/* ══════════════════════════════════════════════════════════════
     羲和・築 Le Studio 專屬 CIS（子品牌識別）
     血統承羲和的優雅——奶油底、宋體標題、金線、大留白、一整套 CIS 的紀律；
     築走得更輕盈：淺色比例拉高、字重放輕、線條變細，深色只做錨點、不做大面積。
     色票（築專屬，與羲和六色區隔但同家族）：
       雲白 #FCFAF6 主底 45%｜晨光奶油 #F7F1E7 承羲和 25%
       築松綠 #4E6B5C 主色 12%（比羲和墨綠輕一階）｜淺鼠尾草 #BCC9B1 輔色 8%
       香檳金 #C6A15B 點綴 6%（比日落金更淡更冷靜）｜霧青 #B7C9D1 點綴 4%
       羲和墨綠 #2F453C 只保留作內文字色與頁尾錨點，不再做大面積深色面板。
     字體：中文標題 Noto Serif TC 600｜英文展示 Noto Serif Display 300 全大寫＋寬字距
           內文 Noto Sans TC 400・行高 1.9｜數字 Noto Serif Display 細字重
     元件：1px 建築細線圖示、卡片轉角小金 tick、細襯線編號；
           卡片＝雲白底＋1px 淺鼠尾草細邊＋極輕陰影；
           主 CTA＝築松綠底＋奶油字＋香檳金箭頭。
     色彩模式：鎖定淺色——深色只出現在頁尾與品牌錨點，文字一律奶油白／金。
     ══════════════════════════════════════════════════════════════ */
  :root{
    color-scheme: light;
    --cloud:#FCFAF6; --cream:#F7F1E7; --pine:#4E6B5C; --ink:#2F453C;
    --sage:#BCC9B1; --champagne:#C6A15B; --mist:#B7C9D1;
    --gold:var(--champagne); --sea:var(--mist);
    /* 衍生階（由築六色混色，不引入色票外新色） */
    --pine-deep:color-mix(in srgb, var(--pine) 72%, var(--ink) 28%);
    --ink-deep:#22362D;            /* 墨綠深階：頁尾與錨點 */
    --ink-night:#182420;           /* 墨綠最深階：頁尾底 */
    --paper:var(--cloud);
    --card:var(--cloud);
    --sage-soft:color-mix(in srgb, var(--sage) 30%, var(--cloud));
    --sea-soft:color-mix(in srgb, var(--mist) 30%, var(--cloud));
    --gold-soft:color-mix(in srgb, var(--champagne) 20%, var(--cream));
    --line:color-mix(in srgb, var(--sage) 62%, var(--cloud));
    --card-line:color-mix(in srgb, var(--sage) 78%, var(--cloud));
    --text:#26332C;                /* 墨綠近黑階：淺底內文 */
    --text-soft:color-mix(in srgb, var(--ink) 68%, var(--sage) 32%);
    --bronze:color-mix(in srgb, var(--champagne) 45%, var(--ink) 55%);  /* 深香檳：小標、連結、淺底上的「築」字點綴 */
    --ok:color-mix(in srgb, var(--ink) 84%, var(--sage) 16%);  /* 墨綠深階：可做 */
    --ok-bg:color-mix(in srgb, var(--sage) 32%, var(--cream));
    --warn:var(--bronze);          /* 有條件：深香檳 */
    --warn-bg:var(--gold-soft);
    --danger:#9C3B2E;              /* 陶土深紅階：絕對不做（功能色） */
    --danger-bg:color-mix(in srgb, var(--danger) 13%, var(--cream));
    --sea-ink:color-mix(in srgb, var(--mist) 28%, var(--ink) 72%);   /* 霧青深階：淺底標籤字 */
    /* 深色錨點面（頁尾）上的文字——一律淺色，確保對比 */
    --on-ink:var(--cream);
    --on-ink-soft:color-mix(in srgb, var(--cream) 78%, var(--sage));
    --on-ink-dim:color-mix(in srgb, var(--cream) 60%, var(--sage));
    --shadow:0 6px 18px rgba(47,69,60,.05);
    --r-card:12px; --r-panel:14px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth;background:var(--cloud)}
  body{margin:0;background:color-mix(in srgb, var(--cream) 34%, var(--cloud));color:var(--text);
    font-family:"Noto Sans TC",system-ui,sans-serif;font-size:16.5px;line-height:1.9;font-weight:400;
    -webkit-font-smoothing:antialiased}
  h1,h2,h3,.serif{font-family:"Noto Serif TC",serif;font-weight:600}
  .latin{font-family:"Noto Serif Display","Noto Serif TC",serif}
  a{color:var(--bronze);text-decoration-thickness:1px;text-underline-offset:3px}
  .wrap{max-width:1120px;margin:0 auto;padding:0 20px}
  section{scroll-margin-top:72px;padding:64px 0 8px}
  /* 章節引言框：全頁章節開頭統一——細邊、極淺底、圓角、內距，框內三階字級 */
  .sec-head{background:color-mix(in srgb, var(--sage) 13%, var(--cloud));
    border:1px solid var(--line);border-radius:var(--r-panel);
    padding:26px 28px 24px;margin-bottom:28px;
    box-shadow:0 4px 14px rgba(47,69,60,.04)}
  .sec-head .rule{width:44px;height:2px;background:var(--champagne);border-radius:2px;margin-bottom:16px}
  .sec-head h2{font-size:clamp(26px,4.2vw,32px);line-height:1.32;margin:0;font-weight:600;color:var(--pine)}
  .sec-head p{margin:0;color:var(--text-soft);max-width:46em}
  .sec-head>p:not(.heart){font-size:15.5px;line-height:1.9;margin-top:10px}
  .sec-head .expand{margin-top:14px}
  .sec-head .expand .detail p{font-size:15.5px;line-height:1.9;color:var(--text-soft)}
  @media (max-width:640px){
    .sec-head{padding:22px 20px 20px;margin-bottom:24px}
    .sec-head h2{font-size:27px;line-height:1.35}
  }
  .small{font-size:13.5px;color:var(--text-soft)}
  .src{font-size:13px;color:var(--text-soft)}
  .src a{white-space:nowrap}

  /* ── top bar（桌機單列／手機精簡品牌列＋右側彈出抽屜） ── */
  html{overflow-x:clip}
  body{overflow-x:clip}
  .topbar{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--cloud) 92%,transparent);
    backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .topbar .wrap{display:flex;align-items:center;gap:14px;padding-top:10px;padding-bottom:10px}
  .brand{display:grid;grid-template-columns:46px auto auto;column-gap:10px;row-gap:0;align-items:baseline;margin-right:auto;min-width:0}
  .brand .zh{grid-column:2;grid-row:1;font-family:"Noto Serif TC",serif;font-weight:600;font-size:19px;color:var(--pine);letter-spacing:.06em;line-height:1.2;white-space:nowrap}
  .brand .zh .zhu{color:var(--bronze)}
  .brand .en{grid-column:3;grid-row:1;font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.3em;font-size:13px;color:var(--bronze);white-space:nowrap}
  .brand .kind{grid-column:2 / -1;grid-row:2;font-size:10.5px;letter-spacing:.16em;color:var(--bronze);white-space:nowrap;line-height:1.3}
  nav.main{display:flex;flex-wrap:wrap;gap:2px 4px}
  nav.main a{color:var(--text);text-decoration:none;font-size:13.5px;padding:6px 10px;border-radius:8px;white-space:nowrap}
  nav.main a:hover{background:var(--sage-soft)}
  .menu-btn{display:none;flex:0 0 auto;align-items:center;gap:8px;border:1px solid var(--bronze);
    background:var(--card);color:var(--pine);border-radius:10px;padding:8px 13px;
    font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;line-height:1}
  .menu-btn svg{width:18px;height:18px;display:block}
  .menu-btn:active{transform:scale(.97)}
  /* 抽屜與遮罩 */
  .drawer-overlay{position:fixed;inset:0;z-index:110;background:rgba(24,36,32,.5);
    opacity:0;pointer-events:none;transition:opacity .28s ease}
  .drawer-overlay.open{opacity:1;pointer-events:auto}
  .drawer{position:fixed;top:0;right:0;z-index:120;width:min(320px,84vw);height:100dvh;
    background:var(--cloud);color:var(--text);display:flex;flex-direction:column;
    transform:translateX(106%);visibility:hidden;
    transition:transform .38s cubic-bezier(.22,1.18,.36,1),visibility 0s linear .4s;
    box-shadow:-18px 0 44px rgba(24,36,32,.28);border-left:1px solid var(--line)}
  .drawer.open{transform:translateX(0);visibility:visible;transition:transform .38s cubic-bezier(.22,1.18,.36,1),visibility 0s}
  .drawer-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:14px 18px;border-bottom:1px solid var(--line)}
  .drawer-head .zh{font-family:"Noto Serif TC",serif;font-weight:600;font-size:17px;color:var(--pine);letter-spacing:.06em}
  .drawer-head .zh .zhu{color:var(--bronze)}
  .drawer-head .en{font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.3em;font-size:11.5px;color:var(--bronze)}
  .drawer-head .kind{flex-basis:100%;font-size:10px;letter-spacing:.14em;color:var(--bronze)}
  .drawer-close{position:absolute;top:12px;right:14px;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);
    background:var(--card);color:var(--text);font-size:19px;line-height:1;cursor:pointer;font-family:inherit}
  .drawer-head{position:relative;padding-right:64px}
  .drawer nav{overflow-y:auto;flex:1 1 auto}
  .drawer nav a{display:flex;align-items:center;min-height:58px;padding:10px 20px;
    color:var(--text);text-decoration:none;font-size:15.5px;font-weight:500;
    border-bottom:1px solid var(--card-line)}
  .drawer nav a:hover,.drawer nav a:active{background:var(--sage-soft)}
  .drawer nav a .arr{margin-left:auto;color:var(--bronze);font-size:14px}
  .drawer-cta{flex:0 0 auto;padding:16px 18px calc(16px + env(safe-area-inset-bottom,0px));
    border-top:1px solid var(--line);background:var(--cloud)}
  .drawer-cta a{display:flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--r-card);
    background:linear-gradient(150deg,var(--pine),var(--pine-deep));color:var(--cream);text-decoration:none;font-weight:700;font-size:15.5px;
    padding:14px 18px}
  .drawer-cta a .arr{color:var(--champagne)}
  body.drawer-locked{overflow:hidden}
  @media (max-width:900px){
    nav.main{display:none}
    .menu-btn{display:inline-flex}
    .topbar .wrap{padding-top:8px;padding-bottom:8px;min-height:58px}
    .brand{display:grid;grid-template-columns:40px auto auto;grid-template-rows:auto auto;
      column-gap:8px;row-gap:1px;align-items:baseline}
    .brand .zh{grid-column:2;grid-row:1;font-size:16.5px}
    .brand .en{grid-column:3;grid-row:1;font-size:11px;letter-spacing:.22em}
    .brand .kind{grid-column:2 / -1;grid-row:2;font-size:9.5px;letter-spacing:.12em;line-height:1.25}
  }
  @media (prefers-reduced-motion: reduce){
    .drawer,.drawer-overlay{transition:none}
  }

  /* ── 回頂部按鈕（品牌錨點：墨綠底＋香檳金箭頭） ── */
  .to-top{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:90;
    width:48px;height:48px;border-radius:999px;border:1px solid var(--champagne);
    background:linear-gradient(150deg,var(--ink),var(--ink-deep));color:var(--champagne);cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 8px 22px rgba(24,36,32,.28);
    opacity:.55;transform:translateY(4px);pointer-events:auto;
    transition:opacity .25s ease,transform .25s ease;font-family:inherit}
  .to-top svg{width:20px;height:20px;display:block}
  .to-top.show{opacity:1;transform:translateY(0);pointer-events:auto}
  .to-top:active{transform:scale(.94)}
  @media (max-width:560px){ .to-top{right:14px;width:46px;height:46px} }
  @media (prefers-reduced-motion: reduce){ .to-top{transition:none} }

  /* ── hero（攝影面：文字一律奶油白／香檳金，資訊條為築松綠） ── */
  .hero{position:relative;min-height:520px;display:flex;flex-direction:column;justify-content:flex-end;color:var(--cream);overflow:hidden}
  .hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 38%}
  .hero .veil{position:absolute;inset:0;background:linear-gradient(100deg,rgba(24,36,32,.84) 0%,rgba(24,36,32,.64) 46%,rgba(24,36,32,.24) 78%,rgba(24,36,32,.10) 100%)}
  .hero .inner{position:relative;width:100%;padding-top:120px}
  .hero .kicker{font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.42em;font-size:12px;color:var(--champagne);text-transform:uppercase;margin:0 0 14px}
  .hero .brandline{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin:0 0 10px}
  .hero .brandline .zh{font-family:"Noto Serif TC",serif;font-weight:600;font-size:clamp(22px,3.6vw,30px);letter-spacing:.08em;color:var(--cream);line-height:1.2}
  .hero .brandline .zh .zhu{color:var(--champagne)}
  .hero .brandline .en{font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.3em;font-size:clamp(14px,2.4vw,19px);color:var(--champagne)}
  .hero .brandline .sub{flex-basis:100%;font-size:11px;letter-spacing:.22em;color:var(--on-ink-soft)}
  .hero .position{font-size:15.5px;line-height:1.9;max-width:36em;margin:0 0 10px;color:var(--on-ink-soft)}
  .hero .position b{color:var(--cream)}
  .hero .brand-sentence{font-family:"Noto Serif TC",serif;font-size:clamp(17px,2.6vw,20px);font-weight:600;line-height:1.7;color:var(--champagne);max-width:34em;margin:0 0 26px}
  .hero h1{font-size:clamp(30px,6vw,52px);line-height:1.22;font-weight:600;margin:0 0 16px;max-width:15em;color:var(--cream)}
  .hero .lead{font-size:clamp(16px,2.4vw,19px);line-height:1.9;max-width:34em;margin:0 0 26px;color:var(--on-ink-soft)}
  .hero .cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:34px}
  .btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:12px 22px;font-size:15px;font-weight:700;text-decoration:none;border:1px solid transparent;cursor:pointer;font-family:inherit}
  .btn .arr{font-weight:700}
  .btn-gold{background:var(--champagne);color:var(--ink-deep)}
  .btn-gold:hover{background:color-mix(in srgb, var(--champagne) 84%, var(--cream))}
  .btn-gold .arr{color:var(--ink-deep)}
  .btn-ghost{background:rgba(247,241,231,.08);color:var(--cream);border-color:rgba(247,241,231,.45)}
  .btn-ghost:hover{background:rgba(247,241,231,.18)}
  .btn-ghost .arr{color:var(--champagne)}
  .hero .infobar{position:relative;background:rgba(78,107,92,.94);border-top:1px solid rgba(198,161,91,.55);backdrop-filter:blur(6px)}
  /* Hero 資訊列改圖示 chips：圖示＋短標，一眼看完 */
  .hero-chips{display:flex;flex-wrap:wrap;gap:10px;padding:14px 0}
  .hchip{display:inline-flex;align-items:center;gap:9px;background:rgba(247,241,231,.13);border:1px solid rgba(198,161,91,.6);border-radius:999px;padding:8px 18px 8px 13px;color:var(--cream);font-size:14.5px;font-weight:700;line-height:1.4}
  .hchip svg{width:19px;height:19px;flex:0 0 auto;color:var(--champagne)}
  .hchip .amt{font-family:"Noto Serif Display","Noto Serif TC",serif;font-weight:500}
  @media (max-width:760px){
    .hero{min-height:0}
    .hero .kicker{font-size:10.5px;letter-spacing:.24em}
    .hero .inner{padding-top:84px}
    .hero-chips{gap:8px}
    .hchip{font-size:13.5px;padding:7px 14px 7px 11px}
  }

  /* ── generic cards & grids ── */
  .grid{display:grid;gap:18px}
  .g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}
  @media (max-width:900px){.g3{grid-template-columns:1fr 1fr}}
  @media (max-width:640px){.g2,.g3{grid-template-columns:1fr}}
  .card{position:relative;background:var(--card);border:1px solid var(--card-line);border-radius:var(--r-card);padding:22px 24px;box-shadow:var(--shadow)}
  .card::after{content:"";position:absolute;top:9px;right:9px;width:13px;height:13px;pointer-events:none;
    border-top:1.5px solid var(--champagne);border-right:1.5px solid var(--champagne);opacity:.75}
  .card h3{margin:0 0 8px;font-size:19px;line-height:1.3;color:var(--pine)}
  .card p{margin:0 0 10px;color:var(--text)}
  .card p:last-child{margin-bottom:0}
  .card ul{margin:6px 0 0;padding-left:1.25em}
  .card li{margin:3px 0}
  /* 圖示：全站同一套——1px 建築細線、深香檳色、極淺鼠尾草框 */
  .icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;
    background:color-mix(in srgb, var(--sage) 22%, var(--cloud));border:1px solid var(--card-line);color:var(--bronze)}
  .icon svg{width:22px;height:22px;stroke-width:1.3}
  .icon.gold,.icon.sea{background:color-mix(in srgb, var(--sage) 22%, var(--cloud));color:var(--bronze)}
  .tag{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:2px 10px;vertical-align:2px;white-space:nowrap}
  .tag-ok{background:var(--ok-bg);color:var(--ok)}
  .tag-idx{background:var(--sea-soft);color:var(--sea-ink)}
  .tag-fix{background:var(--warn-bg);color:var(--bronze)}
  .tag-danger{background:var(--danger-bg);color:var(--danger)}
  .callout{border-radius:var(--r-card);padding:20px 24px;background:var(--sage-soft);border:1px solid var(--card-line);color:var(--text)}
  .callout p{margin:0}
  .callout strong{color:var(--pine)}

  /* ── layered pricing ── */
  .price-anchor{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;margin-bottom:22px}
  @media (max-width:760px){.price-anchor{grid-template-columns:1fr}}
  .anchor-main{background:linear-gradient(155deg,color-mix(in srgb, var(--cream) 58%, #FFFFFF),var(--cloud));color:var(--text);border:1px solid var(--line);border-radius:var(--r-panel);padding:28px 30px;position:relative;overflow:hidden;box-shadow:var(--shadow)}
  .anchor-main .lbl{font-size:13px;letter-spacing:.18em;color:var(--bronze);font-weight:700}
  .anchor-main .amt{font-family:"Noto Serif Display","Noto Serif TC",serif;font-weight:500;font-size:clamp(42px,7vw,58px);line-height:1.15;margin:6px 0 2px;color:var(--pine)}
  .anchor-main .amt small{font-size:17px;font-weight:600;color:var(--text-soft)}
  .anchor-main p{color:var(--text-soft);margin:8px 0 0;font-size:15px}
  .anchor-main .expand .detail p{color:var(--text-soft)}
  .anchor-plus{background:var(--card);border:1px dashed var(--bronze);border-radius:var(--r-panel);padding:28px 30px}
  .anchor-plus .lbl{font-size:13px;letter-spacing:.18em;color:var(--bronze);font-weight:700}
  .anchor-plus .amt{font-family:"Noto Serif Display","Noto Serif TC",serif;font-weight:500;font-size:clamp(30px,5vw,40px);line-height:1.2;margin:6px 0 2px;color:var(--pine)}
  .layer-list{display:flex;flex-direction:column;gap:12px}
  .layer{display:flex;gap:16px;background:var(--card);border:1px solid var(--card-line);border-radius:var(--r-card);padding:18px 20px;align-items:flex-start;transition:border-color .15s}
  .layer.on{border-color:var(--bronze);box-shadow:var(--shadow)}
  .layer .no{flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:1px solid var(--sage);color:var(--pine);
    display:flex;align-items:center;justify-content:center;font-family:"Noto Serif Display",serif;font-size:15px;font-weight:300}
  .layer.on .no{background:var(--pine);color:var(--cream);border-color:var(--pine)}
  .layer .body{flex:1;min-width:0}
  .layer h3{margin:0 0 4px;font-size:18px;line-height:1.3;color:var(--pine)}
  .layer .desc{font-size:14.5px;color:var(--text-soft);margin:0}
  .layer .side{flex:0 0 auto;text-align:right}
  .layer .price{font-family:"Noto Serif Display","Noto Serif TC",serif;font-weight:500;font-size:19px;white-space:nowrap;color:var(--pine)}
  .layer .price small{font-size:12px;color:var(--text-soft);font-weight:500}
  .toggle{margin-top:8px;border:1.5px solid var(--pine);background:transparent;color:var(--pine);border-radius:999px;
    padding:6px 16px;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}
  .toggle[aria-pressed="true"]{background:var(--pine);color:var(--cream)}
  .toggle.fixed{border-style:dashed;cursor:default;opacity:.85}
  @media (max-width:560px){ .layer{flex-wrap:wrap} .layer .side{text-align:left;width:100%;display:flex;align-items:center;gap:14px} .toggle{margin-top:0} }
  .calc{margin-top:20px;background:linear-gradient(155deg,#CBD8C0,var(--sage) 55%,#A9BE9C);color:#243129;border-radius:var(--r-panel);padding:24px 28px;box-shadow:var(--shadow)}
  .calc .row{display:flex;flex-wrap:wrap;gap:10px 34px;align-items:baseline}
  .calc .total{font-family:"Noto Serif Display","Noto Serif TC",serif;font-size:clamp(30px,5vw,42px);font-weight:500;color:#243129;line-height:1.2}
  .calc .lbl{font-size:13px;letter-spacing:.14em;color:#243129;font-weight:700}
  .calc .picked{margin-top:10px;font-size:14px;color:#243129}
  .calc .recur{margin-top:6px;font-size:14px;color:#243129}
  .calc #calcRecur{color:#243129}
  .presets{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 4px}
  .preset{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:8px 18px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;color:var(--text)}
  .preset:hover{border-color:var(--bronze)}
  .preset.active{background:var(--champagne);border-color:var(--champagne);color:var(--ink-deep)}

  /* ── 附加服務卡（價格待定，不進試算器） ── */
  .addon{margin-top:18px;background:var(--card);border:1.5px dashed var(--bronze);border-radius:var(--r-panel);padding:24px 26px;box-shadow:var(--shadow)}
  .addon h3{margin:0 0 6px;font-size:21px;line-height:1.3;color:var(--pine)}
  .addon .one{font-size:15.5px;line-height:1.9;margin:0;color:var(--text)}
  .addon .detail p{margin:0 0 10px;color:var(--text)}
  .addon .detail p:last-child{margin-bottom:0}
  .addon .detail ul{margin:6px 0 0;padding-left:1.25em}
  .addon .detail li{margin:3px 0}
  .companions{margin:0 0 22px;font-size:15px;line-height:1.9;color:var(--text-soft)}
  .companions b{color:var(--pine);font-family:"Noto Serif TC",serif}

  /* ── tables ── */
  .tbl{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--card-line);border-radius:var(--r-card);overflow:hidden;font-size:15px;color:var(--text)}
  .tbl th,.tbl td{padding:13px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--card-line)}
  .tbl thead th{background:var(--sage-soft);font-family:"Noto Serif TC",serif;font-weight:600;font-size:15.5px;color:var(--pine)}
  .tbl tbody tr:last-child td{border-bottom:none}
  .tbl td .st{font-weight:700;white-space:nowrap}
  .st-must{color:var(--ok)} .st-nice{color:var(--bronze)} .st-no{color:var(--danger)}
  @media (max-width:720px){
    .tbl thead{display:none}
    .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
    .tbl tr{border-bottom:2px solid var(--card-line);padding:8px 0}
    .tbl td{border-bottom:none;padding:6px 16px}
    .tbl td::before{content:attr(data-l);display:block;font-size:12px;font-weight:700;color:var(--text-soft);letter-spacing:.08em}
  }

  /* ── market bars ── */
  .bars{display:flex;flex-direction:column;gap:14px;background:var(--card);border:1px solid var(--card-line);border-radius:var(--r-card);padding:24px 26px}
  .bar-row{display:grid;grid-template-columns:210px 1fr 190px;gap:14px;align-items:center}
  .bar-row .name{font-size:14.5px;font-weight:500;line-height:1.5;color:var(--text)}
  .bar-row .track{position:relative;height:16px;background:var(--sage-soft);border-radius:8px}
  .bar-row .fill{position:absolute;top:0;bottom:0;border-radius:8px;background:var(--sage)}
  .bar-row.mine .fill{background:var(--champagne)}
  .bar-row.mine .name{font-weight:700;color:var(--pine)}
  .bar-row .val{font-size:13.5px;color:var(--text-soft);line-height:1.5}
  @media (max-width:760px){
    .bar-row{grid-template-columns:1fr}
    .bar-row .val{white-space:normal}
  }

  .law-note{font-size:13px;line-height:1.7;margin:8px 0 0;padding:8px 12px;border-radius:8px;background:var(--warn-bg);color:var(--text)}
  .law-note b{color:var(--bronze)}
  .gate-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
  .gate-list li{background:var(--card);border:1px solid var(--card-line);border-radius:10px;padding:14px 18px;font-size:15px;color:var(--text)}
  .gate-list li b{font-family:"Noto Serif TC",serif;color:var(--pine)}
  .gate-list .g{display:inline-block;min-width:86px;font-size:12px;font-weight:700;color:var(--danger);letter-spacing:.06em}
  /* 原則面板（淺色呈現）：極淡香檳底＋築松綠標題＋深香檳強調 */
  .principle{background:color-mix(in srgb, var(--champagne) 11%, var(--cloud));border:1px solid color-mix(in srgb, var(--champagne) 42%, var(--cloud));color:var(--text);border-radius:var(--r-panel);padding:26px 30px;margin-bottom:22px}
  .principle h3{margin:0 0 8px;font-size:21px;line-height:1.3;color:var(--pine)}
  .principle p{margin:0;color:var(--text);font-size:15.5px}
  .principle strong{color:var(--bronze)}

  /* ── legal ── */
  .law{border-left:3px solid var(--danger);background:var(--card);border-radius:0 var(--r-card) var(--r-card) 0;padding:20px 24px;border-top:1px solid var(--card-line);border-right:1px solid var(--card-line);border-bottom:1px solid var(--card-line)}
  .law h3{margin:0 0 6px;font-size:18px;line-height:1.3;color:var(--danger)}
  .law p{margin:0 0 8px;font-size:15px;color:var(--text)}
  .law p:last-child{margin-bottom:0}
  .law .fine{font-weight:700;color:var(--pine)}

  /* ── steps / misc ── */
  .steps{counter-reset:step;display:flex;flex-direction:column;gap:0}
  .step{display:flex;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}
  .step:last-child{border-bottom:none}
  .step .n{counter-increment:step;flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:var(--pine);color:var(--cream);
    display:flex;align-items:center;justify-content:center;font-family:"Noto Serif Display",serif;font-weight:300;font-size:16px}
  .step h3{margin:2px 0 4px;font-size:17.5px;line-height:1.3;color:var(--pine)}
  .step p{margin:0;color:var(--text-soft);font-size:15px}
  figure{margin:0}
  figure img{width:100%;height:100%;object-fit:cover;display:block}
  figcaption{font-size:13px;color:var(--text-soft);padding:8px 2px 0;text-align:left}
  .photo-card{border-radius:var(--r-card);overflow:hidden;border:1px solid var(--card-line);background:var(--card);box-shadow:var(--shadow)}
  .photo-card .ph{aspect-ratio:16/8.2;overflow:hidden}
  .photo-card .tx{padding:18px 22px 20px}
  .photo-card h3{margin:0 0 6px;font-size:19px;line-height:1.3;color:var(--pine)}
  .photo-card p{margin:0;font-size:15px;color:var(--text-soft)}
  .qa{border:1px dashed var(--bronze);border-radius:var(--r-card);padding:20px 24px;background:var(--card)}
  .qa h3{margin:0 0 6px;font-size:17.5px;line-height:1.3;color:var(--pine)}
  .qa p{margin:0;font-size:15px;color:var(--text-soft)}
  /* 頁尾：全頁唯一的深色錨點——墨綠深面，文字一律奶油白／香檳金／淺鼠尾草 */
  footer{margin-top:70px;background:var(--ink-night);color:var(--on-ink-soft);padding:44px 0 92px}
  footer h2{color:var(--cream);font-size:22px;line-height:1.3;margin:0 0 6px}
  footer p{color:var(--on-ink-soft)}
  footer .src-list{columns:2;column-gap:40px;font-size:13.5px;line-height:2;color:var(--on-ink-soft)}
  @media (max-width:700px){ footer .src-list{columns:1} }
  footer a{color:var(--champagne);word-break:break-all}
  footer .note{font-size:13px;color:var(--on-ink-dim);margin-top:18px;max-width:60em}
  .disclaimer{margin-top:26px;font-size:13px;color:var(--text-soft);border-top:1px solid var(--line);padding-top:16px}

  /* ── 圖卡＋展開 ── */
  .sec-head .heart{font-family:"Noto Serif TC",serif;font-size:clamp(17px,2.7vw,19px);font-weight:500;line-height:1.85;color:var(--pine);max-width:44em;margin:14px 0 0;padding-top:14px;border-top:1px solid var(--line)}
  .func{display:block;font-size:12.5px;font-weight:700;letter-spacing:.1em;color:var(--bronze);margin:0 0 5px}
  .card .one,.photo-card .one{font-size:15.5px;line-height:1.9;margin:0;color:var(--text)}
  .photo-card .one{color:var(--text-soft)}
  .expand{margin-top:14px;border-top:1px dashed var(--line);padding-top:12px}
  .expand>summary{cursor:pointer;list-style:none;font-weight:700;font-size:14.5px;color:var(--bronze);padding:2px 0}
  .expand>summary::-webkit-details-marker{display:none}
  .expand>summary::before{content:"＋ ";font-weight:900}
  .expand[open ]>summary::before{content:"－ "}
  .expand .detail{margin-top:10px}
  .expand .detail p{margin:0 0 10px}
  .expand .detail p:last-child{margin-bottom:0}
  .mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:20px}
  @media (max-width:760px){.mini-grid{grid-template-columns:1fr}}
  .mini{background:var(--card);border:1px solid var(--card-line);border-radius:var(--r-card);padding:20px 22px;box-shadow:var(--shadow)}
  .mini h3{margin:0 0 6px;font-size:18px;line-height:1.3;color:var(--pine)}
  .mini p{margin:0;font-size:15px;color:var(--text-soft)}
  /* ── 情緒路徑：共鳴 → 嚮往 → 安心 → 邀請 ── */
  .reso-q{font-family:"Noto Serif TC",serif;font-size:20px;font-weight:600;line-height:1.45;color:var(--pine);margin:0 0 8px}
  /* 嚮往面板（淺色呈現）：極淡鼠尾草／奶油底＋築松綠標題＋墨綠內文＋深香檳強調 */
  .vision{background:linear-gradient(155deg,color-mix(in srgb, var(--sage) 24%, var(--cloud)),color-mix(in srgb, var(--cream) 55%, var(--cloud)));border:1px solid var(--line);color:var(--text);border-radius:var(--r-panel);padding:30px 32px;margin-top:22px}
  .vision h3{margin:0 0 6px;font-size:clamp(21px,3.4vw,26px);color:var(--pine);line-height:1.3}
  .vision .vlead{margin:0 0 20px;color:var(--text-soft);font-size:15.5px;max-width:44em}
  .vision-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 28px}
  @media (max-width:700px){.vision-grid{grid-template-columns:1fr}}
  .vision-item{display:flex;gap:12px;align-items:flex-start}
  .vision-item .vn{flex:0 0 auto;font-family:"Noto Serif Display",serif;font-weight:300;font-size:15px;color:var(--pine);border:1px solid var(--champagne);border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;margin-top:3px}
  .vision-item p{margin:0;font-size:15.5px;line-height:1.9;color:var(--text)}
  .vision-item p b,.vision-item p strong{color:var(--bronze)}
  .vision .vclose{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--line);font-family:"Noto Serif TC",serif;font-size:18px;font-weight:600;line-height:1.7;color:var(--pine)}
  .vision .vclose strong{color:var(--bronze)}
  .reassure{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 0 22px}
  @media (max-width:900px){.reassure{grid-template-columns:1fr 1fr}}
  @media (max-width:520px){.reassure{grid-template-columns:1fr}}
  .reassure .ri{background:var(--sage-soft);border:1px solid var(--card-line);border-radius:var(--r-card);padding:16px 18px}
  .reassure .ri b{display:block;font-family:"Noto Serif TC",serif;font-size:16.5px;line-height:1.5;color:var(--pine);margin-bottom:4px}
  .reassure .ri span{font-size:14px;line-height:1.7;color:var(--text-soft);display:block}
  /* 結尾邀請（淺色呈現）：雲白→極淡鼠尾草漸層＋築松綠標題，深色只留在頁尾 */
  .final-cta{margin:64px 0 8px;background:linear-gradient(155deg,var(--cloud),color-mix(in srgb, var(--sage) 26%, var(--cloud)));border:1px solid var(--line);color:var(--text);border-radius:var(--r-panel);padding:clamp(30px,5vw,52px);position:relative;overflow:hidden}
  .final-cta .rule{width:44px;height:2px;background:var(--champagne);border-radius:2px;margin-bottom:16px}
  .final-cta h2{margin:0 0 12px;font-size:clamp(26px,4.6vw,38px);line-height:1.28;font-weight:600;color:var(--pine);max-width:16em}
  .final-cta p{margin:0 0 14px;color:var(--text);font-size:16.5px;line-height:1.9;max-width:40em}
  .final-cta p.serif-line{font-family:"Noto Serif TC",serif;font-size:19px;font-weight:600;color:var(--bronze)}
  .final-cta .cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
  .final-cta .btn-ghost{background:transparent;color:var(--pine);border-color:var(--pine)}
  .final-cta .btn-ghost:hover{background:var(--sage-soft)}
  .final-cta .btn-ghost .arr{color:var(--bronze)}

  /* ── CIS 展示（個人 CIS 示範色票沿用） ── */
  .cis-card{background:var(--card);border:1px solid var(--card-line);border-radius:var(--r-panel);padding:28px 30px;box-shadow:var(--shadow)}
  .cis-brand{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--line)}
  .cis-brand .zh{font-family:"Noto Serif TC",serif;font-weight:600;font-size:24px;color:var(--pine);letter-spacing:.06em;line-height:1.2}
  .cis-brand .zh .zhu{color:var(--bronze)}
  .cis-brand .en{font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.34em;font-size:12px;color:var(--bronze)}
  .cis-brand .kind{font-size:12.5px;color:var(--bronze);border-left:1px solid var(--bronze);padding-left:10px}
  .cis-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:20px 0 4px}
  @media (max-width:900px){.cis-swatches{grid-template-columns:repeat(3,1fr)}}
  @media (max-width:520px){.cis-swatches{grid-template-columns:repeat(2,1fr)}}
  .sw .chip{display:block;height:44px;border-radius:8px;border:1px solid var(--card-line);margin-bottom:8px}
  .sw b{display:block;font-family:"Noto Serif TC",serif;font-size:14.5px;color:var(--pine);line-height:1.4}
  .sw span{display:block;font-size:12px;color:var(--text-soft);line-height:1.5}
  .cis-type{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:20px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
  @media (max-width:760px){.cis-type{grid-template-columns:1fr}}
  .ty-serif{font-family:"Noto Serif TC",serif;font-weight:600;font-size:21px;line-height:1.28;color:var(--pine);margin:0 0 4px}
  .ty-latin{font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.3em;font-size:17px;color:var(--pine);margin:6px 0 4px;text-transform:uppercase}
  .ty-body{font-size:14.5px;line-height:1.9;color:var(--text);margin:0 0 4px}
  .ty-num{font-family:"Noto Serif Display","Noto Serif TC",serif;font-weight:500;font-size:21px;color:var(--pine);margin:6px 0 4px}
  /* 個人 CIS 示範概念小卡：四色一列，色票為示範客戶專屬、與羲和六色不同 */
  .demo-swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0 4px}
  @media (max-width:520px){.demo-swatches{grid-template-columns:repeat(2,1fr)}}
  .demo-swatches .chip{display:block;height:38px;border-radius:8px;border:1px solid var(--card-line);margin-bottom:6px}
  .demo-swatches b{display:block;font-family:"Noto Serif TC",serif;font-size:13.5px;color:var(--pine);line-height:1.4}
  .demo-swatches span{display:block;font-size:11.5px;color:var(--text-soft);line-height:1.5}
  .slogan{font-family:"Noto Serif TC",serif;font-size:19px;font-weight:600;line-height:1.45;color:var(--pine);margin:10px 0 0}
  /* ── 未來延伸願景卡（藍圖，非現行服務） ── */
  .future-card{margin-top:22px;background:var(--card);border:1px dashed var(--bronze);border-radius:var(--r-panel);padding:26px 28px;box-shadow:var(--shadow)}
  .future-card h3{margin:0 0 6px;font-size:21px;line-height:1.3;color:var(--pine)}
  .future-card .one{font-size:15.5px;line-height:1.9;margin:0;color:var(--text)}
  .future-list{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:18px}
  @media (max-width:900px){.future-list{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:520px){.future-list{grid-template-columns:1fr}}
  .future-list .fi{background:var(--sage-soft);border:1px solid var(--card-line);border-radius:10px;padding:14px 16px}
  .future-list .fi b{display:block;font-family:"Noto Serif TC",serif;font-size:15.5px;line-height:1.5;color:var(--pine);margin-bottom:3px}
  .future-list .fi span{font-size:13px;line-height:1.6;color:var(--text-soft);display:block}
  .future-note{margin:16px 0 0;font-size:13.5px;line-height:1.7;color:var(--text-soft)}
  /* ── 裝進手機・推播（PWA） ── */
  .btn-ink{background:linear-gradient(135deg,var(--pine),var(--pine-deep));color:var(--cream)}
  .btn-ink:hover{background:linear-gradient(135deg,var(--pine-deep),var(--pine))}
  .btn-ink .arr{color:var(--champagne)}
  .btn-soft{background:var(--card);color:var(--pine);border-color:var(--bronze)}
  .btn-soft:hover{background:var(--sage-soft)}
  .btn[disabled]{opacity:.55;cursor:default}
  .howto{margin:10px 0 0;padding-left:1.35em;color:var(--text-soft);font-size:15px;line-height:1.75}
  .howto li{margin:3px 0}
  .howto b{color:var(--pine)}
  .app-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
  .app-status{font-size:14px;line-height:1.7;margin:14px 0 0;color:var(--text-soft)}
  .app-status:empty{display:none}
  .app-status b{color:var(--pine)}

  /* ── 羲和・築 CIS 展示板 ── */
  .board-block{margin-top:30px}
  .board-block>h3{font-size:20px;margin:0 0 6px;color:var(--pine)}
  .board-block>.small{margin:0 0 14px}
  .lockup{border-radius:var(--r-panel);padding:34px 30px 28px;border:1px solid var(--card-line);background:var(--cloud);box-shadow:var(--shadow);position:relative}
  .lockup .lk-zh{font-family:"Noto Serif TC",serif;font-weight:600;font-size:clamp(30px,5vw,40px);letter-spacing:.08em;line-height:1.2;color:var(--pine);margin:0}
  .lockup .lk-zh .zhu{color:var(--bronze)}
  .lockup .lk-en{font-family:"Noto Serif Display",serif;font-weight:300;letter-spacing:.42em;font-size:15px;color:var(--bronze);margin:10px 0 0;text-transform:uppercase}
  .lockup .lk-kind{font-size:11px;letter-spacing:.24em;color:var(--bronze);margin:6px 0 0}
  .lockup .lk-note{margin:20px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;line-height:1.7;color:var(--text-soft)}
  .lockup.dark{background:var(--ink-night);border-color:var(--ink-night)}
  .lockup.dark .lk-zh{color:var(--cream)}
  .lockup.dark .lk-zh .zhu{color:var(--champagne)}
  .lockup.dark .lk-en{color:var(--champagne)}
  .lockup.dark .lk-kind{color:var(--on-ink-soft)}
  .lockup.dark .lk-note{border-top-color:rgba(247,241,231,.2);color:var(--on-ink-soft)}
  .arch-icons{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  @media (max-width:640px){.arch-icons{grid-template-columns:repeat(2,1fr)}}
  .arch-icons .ai{background:var(--cloud);border:1px solid var(--card-line);border-radius:10px;padding:18px 12px 12px;text-align:center}
  .arch-icons .ai svg{width:40px;height:40px;stroke-width:1;color:var(--pine)}
  .arch-icons .ai span{display:block;margin-top:8px;font-size:13px;color:var(--text-soft)}
  .kw-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  @media (max-width:640px){.kw-row{grid-template-columns:1fr}}
  .kw{background:var(--cloud);border:1px solid var(--card-line);border-radius:var(--r-card);padding:20px 22px;box-shadow:var(--shadow)}
  .kw b{display:block;font-family:"Noto Serif TC",serif;font-weight:600;font-size:22px;color:var(--pine);margin-bottom:4px}
  .kw span{font-size:14.5px;line-height:1.8;color:var(--text-soft);display:block}
  .position-line{margin:30px 0 0;text-align:center;font-family:"Noto Serif TC",serif;font-weight:600;
    font-size:clamp(19px,3.4vw,25px);line-height:1.6;color:var(--pine);
    padding:26px 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

  /* ── 第六系列定位卡（自 Hero 移出，獨立小卡＋系列圖示） ── */
  .series-card{position:relative;display:flex;gap:20px;background:var(--card);border:1px solid var(--card-line);
    border-radius:var(--r-panel);padding:24px 28px;box-shadow:var(--shadow);margin-top:38px}
  .series-card::after{content:"";position:absolute;top:9px;right:9px;width:13px;height:13px;pointer-events:none;
    border-top:1.5px solid var(--champagne);border-right:1.5px solid var(--champagne);opacity:.75}
  .series-ic{flex:0 0 auto;width:54px;height:54px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    background:color-mix(in srgb, var(--sage) 22%, var(--cloud));border:1px solid var(--card-line);color:var(--bronze)}
  .series-ic svg{width:29px;height:29px;stroke-width:1.2}
  .series-card .series-text{margin:0;font-size:15.5px;line-height:1.9;color:var(--text)}
  .series-card .series-text b{color:var(--pine);font-family:"Noto Serif TC",serif}
  .series-card .series-line{margin:10px 0 0;font-family:"Noto Serif TC",serif;font-size:17.5px;font-weight:600;line-height:1.7;color:var(--bronze)}
  @media (max-width:640px){ .series-card{flex-direction:column;gap:14px;padding:22px 20px} }

  /* ── 試算區圖示列：一段多事 → 逐項圖示分開 ── */
  .calc-list{display:flex;flex-direction:column;gap:11px;margin-top:16px}
  .calc-item{display:flex;gap:12px;align-items:flex-start}
  .calc-item .ci{flex:0 0 auto;width:34px;height:34px;border-radius:9px;background:rgba(252,250,246,.55);
    display:flex;align-items:center;justify-content:center;color:#243129}
  .calc-item .ci svg{width:19px;height:19px}
  .calc-item p{margin:0;font-size:14.5px;line-height:1.75;color:#243129}
  .calc-item p b{font-weight:700}

  /* ── 待拍板卡圖示列 ── */
  .qa-list{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
  .qa-list li{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;line-height:1.8;color:var(--text-soft)}
  .qa-list li b{color:var(--pine)}
  .qa-list .qi{flex:0 0 auto;width:31px;height:31px;border-radius:8px;display:flex;align-items:center;justify-content:center;
    background:color-mix(in srgb, var(--sage) 22%, var(--cloud));border:1px solid var(--card-line);color:var(--bronze)}
  .qa-list .qi svg{width:17px;height:17px}

/* ── 品牌標誌（2026-11-04 加上） ── */
.brand-logo{grid-column:1;grid-row:1 / -1;width:46px;height:46px;border-radius:50%;object-fit:cover;border:1px solid var(--champagne);align-self:center;display:block}
.drawer-head .brand-logo{width:40px;height:40px}
.to-top{padding:0;overflow:hidden}
.to-top .top-logo{width:100%;height:100%;object-fit:cover;display:block}
.foot-logo{width:96px;height:96px;border-radius:50%;object-fit:cover;border:1px solid rgba(198,161,91,.65);display:block;margin:0 0 14px}
@media (max-width:760px){.brand-logo{width:40px;height:40px}}

.drawer-head{padding-right:72px}

/* ── 去背 logo 調整（2026-11-04）：深底處以奶油圓盤襯底 ── */
.brand-logo{object-fit:contain;padding:3px;box-sizing:border-box}
.to-top{background:#F7F1E7}
.to-top .top-logo{object-fit:contain;padding:4px;box-sizing:border-box}
.foot-logo{object-fit:contain;background:#F7F1E7;padding:7px;box-sizing:border-box}