/* ════════════════════════════════════════════════════════════
   「晴讀」全站閱讀層 — v1.0 · 115.07.26
   引用方式：<link rel="stylesheet" href="assets/read.css?v=1">
            （文章頁為 ../assets/read.css?v=1）
   移除該行引用即 100% 還原原版排版。骨架、配色、字體家族、
   版面結構一律不動；本層只調字級、字重、字距、行距、留白與可點區。

   設計原則（115.07.26 律師核定「B 案 閱讀優先」）：
   1. 中文內文不加字距——中文字面本身已含留白，額外 letter-spacing
      只會減少每行字數、增加斷行。字距只留給標題與英文襯字。
   2. 對齊方式一律沿用原版（桌機與手機皆兩端對齊），本層不覆寫 text-align。
      【115.07.26 訂正】上午批1 曾把手機改為左對齊，下午經律師回報與實測後
      回復原狀：中文是方塊字，左對齊時右緣本就近乎齊平，只有夾半形字元的行
      會凹進去，反而比全部參差更顯眼（實測凹口 23 處 vs 兩端對齊 8 處）。
      詳細數據與判斷理由記於批1 的手機段註解。
   3. 內文字重一律 400——Noto Sans TC 的 Light(300) 在手機小字級下
      筆畫過細，日光下與低解析裝置尤其吃虧。300 只留給大字與裝飾。
   4. 可點區不低於 44px（WCAG 2.5.5）。
   5. 裝飾層（英文襯字、分類籤、logo）維持原樣，不因放大而破版。

   批次進度：批0 僅建立變數層（尚未有任何頁面引用本檔）；
            批1 文章頁、批2 首頁＋業務頁、批3 其他主頁＋主題頁、
            批4 影音頁＋404。各批規則以「批N」註解分段標示。
   ════════════════════════════════════════════════════════════ */

:root {
  /* ── 字階（8 級）────────────────────────────────────────── */
  --rd-fs-display: clamp(23px, 4.6vw, 32px); /* 文章大標 */
  --rd-fs-h2:      20px;                     /* 章節小標 */
  --rd-fs-h3:      17.5px;                   /* 次級小標 */
  --rd-fs-body:    17.5px;                   /* 內文段落（主力）*/
  --rd-fs-list:    17px;                     /* 條列 */
  --rd-fs-table:   16px;                     /* 表格內文 */
  --rd-fs-aux:     15px;                     /* 延伸閱讀卡、系列導覽、圖說 */
  --rd-fs-meta:    13px;                     /* 麵包屑、日期、署名 */
  --rd-fs-label:   11px;                     /* 分類籤、英文襯字（裝飾，維持）*/

  /* ── 行距 ─────────────────────────────────────────────── */
  --rd-lh-body:  1.95;
  --rd-lh-list:  1.95;
  --rd-lh-head:  1.75;
  --rd-lh-title: 1.6;

  /* ── 字重 ─────────────────────────────────────────────── */
  --rd-w-body:    400;  /* 內文 */
  --rd-w-strong:  500;  /* 強調 */
  --rd-w-display: 400;  /* 大標 */
  /* 300 保留給裝飾層與英文襯字，本層不主動指派 */

  /* ── 字距 ─────────────────────────────────────────────── */
  --rd-track-body:  0;      /* 中文內文一律 0 */
  --rd-track-head:  1.5px;  /* 小標 */
  --rd-track-title: 1.5px;  /* 大標 */

  /* ── 墨色（對比值以 WCAG 2.1 計算，底色 #f8f5ef）─────────── */
  --rd-ink-body: #33465a;  /* 對比 8.92（原 #3d5060 為 7.67）*/
  --rd-ink-aux:  #55697a;  /* 對比 5.23（原 #6b8090 僅 3.77，AA 不過）*/

  /* ── 版面 ─────────────────────────────────────────────── */
  --rd-pad-mobile: 1.5rem; /* 手機左右留白（原 2rem）*/
  --rd-tap:        44px;   /* 最小可點區高 */
}

/* ── 全域最低防線（不改觀感，僅修正瀏覽器行為）───────────── */
html {
  /* 橫置或 iOS 自動放大時字級不被瀏覽器擅自調整 */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* ══════════════════════════════════════════════════════════
   批1 · 文章頁（articles/article-001~105.html）· 115.07.26
   本檔在各頁 inline <style> 之後載入，靠來源順序覆寫，不用 !important。
   ══════════════════════════════════════════════════════════ */

/* ── 內文層：字重、字距、墨色、避孤字 ───────────────────── */
.a-p,
.a-ol li,
.a-ul li,
.notice,
.info-table td,
.info-table th {
  font-weight: var(--rd-w-body);        /* 原 300 */
  letter-spacing: var(--rd-track-body); /* 原 .5px */
  color: var(--rd-ink-body);            /* 原 #3d5060，對比 7.67 → 8.92 */
  text-wrap: pretty;                    /* 避免孤字結尾（不支援者自動忽略）*/
}
.a-p strong,
.a-ol li strong,
.a-ul li strong,
.notice strong { font-weight: var(--rd-w-strong); }

.a-p {
  font-size: var(--rd-fs-body);          /* 17 → 17.5px */
  line-height: var(--rd-lh-body);        /* 2.05 → 1.95 */
  margin-bottom: 1.75rem;                /* 1.5rem → 1.75rem */
  hanging-punctuation: allow-end;        /* 標點懸掛（Safari）*/
}
.a-ol li,
.a-ul li { font-size: var(--rd-fs-list); line-height: var(--rd-lh-list); }
.notice  { font-size: 16.5px;            line-height: var(--rd-lh-list); }
.info-table td,
.info-table th { font-size: var(--rd-fs-table); line-height: 1.85; }

/* ── 標題層 ──────────────────────────────────────────── */
.a-title {
  font-size: var(--rd-fs-display);       /* clamp(22,4vw,32) → clamp(23,4.6vw,32) */
  letter-spacing: var(--rd-track-title); /* 3px → 1.5px：手機標題不再被字距擠掉一行 */
  line-height: var(--rd-lh-title);
  text-wrap: balance;
}
.a-h2 { font-size: var(--rd-fs-h2); letter-spacing: var(--rd-track-head); line-height: var(--rd-lh-head); }
.a-h3 { font-size: var(--rd-fs-h3); letter-spacing: var(--rd-track-head); line-height: var(--rd-lh-head); }

/* ── 輔助層：原字級偏小、但承載內容者放大（純裝飾層不動）── */
.a-bc-link,
.a-bc-cur   { font-size: var(--rd-fs-meta); letter-spacing: .3px; }  /* 12 → 13px */
.a-meta-item{ font-size: 14px; letter-spacing: .3px; }                /* 13.5 → 14px */
.a-rel-title{ font-size: var(--rd-fs-aux); line-height: 1.75; letter-spacing: 0; } /* 12.5 → 15px */
.a-series-nav .sn-title { font-size: 15.5px; letter-spacing: 0; }     /* 14.5 → 15.5px */

/* 頁尾導覽連結有兩種世代：article-076~105 用 .a-footer-grid a（12px），
   article-001~075 用 .f-col a（13.5px）。兩者一併校準到同一高度。 */
.a-footer-grid a { font-size: 13px; }                                  /* 12 → 13px */
.f-col a         { font-size: 14px; }                                  /* 13.5 → 14px */

/* ── 可點區（WCAG 2.5.8 最小 24×24；本站取 ≥30px）────────
   註：行動選單原本即 45~50px，合格，不動。
      需要處理的是頁尾連結（新式 22px、舊式 24px）與麵包屑（22px）。 */
.a-footer-grid a { padding: 6px 0; margin-bottom: 2px; }  /* → 約 35px */
.f-col a         { padding: 5px 0; margin-bottom: 4px; }  /* → 約 35px */
.a-bc-link       { padding: 4px 2px; }                    /* 22 → 30px（inline padding 不影響行高）*/

/* 漢堡鈕：舊世代 30×23px、新世代 40×40px，統一到 44×44。
   只給 min-width／min-height，不動字級：導覽列屬固定寬高 UI，
   放大字級會把漢堡鈕擠出螢幕（115.07.14 踩過）。

   【115.07.26 下午訂正：律師回報「位置偏移、圖樣偏小」】
   實測 about 頁 390px：三條線距按鈕左緣僅 4px（＝padding 值），居中應為 11px，
   整組線條左偏 7px。根因是 108 檔的 .hamburger **原本沒有 align-items／
   justify-content**——當初按鈕框只有內容寬（22＋8＝30px），偏移看不出來；
   本層把它撐到 44px 後就顯露了。只有 article-076~105 那 30 檔本來就有寫，
   新版頁面的寫法才是對的，舊版少了兩行。
   同時把 1.5px 線條加粗、加長（律師核定乙案 26×2px），44px 框內比例才相稱。 */
.hamburger {
  min-width: var(--rd-tap); min-height: var(--rd-tap);
  align-items: center;
  justify-content: center;
}
.hamburger span { width: 26px; height: 2px; }

/* 開合成 ✕ 的位移量必須跟著線寬走：
   三條線總高 ＝ 2×3 ＋ 5×2（gap）＝ 16px，上線中心 1px、中線中心 8px → 位移 7px。
   全站原有兩種值（84＋24 檔為 6.5px、30 檔為 7px），此處一次收斂為 7px，
   否則線條加粗後 ✕ 會有 0.5px 錯位。 */
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── 手機（≤768px）───────────────────────────────────── */
@media (max-width: 768px) {
  /* 【115.07.26 下午訂正】手機兩端對齊已回復為原版行為，本層不再覆寫 text-align。
     原本（同日上午批1）改為 text-align:start，理由是「中文夾半形數字在窄欄被兩端
     對齊拉出大空隙」。律師回報後實測 article-078 全篇 29 段／134 行（390px）：
        左對齊   → 右緣凹口 23 處、平均 40px
        兩端對齊 → 右緣凹口  8 處（且皆為 <br> 刻意換行，本來就不該被拉）
     中文是方塊字，左對齊時右緣本就天然接近齊平，只有夾半形字元的行會凹 18~44px，
     於是「大部分齊、少數幾行凹一塊」比全部參差更顯眼。
     且批1 的判斷依據建立在舊條件（欄寬 326px／字距 .5px／字重 300）之上，
     現已改為欄寬 342px／字距 0／字重 400，大空隙的三個成因均已削弱。
     三案行數相同（134），不影響頁面長度。律師 115.07.26 核定乙案（回復兩端對齊）。
     ——本段刻意留下註解而非直接刪除，以免日後又被同一個理由改回去。 */

  /* 左右留白 2rem → 1.5rem：每行 16.3 → 19.4 字（115.07.26 律師核定甲案）*/
  .a-body {
    padding-left: var(--rd-pad-mobile);
    padding-right: var(--rd-pad-mobile);
  }

  /* 既存缺陷修正：article-001~075（75 篇）漏了「手機隱藏頂欄線上預約鈕」這條，
     手機上同時出現線上預約鈕與漢堡鈕，導覽列實際超出螢幕右緣、被 overflow-x:hidden
     遮住。首頁與 article-076~105 早已隱藏。預約入口仍在漢堡選單內（.mobile-menu-cta），
     隱藏頂欄鈕不減少任何入口。 */
  .navbar .nav-cta { display: none; }
}

/* ── 極窄（≤430px）───────────────────────────────────────
   同一缺陷的第二處：文章頁 77 篇的導覽列英文標語是長版
   「Clear Counsel · Honest Advice · Steady Support」，在 390px 擠成兩行、
   把 logo 撐到 306px 寬並壓迫漢堡鈕。首頁與 14 個主頁早已有
   「≤430px 隱藏英文標語」這條規則（115.07.14 律師選定案 B），
   105 篇文章頁全部沒有。本批補齊，與全站一致。               */
@media (max-width: 430px) {
  .navbar .nav-logo-en { display: none; }
}

/* ══════════════════════════════════════════════════════════
   批2 · 首頁（.p-home）與八個業務頁（.p-service）· 115.07.26
   自本批起以 <body class="p-xxx"> 界定頁族：同名 class 在不同頁族
   字級不同（例：.step-desc 首頁 15.5px、業務頁 12px），不分族會誤套。
   ══════════════════════════════════════════════════════════ */

/* ── 首頁（.p-home）───────────────────────────────────────
   hero 區一律不動（含 .hero-title／.hero-eyebrow／.pillar-*／.hero-scroll），
   只處理 hero 以下的說明文字。                                */
.p-home .service-desc,
.p-home .value-desc,
.p-home .step-desc,
.p-home .fee-note,
.p-home .audience-lead,
.p-home .audience-note,
.p-home .about-text,
.p-home .about-quote,
.p-home .promise-hook-quote,
.p-home .cta-sub,
.p-home .f-email,
.p-home .org-item-desc {
  font-weight: var(--rd-w-body);
  letter-spacing: 0;
  text-wrap: pretty;
}
.p-home .cta-sub { font-size: 17px; }   /* 16.5 → 17 */

/* 影音導流帶（115.07.21 以 inline style 建置、無 class）：inline 樣式優先權高於
   任何外部樣式表，只能用 !important 覆寫。不改 HTML 內的 inline 值，
   是為了維持「移除 read.css 引用即完整還原」。                    */
.p-home .films-promo p {
  font-size: 16.5px !important;                 /* 15 → 16.5 */
  font-weight: var(--rd-w-body) !important;     /* 300 → 400 */
  letter-spacing: 0 !important;                 /* 1px → 0 */
  line-height: 1.95 !important;
  text-wrap: pretty;
}
.p-home .service-desc,
.p-home .value-desc,
.p-home .step-desc,
.p-home .fee-note { font-size: 16.5px; line-height: 1.95; }   /* 15.5 → 16.5 */
.p-home .audience-lead { font-size: 17px; line-height: 1.95; }  /* 16 → 17 */
.p-home .audience-note { font-size: 16px; }                     /* 15 → 16 */
.p-home .about-text    { font-size: 17px; line-height: 2.05; }  /* 16.5 → 17，行距 2.2 略收 */
.p-home .about-quote   { font-size: 17px; }                     /* 16.5 → 17 */
.p-home .org-item-desc { font-size: 14px; line-height: 1.85; }  /* 12.5 → 14（深底上的說明文字）*/

/* ── 業務頁（.p-service）─────────────────────────────────── */
.p-service .page-subtitle,
.p-service .service-desc,
.p-service .inv-svc-desc,
.p-service .inv-qa-a,
.p-service .inv-qa-q,
.p-service .fee-note,
.p-service .fee-notice-text,
.p-service .step-desc,
.p-service .step-name,
.p-service .area-detail,
.p-service .area-online-text,
.p-service .inv-duty-note,
.p-service .inv-cred-cell span,
.p-service .inv-duty-table th,
.p-service .inv-duty-table td,
.p-service .sh-law td,
.p-service .sh-law th,
.p-service .read-list a,
.p-service .svc-read-t,
.p-service .svc-reads-sub,
.p-service .cta-sub,
.p-service .f-email {
  font-weight: var(--rd-w-body);
  letter-spacing: 0;
  text-wrap: pretty;
}
.p-service .cta-sub { font-size: 17px; }   /* 16.5 → 17 */

/* 服務總覽頁（qingxilaw_services）獨有的兩處 */
.p-service .mode-desc {
  font-size: 17px; line-height: 1.95;      /* 16 → 17 */
  font-weight: var(--rd-w-body); letter-spacing: 0; text-wrap: pretty;
}
.p-service .service-b2b-link a {
  font-size: 14px;                          /* 11.5 → 14：這是通往六大業務專頁的實質導覽 */
  font-weight: var(--rd-w-body);
  padding: 4px 0;                           /* 可點區 18 → 26px */
  display: inline-block;
}

/* 註（115.07.26 下午訂正）：原本此處把業務頁說明文字在手機改為左對齊。
   實測全站 inline style 中真正設 justify 的只有四個選擇器
   （.a-p 105 檔、條列 103 檔、.notice 62 檔、qingxilaw_drafting 的 .fee-note 1 檔），
   其餘皆本來就是 left／start，該組規則對它們是空轉。
   律師核定回復兩端對齊後整段移除，理由詳見文章頁該段註解。 */
.p-service .page-subtitle   { font-size: 17px; line-height: 1.95; }
.p-service .service-desc,
.p-service .inv-svc-desc,
.p-service .inv-qa-a        { font-size: 17px; line-height: 1.95; }  /* 16.5 → 17 */
.p-service .inv-qa-q        { font-size: 17px; }
.p-service .fee-note,
.p-service .fee-notice-text,
.p-service .svc-reads-sub,
.p-service .area-online-text{ font-size: 16.5px; line-height: 1.95; } /* 15.5 → 16.5 */
.p-service .step-name       { font-size: 16.5px; }                     /* 15.5 → 16.5 */
.p-service .step-desc,
.p-service .area-detail,
.p-service .inv-duty-note,
.p-service .inv-cred-cell span { font-size: 15px; line-height: 1.85; } /* 12 → 15：這些是實質內容，不是標籤 */
.p-service .svc-read-t      { font-size: 16.5px; line-height: 1.8; }   /* 16 → 16.5 */
.p-service .read-list a     { font-size: 17px; letter-spacing: 0; }    /* 16.5 → 17 */
.p-service .inv-duty-table th,
.p-service .inv-duty-table td,
.p-service .sh-law td:first-child { font-size: 17px; }                 /* 16.5 → 17 */
.p-service .sh-law .sh-law-name   { font-size: 16.5px; }               /* 15.5 → 16.5 */
.p-service .sh-law td:nth-child(2)::before,
.p-service .sh-law td:nth-child(3)::before { font-size: 12px; }        /* 11 → 12：手機表格的欄位標籤 */

/* ── 頁尾資訊（兩頁族共用；地址與 email 是實質資訊，非裝飾）── */
.p-home .f-info,   .p-home .f-email,   .p-home .f-copy,
.p-service .f-info, .p-service .f-email, .p-service .f-copy,
.p-service .footer-brand-info, .p-service .footer-brand-email, .p-service .footer-copy {
  font-size: 13px;
}
.p-home .f-col a, .p-service .f-col a, .p-service .footer-col a {
  font-size: 15.5px; padding: 5px 0;   /* 字級已足，補可點區高度 */
}

/* ── 可點區 ─────────────────────────────────────────────── */
.p-home .service-link, .p-service .read-more-link, .p-service .inv-qa-more,
.p-home .s-btn, .p-home .social-btn, .p-service .s-btn, .p-service .social-btn {
  padding-top: 5px; padding-bottom: 5px;
}
.p-home .hamburger, .p-service .hamburger {
  min-width: var(--rd-tap); min-height: var(--rd-tap);
}

/* ══════════════════════════════════════════════════════════
   批3 · 其他主頁（.p-page：about／lectures／articles／faq／booking）
        與主題頁（.p-topic × 9）· 115.07.26
   ══════════════════════════════════════════════════════════ */

/* ── 其他主頁（.p-page）───────────────────────────────── */
.p-page .page-subtitle,
.p-page .intro-text, .p-page .intro-quote, .p-page .stats-lede,
.p-page .cred-desc, .p-page .qual-text, .p-page .role-desc,
.p-page .timeline-main, .p-page .timeline-sub, .p-page .role-org,
.p-page .badge, .p-page .exp-col-title, .p-page .lawyer-title, .p-page .stat-label,
.p-page .lect-band-text, .p-page .promise-text,
.p-page .service-desc, .p-page .step-desc, .p-page .step-name,
.p-page .fee-note, .p-page .fee-notice-text, .p-page .area-detail,
.p-page .area-online-text, .p-page .inv-svc-desc, .p-page .inv-svc-note,
.p-page .inv-qa-q, .p-page .inv-qa-a, .p-page .inv-cred-cell span, .p-page .inv-duty-note,
.p-page .inv-duty-table th, .p-page .inv-duty-table td,
.p-page .lect th, .p-page .lect td, .p-page .sh-law td,
.p-page .read-list a,
.p-page .faq-q-text, .p-page .faq-a-text, .p-page .faq-a-highlight,
.p-page .card-title, .p-page .card-excerpt, .p-page .card-date,
.p-page .list-title, .p-page .list-count, .p-page .cat-btn, .p-page .cat-count,
.p-page .a-cta-sub, .p-page .cta-sub, .p-page .f-email {
  font-weight: var(--rd-w-body);
  letter-spacing: 0;
  text-wrap: pretty;
}

/* 內文主力：17px */
.p-page .page-subtitle,
.p-page .intro-text, .p-page .intro-quote, .p-page .stats-lede,
.p-page .lect-band-text, .p-page .promise-text,
.p-page .service-desc, .p-page .inv-svc-desc,
.p-page .inv-qa-a, .p-page .inv-qa-q,
.p-page .faq-q-text, .p-page .faq-a-text,
.p-page .card-title, .p-page .cta-sub, .p-page .a-cta-sub,
.p-page .inv-duty-table th, .p-page .inv-duty-table td,
.p-page .lect th, .p-page .lect td, .p-page .sh-law td,
.p-page .read-list a, .p-page .timeline-main { font-size: 17px; }
.p-page .intro-text, .p-page .stats-lede { line-height: 2.05; }   /* 2.2 略收 */
.p-page .inv-qa-a, .p-page .faq-a-text, .p-page .service-desc,
.p-page .inv-svc-desc, .p-page .promise-text { line-height: 1.95; }

/* 次要內文：16.5px */
.p-page .cred-desc, .p-page .qual-text, .p-page .role-desc,
.p-page .fee-note, .p-page .fee-notice-text, .p-page .faq-a-highlight,
.p-page .area-online-text, .p-page .inv-svc-note, .p-page .step-name,
.p-page .step-desc, .p-page .area-detail,
.p-page .card-excerpt, .p-page .list-title, .p-page .list-count,
.p-page .cat-btn, .p-page .lawyer-title, .p-page .stat-label { font-size: 16.5px; line-height: 1.9; }

/* 原 12px 但屬實質內容者一律提到 15px（機關名、職務副標、日期、註記）*/
.p-page .timeline-sub, .p-page .role-org, .p-page .badge,
.p-page .exp-col-title, .p-page .card-date, .p-page .cat-count,
.p-page .mobile-cat-chip, .p-page .inv-cred-cell span,
.p-page .inv-duty-note, .p-page .card-readmore { font-size: 15px; line-height: 1.85; }
.p-page .sidebar-title { font-size: 13px; }        /* 11 → 13：側欄區塊標題 */

/* ── 主題頁（.p-topic × 9）────────────────────────────────
   這 9 頁未納入 115.07.08 的全站字級 +1 映射，整體比其他頁小一級
   （.topic-intro-text 只有 13.5px、.f-col a 13.5px 對比其他頁 15.5px）。
   本批一併補齊到全站水準。                                    */
.p-topic .topic-intro-text,
.p-topic .card-title, .p-topic .card-readmore,
.p-topic .page-subtitle, .p-topic .service-cta-text,
.p-topic .a-cta-sub, .p-topic .list-count, .p-topic .list-label,
.p-topic .breadcrumb-inner, .p-topic .btn-service, .p-topic .f-email {
  font-weight: var(--rd-w-body);
  letter-spacing: 0;
  text-wrap: pretty;
}
.p-topic .topic-intro-text { font-size: 17px; line-height: 1.95; }  /* 13.5 → 17 */
.p-topic .card-title       { font-size: 17px; line-height: 1.8; }
.p-topic .page-subtitle    { font-size: 17px; }                     /* 14.5 → 17 */
.p-topic .service-cta-text { font-size: 16.5px; line-height: 1.9; } /* 14.5 → 16.5 */
.p-topic .a-cta-sub,
.p-topic .list-count,
.p-topic .card-readmore,
.p-topic .btn-service      { font-size: 15.5px; }                   /* 13.5 → 15.5 */
.p-topic .list-label       { font-size: 16.5px; }                   /* 15.5 → 16.5 */
.p-topic .breadcrumb-inner { font-size: 14px; }                     /* 13.5 → 14 */
.p-topic .f-col a          { font-size: 15.5px; }                   /* 13.5 → 15.5，與全站齊 */
.p-topic .mobile-menu a    { font-size: 16.5px; }                   /* 14.5 → 16.5，漢堡選單非固定頂欄 */
.p-topic .mobile-menu .mobile-sub a { font-size: 15.5px; }          /* 13.5 → 15.5 */

/* ── 頁尾資訊：批3 兩頁族比照批2 ─────────────────────── */
.p-page .f-info, .p-page .f-email, .p-page .f-copy,
.p-page .footer-brand-info, .p-page .footer-brand-email, .p-page .footer-copy,
.p-topic .f-info, .p-topic .f-email, .p-topic .f-copy { font-size: 13px; }
.p-page .f-col a, .p-page .footer-col a { font-size: 15.5px; }
.p-page .f-col a, .p-page .footer-col a, .p-topic .f-col a { padding: 5px 0; }

/* ── 可點區 ─────────────────────────────────────────── */
.p-page .hamburger, .p-topic .hamburger { min-width: var(--rd-tap); min-height: var(--rd-tap); }
.p-page .s-btn, .p-page .social-btn, .p-topic .s-btn,
.p-page .card-readmore, .p-topic .card-readmore, .p-page .read-more-link,
.p-page .inv-qa-more { padding-top: 5px; padding-bottom: 5px; }

/* 註：原手機取消兩端對齊之規則已於 115.07.26 下午移除（同上，且對這些
   選擇器本來就是空轉——它們原本並非 justify）。 */

/* ── 極窄（≤430px）：主頁與主題頁比照文章頁 ───────────── */
@media (max-width: 430px) {
  .p-page .navbar .nav-logo-en, .p-topic .navbar .nav-logo-en { display: none; }
}

/* ══════════════════════════════════════════════════════════
   批4 · 影音頁（.p-films）與 404（.p-404）· 115.07.26
   影音頁樣式主要在 assets/films.css；本層以 .p-films 覆寫，
   不改 films.css，維持「移除 read.css 引用即完整還原」。
   影音頁多為深底，只調字級與字重，不動任何顏色。
   ══════════════════════════════════════════════════════════ */

.p-films .films-intro p,
.p-films .theme-desc, .p-films .series-desc, .p-films .series-sub,
.p-films .film-desc, .p-films .film-credit, .p-films .film-part-label,
.p-films .film-lead, .p-films .film-quote,
.p-films .series-outro p, .p-films .series-transition p,
.p-films .films-toc a, .p-films .films-disclosure p,
.p-films .films-farewell, .p-films .film-tag, .p-films .film-dur,
.p-films .intro-text, .p-films .stats-lede, .p-films .cred-desc,
.p-films .qual-text, .p-films .role-desc, .p-films .promise-text,
.p-films .lect-band-text, .p-films .cta-sub, .p-films .lawyer-title,
.p-films .stat-label, .p-films .timeline-sub, .p-films .role-org,
.p-films .badge, .p-films .exp-col-title, .p-films .f-email {
  font-weight: var(--rd-w-body);
  letter-spacing: 0;
  text-wrap: pretty;
}

/* 內文主力 17px */
.p-films .films-intro p     { font-size: 17px; line-height: 2.05; }  /* 行距 2.2 略收 */
.p-films .theme-desc        { font-size: 17px; line-height: 1.95; }  /* 14.5 → 17：主題說明是實質內容 */
.p-films .intro-text,
.p-films .stats-lede        { font-size: 17px; line-height: 2.05; }
.p-films .timeline-main     { font-size: 17px; }
.p-films .film-lead,
.p-films .series-outro p,
.p-films .series-transition p { font-size: 17px; line-height: 2.05; } /* 16 → 17 */

/* 每支影片的說明文字：本頁最主要的閱讀內容（35 處）*/
.p-films .film-desc { font-size: 16.5px; line-height: 1.95; }          /* 15.5 → 16.5 */

/* AI 生成揭露（曲・演唱｜Suno AI／影像｜AI 生成素材）：屬揭露性資訊，
   不是純裝飾，原 11.5px 過小。                                        */
.p-films .film-credit { font-size: 13px; line-height: 1.95; }          /* 11.5 → 13 */
.p-films .film-part-label { font-size: 14px; }                          /* 13 → 14 */

/* 次要內文 16.5px */
.p-films .series-desc,
.p-films .film-quote,
.p-films .films-farewell,
.p-films .cred-desc, .p-films .qual-text, .p-films .role-desc,
.p-films .promise-text, .p-films .lect-band-text, .p-films .cta-sub,
.p-films .lawyer-title, .p-films .stat-label { font-size: 16.5px; line-height: 1.95; }
.p-films .series-sub        { font-size: 15.5px; }                    /* 14 → 15.5 */

/* 目錄與揭露：原 12.5~14px，屬實質內容（含揭露聲明），提到 14~15px */
.p-films .films-toc a       { font-size: 15px; line-height: 2; }      /* 14 → 15 */
.p-films .films-disclosure .films-copy { font-size: 13.5px; }         /* 13 → 13.5 */

/* 揭露聲明：只在寬螢幕放大。
   律師 115.07.20 定案「揭露三段各自成行，不讓它在欄寬內亂折」；
   實測 390px 下放大到 14px 會使前三段由 1 行變 2 行，破壞該設計，
   故手機維持原 12.5px，寬螢幕行寬足夠才提升可讀性。            */
.p-films .films-disclosure p { font-size: 14px; line-height: 2.15; }
@media (max-width: 560px) {
  .p-films .films-disclosure p { font-size: 12.5px; line-height: 2.3; }
}
.p-films .film-tag,
.p-films .film-dur          { font-size: 13px; }                      /* 12 → 13 */
.p-films .timeline-sub, .p-films .role-org, .p-films .badge,
.p-films .exp-col-title     { font-size: 15px; }                      /* 12 → 15 */
.p-films .f-info, .p-films .f-email, .p-films .f-copy,
.p-films .footer-brand-info, .p-films .footer-brand-email,
.p-films .footer-copy       { font-size: 13px; }                      /* 12 → 13 */

/* 可點區 */
.p-films .hamburger { min-width: var(--rd-tap); min-height: var(--rd-tap); }
.p-films .films-toc a, .p-films .f-col a, .p-films .footer-col a { padding: 5px 0; }
.p-films .s-btn, .p-films .social-btn { padding-top: 5px; padding-bottom: 5px; }

/* 註：影音頁的說明文字在 films.css 中本來就不是 justify，原手機覆寫規則
   屬空轉，已於 115.07.26 下午移除。 */
@media (max-width: 430px) {
  .p-films .navbar .nav-logo-en { display: none; }
}

/* ══════════════════════════════════════════════════════════
   批6 · 影片專頁（.p-film-single）與分享鈕（.film-share）· 115.07.26
   專頁骨架與 .film-* 全部沿用 films.css，本段只補「原本不存在的新元件」：
   單頁容器、麵包屑、分享鈕、上下支導覽、回總覽連結。
   ══════════════════════════════════════════════════════════ */

.films-map--single { padding-top: 2rem; max-width: 860px; }

/* ── 金線收尾（115.07.26 律師核定乙案）────────────────────
   總覽頁的金線是串連九支影片的地圖裝置（依 .gl-anchor 節點實座標由
   qingmo.js 重繪 SVG），單支影片頁沒有可串連的對象。但讀者從總覽頁點進
   專頁時，若金線完全消失，晴墨版的視覺語彙會斷掉。
   故在版頭下方接一小段垂直金線＋一個金點，作為「你從那條線上來」的呼應，
   之後不再延伸——是氛圍的收尾，不假裝單頁也有一條路徑要走。
   純 CSS、不碰 qingmo.js，移除本段即完全還原。                 */
.p-film-single .films-map--single { position: relative; }
.p-film-single .films-map--single::before {
  content: ''; position: absolute; top: 0; left: 50%;
  width: 1px; height: 96px; margin-left: -.5px;
  background: linear-gradient(to bottom, var(--gd, #c9a84c), rgba(201,168,76,0));
  opacity: .55; pointer-events: none;
}
.p-film-single .films-map--single::after {
  content: ''; position: absolute; top: -3px; left: 50%;
  width: 7px; height: 7px; margin-left: -3.5px; border-radius: 50%;
  background: var(--gd, #c9a84c); opacity: .8; pointer-events: none;
}
/* 行動版金線在總覽頁靠左 24px，專頁的收尾線比照靠左，維持同一條線的錯覺 */
@media (max-width: 900px) {
  .p-film-single .films-map--single::before,
  .p-film-single .films-map--single::after { left: 24px; }
}
/* 尊重減少動態偏好時仍保留（屬靜態指示、非動畫），但降低存在感 */
@media (prefers-reduced-motion: reduce) {
  .p-film-single .films-map--single::before { opacity: .35; }
}

/* 麵包屑 */
.film-crumb { display: flex; align-items: center; gap: 8px; margin-bottom: 2rem; }
.film-crumb-link { color: var(--tt, #6b8090); font-size: 14px; letter-spacing: .5px;
  text-decoration: none; padding: 4px 2px; transition: color .2s; }
.film-crumb-link:hover { color: var(--gd, #c9a84c); }
.film-crumb-sep { color: rgba(154,176,188,.45); font-size: 12px; }
.film-crumb-cur { color: var(--tm, #3d5060); font-size: 14px; letter-spacing: .5px; }

/* ── 分享鈕 ────────────────────────────────────────────
   視覺語彙沿用導覽列的 .nav-cta（金色細框、疏排、無圓角），
   不引入新的形狀語言。                                      */
.film-share { margin: 2.5rem auto 0; text-align: center; }
.film-share-label {
  display: block; font-family: 'Cormorant Garamond', serif; font-style: italic;
  font-size: 12px; letter-spacing: 2px; color: var(--gd, #c9a84c); margin-bottom: .9rem;
}
.film-share-btns { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; }
/* 邊框用「實色 1px」而非半透明。
   【115.07.26 律師回報：LINE 鈕左框斷掉】實測 390px／DPR 2：三顆鈕由 flex 居中、
   寬度隨文字決定，總寬是分數，居中後左緣落在非整數裝置像素
   （LINE 左緣 61.484 → ×2 = 122.968；複製連結 238.5 → ×2 = 477 剛好整數）。
   1px 邊框被反鋸齒攤到兩個裝置像素、各半，再乘上原本的 55% 不透明度，
   實際只剩約 27%，視覺上就消失；落在整數邊界的那顆則完好。
   改實色後即使攤成兩像素、每像素仍有 50% 金色，清楚可見。
   附帶把語彙真正對齊 .nav-cta——它用的就是實色 rgb(201,168,76)，
   當初寫成半透明是小晴的不一致。 */
.fs-btn {
  font-family: inherit; font-size: 14px; letter-spacing: 1.5px; font-weight: 400;
  color: var(--bd, #2C4A5A); background: transparent;
  border: 1px solid var(--gd, #c9a84c); border-radius: 0;
  padding: 9px 20px; min-height: var(--rd-tap, 44px); cursor: pointer;
  transition: background .25s, color .25s, border-color .25s;
}
.fs-btn:hover { background: var(--gd, #c9a84c); border-color: var(--gd, #c9a84c); color: #fff; }
.fs-btn:focus-visible { outline: 2px solid var(--gd, #c9a84c); outline-offset: 2px; }
.fs-btn[data-state="done"] { background: rgba(201,168,76,.14); border-color: var(--gd, #c9a84c); }

/* ── 分享備援列（115.07.26 律師核定：只留一顆分享鈕）────────
   系統分享面板本身就含 LINE／Threads，並排再放兩顆是重複，故收成一顆
   「分享連結」。但 macOS Chrome／Edge、Firefox 桌機、Linux Chrome 都沒有
   navigator.share（已於律師機實測確認），那些環境按下後改展開此備援列，
   否則桌機（佔流量一半）會只剩「複製連結」一顆。
   有系統分享的環境由 site.js 直接把本列從 DOM 移除。          */
.fs-fallback {
  display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center;
  margin-top: .75rem; padding-top: .75rem;
  border-top: 1px solid rgba(201,168,76,.28);
}
/* 【必要】`hidden` 屬性是靠瀏覽器預設樣式的 display:none 生效，優先權低於
   上面這條作者樣式的 display:flex，不補這行 hidden 會完全失效、備援列永遠展開。
   （115.07.26 實測踩到：JS 量測顯示 hidden:true 卻同時量到高度 52px，
     是截圖才看出來。日後凡對可切換元件設 display，必補對應的 [hidden] 規則。）*/
.fs-fallback[hidden] { display: none; }
.fs-btn--sm {
  font-size: 13px; letter-spacing: 1px; padding: 7px 16px;
  min-height: 36px;                 /* 次級入口，仍高於 WCAG 2.5.8 的 24px 門檻 */
  border-color: rgba(201,168,76,.75);
}

/* 多段影片的分段標後綴時長（《請先好好說話》上下集）*/
.film-part-dur {
  font-family: 'Cormorant Garamond', serif; font-size: 13px; font-weight: 400;
  letter-spacing: 1px; color: var(--gd, #c9a84c); margin-left: .5rem;
}

/* 總覽頁分享區下方的「看這支的專頁」：inline 連結需自帶內距才達可點區門檻 */
.film-page-link {
  display: inline-block; margin-top: .85rem; padding: 6px 4px;
  font-size: 15px; letter-spacing: .5px; color: var(--tt, #6b8090);
  text-decoration: none; border-bottom: .5px solid rgba(201,168,76,.4);
  transition: color .2s, border-color .2s;
}
.film-page-link:hover { color: var(--gd, #c9a84c); border-color: var(--gd, #c9a84c); }

/* 深底頁面（影音頁的 CTA 區等）上的分享鈕改用淡金字，維持可讀 */
.film-share--on-dark .fs-btn { color: var(--gl, #e2c47a); }
.film-share--on-dark .fs-btn:hover { color: var(--bd, #2C4A5A); }

/* ── 專頁頁尾：回總覽＋上下支 ───────────────────────── */
.film-single-foot {
  margin-top: 3.5rem; padding-top: 2rem;
  border-top: .5px solid rgba(44,74,90,.14);
  display: flex; flex-wrap: wrap; gap: 1rem 2rem;
  align-items: center; justify-content: space-between;
}
.film-back {
  font-size: 15px; letter-spacing: 1px; color: var(--bd, #2C4A5A);
  text-decoration: none; border-bottom: .5px solid rgba(201,168,76,.5);
  padding: 6px 0; transition: color .2s, border-color .2s;
}
.film-back:hover { color: var(--gd, #c9a84c); border-color: var(--gd, #c9a84c); }
.film-nav { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.film-nav-link {
  font-size: 14.5px; letter-spacing: .5px; color: var(--tt, #6b8090);
  text-decoration: none; padding: 6px 0; transition: color .2s;
}
.film-nav-link:hover { color: var(--gd, #c9a84c); }
.film-nav-link--off { display: none; }

@media (max-width: 768px) {
  .films-map--single { padding-left: var(--rd-pad-mobile, 1.5rem); padding-right: var(--rd-pad-mobile, 1.5rem); }
  .film-single-foot { flex-direction: column; align-items: flex-start; }
}
/* 手機讓三顆鈕同列：內距收緊即可容納，避免 2+1 的失衡排法。
   可點高度仍由 min-height 保住 44px，不因內距變小而失守。 */
@media (max-width: 560px) {
  .fs-btn { padding: 9px 14px; letter-spacing: 1px; flex: 0 1 auto; }
  .film-share-btns { gap: .5rem; }
}
@media (max-width: 430px) {
  .p-film-single .navbar .nav-logo-en { display: none; }
}

/* ── 404（.p-404）─────────────────────────────────────── */
.p-404 p        { font-size: 16.5px; font-weight: var(--rd-w-body); line-height: 1.95;
                  letter-spacing: 0; text-wrap: pretty; }   /* 15 → 16.5 */
.p-404 a.btn    { font-size: 16px; }                        /* 15 → 16 */
.p-404 .firm    { font-size: 13.5px; }                      /* 13 → 13.5 */

/* 註：導覽列頂欄（.nav-cta 14.5px／.nav-logo-cn／.nav-links a）屬固定寬高 UI，
   一律不放大（115.07.14 踩坑：放大字級把漢堡鈕擠出螢幕）。
   裝飾層亦不動：.nav-logo-en／.pillar-en／.hero-scroll／.section-eyebrow／
   .value-num／.fee-type／.fee-tag／.service-en／.service-tag／
   .f-col-title／.footer-col-title／.f-tagline／.svc-reads-eyebrow／.svc-read-cat。 */

/* ══════════════════════════════════════════════════════════
   批7　窄螢幕詞組列改單欄（115.07.26 律師核定甲案）
   ══════════════════════════════════════════════════════════
   問題：首頁「六大業務」與「企業服務」的兩欄卡片在窄螢幕放不下，
   詞組被切在**法律名詞中間**：
       性平三法（性別平等三法）諮詢  →  性平三 ／ 法諮詢
       家庭暴力案件                  →  家庭暴 ／ 力案件
       兒少不當對待                  →  兒少不 ／ 當對待
   不只是排版不美，專業名詞被切半讀起來像疏忽。

   實測（線上，`.service-desc` 6 字 ＠16.5px ＝ 需要 99px）：
       視窗 320px → 卡片可排 78.3px（差 20.7）❌
       視窗 360px → 卡片可排 98.3px（**差 0.7**）❌  ← 最常見的 Android 寬度
       視窗 375px → 卡片可排 105.8px（餘裕 6.8）勉強
       視窗 390px → 卡片可排 113.3px（餘裕 14.3）
   整個版面是「剛好撐住」而不是「設計得下」。

   320px 不是老機：那是 390pt 的 iPhone 開啟「顯示器縮放 → 較大文字」
   時的邏輯寬度（律師的 iPhone 12 即為此狀態）。事務所客群年齡偏高，
   這個設定的使用比例不低。

   **不是今天調字級造成的**：320px 下 15.5px（今天之前的值）同樣斷行，
   要降到 13px 才不斷——那遠低於可讀標準。屬既有問題。

   不採的兩案及其理由：
     壓縮卡片留白（padding 24→10px）：只把餘裕從 −20px 拉到 +7px，仍脆弱，
       且違反〔設計優先於機械目標〕——留白與間距即設計本體。
     降字級：15.5px 也救不了，要 13px；違反當日核定的閱讀優先方向。

   處置：≤389px 改單欄。實測 320px 卡片可排 78.3 → 206px、
   org 96 → 208px，詞組斷行 0 處、零橫向溢出。
   代價：窄螢幕服務區高度 813 → 1374px（僅 ≤389px 受影響，390px 以上完全不變）。

   ⚠️ 390px 仍只有 14.3px 餘裕（不到一個字）。日後若再調 `.service-desc`
   字級，390–430px 這段會跟著破，屆時應把本段斷點往上移而不是壓留白。

   用 `.p-home` 前綴取得兩個 class 的特異度，蓋過頁內 `@media (max-width:768px)`
   的 `1fr 1fr`，不需 !important。移除本段即完整還原。               */
@media (max-width: 389px) {
  .p-home .services-grid { grid-template-columns: 1fr; }
  .p-home .org-items     { grid-template-columns: 1fr; }
}