/* ── 1. 版面節奏 ───────────────────────────────────────────────────────── */
:root{
  --s-gap:clamp(34px,6vw,64px);
  --s-fig-bg:#F7FAFC;
  /* 2026-10-05（GM）：簡報在他的電腦 100% 顯示時兩側留白過多（原 1120px
     在 1920 螢幕每側空 400px）。本檔只被 A 類頁載入，於此覆寫全站版心變數，
     不影響其他 74 頁。min(…,96vw) 保護小螢幕。 */
  --mx-maxw:min(1560px,96vw);
}
.s-wrap{max-width:var(--mx-maxw,1560px);margin:0 auto;padding:0 22px var(--s-gap)}
.s-wrap.narrow{max-width:900px}
/* 2026-10-15（GM）：首頁 Hero + 三張 KPI 卡組成單一首屏，底部呼吸空間收緊，
   讓史詩區明確落在第二屏。 */
.s-wrap.s-hero-area{padding-bottom:clamp(26px,4.2vh,48px)}

/* ── 2. 開場：超大字主張 ───────────────────────────────────────────────── */
.s-open{
  /* 2026-10-05：原 clamp(46px,8vw,92px) 在桌面吃到 86–92px，
     加上右側大圖 58vh，首屏只剩標題——下方 KPI 全被擠出視窗。壓回 22–36px。
     另 max-layout.css 的 section{margin:36px 0} 會穿透 .s-wrap 疊在頁首下，
     開場區的節奏全由本規則的 padding 控制，margin 必須歸零。 */
  margin:0;
  padding:clamp(22px,3vw,36px) 0 clamp(24px,4vw,40px);
  border-bottom:1px solid var(--mx-line-soft);
}
.s-kicker{
  font-size:clamp(12px,1.4vw,15px); font-weight:800; letter-spacing:.22em;
  color:var(--mx-accent); margin-bottom:clamp(12px,2vw,20px);
  text-transform:uppercase;
}
.s-h1{
  margin:0; font-weight:900; line-height:1.06; letter-spacing:-.015em;
  /* 2026-10-05（GM）：68px 三行標題在 100% 縮放吃掉首屏，壓到 60px 上限 */
  font-size:clamp(34px,4.8vw,60px);
  color:var(--mx-ink);
}
.s-h1 em{font-style:normal; color:var(--mx-accent)}
.s-h1 .thin{font-weight:300; color:var(--mx-muted)}
.s-lede{
  margin:clamp(16px,2.6vw,26px) 0 0; max-width:800px;
  font-size:clamp(15px,1.9vw,20px); line-height:1.62; color:var(--mx-body);
}
/* 副標（Hook 表定稿 .s-sub）：h1 與 lede 之間的標語行，品牌色 */
.s-sub{
  margin:clamp(10px,1.6vw,16px) 0 0; max-width:760px;
  font-size:clamp(15px,1.7vw,19px); line-height:1.5; font-weight:700;
  color:var(--mx-accent);
}
/* 總覽史詩：跨頁深入閱讀連結 */
.s-jump{
  display:inline-block; margin-top:12px; font-weight:700; font-size:14px;
  color:var(--mx-accent); text-decoration:none;
  border:1px solid var(--mx-accent); padding:6px 15px; border-radius:999px;
}
.s-jump:hover{background:var(--mx-accent); color:#fff}
.s-epic p{margin:0 0 14px; max-width:860px; line-height:1.78; color:var(--mx-body); font-size:clamp(15px,1.7vw,18px)}
.s-epic .s-drop{font-weight:800; color:var(--mx-ink)}

/* ── 進化軸（2026-10-16 GM）：史詩開場由「一坨字」改為四個時代各據一站 ──────
   前三站＝已達成的進化（品牌藍）；第四站「纜線」＝尚未解決的問題（語意紅），
   與下一段「這一次，解開它的是台灣」構成問題→解答的敘事。
   .s-epic p 會覆寫段落字級，故 sub／cut 以 p.class 提高特異性。 */
.s-evo{margin:0 0 clamp(24px,3.4vw,38px)}
.s-evo-kicker{
  font-size:clamp(11.5px,1.2vw,13px); font-weight:800; letter-spacing:.22em;
  color:var(--mx-accent); margin-bottom:8px;
}
.s-evo-h{
  margin:0 0 6px; font-size:clamp(19px,2.4vw,27px); font-weight:800;
  line-height:1.42; letter-spacing:-.01em; color:var(--mx-ink);
}
.s-evo p.s-evo-sub{
  margin:0 0 clamp(16px,2vw,22px); max-width:860px;
  font-size:clamp(13px,1.4vw,15px); line-height:1.7; color:var(--mx-muted);
}
.s-evo-rail{
  list-style:none; margin:0; padding:0; display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:clamp(10px,1.2vw,14px);
}
.s-evo-i{
  min-width:0; background:var(--mx-card);
  border:1px solid var(--mx-line-soft); border-top:3px solid var(--mx-accent);
  border-radius:12px; padding:clamp(13px,1.4vw,18px) clamp(12px,1.3vw,16px);
}
.s-evo-era{
  display:block; font-size:11.5px; font-weight:800; letter-spacing:.08em;
  color:var(--mx-faint);
}
.s-evo-ic{
  display:flex; align-items:center; justify-content:center;
  width:40px; height:40px; margin:10px 0; border-radius:50%; background:#E6F1FB;
}
.s-evo-nm{
  display:block; font-size:clamp(14px,1.5vw,16px); font-weight:800; color:var(--mx-ink);
}
.s-evo-tx{
  display:block; margin-top:5px; font-size:12.5px; line-height:1.62; color:var(--mx-muted);
}
.s-evo-i.is-problem{
  background:var(--mx-risk-bg); border-color:#F7C1C1; border-top-color:var(--mx-risk);
}
.s-evo-i.is-problem .s-evo-era{color:var(--mx-risk)}
.s-evo-i.is-problem .s-evo-nm{color:var(--mx-risk)}
.s-evo-i.is-problem .s-evo-ic{background:#FCEBEB}
.s-evo-i.is-problem .s-evo-tx{color:#791F1F}
.s-evo p.s-evo-cut{
  margin:clamp(14px,1.8vw,18px) 0 0; max-width:860px;
  padding:clamp(12px,1.4vw,15px) clamp(14px,1.6vw,18px);
  background:var(--mx-bg); border-left:3px solid var(--mx-accent); border-radius:10px;
  font-size:clamp(13px,1.4vw,15px); line-height:1.7; color:var(--mx-ink);
}
.s-evo p.s-evo-cut b{color:var(--mx-accent); font-weight:800}
@media (min-width:861px){
  .s-evo-rail{grid-template-columns:repeat(4,minmax(0,1fr))}
  /* 2026-10-16（GM）：進化軸起點改為「數百年前 不鏽鋼與烙鐵止血」後為 3 站，
     寬屏需改 3 欄排滿，否則 4 欄會留一個空格。 */
  .s-evo-rail:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* 開場右側大圖 */
.s-open-grid{
  display:grid; gap:clamp(24px,4vw,52px); align-items:center;
  grid-template-columns:1fr;
  /* margin-top 40px 是「nav→標題」留白的第三個來源（padding 之外），
     kicker 就在 grid 內第一格，歸零由 .s-open 的 padding 全權控制節奏。 */
  margin-top:0;
}
/* 2026-10-06（GM）：原 1.05/0.95 讓文字欄只有 655px——h1 放大回 60px 後，
   英文版標題被擠成 4 行、hero 長到 501px，超過全站 489px 錨點，數字列會跳位。
   文字欄加寬到 1.25fr（≈807px）：英文標題回到 3 行、hero 回到 489。
   右欄產品圖實為「高度上限」(28vh/280px) 所限，寬度從 485 縮到 448 不影響顯示。 */
.s-open-grid.fig-right{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
/* 2026-10-05：原規則寫成「.s-open-grid.fig-right .s-open」（找 grid 的子孫 .s-open），
   但 .s-open 是 grid 的「父層」，選擇器永不匹配＝死碼。padding 已直接改小，刪除。 */
/* 2026-10-05（GM）：首頁產品圖移回 hero 右欄。.s-fig 預設 margin-top:var(--s-gap)
   在 grid 內會把圖往下推、與左欄文字錯位，歸零；寬度交給欄位。
   16:20 二次裁示：KPI 的 .d 說明必須完整落在首屏——hero 圖壓到 28vh/280px、
   hero 底 padding 收緊、h1 上限 54（僅限含右欄圖的首頁 hero，:has 作作用域，
   其餘七頁的 60px 標題與節奏不動）。 */
.s-open-grid .s-fig{margin:0}
.s-open-grid .s-fig img{max-height:min(28vh,280px)}
/* 2026-10-06（GM）：原本這裡有兩條「只對首頁」的規則——
   hero 底 padding 收到 20px（其他頁 40px）、h1 上限壓到 54px（其他頁 60px），
   是 10-05 為了把首屏塞進 744 視窗加的。後續已改用 min-height 對齊機制
   （hero 一律 489／矮視窗 386），首屏靠 min-height 收口，不再需要靠縮字，
   結果卻讓總覽頁的字級與節奏跟其他頁不一致（GM 回報）。
   這兩條刪除，總覽頁與其他頁共用同一套字級與 padding。
   實測：刪除後 hero 仍由 min-height 綁定（489／386），KPI 位置不變。 */
/* 2026-10-05（GM）：換上二代產品圖後，figcaption 多一行 → hero 增高 →
   首屏 KPI 底部落在 757，超出 744 視窗 13px（KPI 說明被切）。
   hero 底 padding 之外，再把「hero 之後第一組 KPI」的上間距改以 vh 為準：
   視窗越矮，間距越收——節奏不變，但首屏一定收得進去。其他七頁的 KPI 不變。 */
/* 2026-10-06（GM）：數字列跨頁對齊。實測各頁 KPI 起始 y 不一致
   （clinical 452／ip・fto・market・dd 516／index 618 @1400×1000），
   原因是各頁 hero 文字行數不同。錨定最高、且不可壓縮的總覽頁（含產品圖；
   英文版 lede 換行較多，實測 489px 為全站最高 hero）：
   凡「.s-open 後面直接接 .s-bignums」的頁面，hero 一律撐到同一高度（489px）、
   hero→KPI 間距一律用同一條 clamp——翻頁時數字列不再跳位。
   只限 screen（列印排版不灌水空白）。 */
@media screen{
  /* 2026-10-06（GM）：數字列跨頁對齊（489px 錨點）。
     2026-10-06 二修（GM）：技術頁三圖排「上提並留空格」——.s-fig3 頁的 hero
     不灌到 489（這頁沒有數字列），縮到 300px 讓圖排提前，
     圖高另依視窗高收縮（見 .s-fig3 img），圖說不再被擠出首屏。 */
  /* 錨點 489 → 504：2026-10-06（GM）總覽頁 h1 由 54px 放大回 60px 後，
     英文版標題換行多一行、hero 實測 501px，超過原錨點 → 數字列會跳 12px。
     錨點上修到 504 覆蓋它，12 頁仍維持同一條線。 */
  /* 2026-10-16（GM）：實測「數字框／產品圖卡被截一半」——hero 預留過高
     （原 48vh/420px）＋ .s-wrap 底部 64px（mx-system.css）＋ 卡片間距三者疊加，
     把首屏下方的數字列與產品圖卡推出視窗。三處同時收緊。 */
  .s-open:has(+ .s-bignums),
  .s-open:has(+ .s-sech .s-bignums){min-height:clamp(150px,30vh,240px)}
  .s-open:has(+ .s-fig3){min-height:clamp(130px,20vh,190px)}
  .s-open:has(+ .s-bignums) + .s-bignums,
  .s-open:has(+ .s-sech .s-bignums) + .s-sech .s-bignums,
  .s-open:has(+ .s-fig3) + .s-fig3{margin-top:clamp(8px,1.6vh,18px)}
}
/* mx-system.css 的 body.sys-public .s-wrap 底部內距 64px 會把首屏後的第一個區塊
   往下推；hero 與其後區塊同屬首屏時收緊（層級需高於 mx-system，故加 body.sys-public）。 */
body.sys-public .s-wrap:has(> .s-open){padding-bottom:clamp(10px,1.8vh,22px)}
/* 2026-10-05（GM）：換上二代產品圖後，figcaption 多一行；英文版 lede 換行更多。
   1536×744 實測：中版 KPI 底 719（OK）、英版落到 799（溢出 55px，說明被切）。
   補一組「矮視窗」規則：只在視窗高度 ≤820px 時對首頁 hero＋其後第一組 KPI 收緊；
   高螢幕與其餘七頁維持原規格，不為了湊首屏把設計壓扁。
   2026-10-06（GM）：矮視窗同步做「跨頁對齊」——min-height 收到 386px、
   間距規則放寬到所有帶 KPI 的頁，實測各頁 KPI y 一律 517、底部 658（≤744）。 */
@media (max-height:820px){
  /* 2026-10-06（GM）：這三條原本也只作用於含右欄圖的首頁（:has(.s-open-grid)），
     矮視窗下首頁 h1 只剩 38.9px、其他頁 51.8px——正是 GM 看到的落差。
     改為全站一致：矮視窗要縮就一起縮，各頁字級維持相同體例。
     （首屏仍由 min-height 386 綁定，縮字不影響 KPI 位置。） */
  .s-open .s-h1{font-size:clamp(32px,3.6vw,46px)}
  .s-open .s-lede{font-size:clamp(13.5px,1.15vw,16px); line-height:1.55; margin-top:14px}
  .s-open .s-kicker{margin-bottom:12px}
  .s-fig figcaption{margin-top:10px; font-size:11.5px; line-height:1.55}
  @media screen{
    /* 386 → 440：總覽頁 h1 回到全站字級後，矮視窗下 hero 實測
       zh 394／en 436，超過原 386 錨點 → 數字列跳 30–50px。
       錨點上修到 440 覆蓋，各頁維持同一條線；
       1536×744 實測 KPI 底最大 731 ≤ 744，首屏仍收得進。 */
    .s-open:has(+ .s-bignums),
    .s-open:has(+ .s-sech .s-bignums){min-height:clamp(140px,26vh,200px)}
    .s-open:has(+ .s-fig3){min-height:clamp(110px,16vh,160px)}
    .s-open:has(+ .s-bignums) + .s-bignums,
    .s-open:has(+ .s-sech .s-bignums) + .s-sech .s-bignums,
    .s-open:has(+ .s-fig3) + .s-fig3{margin-top:clamp(6px,1.2vh,14px)}
  }
  /* 2026-10-16（GM）：左右 padding 原為 0（無卡片框時代遺留），卡片化後
     數字與說明文字貼齊卡片邊緣——補上左右內距（與 mx-system.css 22px 同檔）。 */
  .s-open:has(+ .s-bignums) + .s-bignums .s-bignum{padding:clamp(15px,2vw,22px) clamp(16px,1.8vw,22px)}
  .s-open:has(+ .s-bignums) + .s-bignums .s-bignum .n{font-size:clamp(34px,4.2vw,54px)}
  .s-open:has(+ .s-bignums) + .s-bignums .s-bignum .t{margin-top:8px; font-size:13.5px}
  .s-open:has(+ .s-bignums) + .s-bignums .s-bignum .d{font-size:12.2px; line-height:1.62; margin-top:6px}
}

/* ── 3. 大數字 ─────────────────────────────────────────────────────────── */
.s-bignums{
  display:grid; gap:clamp(14px,2.2vw,22px);
  /* 2026-10-05：minmax(190px,1fr) 在 1076px 容器會排出 5–6 欄（每欄 ~161–203px），
     而 .n 的 60–68px 大字「$2.70B」約 210px 寬且不可斷行 → 溢出欄位、
     疊印到右側卡片（首頁 KPI 出現「$2.7059」）。收斂為 4 欄起跳。 */
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  margin:var(--s-gap) 0 0;
}
/* 首頁 6 張 KPI 用 3×2，避免 4+2 的孤行 */
.s-bignums.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}
/* 2026-10-16（GM）：B2B 關係指標四項改為四個數字框。四項皆為關係推進狀態，
   無可稽核之絕對計數（不臆造數字），故 .n 改放狀態詞並縮一號字級，維持框體一致。 */
.s-bignums.cols4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* 2026-10-20 GM：is-word 值是「詞」不是「數字」——nowrap（原為防數字折行而設）
   會讓英文長詞（International keynote 等）超出卡片被裁切，改回可折行；
   折行造成的卡片高度差由 grid 等高吸收，優先於「整排不動」的數字紀律。 */
.s-bignum.is-word .n{font-size:clamp(18px,2.2vw,26px); letter-spacing:.02em; white-space:normal}
/* 2026-10-20 GM 二次訂正：日期卡是 hero 大數字，絕不縮小——保留 .s-open:has 大字級，
   僅關掉 nowrap 讓 "December 1, 2028" / "2028-12-01" 以大字兩行顯示（與另兩張卡同氣勢）。 */
.s-open:has(+ .s-bignums) + .s-bignums .s-bignum.is-date .n,
.s-open:has(+ .s-sech .s-bignums) + .s-sech .s-bignums .s-bignum.is-date .n{white-space:normal; line-height:1.02}
@media (max-width:1080px){.s-bignums.cols4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.s-bignums.cols4{grid-template-columns:1fr}}
.s-bignum{
  min-width:0;               /* grid 子項預設 min-width:auto，長數字會撐破欄寬 */
  padding:clamp(18px,2.6vw,26px) clamp(16px,1.8vw,22px); /* 左右不為 0：卡片化後文字不可貼邊（2026-10-16 GM） */
  border-top:3px solid var(--mx-accent);
}
.s-bignum .n{
  font-family:var(--mx-font-num); font-weight:900;
  font-size:clamp(38px,5.6vw,68px); line-height:.98; letter-spacing:-.02em;
  color:var(--mx-accent); font-variant-numeric:tabular-nums;
  display:block;
}
.s-bignum .n small{font-size:.42em; font-weight:800; letter-spacing:0}
.s-bignum .t{
  display:block; margin-top:9px; font-size:clamp(13px,1.5vw,15px);
  font-weight:700; color:var(--mx-ink);
}
.s-bignum .d{
  display:block; margin-top:5px; font-size:12.5px; line-height:1.62; color:var(--mx-muted);
}

/* ── 4b. 證據連結（W6-S630）─────────────────────────────────────────────────
   精簡版只給結論。每個數字下方開一條通往完整版「證據與理論」的路，
   讀者不必在兩版之間來回找：看到哪個數字，就從那個數字點進去。 */
.s-ev{
  display:inline-block; margin-top:7px; font-size:11.5px; font-weight:700;
  color:var(--mx-accent); text-decoration:none; letter-spacing:.01em;
  border-bottom:1px solid transparent;
}
.s-ev:hover{border-bottom-color:var(--mx-accent)}
/* W6-S656：公開版不再連結內部版，s-ev 改為純標籤（無箭頭、不可點） */
span.s-ev{cursor:default}
span.s-ev::after{content:""}
/* W6-S656：公開版不再連結內部版，s-ev 改為純標籤（無箭頭、不可點） */
span.s-ev{cursor:default}
span.s-ev::after{content:""}
/* W6-S656：公開版不再連結內部版，s-ev 改為純標籤（無箭頭、不可點） */
span.s-ev{cursor:default}
span.s-ev::after{content:""}
/* W6-S656：公開版不再連結內部版，s-ev 改為純標籤（無箭頭、不可點） */
span.s-ev{cursor:default}
span.s-ev::after{content:""}
/* W6-S656：公開版不再連結內部版，s-ev 改為純標籤（無箭頭、不可點） */
span.s-ev{cursor:default}
span.s-ev::after{content:""}
.s-ev::after{content:" →"}

/* ── 4. 產品大圖 ───────────────────────────────────────────────────────── */
.s-fig{
  margin:var(--s-gap) 0 0;
  background:var(--s-fig-bg); border:1px solid var(--mx-line-soft);
  border-radius:18px; padding:clamp(16px,3vw,30px);
  text-align:center;
}
.s-fig img{
  display:block; margin:0 auto; width:100%; height:auto;
  /* 2026-10-05：58vh/520px 讓 hero 圖吃掉整個首屏，下方資訊看不到。
     兩輪壓縮：先到 42vh/380px，配合版心放寬再降到 38vh/340px，
     讓 hero（標題＋三 KPI＋圖）在 100% 縮放的 1080p 螢幕一屏收完。 */
  max-height:min(38vh,340px); object-fit:contain;
}
.s-fig figcaption{
  margin-top:14px; font-size:12.5px; line-height:1.68; color:var(--mx-muted);
  padding-top:12px; border-top:1px solid var(--mx-line-soft);
}
.s-fig figcaption b{color:var(--mx-ink)}

/* ── 2026-10-06（GM）：首頁 hero 產品圖 1.5 代／二代輪播 ──────────────────
   純 CSS 交錯淡入（crossfade），不引入 JS：投影／螢幕自動輪動，
   列印與「減少動態效果」時固定顯示二代（.s-rot-2），不會兩張疊印。
   兩張圖與兩段圖說都用 grid 疊在同一格，容器高度＝較高者——
   版式不會因輪播跳動。 */
.s-fig-rot .s-rot{display:grid}
.s-fig-rot .s-rot-i{grid-area:1/1; width:100%; height:auto; max-height:min(38vh,340px); object-fit:contain; display:block; margin:0 auto}
.s-open-grid .s-fig-rot .s-rot-i{max-height:min(28vh,280px)}
.s-fig-rot figcaption{display:grid}
.s-fig-rot .s-rot-c{grid-area:1/1}
@keyframes srotA{0%,46%{opacity:1} 50%,96%{opacity:0} 100%{opacity:1}}
@keyframes srotB{0%,46%{opacity:0} 50%,96%{opacity:1} 100%{opacity:0}}
@media screen and (prefers-reduced-motion:no-preference){
  .s-fig-rot .s-rot-1{animation:srotA 10s linear infinite}
  .s-fig-rot .s-rot-2{animation:srotB 10s linear infinite}
}
/* 靜止狀態（列印／減少動態效果）：只留二代，避免兩張疊印 */
@media print{
  .s-fig-rot .s-rot-1{display:none}
  .s-fig-rot .s-rot-2{opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .s-fig-rot .s-rot-1{display:none}
  .s-fig-rot .s-rot-2{opacity:1}
}

/* 圖組：三張並列 */
.s-fig3{
  display:grid; gap:clamp(12px,2vw,20px);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  margin:var(--s-gap) 0 0;
}
.s-fig3 figure{
  margin:0; background:var(--s-fig-bg); border:1px solid var(--mx-line-soft);
  border-radius:14px; padding:clamp(14px,2.2vw,20px);
}
/* 2026-10-05：三張器械圖原始比例不同，height:auto 造成三卡圖高不一、
   caption 起點錯位（第一代 caption 靠上、第二代在底部）。
   改為「固定等高＋contain」，三圖縮放基準一致、位置對齊。 */
/* 2026-10-06（GM）：圖高原 clamp(170px,22vw,260px) 在矮視窗會把圖說擠出首屏。
   改依「視窗高」收縮（22vh），螢幕越矮圖越矮，圖與圖說永遠同屏；
   列印不吃 vh，維持固定 240px。三圖同一 canvas（1600×1000、同地面線），
   等比關係（Gen1＝Gen1.5、Gen2≈1.05×）在任何高度下自動成立。 */
/* 2026-10-16（GM）：固定 height 會讓產品圖被裁切／看得不完整；改為
   height:auto ＋ max-height（三圖同一 canvas 1600×1000，等比自動對齊）。 */
.s-fig3 img{width:100%;height:auto;max-height:clamp(170px,26vw,300px);object-fit:contain;display:block;margin:0 auto}
@media screen{.s-fig3 img{max-height:clamp(130px,24vh,260px)}}
.s-fig3 figcaption{margin-top:11px;font-size:12px;line-height:1.6;color:var(--mx-muted)}
.s-fig3 figcaption b{display:block;color:var(--mx-ink);font-size:13px;margin-bottom:3px;font-weight:700}

/* 2026-10-13（GM）：臨床頁「代表性手術術式」6 張圖——原沿用 .s-fig3 的
   auto-fit minmax(240px,1fr)，寬屏會排成 3+3 或 2+2+2，與「同一列」要求不符。
   改為專屬 .s-fig6：固定 6 欄，6 張圖恆為一列；窄屏才逐級降為 3→2→1 欄。
   不動 .s-fig3，避免影響技術頁三圖版。 */
.s-fig6{
  display:grid; gap:clamp(8px,1.1vw,14px);
  grid-template-columns:repeat(6,1fr);
  margin:var(--s-gap) 0 0;
}
.s-fig6 figure{
  margin:0; background:var(--s-fig-bg); border:1px solid var(--mx-line-soft);
  border-radius:14px; padding:clamp(10px,1.2vw,16px);
  min-width:0;
}
.s-fig6 img{width:100%;height:clamp(150px,17vw,220px);object-fit:contain;display:block;margin:0 auto}
@media screen{.s-fig6 img{height:clamp(100px,17vh,200px)}}
.s-fig6 figcaption{margin-top:9px;font-size:11.5px;line-height:1.55;color:var(--mx-muted)}
.s-fig6 figcaption b{display:block;color:var(--mx-ink);font-size:12.5px;margin-bottom:3px;font-weight:700}
/* 科別清單：9 科一列排開，窄屏自動換行 */
.s-dept9{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px;padding:0;list-style:none}
.s-dept9 li{
  font-size:11.5px;line-height:1.4;padding:3px 9px;border-radius:999px;
  background:var(--s-fig-bg);border:1px solid var(--mx-line-soft);color:var(--mx-ink);
}
.s-dept9 li b{font-weight:700}
.s-dept9 li span{color:var(--mx-muted)}
/* 窄屏降欄（維持同一列為先，降欄為次） */
@media screen and (max-width:1080px){.s-fig6{grid-template-columns:repeat(3,1fr)}}
@media screen and (max-width:680px){.s-fig6{grid-template-columns:repeat(2,1fr)}}
@media screen and (max-width:420px){.s-fig6{grid-template-columns:1fr}}
/* 2026-10-06（GM）：矮視窗圖卡內距收一檔，圖說底部留安全餘裕。
   （放在基礎規則之後確保覆蓋生效） */
@media screen and (max-height:820px){.s-fig3 figure{padding:12px 14px}}

/* ── 5. 主張陳述條（超大引言式） ───────────────────────────────────────── */
.s-claim{
  margin:var(--s-gap) 0 0; padding:clamp(26px,4.4vw,44px) 0;
  border-top:1px solid var(--mx-line); border-bottom:1px solid var(--mx-line);
  font-size:clamp(19px,3vw,34px); font-weight:800; line-height:1.4;
  color:var(--mx-ink); letter-spacing:-.005em;
}
.s-claim em{font-style:normal; color:var(--mx-accent)}
.s-claim-sub{
  margin:14px 0 0; font-size:clamp(13px,1.6vw,16px); font-weight:400;
  line-height:1.7; color:var(--mx-muted); letter-spacing:0;
}

/* ── 6. 條列（每項一行一句） ───────────────────────────────────────────── */
.s-list{margin:var(--s-gap) 0 0; border-top:1px solid var(--mx-line)}
.s-row{
  display:grid; grid-template-columns:minmax(0,auto) minmax(0,1fr);
  gap:clamp(16px,3vw,40px); align-items:baseline;
  padding:clamp(16px,2.2vw,22px) 0;
  border-bottom:1px solid var(--mx-line-soft);
}
.s-row .lead{
  font-size:clamp(17px,2.4vw,26px); font-weight:800; line-height:1.3;
  color:var(--mx-ink); letter-spacing:-.005em;
}
.s-row .lead .mark{
  display:block; font-size:11.5px; font-weight:700; letter-spacing:.14em;
  color:var(--mx-accent); margin-bottom:5px; text-transform:uppercase;
}
.s-row .body{font-size:clamp(13px,1.55vw,15px); line-height:1.75; color:var(--mx-body)}
/* ---- 疊代速度對比（.s-pace）----------------------------------------------
   2026-10-16：技術頁 05「一代平台的優化升級」補充「四年疊代 vs 大廠 11 年」。
   兩條橫條同一基準（4/11 → 36%），久方為品牌色、大廠為中性灰；
   長條僅表示相對長度，非產品效能評比。 ------------------------------------ */
.s-pace{margin-top:clamp(12px,1.6vw,18px); border:1px solid var(--mx-line);
 border-radius:12px; padding:clamp(14px,1.8vw,20px) clamp(16px,2vw,22px);
 background:var(--mx-line-soft)}
.s-pace-row{display:grid; grid-template-columns:minmax(110px,auto) minmax(70px,1fr) auto;
 align-items:center; gap:8px clamp(10px,1.4vw,16px)}
.s-pace .lab{font-size:clamp(12px,1.3vw,13.5px); font-weight:700; color:var(--mx-body); white-space:nowrap}
.s-pace .bar{display:block; height:10px; border-radius:6px; background:#fff;
 box-shadow:inset 0 0 0 1px var(--mx-line); overflow:hidden}
.s-pace .bar i{display:block; height:100%; width:var(--w,100%); background:var(--mx-muted)}
.s-pace-row.is-ours .bar i{background:var(--mx-accent)}
.s-pace .yr{font-family:var(--mx-font-num); font-size:clamp(19px,2.2vw,27px);
 font-weight:800; color:var(--mx-muted); font-variant-numeric:tabular-nums}
.s-pace-row.is-ours .yr{color:var(--mx-accent)}
.s-pace-note{margin:5px 0 clamp(12px,1.6vw,16px); font-size:clamp(11.5px,1.25vw,12.8px);
 line-height:1.55; color:var(--mx-muted)}
.s-pace-f{margin-top:2px; padding-top:clamp(8px,1.2vw,12px);
 border-top:1px dashed var(--mx-line); font-size:clamp(11px,1.15vw,12px);
 line-height:1.7; color:var(--mx-muted)}
@media (max-width:640px){
 .s-pace-row{grid-template-columns:1fr auto; }
 .s-pace .lab{grid-column:1 / -1; white-space:normal}
 .s-pace .bar{grid-column:1}
}

.s-row .body b{color:var(--mx-ink)}

/* ── 7. 對照兩欄 ───────────────────────────────────────────────────────── */
.s-vs{
  margin:var(--s-gap) 0 0; display:grid; gap:clamp(16px,2.4vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}
.s-vs > div{
  padding:clamp(20px,3vw,28px); border-radius:14px;
  border:1px solid var(--mx-line); background:#fff;
}
.s-vs > div.ours{border-color:var(--mx-accent); background:#F4FAFE}
.s-vs h3{
  margin:0 0 12px; font-size:clamp(15px,1.9vw,19px); font-weight:800; color:var(--mx-ink);
}
.s-vs .big{
  font-family:var(--mx-font-num); font-weight:900; font-size:clamp(28px,4.4vw,48px);
  color:var(--mx-accent); line-height:1.05; display:block; margin-bottom:4px;
}
.s-vs p{margin:0;font-size:13px;line-height:1.72;color:var(--mx-body)}

/* ── 8. 時序：橫向節點 ─────────────────────────────────────────────────── */
.s-timeline{
  margin:var(--s-gap) 0 0; position:relative; padding-left:0;
  display:grid; gap:0;
}
.s-tl-item{
  display:grid; grid-template-columns:130px minmax(0,1fr);
  gap:clamp(16px,3vw,36px); align-items:start;
  padding:clamp(18px,2.6vw,26px) 0; position:relative;
}
.s-tl-item + .s-tl-item{border-top:1px solid var(--mx-line-soft)}
.s-tl-date{
  font-family:var(--mx-font-num); font-weight:800; font-size:clamp(15px,2vw,19px);
  color:var(--mx-accent); font-variant-numeric:tabular-nums; line-height:1.3;
}
.s-tl-body{font-size:clamp(13px,1.55vw,15px); line-height:1.75; color:var(--mx-body)}
.s-tl-body b{color:var(--mx-ink); font-size:1.06em}
.s-tl-body .s-mx-warn{color:var(--mx-risk); font-weight:700}

/* ── 8.1 章節大標（W6-S707：市場頁新增「中國市場」章） ─────────────────── */
.s-sech{
  margin:calc(var(--s-gap)*1.6) 0 0; padding-top:clamp(22px,3vw,34px);
  border-top:2px solid var(--mx-ink);
}
/* 2026-10-16（GM）：B2B 頁 KPI 標題與導言移除後，該章節只剩四張指標卡——
      無標題即不畫章節分隔線、不留章節頂距，避免出現一條懸空的粗線。 */
.s-sech:not(:has(h2)){
  border-top:none; padding-top:0;
}
/* 2026-10-16（GM）：Hero 區閉合後直接接章節時，收掉雙重間距——
   .s-wrap 底部 padding 已給呼吸空間，再疊 .s-sech 的 1.6× 上 margin
   會在 Hero 與第一個章節標題之間擠出一大塊死白（story／ip／monitor 命中；
   CSS 相鄰兄弟選擇器會跳過 HTML 註解，中間有註解也生效）。 */
.s-wrap + .s-sech{margin-top:0}
.s-sech .n{
  display:block; font-family:var(--mx-font-num); font-weight:900;
  font-size:clamp(30px,4vw,46px); color:var(--mx-accent); line-height:1;
  letter-spacing:-.02em; margin-bottom:8px;
}
.s-sech h2{
  margin:0; font-weight:900; letter-spacing:-.015em; color:var(--mx-ink);
  font-size:clamp(19px,2.6vw,30px); line-height:1.25;
}
.s-sech .sub{
  margin:10px 0 0; font-size:13.5px; line-height:1.75; color:var(--mx-muted);
  max-width:900px;
}


.s-duo,.s-sech.has-comic{
  display:grid; grid-template-columns:minmax(0,1fr) clamp(190px,23vw,300px);
  gap:clamp(18px,3.2vw,40px); align-items:start;
}
.s-comic{
  margin:0; background:#fff; border:1px solid var(--mx-line-soft,#EBF0F5);
  border-radius:12px; overflow:hidden; box-shadow:0 1px 5px rgba(6,26,48,.07);
}
.s-comic img{width:100%; height:auto; display:block}
.s-comic figcaption{
  font-size:11px; line-height:1.55; color:var(--mx-muted);
  padding:7px 10px; border-top:1px solid var(--mx-line-soft,#EBF0F5); background:#FAFCFE;
}
@media (max-width:860px){
  .s-duo,.s-sech.has-comic{grid-template-columns:1fr}
  .s-comic{max-width:440px}
}
/* ── 2026-10-16（GM）：漫畫中的器械「不是久方的產品」——凡出現器械的段位，
      一律改用站上既有的實機照片（gen15_norm.png），不再用 AI 生成的外形。
      實機照為黑底，故以 mix-blend-mode:screen 疊在深色場景上合成。 ─────── */
.s-comic.s-prod img{background:#0A1420; padding:clamp(8px,1.4vw,16px) 0}
.s-comic.s-where{display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:8px}
.s-comic.s-where figcaption{grid-column:1/-1}
.w-p{position:relative; border-radius:10px; overflow:hidden}
.w-p img{width:100%; height:auto; display:block; mix-blend-mode:screen}
.w-or{background:radial-gradient(120% 120% at 50% 25%, #14416B 0%, #071B2F 100%)}
.w-fd{background:radial-gradient(120% 120% at 50% 25%, #6B4A22 0%, #241505 100%)}
.w-lab{
  position:absolute; left:8px; top:8px; z-index:2;
  font-size:11px; font-weight:800; letter-spacing:.02em; color:#fff;
  background:rgba(0,0,0,.45); padding:3px 9px; border-radius:999px;
}
@media (max-width:860px){ .s-comic.s-where{grid-template-columns:1fr} }

/* ── 9. 揭露框（丙案精神，簡單版仍保留） ───────────────────────────────── */
.s-disclose{
  margin:var(--s-gap) 0 0; padding:clamp(20px,3vw,30px);
  background:#FDF8EF; border-left:4px solid var(--mx-warn); border-radius:12px;
}
.s-disclose h3{
  margin:0 0 10px; font-size:clamp(14px,1.8vw,17px); font-weight:800; color:#8A5200;
}
.s-disclose p{margin:0 0 10px;font-size:13px;line-height:1.75;color:#5A3E10}
.s-disclose p:last-child{margin-bottom:0}

/* ── 專利樹補充說明（FTO 頁，W6-S500） ─────────────────────────────── */
.s-tree{
  margin:var(--s-gap) 0 0; padding:clamp(20px,3vw,30px);
  background:#F4F8FB; border-left:4px solid var(--mx-accent,#006CB4); border-radius:12px;
}
.s-tree h3{ margin:0 0 10px; font-size:clamp(14px,1.8vw,17px); font-weight:800; color:var(--mx-ink,#0B1F3A); }
.s-tree p{ margin:0 0 10px; font-size:13px; line-height:1.75; color:var(--mx-body,#33475B); }
.s-tree p:last-child{ margin-bottom:0; }
.s-tree ul{ margin:8px 0 12px; padding-left:20px; }
.s-tree li{ font-size:13px; line-height:1.8; color:var(--mx-body,#33475B); margin:0 0 5px; }
.s-tree li b{ color:var(--mx-ink,#0B1F3A); }
.s-tree code{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; background:var(--mx-line-soft,#EBF0F5); padding:1px 5px; border-radius:4px; color:var(--mx-accent-dark,#005A9C); }

/* ── 10. 頁尾連結回完整版 ───────────────────────────────────────────────── */
.s-more{
  margin:var(--s-gap) 0 0; padding:clamp(20px,3vw,28px);
  border:1px dashed var(--mx-line); border-radius:12px;
  background:#FCFDFE; text-align:center;
}
.s-more p{margin:0 0 14px; font-size:13.5px; line-height:1.75; color:var(--mx-muted)}
.s-more a{
  display:inline-block; font-size:14px; font-weight:700; text-decoration:none;
  color:#fff; background:var(--mx-accent); padding:10px 22px; border-radius:999px;
}
.s-more a:hover{filter:brightness(1.08)}

/* ── 11. 頁首品牌列（RWD 收合） ─────────────────────────────────────────── */
/* 2026-10-06（GM）：窄螢幕（≤1240px）雙欄會把文字欄擠到 499px（1080 視窗實測），
   kicker 被迫折成兩行、與其他頁的單行 kicker 不一致。
   加寬文字欄比例、收小欄距；產品圖仍是「高度上限」所限，不受影響。 */
@media (max-width:1240px){
  .s-open-grid.fig-right{grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr); gap:clamp(16px,2.4vw,30px)}
}
@media (max-width:860px){
  .s-open-grid.fig-right{grid-template-columns:1fr}
  .s-bignums.cols3{grid-template-columns:1fr}
  .s-tl-item{grid-template-columns:1fr; gap:6px}
  .s-row{grid-template-columns:1fr; gap:8px}
}

/* ── 12. 列印 ─────────────────────────────────────────────────────────── */
@media print{
  .s-open{padding-top:0}
  .s-fig,.s-fig3 figure,.s-vs > div{ -webkit-print-color-adjust:exact; print-color-adjust:exact}
  .s-h1{font-size:34pt}
  .s-bignum .n{font-size:28pt}
  .s-more{display:none}
}

/* ── 2026-10-16（GM）：加強公開版頁面視覺層次與節奏 ───────────────────────
   症狀：首頁／使命／B2C／B2B 四頁看起來「還是不滿意」——大白底＋重複卡片
   模板、標題過長、缺乏視覺焦點與節奏變化。
   對策：
   ① 強化 .s-open 開場區的戲劇性（更明確的漸層／格線／左側識別色條）。
   ② .s-bignum 數字改為品牌漸層文字，卡片增加微浮起與 hover。
   ③ 為 .s-bignum.is-word（B2B 關係里程碑）新增專屬「里程碑卡」樣式，
      避免把狀態詞硬塞成數字大字。
   ④ .s-row 首欄縮小一級、次欄行高收緊，讓長列表更透氣。
   ⑤ 新增 .s-brief 公開版微調（與 mx-system.css 並存，只補間距）。
   所有變更只動呈現層，不改 SSOT 綁定與內文。 */

/* 開場區：極淺縱向漸層鋪底，讓標題右側的留白讀起來是設計、不是空著。
   八個精簡頁一致，翻頁時節奏不變。 */
body.mx-a.sys-public .s-open{
  background:
    radial-gradient(520px 180px at 96% 8%,rgba(24,168,132,.10),transparent 70%),
    linear-gradient(122deg,#FFFFFF 0%,#F4F9FE 52%,#EAF3FB 100%);
  border-left:5px solid var(--mx-accent);
}

/* 主張陳述條：通欄上下線改為圓角卡片（淡漸層＋細邊＋淺陰影），
   引言在版面上有了「載體」，不再像浮在半空的一行字。 */
.s-claim{
  border:1px solid var(--mx-line-soft); border-radius:16px;
  background:linear-gradient(180deg,#F7FAFC 0%,#FFFFFF 80%);
  padding-left:clamp(20px,3vw,36px); padding-right:clamp(20px,3vw,36px);
  box-shadow:0 1px 2px rgba(20,45,90,.04), 0 12px 28px -26px rgba(20,45,90,.35);
}

/* 三圖卡：改純白底——產品照有白色柔光暈，淺灰底會把暈映成「白方塊」。
   加浮起陰影＋滑過上浮 3px；右上角世代徽章由生成器輸出（.s-fig3-tag）。 */
.s-fig3 figure{
  position:relative; background:#fff;
  box-shadow:0 1px 2px rgba(20,45,90,.05), 0 14px 30px -26px rgba(20,45,90,.45);
  transition:transform .18s ease, box-shadow .18s ease;
}
.s-fig3 figure:hover{
  transform:translateY(-3px);
  box-shadow:0 2px 6px rgba(20,45,90,.07), 0 18px 38px -22px rgba(20,45,90,.5);
}
/* 2026-10-20 GM：世代徽章原為 absolute 浮在圖右上角，英文版「PLATFORM 1　GEN 1.5」
   較長（letter-spacing .16em）→ 壓在器械圖上面重疊。改為隨文（static）右對齊、
   置於圖上方，任何語系皆不與器械相交，視覺仍是同一顆角落晶片。 */
.s-fig3-tag{
  position:static; display:block; width:fit-content; margin:0 0 8px auto;
  font-size:10.5px; font-weight:800; letter-spacing:.16em;
  color:var(--mx-accent); background:#F4FAFE;
  border:1px solid #D9ECFA; border-radius:999px; padding:3px 9px 3px 11px;
}
/* 列印：陰影與動效全部歸零，不灌墨。 */
@media print{
  .s-open{background:none}
  .s-claim,.s-fig3 figure{box-shadow:none}
  .s-fig3 figure:hover{transform:none}
}

/* ── 2026-10-06（GM）W6-S327　版面調整（實測幾何後對症下藥）──────────────
   量測（1080×720，_layout_measure.js）：
   · 技術頁 .s-open→.s-fig3 間距實測 20px，其餘區塊一律 64px —— 節奏斷掉。
   · .s-row 首欄為 auto 寬，各列 lead 長度不同 → 正文起點逐列參差
     （英文版 What business／Market size 差異最明顯）。
   · 超寬螢幕（1560 版心）下 .s-row .body 單行可達 1,200px，長行難讀。
   ──────────────────────────────────────────────────────────────────── */
/* 1. 三圖卡與其他區塊同一節奏：20px → clamp(30,4.2vw,48)。
      仍保留「上提」精神（不灌到 64），但與前後段不再落差過大。 */
@media screen{
  .s-open:has(+ .s-fig3) + .s-fig3{margin-top:clamp(30px,4.2vw,48px)}
}
/* 2. 正文加閱讀上限 900px（1560 版心下單行不再拉到 1,200px）。
      首欄維持 auto 寬：實測英文標題最長需 420px，固定窄欄會讓它折行、
      英文技術頁總高 +254px（1688→1942），得不償失——故不鎖死欄寬。 */
.s-row .body{max-width:900px}
/* 3. 卡片圖高一檔（144 → 158 @720），產品圖更有存在感，
      實測卡底仍在首屏內（720 高時 655 < 720）。 */
/* 2026-10-16（GM）：產品圖要「完整呈現」——固定 height 會把器械上下緣切掉
   （尤其 Gen 1 直立構型）。改 height:auto ＋ max-height：圖依原比例完整入框，
   三圖皆為 1600×1000 同一 canvas，等比關係與卡高對齊仍然成立。 */
.s-fig3 img{height:auto; max-height:clamp(220px,26vw,320px)}
@media screen{.s-fig3 img{height:auto; max-height:clamp(180px,26vh,300px)}}

/* ── 2026-10-08（GM）對齊與均分 ─────────────────────────────────────────────
   量測工具：`_audit_align.js`（CDP 實測，1120 寬）；以下三項皆為實測值，非目視。
   ① .s-row 首欄原為 minmax(0,auto)：每列依「自身標題寬」決定欄寬，
      正文左緣逐列參差——實測中文散布 19–188px、英文 68–382px（en/market 最嚴重）。
      連帶效果：標題愈寬的列，正文欄愈窄、行數愈多 → 同一頁各列文字量落差極大。
      → 固定首欄，所有列的正文左緣與正文欄寬完全一致。
        寬度取實測 90 分位／中位數：中文 259px → 260px；英文 332px → 340px。
   ② .s-bignum .n：數字一旦折行，該卡標題與說明整排下移。實測位移 62px＝整整一行
      （en/dd「4classes, 16 items」）。
      → nowrap 保證單行；字級上限維持 68px，僅把 vw 係數 5.6→5.5（1120 寬下 61.6px）。
        矮視窗（≤820px）另有既有規則，不動。
   ③ .s-bignums 6 格落在 5 欄容器 → 排成 5+1（en/index 實測）。→ 6 格一律 3×2。
   ────────────────────────────────────────────────────────────────────────── */
@media (min-width:861px){
  .s-row{grid-template-columns:min(260px,24vw) minmax(0,1fr)}
  html[lang="en"] .s-row{grid-template-columns:min(340px,30vw) minmax(0,1fr)}
}
.s-bignum .n{white-space:nowrap}
@media (min-height:821px){
  .s-bignum .n{font-size:clamp(38px,5.5vw,68px)}
}
/* 6 格 → 3×2（避免 5+1 的孤行）；4 格維持 4 欄、3 格維持 3 欄 */
.s-bignums:has(> :nth-child(6):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
/* KPI 列下的小註：把「數字列不該承載的長清單／沿革」移出卡片，讓各卡文字量均衡。
   卡片只留一句判讀，細節（專利號、國別、V-27 沿革）在小註完整保留，資訊零損失。 */
.s-kpinote{
  margin:14px 0 0; padding-top:9px; font-size:12px; line-height:1.72;
  color:var(--mx-muted); border-top:1px solid var(--mx-line-soft);
}
.s-kpinote b{color:var(--mx-ink)}
/* 子列（.s-row.sub）：原先把 ①②③ 或數個小標全塞在同一格，造成一列十餘行、
   其他列僅一兩行。改為每段自成子列——文字一字未動，只是不再疊在同一格。
   子列首欄留空，正文因此與其他列的正文左緣對齊（同一條垂直線）。 */
.s-row.sub{padding:clamp(5px,0.9vw,9px) 0}
.s-row.sub:last-child{border-bottom:1px solid var(--mx-line-soft);padding-bottom:clamp(14px,2vw,20px)}
/* 平板區間（≥700px）不允許孤行：3 格一律排滿 3 欄。
   實測 768 寬：容器可用 693px，3 欄各 216px——足夠（.n 已 nowrap 且字級 5.5vw）。
   未加此規則時，minmax(220px,1fr) 只排得出 2 欄 → 3 格變 2+1。 */
@media (min-width:700px){
  .s-bignums:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
  .s-fig3:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
}
/* 中間寬度（≤1090px）4 格 KPI 不允許 3+1 孤行：改排 2×2。
   實測 1024 寬：可用 939px，4 欄需 (939−66)/4＝218px ＜ minmax 下限 220
   → 只排得出 3 欄 → 4 格變 3+1。2×2 在 700–1090 都排得滿，
   ≥1091 回到預設 4 欄（實測 1120 寬可用 1031px，4 欄各 241px）。 */
@media (max-width:1090px){
  .s-bignums:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ── 2026-10-10（GM，W6-S526）：格線子項 min-width:0 ─────────────────────────
   .s-row 內含橫捲表格（.mw-scroll 等）時，子項 min-width:auto 會以表格
   min-content（nowrap 表頭，實測 391px）撐破 1fr 軌道，手機上溢出視窗。
   標準格線衛生規則：子項一律允許收縮，橫捲交給捲動容器。 */
.s-row > *{min-width:0}

/* ══════════════════════════════════════════════════════════════════════
   2026-10-15（GM）：公開版還原「W11 設計系統之前的淺色頁首／頁尾」。
   GM 明確指示「不要深色 頁首跟頁尾」。以下僅作用 body.sys-public（公開版），
   不影響內部版（detailed）。因 iv-simple.css 載入早於 mx-system.css（第 10 行
   對第 17 行），故以 !important 壓過後者加上的 navy 漸層。
   ══════════════════════════════════════════════════════════════════════ */

/* —— 頁首品牌列：去 navy 漸層，改淺底（白＋細底線＋極淡陰影） —— */
body.sys-public .mx-brandbar{
  background:#FFFFFF !important;
  border-bottom:1px solid var(--sys-line,#DCE4ED) !important;
  box-shadow:0 1px 0 rgba(6,26,48,.04) !important;
}
/* brandbar 文字原在深色底上為白色，淺底必須轉深色，否則看不見 */
body.sys-public .mx-brandname{color:var(--sys-ink,#0B1F3A) !important; text-shadow:none !important}
body.sys-public .mx-brandsub{color:var(--sys-muted,#5B677A) !important}
/* 中文/EN 版本切換器：原為深色底上的半透明白片，淺底上改為淡灰片＋深字 */
body.sys-public .mx-vswitch{
  background:rgba(10,46,82,.05) !important;
  border:1px solid var(--sys-line,#DCE4ED) !important;
}
body.sys-public .mx-vs{color:var(--sys-muted,#5B677A) !important}
body.sys-public .mx-vs:hover{background:var(--sys-line-soft,#EBF0F5) !important; color:var(--sys-ink,#0B1F3A) !important}
/* .mx-vs.on（目前語言）保持白底藍字，已可讀，不動 */
/* .mx-brandtag（投資人公開版 青綠徽章）在淺底上是正常強調，保留 */

/* ── 2026-10-20（GM 回報）：手機板看不到「中文／EN」切換鍵 ────────────
   根因：mx-system.css 的 @media (max-width:860px) 區塊內有
   .mx-vswitch{display:none}——當初為避免窄螢幕品牌列過擠，直接把切換器
   藏掉；手機視窗（約 390–430px）落在該斷點內，故完全看不到語言切換。
   公開版手機板必須看得到切換鍵，於此覆寫為顯示，並縮小元件、讓次要
   元素讓位，避免品牌列被撐成兩行（品牌列本身有 flex-wrap:wrap，
   即使最終換行也不會被裁切）。
   mx-system.css 晚於本檔載入，故一律 !important。
   ────────────────────────────────────────────────────────────────── */
@media (max-width:860px){
  body.sys-public .mx-vswitch{
    display:inline-flex !important; margin-left:auto !important;
    gap:2px !important; padding:2px !important;
  }
  body.sys-public .mx-brandtag{margin-left:0 !important}
  body.sys-public .mx-vs{font-size:10.5px !important; padding:3px 9px !important}
}
@media (max-width:620px){
  /* 極窄視窗：副標與版本徽章讓位，確保 logo＋品牌名＋語言切換同一行放得下。
     「投資人公開版」之標示於頁尾 .mx-vbar-tag 仍可見，資訊未遺失。 */
  body.sys-public .mx-brandsub{display:none !important}
  body.sys-public .mx-brandtag{display:none !important}
}

/* —— 頁尾：去 navy 漸層，改淺底（極淺灰＋上邊線） —— */
body.sys-public .mx-foot{
  background:#F5F8FB !important;
  color:var(--sys-text,#33475B) !important;
  border-top:1px solid var(--sys-line,#DCE4ED) !important;
}
body.sys-public .mx-foot::after{display:none !important}
body.sys-public .mx-foot-brand{border-bottom:1px solid rgba(10,46,82,.10) !important}
body.sys-public .mx-foot-brand span{color:var(--sys-ink,#0B1F3A) !important}
body.sys-public .mx-foot b{color:var(--sys-ink,#0B1F3A) !important}
body.sys-public .mx-foot .ft-disc{color:var(--sys-muted,#5B677A) !important}
body.sys-public .mx-foot .ft-disc b{color:var(--sys-ink,#0B1F3A) !important}
body.sys-public .mx-foot .ft-ver{color:var(--sys-muted,#5B677A) !important}

/* —— 2026-10-21（GM 指正）：頁尾原為三層堆疊（品牌列 ＋ 版本列 ＋ 免責列），
      三塊各佔一條，讀者滑到底只見重複的橫條。合併為單一頁尾：
      品牌列內併入版本資訊（.ft-ver），免責聲明改列於下方（.ft-disc）。
      基線樣式在此定義（mx-system.css 未載於公開版）。 —— */
body.sys-public .mx-foot-brand{
  display:flex !important; align-items:center !important; gap:10px !important; flex-wrap:wrap !important;
}
body.sys-public .mx-foot .ft-ver{
  font-size:12px !important; font-weight:400 !important; margin-left:auto !important;
}
body.sys-public .mx-foot .ft-ver b{font-weight:700 !important}
body.sys-public .mx-foot .ft-disc{
  margin:10px 0 0 !important; font-size:12px !important; line-height:1.75 !important;
}
@media (max-width:620px){
  body.sys-public .mx-foot .ft-ver{margin-left:0 !important; width:100% !important}
}

/* ════════════════════════════════════════════════════════════════════════════
   2026-10-16（GM 第四次指正，CDP 實測後對症下藥）
   症狀：技術頁「看不到產品圖」、臨床頁「數字框沒有完整露出」、
         B2B 頁「文字框沒有完整露出」。
   實測（vw 1510／vh 832，約等於 1920 螢幕 125% 縮放）：
     · 技術頁 hero[138→544] → fig3[653→982]：產品圖卡被摺線切掉 150px
     · 臨床頁 hero[138→544] → bignums[653→820]：距摺線只剩 12px
     · hero 上方頁首吃掉 138px（brandbar 59 ＋ nav 59 ＋ 間距 20）
   對策：頁首／hero／間距／卡片內距四段同步收緊，全部以 vh 收縮。
   注意：mx-system.css 晚於本檔載入，故一律以 body.mx-a.sys-public 提升權重。
   ════════════════════════════════════════════════════════════════════════════ */
@media screen{
  /* 1. 頁首收一檔（公開版限定） */
  body.mx-a.sys-public .mx-brandbar-in{padding:5px 20px; min-height:48px}
  body.mx-a.sys-public .mx-logo, body.mx-a.sys-public .mx-logo img{height:36px}
  body.mx-a.sys-public .navl a{padding:8px 12px}

  /* 2. Hero：由「浮起的圓角卡片」改為「通欄淺色面板」。
        原因：卡片下緣那條線＋卡片與下方區塊之間的空白，兩者疊在一起
        看起來就是「被切了一刀」；改為通欄面板後沒有下緣線、沒有多餘留白，
        hero 與其後的產品／數字區塊讀起來是同一組，視覺連續。
        收緊 padding 讓首屏容得下 hero ＋ 第一個區塊。 */
  body.mx-a.sys-public .s-open{
    padding:clamp(14px,1.8vh,30px) clamp(22px,2.2vw,40px) clamp(14px,2vh,34px);
    margin-bottom:clamp(10px,1.6vh,22px);
    border:none; border-radius:0; box-shadow:none;
  }
  body.mx-a.sys-public .s-open .s-kicker{margin-bottom:clamp(6px,.9vh,14px)}
  body.mx-a.sys-public .s-open .s-h1{font-size:clamp(30px,3.7vw,48px); margin-bottom:clamp(5px,.9vh,10px)}
  body.mx-a.sys-public .s-open .s-sub{margin-top:clamp(6px,1vh,12px); font-size:clamp(14px,1.5vw,18px)}
  body.mx-a.sys-public .s-open .s-lede{
    margin-top:clamp(8px,1.3vh,16px);
    font-size:clamp(14px,1.5vw,18px); line-height:1.5;
  }

  /* 3. Hero 與其後區塊的間距：收至最小 */
  body.mx-a.sys-public .s-wrap:has(> .s-open){padding-bottom:0}
  body.mx-a.sys-public .s-open:has(+ .s-fig3) + .s-fig3{margin-top:clamp(6px,1.4vh,18px)}
  body.mx-a.sys-public .s-open:has(+ .s-bignums) + .s-bignums,
  body.mx-a.sys-public .s-open:has(+ .s-sech .s-bignums) + .s-sech .s-bignums{margin-top:clamp(6px,1.2vh,16px)}
}

/* 4. 矮視窗（vh ≤ 900，含 1920 螢幕 125% 縮放）：卡片內距再收，圖高維持 24vh */
@media screen and (max-height:900px){
  .s-fig3 figure{padding:12px 14px}
  /* 圖高 26vh → 22vh：矮視窗下讓「三張產品圖」整組落回首屏內（實測切 35px） */
  .s-fig3 img{max-height:clamp(150px,20.5vh,240px)}
  .s-fig3 figcaption{margin-top:8px; font-size:11.5px; line-height:1.5}
  .s-fig3 figcaption b{font-size:12.5px; margin-bottom:2px}
  .s-bignum{padding:clamp(14px,1.8vh,20px) clamp(14px,1.6vw,20px)}
  .s-bignum .n{font-size:clamp(30px,3.6vw,52px)}
  .s-bignum .d{font-size:12px; line-height:1.55; margin-top:5px}
}

/* ════════════════════════════════════════════════════════════════════════════
   2026-10-16（GM）久方使命頁（page-story）首屏：
     · hero 卡片下緣那條橫線移除（border-bottom:none，卡片仍保留左／右／上框）
     · 「01　問題」列推到第二屏：第一屏只留 hero ＋ 章節標題與導言
   ════════════════════════════════════════════════════════════════════════════ */
/* 久方使命頁（story）專屬：
   · hero 卡片下緣黑色橫線移除（僅本頁）
   · 恢復原狀：不製造大段空白，把 hero 與其後區塊的樣式回到 mx-system 預設節奏 */
/* 2026-10-21（GM 指正）：使命頁 hero 內距原寫死 38px 40px 34px，與其他頁
   clamp(22px,2.2vw,40px) 差 6–12px、矮視窗下差更多——翻頁時邊緣距離會跳。
   回歸與其他頁完全相同的響應式曲線（含下方 max-height:780px 斷點）。 */
body.page-story.mx-a.sys-public .s-open{
  padding:clamp(14px,1.8vh,30px) clamp(22px,2.2vw,40px) clamp(14px,2vh,34px);
  margin-bottom:clamp(10px,1.6vh,22px);
}
body.page-story.mx-a.sys-public .s-open .s-kicker{margin-bottom:14px}
body.page-story.mx-a.sys-public .s-open .s-h1{font-size:clamp(30px,4.4vw,50px); margin:0 0 14px}
body.page-story.mx-a.sys-public .s-open .s-sub{margin:clamp(10px,1.6vw,16px) 0 0; font-size:clamp(15px,1.7vw,19px)}
body.page-story.mx-a.sys-public .s-open .s-lede{font-size:clamp(14.5px,1.45vw,17px); line-height:1.85; margin:0}
body.page-story.mx-a.sys-public .s-list{margin-top:var(--s-gap)}
body.page-story.mx-a.sys-public .s-sech:first-of-type{margin-top:0}

/* ════════════════════════════════════════════════════════════════════════════
   2026-10-16（全域稽核，CDP 實測後修復）
   ① 技術頁於 1366×720 筆電（vh 720）三張產品圖卡被切 58px → 矮視窗圖高再收一檔。
   ② 英文首頁 hero 高 466（中文僅 330），於 vh 720／832 分別把數字卡切 152／42px
      → 英文版 hero 字級與行高一併收緊（英文同義文字較長，非等比縮小不足以入屏）。
   ════════════════════════════════════════════════════════════════════════════ */
@media screen and (max-height:780px){
  .s-fig3 img{max-height:clamp(120px,17vh,190px)}
  .s-fig3 figcaption{font-size:11px; line-height:1.45}
}
html[lang="en"] body.mx-a.sys-public .s-open .s-h1{font-size:clamp(26px,3vw,40px)}
html[lang="en"] body.mx-a.sys-public .s-open .s-lede{
  font-size:clamp(13px,1.2vw,15.5px); line-height:1.5;
}
@media screen and (max-height:900px){
  html[lang="en"] body.mx-a.sys-public .s-open .s-h1{font-size:clamp(24px,2.6vw,34px)}
  html[lang="en"] body.mx-a.sys-public .s-open .s-lede{
    font-size:clamp(12.5px,1.1vw,14.5px); line-height:1.45;
  }
}

/* ③ 英文首頁 hero 實測 466（中文 330）：撐高者為右欄產品輪播圖（figure 438），
      非文字；故矮視窗收圖高與圖說，非只收字級。 */
@media screen and (max-height:900px){
  .s-open-grid .s-fig-rot .s-rot-i,
  .s-open-grid .s-fig img{max-height:min(20vh,200px)}
  .s-open-grid .s-fig figcaption{font-size:11.5px; line-height:1.45; margin-top:6px}
}

/* ④ 1366×720 筆電（vh 720）殘餘：技術頁產品圖卡仍切 26px、英文首頁數字卡切 57px
      → 極矮視窗再收一檔（hero 內距、數字卡內距與字級、圖卡內距）。 */
@media screen and (max-height:780px){
  body.mx-a.sys-public .s-open{padding:10px clamp(18px,2vw,32px) 10px}
  /* 使命頁規則權重較高，會蓋掉上一行——同步收緊，與其他頁一致 */
  body.page-story.mx-a.sys-public .s-open{padding:10px clamp(18px,2vw,32px) 10px}
  .s-bignum{padding:12px 14px}
  .s-bignum .n{font-size:clamp(26px,3vw,42px)}
  .s-bignum .d{font-size:11.5px; line-height:1.45; margin-top:4px}
  .s-fig3 figure{padding:10px 12px}
  .s-fig3 img{max-height:clamp(110px,15vh,170px)}
}

/* ⑤ 1366×720 之英文首頁：六張數字卡兩行仍切 48px → 極矮視窗再收間距與卡片 */
@media screen and (max-height:780px){
  .s-bignums{gap:8px}
  .s-bignum{padding:10px 12px}
  .s-bignum .n{font-size:clamp(24px,2.6vw,36px)}
  .s-bignum .d{font-size:11px; line-height:1.4; margin-top:3px}
  .s-fig3 img{max-height:clamp(100px,14vh,150px)}
  html[lang="en"] .s-open-grid .s-fig-rot .s-rot-i,
  html[lang="en"] .s-open-grid .s-fig img{max-height:min(16vh,160px)}
}

/* ============ 策略合作進度表（milestone 02-05） ============ */
.coop{border:1px solid var(--mx-line-soft); border-radius:10px; overflow:hidden; background:#fff}
.coop-row{display:grid; grid-template-columns:minmax(110px,.9fr) minmax(0,1.5fr) minmax(0,1.35fr) minmax(78px,.55fr); gap:12px; padding:11px 14px; border-bottom:1px solid var(--mx-line-soft); align-items:start}
.coop-row:last-child{border-bottom:0}
.coop-row:not(:first-child):hover{background:#f7fafd}
.coop-h{font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--mx-muted,#8a97a6); background:#f4f7fa; padding:9px 14px; margin:-11px -14px 0; border-bottom:1px solid var(--mx-line-soft)}
.coop-row:first-child{background:#f4f7fa; align-items:center; gap:12px}
.coop-n{font-size:14.5px; font-weight:800; color:var(--mx-ink); line-height:1.35}
.coop-s{font-size:11.5px; font-weight:600; color:var(--mx-muted,#8a97a6); letter-spacing:.02em}
.coop-b{font-size:13px; line-height:1.6; color:var(--mx-body)}
.coop-b b{color:var(--mx-ink)}
@media (max-width:860px){
  .coop-row{grid-template-columns:1fr; gap:6px; padding:12px 14px}
  .coop-row:first-child{display:none}
  .coop-n{font-size:14px}
  .coop-b:before{content:''}
}