/* ════════════════════════════════════════════════════════════════════
 * 躍馬企業 — shared design system
 * Tokens + chrome extracted verbatim from the verified homepage so every
 * sub-page renders identically. Bain visual system (per brand-spec):
 * brand red #DC412B, 1360px container, 62px header, Helvetica/Georgia
 * stand-ins for Graphik/Tiempos, soft 3px radius, borders over shadows.
 * ════════════════════════════════════════════════════════════════════ */

/* 繁體中文 webfont：拉丁字仍走 Helvetica/Georgia，中文 fallback 到思源黑體/宋體，跨裝置一致 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;800&family=Noto+Serif+TC:wght@500;700&display=swap');

/* ───────── Tokens ───────── */
:root{
  --brand:#DC412B;
  --brand-hover:#B83320;
  --brand-active:#9C2A1A;
  --black:#000000;
  --white:#FFFFFF;
  --bg:#FEFEFE;
  --g700:#333333;
  --g600:#636363;
  --g500:#666666;
  --g400:#979797;
  --g300:#D8D8D8;
  --g200:#ECECEC;
  --surface-sub:#F4F4F4;

  --sans:'Helvetica Neue',Helvetica,Arial,'Noto Sans TC',sans-serif; /* ≈ Graphik；中文走思源黑體 */
  --serif:Georgia,'Times New Roman','Noto Serif TC',serif;            /* ≈ Tiempos；中文走思源宋體 */

  --container:1360px;
  --gutter:24px;
  --header-h:62px;
  --radius:3px;

  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;
  --s8:32px;--s10:40px;--s11:44px;
  --s12:48px;--s15:60px;--s18:72px;--s24:96px;--s40:160px;

  /* type scale (8 steps) — see DESIGN.md */
  --fs-display:clamp(33px,5.5vw,52px); --lh-display:1.06;
  --fs-h1:clamp(28px,3.6vw,40px);      --lh-h1:1.12;
  --fs-h2:clamp(24px,2.6vw,30px);      --lh-h2:1.2;
  --fs-h3:clamp(20px,1.7vw,24px);      --lh-h3:1.3;
  --fs-lead:20px;                      --lh-lead:1.6;
  --fs-body:16px;                      --lh-body:1.8;
  --fs-meta:16px;                      --lh-meta:1.6;
  --fs-eyebrow:14px;                   --lh-eyebrow:1.5;
  --fs-brand-sub:14px; --fs-brand-en:12px; /* 頁首字標 LOCKED：與 meta/eyebrow 脫鉤，放大全站小字時維持原尺寸 */
  --fs-stat:clamp(36px,4.6vw,46px);
  /* vertical rhythm (image-ready) */
  --space-section:var(--s18); --space-block:var(--s8);
  --space-para:var(--s6);     --space-tight:var(--s3);
  --fig-my:var(--s10);        --fig-cap-gap:var(--s3);
  --fs-caption:var(--fs-meta);
  --ar-wide:16/9; --ar-photo:4/3; --ar-square:1/1;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--bg);color:var(--black);
  font-family:var(--serif);font-size:var(--fs-body);line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  text-wrap:pretty;hanging-punctuation:first allow-end last;
}
.ui{font-family:var(--sans);}
h1,h2,h3,h4,h5,h6{font-family:var(--sans);font-weight:500;margin:0;line-height:1.2;text-wrap:balance;}
/* 編輯級數字肌理：實績/統計數字一律等寬對齊、微收字距，像印刷品 */
.num,.statrow .num,.net-stat .num,.stat .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}

.eyebrow{
  font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;
  letter-spacing:.065em;text-transform:uppercase;color:var(--g500);
  margin:0 0 var(--s4);
}

a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--brand);outline-offset:3px;border-radius:var(--radius);
}

/* ───────── Skip link ───────── */
.skip{
  position:absolute;left:-999px;top:0;z-index:200;
  background:var(--black);color:var(--white);padding:var(--s3) var(--s5);
  font-family:var(--sans);font-size:var(--fs-meta);
}
.skip:focus{left:var(--s4);top:var(--s4);}

/* ───────── Top-hat utility bar ───────── */
.tophat{background:var(--white);border-bottom:1px solid var(--g300);}
.tophat .wrap{height:34px;display:flex;align-items:center;justify-content:flex-end;gap:var(--s5);}
.tophat a,.tophat span{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;
  letter-spacing:.04em;text-transform:uppercase;color:var(--g500);transition:color .15s;}
.tophat a:hover{color:var(--brand);}
.tophat .sep{color:var(--g300);}
.tophat .lang b{color:var(--black);}
@media(max-width:768px){.tophat .hide-sm,.tophat .sep:has(+ .lang){display:none;}}

/* ───────── Header ───────── */
section[id]{scroll-margin-top:calc(var(--header-h) + 18px);}
.header{
  position:sticky;top:0;z-index:60;height:var(--header-h);
  background:var(--white);border-bottom:1px solid var(--g300);
}
.header .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;}
.h-left{display:flex;align-items:center;gap:var(--s6);}
.menu-btn{
  display:flex;align-items:center;gap:var(--s2);padding:var(--s2);border:0;background:none;
  cursor:pointer;border-radius:var(--radius);font-family:var(--sans);font-size:var(--fs-eyebrow);
  font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--black);
}
.menu-btn .bars{display:flex;flex-direction:column;gap:4px;}
.menu-btn .bars span{display:block;width:22px;height:2px;background:var(--black);transition:background .15s;}
.menu-btn:hover .bars span{background:var(--brand);}
.menu-btn:hover{color:var(--brand);}
.brand-mark{display:flex;align-items:center;gap:var(--s2);text-decoration:none;flex:none;}
.brand-mark .bw{font-family:var(--sans);display:inline-flex;align-items:baseline;color:var(--black);white-space:nowrap;flex:none;}
.brand-mark .bw-lead{font-weight:800;font-size:var(--fs-lead);letter-spacing:-.01em;}
.brand-mark .bw-sub{font-weight:500;font-size:var(--fs-brand-sub);letter-spacing:.02em;margin-left:1.5px;}
.brand-mark .bw-div{width:1px;height:19px;background:var(--brand);display:inline-block;flex:none;}
.brand-mark .bw-en{font-family:var(--sans);font-size:var(--fs-brand-en);font-weight:600;letter-spacing:.2em;color:var(--g500);white-space:nowrap;}
@media(max-width:600px){.brand-mark .bw-div,.brand-mark .bw-en{display:none;}}
.h-right{display:flex;align-items:center;gap:var(--s5);}
.icon-btn{
  border:0;background:none;cursor:pointer;color:var(--black);padding:var(--s2);
  display:flex;align-items:center;border-radius:var(--radius);transition:color .15s;
}
.icon-btn:hover{color:var(--brand);}
.icon-btn svg{width:20px;height:20px;}

/* ───────── Mega menu ───────── */
.mega{
  position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.32);
  opacity:0;visibility:hidden;transition:opacity .25s;
}
.mega.open{opacity:1;visibility:visible;}
.mega-panel{
  position:absolute;left:0;top:0;height:100%;width:440px;max-width:88vw;
  background:var(--bg);padding:var(--s6) var(--s8) var(--s10);
  overflow-y:auto;transform:translateX(-100%);transition:transform .28s cubic-bezier(.2,0,0,1);
  box-shadow:2px 0 8px rgba(10,10,10,.12);
}
.mega.open .mega-panel{transform:translateX(0);}
.mega-close{
  border:0;background:none;color:var(--brand);font-size:var(--fs-h3);line-height:1;
  cursor:pointer;margin-bottom:var(--s8);padding:4px;border-radius:var(--radius);
}
.mega-nav{list-style:none;margin:0 0 var(--s8);padding:0;}
.mega-nav>li{border-bottom:1px solid var(--g300);}
.mega-nav>li>a{
  font-family:var(--sans);font-size:var(--fs-lead);font-weight:500;
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--s4) 0;transition:color .15s;
}
.mega-nav>li>a:hover{color:var(--brand);}
.mega-nav>li>a .chev{color:var(--g400);font-weight:400;}
.mega-sub{list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s2) var(--s5);
  max-height:0;overflow:hidden;visibility:hidden;
  transition:max-height .3s ease,visibility 0s linear .3s,padding .3s ease;}
.mega-nav>li.expanded .mega-sub{max-height:520px;visibility:visible;padding:0 0 var(--s4);
  transition:max-height .3s ease,visibility 0s,padding .3s ease;}
.mega-sub a{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);padding:var(--s2) 0;display:block;}
.mega-sub a:hover{color:var(--brand);}
.mega-secondary{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s4) var(--s6);}
.mega-secondary a{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.065em;text-transform:uppercase;color:var(--g500);}
.mega-secondary a:hover{color:var(--brand);}

/* ───────── Search overlay ───────── */
.search{
  position:fixed;inset:0;z-index:90;background:rgba(254,254,254,.97);
  opacity:0;visibility:hidden;transition:opacity .2s;
  display:flex;align-items:flex-start;justify-content:center;padding-top:18vh;
}
.search.open{opacity:1;visibility:visible;}
.search-inner{width:min(760px,90vw);}
.search-inner label{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.065em;text-transform:uppercase;color:var(--g500);}
.search-row{display:flex;align-items:center;border-bottom:2px solid var(--black);margin-top:var(--s4);}
.search-row input{
  flex:1;border:0;background:none;font-family:var(--sans);font-size:var(--fs-h2);
  padding:var(--s4) 0;outline:none;color:var(--black);
}
.search-row input::placeholder{color:var(--g400);}
.search-close{position:absolute;top:var(--s6);right:var(--s8);border:0;background:none;font-size:var(--fs-h2);color:var(--g500);cursor:pointer;}
.search-close:hover{color:var(--brand);}

/* ───────── Buttons ───────── */
.btn{
  font-family:var(--sans);font-size:var(--fs-meta);font-weight:500;text-transform:uppercase;
  letter-spacing:.08em;padding:16px 32px;border-radius:var(--radius);cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;
  transition:background .15s,color .15s,border-color .15s;
}
.btn-primary{background:var(--brand);color:var(--white);}
.btn-primary:hover{background:var(--brand-hover);}
.btn-primary:active{background:var(--brand-active);}
.btn-ghost{background:none;color:var(--black);border-color:var(--g400);}
.btn-ghost:hover{border-color:var(--black);}
.btn-outline{background:none;color:#fff;border:1px solid #fff;align-self:flex-start;}
.btn-outline:hover{background:#fff;color:var(--brand);}
.btn-line{background:var(--black);color:#fff;}
.btn-line:hover{background:var(--g700);color:#fff;}
.btn svg{width:18px;height:18px;flex:none;}
.link-more{
  font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.065em;
  text-transform:uppercase;color:var(--brand);display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
}
.link-more .arr{transition:transform .2s;}
.link-more:hover .arr{transform:translateX(4px);}

/* ───────── Section heading ───────── */
.sec{padding:var(--s24) 0;border-top:1px solid var(--g300);}
.sec.no-rule{border-top:0;}
.sec--tint{background:var(--surface-sub);border-top-color:transparent;}
/* 黑底強拍：長頁中段的收尾錨點。把既有區塊整段翻深，文字/邊框翻亮，紅色維持強調。 */
.sec--dark{background:#0e0e0e;border-top-color:transparent;color:rgba(255,255,255,.72);}
.sec--dark h2,.sec--dark h3{color:var(--white);}
.sec--dark .eyebrow{color:rgba(255,255,255,.5);}
.sec--dark .muted{color:rgba(255,255,255,.58);}
.sec--dark .lead-p{color:rgba(255,255,255,.72);}
.sec--dark a.link-more{color:var(--brand);}
.sec--dark .office{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.02);}
.sec--dark .office p{color:rgba(255,255,255,.58);}
.sec--dark .origin-fig figcaption{color:rgba(255,255,255,.5);}
.sec--dark .origin-fig img{border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);}
.sec--dark .svc-grid{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.12);}
.sec--dark .svc{background:#141414;}
.sec--dark .svc:hover{background:#1a1a1a;}
.sec--dark .step{border-top-color:var(--brand);}
.sec--dark .step::before{color:var(--brand);}
.sec--dark .step p{color:rgba(255,255,255,.62);}
.sec--dark .svc h3{color:var(--white);}
.sec--dark .svc p{color:rgba(255,255,255,.62);}
.sec--dark .svc .num{color:var(--brand);}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:var(--s10);gap:var(--s6);}
.sec-head h2{font-size:var(--fs-h2);font-weight:600;letter-spacing:-.01em;}

/* ───────── Insight / generic cards ───────── */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);}
.cards.cols-3{grid-template-columns:repeat(3,1fr);}
.card{display:flex;flex-direction:column;position:relative;}
.card-media{aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;margin-bottom:var(--s4);
  background:var(--g300);position:relative;}
.card-media .ph{position:absolute;inset:0;background:linear-gradient(135deg,#e9e9e9,#cfcfcf);transition:transform .5s ease;}
.card .eyebrow{margin-bottom:var(--s2);}
.card h3{font-size:var(--fs-lead);font-weight:500;line-height:1.22;margin-bottom:var(--s3);transition:color .15s;}
.card:hover h3{color:var(--brand);}
.card p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.6;color:var(--g600);margin:0;}
.card a.cover{position:absolute;inset:0;z-index:1;}
.card:hover .card-media .ph{transform:scale(1.05);}
.card-meta{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s2);}
.card-meta .eyebrow{margin:0;}
.card-date{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g500);font-variant-numeric:tabular-nums;letter-spacing:.04em;white-space:nowrap;}
.card-date .card-new{color:var(--brand);font-weight:600;letter-spacing:.065em;}

/* ───────── High-threshold cards — document-checklist (Direction A) ───────── */
.hard-cards .card{border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s6);
  transition:border-color .18s,box-shadow .18s;}
.hard-cards .card:hover{border-color:var(--black);box-shadow:0 1px 0 var(--black);}
.hard-ico{width:34px;height:34px;color:var(--black);margin-bottom:var(--s4);
  transition:transform .25s cubic-bezier(.25,1,.5,1),color .25s cubic-bezier(.25,1,.5,1);}
.hard-cards .card:hover .hard-ico{transform:translateY(-3px) scale(1.06);color:var(--brand);}
.hard-ico svg{width:100%;height:100%;display:block;stroke:currentColor;stroke-width:1.4;
  fill:none;stroke-linecap:round;stroke-linejoin:round;}
.hard-cards .card h3{margin-bottom:var(--s4);}
.doc-label{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--g500);margin:0 0 var(--s3);}
.doc-list{list-style:none;margin:0 0 var(--s5);padding:0;display:flex;flex-direction:column;gap:var(--s2);}
.doc-list li{position:relative;padding-left:22px;
  font-family:var(--sans);font-size:var(--fs-meta);line-height:1.45;color:var(--g700);}
.doc-list li::before{content:"";position:absolute;left:4px;top:4px;width:6px;height:11px;
  border:solid var(--brand);border-width:0 2px 2px 0;transform:rotate(45deg);}
.hard-solve{margin-top:auto;padding-top:var(--s4);border-top:2px solid var(--brand);}
.hard-solve .solve-tag{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.08em;
  color:var(--brand);display:block;margin-bottom:var(--s2);}
.hard-solve p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.6;color:var(--g700);margin:0;}

/* ───────── Sub-service cards — icon + whole-card link (Direction A) ───────── */
.svc-cards .card{border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s6) var(--s6) var(--s5);
  transition:border-color .18s,box-shadow .18s;}
.svc-cards .card:hover{border-color:var(--black);box-shadow:0 1px 0 var(--black);}
.svc-ico{width:30px;height:30px;color:var(--black);margin-bottom:var(--s4);
  transition:transform .25s cubic-bezier(.25,1,.5,1),color .25s cubic-bezier(.25,1,.5,1);}
.svc-cards .card:hover .svc-ico{transform:translateY(-3px) scale(1.06);color:var(--brand);}
.svc-ico svg{width:100%;height:100%;display:block;stroke:currentColor;stroke-width:1.4;
  fill:none;stroke-linecap:round;stroke-linejoin:round;}
.svc-cards .card h3{margin-bottom:var(--s3);}
.svc-cards .card p{flex:1;}
.svc-go{margin-top:var(--s5);align-self:flex-end;color:var(--g500);font-family:var(--sans);
  font-size:var(--fs-lead);line-height:1;transition:color .18s,transform .18s;}
.svc-cards .card:hover .svc-go{color:var(--brand);transform:translateX(3px);}

/* ───────── Feature / film band ───────── */
.feature{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--s15);align-items:center;}
.feature-media{aspect-ratio:16/9;border-radius:var(--radius);position:relative;overflow:hidden;
  background:linear-gradient(135deg,#0d0d0d,#262626);}
.feature-media .play{
  position:absolute;inset:0;margin:auto;width:74px;height:74px;border-radius:50%;
  background:rgba(220,65,43,.92);display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:transform .2s,background .2s;
}
.feature-media .play:hover{transform:scale(1.06);background:var(--brand);}
.feature-media .play svg{width:26px;height:26px;fill:#fff;margin-left:4px;}
.feature-text .eyebrow{margin-bottom:var(--s4);}
.feature-text h3{font-size:var(--fs-h2);font-weight:600;line-height:1.15;margin-bottom:var(--s5);}
.feature-text p{font-size:var(--fs-body);color:var(--g700);margin:0 0 var(--s6);}

/* ───────── Dual CTA ───────── */
.dual{display:grid;grid-template-columns:1fr 1fr;}
/* full-bleed light tint band + content contained to container (matches homepage #contact) */
[data-od-id="dual-cta"]{background:var(--surface-sub);border-top:1px solid var(--g200);}
[data-od-id="dual-cta"] .dual{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}
.dual-col{
  padding:var(--s18) var(--s12);
  display:flex;flex-direction:column;justify-content:flex-start;min-height:300px;position:relative;
}
.dual-col:first-child{border-right:0;}
.dual-col h2{font-size:var(--fs-h1);font-weight:600;line-height:1.08;margin-bottom:var(--s5);max-width:14ch;color:var(--black);}
.dual-col p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.6;color:var(--g700);max-width:38ch;margin:0 0 var(--s8);}
/* editorial light band — primary/secondary share light bg, brand red reserved for eyebrow + CTA */
.dual-primary{background:transparent;color:var(--black);}
.dual-primary .eyebrow{color:var(--brand);}
.dual-primary p{color:var(--g700);}
.dual-secondary{background:transparent;color:var(--black);border-left:1px solid var(--g300);}
.dual-secondary .eyebrow{color:var(--g500);}
.dual-secondary h2{color:var(--black);}
.dual-secondary p{color:var(--g700);}
.dual-btn-light{background:var(--brand);color:#fff;align-self:flex-start;margin-top:auto;}
.dual-btn-light:hover{background:var(--brand-hover);}
.dual-btn-outline{background:none;color:var(--black);border:1px solid var(--g700);align-self:flex-start;margin-top:auto;}
.dual-btn-outline:hover{background:var(--black);color:#fff;}

/* ───────── Footer ───────── */
.footer{background:var(--surface-sub);color:var(--g700);font-family:var(--sans);}
.footer .wrap{padding:var(--s18) var(--gutter);}
.foot-top{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--s15);padding:var(--s15) 0;border-bottom:1px solid var(--g300);align-items:start;}
.foot-top h2{font-family:var(--serif);font-size:var(--fs-h3);font-weight:400;line-height:1.5;max-width:24ch;text-wrap:pretty;color:var(--black);}
.news-row{display:flex;gap:var(--s3);margin-top:0;max-width:460px;}
.news-row input{
  flex:1;background:var(--white);border:1px solid var(--g300);border-radius:var(--radius);color:var(--black);
  font-family:var(--sans);font-size:var(--fs-body);padding:12px 14px;outline:none;
}
.news-row input::placeholder{color:var(--g400);}
.news-row input:focus{border-color:var(--black);}
.news-row button{background:var(--brand);color:#fff;border:0;padding:0 26px;font-family:var(--sans);
  font-size:var(--fs-meta);font-weight:500;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;border-radius:var(--radius);transition:background .15s;}
.news-row button:hover{background:var(--brand-hover);}
.consent{display:flex;gap:var(--s2);align-items:flex-start;margin-top:var(--s4);font-size:var(--fs-eyebrow);color:var(--g500);max-width:460px;line-height:1.6;}
.consent input{margin-top:3px;accent-color:var(--brand);}

/* newsletter — enriched (eyebrow + value list + lead-magnet + 線上預覽) — light footer */
.news-head{display:flex;align-items:baseline;gap:var(--s4);flex-wrap:wrap;margin-bottom:var(--s3);}
.news-eyebrow{font-size:var(--fs-eyebrow);letter-spacing:.14em;text-transform:uppercase;color:var(--brand);font-weight:600;}
.news-sample{font-size:var(--fs-eyebrow);color:var(--g500);text-decoration:none;border-bottom:1px solid var(--g300);padding-bottom:2px;white-space:nowrap;transition:color .18s,border-color .18s;}
.news-sample:hover{color:var(--brand);border-color:var(--brand);}
.news-sample .arr{display:inline-block;transition:transform .18s;}
.news-sample:hover .arr{transform:translateX(3px);}
.news-value{list-style:none;margin:var(--s5) 0 0;padding:0;display:grid;gap:10px;max-width:36ch;}
.news-value li{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-meta);color:var(--g600);line-height:1.5;}
.news-value .nv-t{color:var(--brand);font-weight:700;flex:none;}
.news-gift{display:flex;gap:var(--s4);align-items:center;padding:var(--s4);border:1px solid var(--g300);border-radius:10px;background:var(--surface-sub);margin-bottom:var(--s5);max-width:460px;}
.news-gift-doc{flex:none;width:46px;height:58px;border-radius:4px;background:#fff;position:relative;box-shadow:0 5px 16px rgba(0,0,0,.14);overflow:hidden;border:1px solid var(--g300);}
.news-gift-doc::before{content:"";position:absolute;left:0;right:0;top:0;height:7px;background:var(--brand);}
.news-gift-doc::after{content:"";position:absolute;left:8px;right:8px;top:18px;height:2px;background:#D2D2D2;box-shadow:0 6px 0 #D2D2D2,0 12px 0 #D2D2D2,0 18px 0 #E4E4E4,0 24px 0 #E4E4E4;}
.news-gift-txt{min-width:0;}
.news-gift-tag{display:block;font-size:var(--fs-eyebrow);letter-spacing:.12em;text-transform:uppercase;color:var(--brand);font-weight:700;margin-bottom:3px;}
.news-gift-title{font-family:var(--serif);font-size:var(--fs-body);color:var(--black);font-weight:400;line-height:1.4;}
.news-gift-sub{font-size:var(--fs-eyebrow);color:var(--g500);margin-top:4px;line-height:1.5;}
.news-note{margin:var(--s4) 0 0;font-size:var(--fs-meta);color:var(--g600);font-weight:500;letter-spacing:.01em;}

/* newsletter 線上預覽 modal */
.nlp-bd{position:fixed;inset:0;background:rgba(12,12,12,.62);opacity:0;visibility:hidden;transition:opacity .22s,visibility .22s;z-index:1200;}
.nlp-bd.open{opacity:1;visibility:visible;}
.nlp-modal{position:fixed;inset:0;z-index:1201;display:flex;align-items:center;justify-content:center;padding:var(--s5);opacity:0;visibility:hidden;transition:opacity .22s,visibility .22s;}
.nlp-modal.open{opacity:1;visibility:visible;}
.nlp-card{background:var(--white);width:100%;max-width:600px;max-height:88vh;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.32);transform:translateY(12px);transition:transform .24s cubic-bezier(.2,.7,.2,1);}
.nlp-modal.open .nlp-card{transform:translateY(0);}
.nlp-bar{display:flex;align-items:center;gap:var(--s2);padding:var(--s3) var(--s4);background:var(--g100,#F4F4F4);border-bottom:1px solid var(--g300);flex-shrink:0;}
.nlp-dots{display:flex;gap:6px;}
.nlp-dots i{width:10px;height:10px;border-radius:50%;background:var(--g300);display:block;}
.nlp-url{flex:1;font-size:var(--fs-eyebrow);color:var(--g500);background:var(--white);border:1px solid var(--g300);border-radius:6px;padding:4px 10px;letter-spacing:.02em;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.nlp-x{flex-shrink:0;width:30px;height:30px;border:0;background:transparent;color:var(--g500);font-size:22px;line-height:1;cursor:pointer;border-radius:6px;transition:background .15s,color .15s;}
.nlp-x:hover{background:var(--g300);color:var(--black);}
.nlp-body{overflow-y:auto;padding:var(--s7) var(--s7) var(--s6);}
.nlp-sample-tag{display:inline-block;font-size:var(--fs-eyebrow);letter-spacing:.12em;text-transform:uppercase;color:var(--brand);font-weight:600;border:1px solid color-mix(in oklab,var(--brand) 35%,transparent);border-radius:999px;padding:3px 10px;margin-bottom:var(--s4);}
.nlp-mast{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);padding-bottom:var(--s3);border-bottom:2px solid var(--black);}
.nlp-mast b{font-family:var(--serif);font-size:var(--fs-h4,21px);color:var(--black);letter-spacing:.02em;}
.nlp-mast span{font-size:var(--fs-eyebrow);color:var(--g500);}
.nlp-lead{font-family:var(--serif);font-size:var(--fs-h3);line-height:1.45;color:var(--black);margin:var(--s5) 0 var(--s2);}
.nlp-dek{font-size:var(--fs-body);color:var(--g600);line-height:1.7;margin-bottom:var(--s5);}
.nlp-item{padding:var(--s4) 0;border-top:1px solid var(--g200,#ECECEC);}
.nlp-item:first-of-type{border-top:1px solid var(--g300);}
.nlp-kicker{font-size:var(--fs-eyebrow);letter-spacing:.1em;text-transform:uppercase;color:var(--brand);font-weight:600;margin-bottom:var(--s2);}
.nlp-item h4{font-size:var(--fs-body);font-weight:700;color:var(--black);margin-bottom:var(--s1);line-height:1.5;}
.nlp-item p{font-size:var(--fs-small,14px);color:var(--g600);line-height:1.7;}
.nlp-foot{margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--g300);font-size:var(--fs-eyebrow);color:var(--g500);line-height:1.7;text-align:center;}
@media(max-width:600px){
  .nlp-body{padding:var(--s5);}
  .nlp-url{display:none;}
}
@media(prefers-reduced-motion:reduce){
  .nlp-bd,.nlp-modal,.nlp-card{transition:none;}
  .nlp-modal.open .nlp-card{transform:none;}
}

.foot-links{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);padding-top:var(--s15);}
.foot-links h3{font-size:var(--fs-eyebrow);letter-spacing:.08em;text-transform:uppercase;color:var(--g500);margin-bottom:var(--s4);font-weight:600;}
.foot-links ul{list-style:none;margin:0;padding:0;}
.foot-links li{margin-bottom:var(--s3);}
.foot-links a{font-size:var(--fs-meta);color:var(--g700);}
.foot-links a:hover{color:var(--brand);}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:var(--s4) var(--s6);margin-top:var(--s10);padding-top:var(--s8);border-top:1px solid var(--g300);flex-wrap:wrap;}
.legal{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);}
.legal a{font-size:var(--fs-eyebrow);color:var(--g500);}
.legal a:hover{color:var(--brand);}
.social{display:flex;gap:var(--s4);}
.social a{position:relative;display:inline-flex;color:var(--g500);transition:color .15s,transform .13s cubic-bezier(.22,1,.36,1);}
.social a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:var(--brand);transform:scaleX(0);transform-origin:center;transition:transform .13s cubic-bezier(.22,1,.36,1);}
.social a:hover{color:var(--brand);transform:translateY(-3px);transition:color .15s,transform .18s cubic-bezier(.22,1,.36,1);}
.social a:hover::after{transform:scaleX(1);transition:transform .18s cubic-bezier(.22,1,.36,1);}
.social svg{width:18px;height:18px;fill:currentColor;}
.copy{font-size:var(--fs-eyebrow);color:var(--g500);margin:0;}
/* dark grounding base — page lands on a deep utility bar */
.foot-base{background:var(--surface-sub);}
.foot-base .wrap{padding:var(--s6) var(--gutter);}
.foot-base .foot-bottom{margin-top:0;padding-top:var(--s6);border-top:1px solid var(--g300);}
.foot-base .copy{color:var(--g500);}
.foot-base .legal a{color:var(--g500);}
.foot-base .legal a:hover{color:var(--brand);}
.foot-base .social a{color:var(--g500);}
.foot-base .social a:hover{color:var(--brand);}

/* ════════════════════════════════════════════════════════════════════
 * Sub-page components (solid header pages — no full-bleed hero)
 * ════════════════════════════════════════════════════════════════════ */

/* ───────── Page hero (full-screen dark banner, mirrors homepage 100svh) ───────── */
.page-hero{background:#0e0e0e;color:#fff;position:relative;overflow:hidden;
  min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;}
/* Scroll-down cue: full-screen hero pushes content below the fold, so signal that
   there's more. CSS-drawn chevron, gentle bounce, disabled for reduced-motion. */
.page-hero::after{content:"";position:absolute;left:50%;bottom:26px;width:13px;height:13px;
  border-right:2px solid rgba(255,255,255,.5);border-bottom:2px solid rgba(255,255,255,.5);
  transform:translateX(-50%) rotate(45deg);animation:heroScrollCue 2.2s ease-in-out infinite;
  z-index:2;pointer-events:none;}
@keyframes heroScrollCue{0%,100%{bottom:26px;opacity:.35;}50%{bottom:16px;opacity:.8;}}
@media (prefers-reduced-motion:reduce){.page-hero::after{animation:none;opacity:.5;}}
.page-hero .bgwash{position:absolute;inset:0;opacity:.9;}
.ph-import .bgwash{background:linear-gradient(110deg,#0e0e0e 40%,rgba(204,72,18,.30) 78%,transparent),radial-gradient(120% 140% at 82% 22%,#243a52,#0b1019 60%);}
.ph-overseas .bgwash{background:linear-gradient(110deg,#0e0e0e 42%,rgba(40,130,190,.26) 78%,transparent),radial-gradient(120% 140% at 80% 24%,#13314e,#080f18 60%);}
.ph-tools .bgwash{background:linear-gradient(110deg,#0e0e0e 44%,rgba(206,96,34,.30) 78%,transparent),radial-gradient(120% 140% at 80% 22%,#2a3346,#0a0d16 60%);}
.ph-insights .bgwash{background:linear-gradient(110deg,#0e0e0e 42%,rgba(120,90,200,.24) 78%,transparent),radial-gradient(120% 140% at 80% 26%,#262247,#0a0816 60%);}
.ph-about .bgwash{background:linear-gradient(110deg,#0e0e0e 44%,rgba(220,65,43,.28) 80%,transparent),radial-gradient(120% 140% at 82% 22%,#3a0d0d,#0b0606 60%);}
.ph-contact .bgwash{background:linear-gradient(110deg,#0e0e0e 44%,rgba(40,130,190,.22) 80%,transparent),radial-gradient(120% 140% at 80% 24%,#15311f,#070f0a 60%);}
.page-hero .wrap{position:relative;z-index:1;width:100%;padding-top:var(--s18);padding-bottom:var(--s18);}
.page-hero .eyebrow{color:rgba(255,255,255,.78);font-size:var(--fs-meta);}
/* Hero 兩階層：首頁=旗艦 clamp(32→76px)/700+徽章（index.html 內聯）；子頁=次級 clamp(30→56px)/600（下方），刻意較小較輕，形成有節奏的層級而非隨機落差。 */
.page-hero h1{font-size:clamp(30px,4.4vw,56px);font-weight:600;line-height:1.06;letter-spacing:-.015em;max-width:18ch;margin-bottom:var(--s5);}
.page-hero p.lead{font-family:var(--serif);font-size:var(--fs-lead);line-height:1.6;color:rgba(255,255,255,.86);max-width:52ch;margin:0;}
.page-hero .cta-row{margin-top:var(--s8);display:flex;gap:var(--s4);flex-wrap:wrap;}

/* ───────── Breadcrumb ───────── */
.crumb{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g500);padding:var(--s4) 0;}
.crumb a:hover{color:var(--brand);}
.crumb .sep{color:var(--g300);margin:0 8px;}
.page-hero .crumb{color:rgba(255,255,255,.6);}
.page-hero .crumb a:hover{color:#fff;}
.page-hero .crumb .sep{color:rgba(255,255,255,.3);}

/* ───────── Prose ───────── */
.prose{max-width:68ch;}
.prose p{font-size:var(--fs-body);line-height:1.75;color:var(--g700);margin:0 0 var(--s5);}
.lead-p{font-size:var(--fs-lead);line-height:1.6;color:var(--black);}

/* ───────── Service grid (icon + title + desc) ───────── */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--g300);border:1px solid var(--g300);border-radius:var(--radius);overflow:hidden;}
.svc{background:var(--white);padding:var(--s8);transition:background .15s;}
.svc:hover{background:#fafafa;}
.svc .num{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;color:var(--brand);letter-spacing:.08em;}
.svc h3{font-size:var(--fs-lead);font-weight:600;margin:var(--s4) 0 var(--s3);}
.svc p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.6;color:var(--g600);margin:0;}
/* svc-iconic — 2×2 bordered cards + thin-line icons (service-content pages) */
.svc-grid.svc-iconic{grid-template-columns:repeat(2,1fr);gap:var(--s4);background:none;border:0;border-radius:0;overflow:visible;}
.svc-iconic .svc{border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s6);transition:border-color .15s,box-shadow .15s;}
.svc-iconic .svc:hover{background:var(--white);border-color:var(--black);box-shadow:0 1px 0 var(--black);}
.svc-iconic .svc-ic{display:block;width:28px;height:28px;color:var(--black);margin-bottom:var(--s4);
  transition:transform .25s cubic-bezier(.25,1,.5,1),color .25s cubic-bezier(.25,1,.5,1);}
.svc-iconic .svc-ic svg{width:100%;height:100%;display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.svc-iconic .svc:hover .svc-ic{transform:translateY(-3px) scale(1.06);color:var(--brand);}
.svc-iconic .svc h3{margin-top:var(--s2);}

/* help-paths — 還是不清楚? two bridging paths: learn vs consult */
.help-paths{border-top:1px solid var(--g300);border-bottom:1px solid var(--g300);padding:var(--s10) 0;}
.help-paths .hp-head{margin:0 0 var(--s6);}
.help-paths .hp-head h2{font-family:var(--serif);font-size:var(--fs-h3);font-weight:600;margin:0 0 var(--s2);color:var(--black);}
.help-paths .hp-head p{font-family:var(--sans);font-size:var(--fs-body);color:var(--g600);margin:0;}
.help-paths .hp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);}
.help-paths .hp-card{display:flex;flex-direction:column;border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s6);transition:border-color .15s,box-shadow .15s;}
.help-paths .hp-card:hover{border-color:var(--black);box-shadow:0 1px 0 var(--black);}
.help-paths .hp-ic{display:block;width:28px;height:28px;color:var(--black);margin-bottom:var(--s4);
  transition:transform .25s cubic-bezier(.25,1,.5,1),color .25s cubic-bezier(.25,1,.5,1);}
.help-paths .hp-ic svg{width:100%;height:100%;display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.help-paths .hp-card:hover .hp-ic{transform:translateY(-3px) scale(1.06);color:var(--brand);}
.help-paths .hp-card h3{font-family:var(--serif);font-size:var(--fs-lead);font-weight:600;margin:0 0 var(--s2);color:var(--black);}

/* ───────── Unified line-icon hover animation (site-wide consistency) ─────────
   All line-art icon families share one "ink pulse" on hover — lines briefly
   thicken like being re-inked, paired with the existing lift + red. Reliable on
   any path/shape, no markup changes. The tool icons (AI 關稅雷達盤 / 碳排長條)
   keep their bespoke radar/bar animations as the hero pair — not touched here. */
@keyframes ic-ink{0%{stroke-width:1.5;}45%{stroke-width:2.5;}100%{stroke-width:1.6;}}
.svc-cards .card:hover .svc-ico svg,
.hard-cards .card:hover .hard-ico svg,
.svc-iconic .svc:hover .svc-ic svg,
.help-paths .hp-card:hover .hp-ic svg{animation:ic-ink .5s cubic-bezier(.25,1,.5,1);}
.help-paths .hp-card p{font-family:var(--sans);font-size:var(--fs-meta);line-height:1.7;color:var(--g700);margin:0 0 var(--s5);flex:1;}
.help-paths .hp-links{display:flex;flex-direction:column;gap:var(--s2);margin-top:auto;}
.help-paths .hp-links a{font-family:var(--sans);font-size:var(--fs-meta);font-weight:500;color:var(--black);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:color .15s,gap .15s;}
.help-paths .hp-links a::after{content:"\2192";color:var(--g600);transition:color .15s,transform .15s;}
.help-paths .hp-links a:hover{color:var(--brand);}
.help-paths .hp-links a:hover::after{color:var(--brand);transform:translateX(3px);}
.help-paths .hp-card-line .hp-links a::after{color:var(--g700);}
@media(max-width:600px){.help-paths .hp-grid{grid-template-columns:1fr;}}

/* ───────── Brand family (about page mission-umbrella diagram) ───────── */
.brand-family .bf-mission{max-width:560px;margin:0 auto;text-align:center;border:1.5px solid var(--black);border-radius:var(--radius);padding:var(--s5) var(--s6);background:var(--white);}
.brand-family .bf-tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--g600);margin-bottom:var(--s2);}
.brand-family .bf-tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand);}
.brand-family .bf-mission h3{font-family:var(--serif);font-size:var(--fs-h3);font-weight:600;color:var(--black);margin:0 0 var(--s2);letter-spacing:-.01em;}
.brand-family .bf-mission p{font-family:var(--sans);font-size:var(--fs-meta);line-height:1.6;color:var(--g600);margin:0;}
.brand-family .bf-stem{width:1px;height:var(--s8);background:var(--g300);margin:0 auto;}
.brand-family .bf-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);position:relative;max-width:760px;margin:0 auto;}
.brand-family .bf-cards::before{content:"";position:absolute;top:0;left:25%;right:25%;height:1px;background:var(--g300);}
.brand-family .bf-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s6);background:var(--white);margin-top:var(--s5);transition:border-color .15s,box-shadow .15s;}
.brand-family .bf-card::before{content:"";position:absolute;top:calc(-1 * var(--s5));left:calc(50% - .5px);width:1px;height:var(--s5);background:var(--g300);}
.brand-family .bf-card:hover{border-color:var(--black);box-shadow:0 1px 0 var(--black);}
.brand-family .bf-card.is-home{border-top:3px solid var(--brand);}
.brand-family .bf-ic{display:block;width:30px;height:30px;color:var(--black);margin-bottom:var(--s4);transition:transform .25s cubic-bezier(.25,1,.5,1),color .25s cubic-bezier(.25,1,.5,1);}
.brand-family .bf-ic svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.brand-family .bf-card:hover .bf-ic{transform:translateY(-3px) scale(1.06);color:var(--brand);}
.brand-family .bf-name{font-family:var(--serif);font-size:var(--fs-lead);font-weight:600;color:var(--black);margin:0 0 3px;}
.brand-family .bf-role{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;color:var(--g600);margin:0 0 var(--s3);}
.brand-family .bf-desc{font-family:var(--sans);font-size:var(--fs-meta);line-height:1.7;color:var(--g700);margin:0;flex:1;}
.brand-family .bf-link{font-family:var(--sans);font-size:var(--fs-meta);font-weight:500;color:var(--black);text-decoration:none;display:inline-flex;align-items:center;gap:6px;margin-top:var(--s4);transition:color .15s,gap .15s;}
.brand-family .bf-link::after{content:"\2197";color:var(--g600);transition:color .15s,transform .15s;}
.brand-family .bf-link:hover{color:var(--brand);}
.brand-family .bf-link:hover::after{color:var(--brand);transform:translate(2px,-2px);}
.brand-family .bf-sub{margin-top:var(--s4);padding-top:var(--s3);border-top:1px dashed var(--g300);}
.brand-family .bf-sub .bf-sub-label{font-family:var(--sans);font-size:var(--fs-eyebrow);letter-spacing:.04em;color:var(--g600);margin:0 0 3px;}
.brand-family .bf-sub a{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:var(--black);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:color .15s;}
.brand-family .bf-sub a::after{content:"\2197";color:var(--g600);}
.brand-family .bf-sub a:hover{color:var(--brand);}
.brand-family .bf-flow{margin-top:var(--s6);text-align:center;font-family:var(--sans);font-size:var(--fs-meta);line-height:1.9;color:var(--g600);}
.brand-family .bf-flow b{color:var(--black);font-weight:600;}
@media(max-width:860px){
  .brand-family .bf-cards{grid-template-columns:1fr;}
  .brand-family .bf-cards::before{display:none;}
  .brand-family .bf-card{margin-top:var(--s4);}
  .brand-family .bf-card::before{display:none;}
  .brand-family .bf-stem{height:var(--s5);}
}
@media(prefers-reduced-motion:reduce){
  .brand-family .bf-card:hover .bf-ic{transform:none;}
}

/* ───────── Policy radar (shared, injected on subpages) ───────── */
.policy-radar{border:1px solid var(--g300);border-radius:var(--radius);background:var(--white);overflow:hidden;}
.pr-head{display:flex;align-items:center;gap:var(--s3);padding:var(--s5) var(--s6);border-bottom:1px solid var(--g300);background:var(--bg);}
.pr-head .pr-dot{width:9px;height:9px;border-radius:50%;background:var(--brand);flex:0 0 auto;animation:prpulse 2.4s ease-out infinite;}
@keyframes prpulse{0%{box-shadow:0 0 0 0 rgba(220,65,43,.45);}70%{box-shadow:0 0 0 8px rgba(220,65,43,0);}100%{box-shadow:0 0 0 0 rgba(220,65,43,0);}}
.pr-head .pr-title{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;color:var(--black);}
.pr-head .pr-sub{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g500);}
.pr-list{display:grid;grid-template-columns:1fr 1fr;}
.pr-item{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s4) var(--s6);text-decoration:none;
  border-bottom:1px solid var(--bg);border-right:1px solid var(--bg);transition:background .15s;}
.pr-item:nth-child(2n){border-right:0;}
.pr-item:nth-last-child(-n+2){border-bottom:0;}
.pr-item:hover{background:var(--bg);}
.pr-tag{flex:0 0 auto;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;
  padding:var(--s1) var(--s2);border-radius:999px;margin-top:1px;}
.pr-tag.tariff{background:var(--black);color:#fff;}
.pr-tag.grant{background:none;color:var(--g700);border:1px solid var(--g500);}
.pr-it-title{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;line-height:1.45;color:var(--black);transition:color .15s;}
.pr-item:hover .pr-it-title{color:var(--brand);}
.pr-it-new{display:inline-block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:700;color:var(--brand);
  letter-spacing:.08em;margin-left:6px;vertical-align:middle;}
@media(max-width:720px){.pr-list{grid-template-columns:1fr;}.pr-item,.pr-item:nth-child(2n){border-right:0;}
  .pr-item:nth-last-child(-n+2){border-bottom:1px solid var(--bg);}.pr-item:last-child{border-bottom:0;}
  .pr-head{flex-wrap:wrap;gap:var(--s1) var(--s2);}}
@media(prefers-reduced-motion:reduce){.pr-head .pr-dot{animation:none;}
  .svc-cards .card:hover .svc-ico,.hard-cards .card:hover .hard-ico,
  .svc-iconic .svc:hover .svc-ic,.help-paths .hp-card:hover .hp-ic{transform:none;}
  .svc-cards .card:hover .svc-ico svg,.hard-cards .card:hover .hard-ico svg,
  .svc-iconic .svc:hover .svc-ic svg,.help-paths .hp-card:hover .hp-ic svg{animation:none;}}

/* ───────── Process step list ───────── */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);counter-reset:step;}
.step{position:relative;padding-top:var(--s8);border-top:3px solid var(--brand);}
.step::before{counter-increment:step;content:"0" counter(step);font-family:var(--sans);
  font-size:var(--fs-meta);font-weight:600;color:var(--brand);letter-spacing:.08em;position:absolute;top:var(--s4);}
.step h3{font-size:var(--fs-lead);font-weight:600;margin:0 0 var(--s3);}
.step p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.6;color:var(--g600);margin:0;}

/* ───────── Stat row ───────── */
.statrow{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);}
.statrow .stat-cell{border-left:3px solid var(--brand);padding-left:var(--s5);}
.statrow .num{font-family:var(--sans);font-size:var(--fs-stat);font-weight:600;line-height:1;letter-spacing:-.02em;}
.statrow .cap{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);margin-top:var(--s3);}
.statrow .stat-cell{transition:border-color .3s;}
.statrow .stat-cell.stat-pop .num{animation:statPop .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes statPop{0%{transform:scale(1)}40%{transform:scale(1.14)}100%{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){.statrow .stat-cell.stat-pop .num{animation:none;}}

/* ───────── 補助時間軸 ───────── */
.subsidy-tl{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s8);margin-top:var(--s12,48px);position:relative;}
.subsidy-tl::before{content:"";position:absolute;top:6px;left:7px;right:7px;height:2px;background:var(--g300);}
.tl-node{position:relative;padding-top:var(--s8);}
.tl-node::before{content:"";position:absolute;top:0;left:0;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--g300);box-sizing:border-box;}
.tl-node.now::before{background:var(--brand);border-color:var(--brand);box-shadow:0 0 0 4px rgba(220,65,43,.14);}
.tl-era{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;letter-spacing:.04em;color:var(--g600);}
.tl-node.now .tl-era{color:var(--brand);}
.tl-node h3{font-family:var(--sans);font-size:var(--fs-lead);font-weight:600;margin:var(--s2) 0 var(--s3);}
.tl-node p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.65;color:var(--g600);margin:0;}
.tl-tag{display:inline-block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.05em;
  color:var(--brand);border:1px solid var(--brand);border-radius:999px;padding:2px 10px;margin-top:var(--s4);}

/* ───────── 現行可申請計畫卡 ───────── */
.prog-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s5);margin-top:var(--s6);}
.prog-card{border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s6);transition:border-color .15s,box-shadow .15s;}
.prog-card:hover{border-color:var(--black);box-shadow:0 1px 0 var(--black);}
.prog-top{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s4);}
.prog-status{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;padding:var(--s1) var(--s3);border-radius:999px;white-space:nowrap;}
.prog-status.open{background:var(--brand);color:#fff;}
.prog-status.soon{background:#fff;color:var(--brand);border:1px solid var(--brand);}
.prog-amt{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:var(--black);text-align:right;}
.prog-card h3{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;margin:0 0 var(--s2);line-height:1.35;}
.prog-card p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.6;color:var(--g600);margin:0 0 var(--s3);}
.prog-src{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g600);}
.prog-src a{color:var(--g600);text-decoration:underline;text-underline-offset:2px;}
.prog-src a:hover{color:var(--brand);}

/* ───────── Filter pills ───────── */
.pills{display:flex;flex-wrap:wrap;gap:var(--s3);margin-bottom:var(--s10);}
.pill{font-family:var(--sans);font-size:var(--fs-meta);font-weight:500;color:var(--g600);
  border:1px solid var(--g300);background:var(--white);padding:9px 18px;border-radius:var(--radius);cursor:pointer;transition:all .15s;}
.pill:hover{border-color:var(--black);color:var(--black);}
.pill[aria-pressed="true"]{background:var(--brand);border-color:var(--brand);color:#fff;}

/* ───────── Featured article row ───────── */
.feat-article{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--s12,48px);align-items:center;margin-bottom:var(--s15);}
.feat-article .feat-media{aspect-ratio:16/10;border-radius:var(--radius);background:linear-gradient(135deg,#2a2a2a,#4a0a0a);}
.feat-article h2{font-size:var(--fs-h1);font-weight:600;line-height:1.12;letter-spacing:-.01em;margin:var(--s3) 0 var(--s5);}
.feat-article p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.65;color:var(--g700);margin:0 0 var(--s6);}

/* ───────── Tool cards (online tools index) ───────── */
.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s6);}
.tool{border:1px solid var(--g300);border-radius:var(--radius);background:var(--white);padding:var(--s8);}
.tool h2{font-size:var(--fs-h3);font-weight:600;margin:0 0 var(--s3);display:flex;align-items:center;gap:var(--s2);}
.tool h2 .tag{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--brand);border:1px solid var(--brand);border-radius:var(--radius);padding:var(--s1) var(--s2);}
.tool>p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.6;color:var(--g600);margin:0 0 var(--s6);}

/* ── Phase 2 D/E/F: 聚焦報價主角 · Beta 上鎖 · 承諾梯子 ── */
.tools-lead-h{font-size:var(--fs-h3);font-weight:600;letter-spacing:-.01em;margin:0 0 var(--s6);}
.tool-featured{margin:0 0 var(--s10);}
.tool.is-locked{background:#fafafa;}
.tool h2 .tag.tag-beta{color:var(--g600);border-color:var(--g400);background:transparent;}
.field input:disabled{background:#f0f0f0;color:var(--g500);cursor:not-allowed;}
.lock-route{border-top:1px solid var(--g300);margin-top:var(--s5);padding-top:var(--s5);}
.lock-route p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.6;color:var(--g700);margin:0 0 var(--s4);}
.co2-ladder{border-top:1px solid var(--g300);margin-top:var(--s5);padding-top:var(--s5);}
.co2-ladder p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.6;color:var(--g600);margin:0 0 var(--s4);}

/* ───────── Form fields (tools + contact) ───────── */
.field{margin-bottom:var(--s4);}
.field label{display:block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;
  letter-spacing:.04em;color:var(--g600);text-transform:uppercase;margin-bottom:var(--s2);}
.field input,.field select,.field textarea{
  width:100%;font-family:var(--sans);font-size:var(--fs-body);color:var(--black);
  border:1px solid var(--g400);border-radius:var(--radius);background:var(--white);
  padding:12px var(--s4);outline:none;transition:border-color .15s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand);}
.field textarea{min-height:120px;resize:vertical;line-height:1.6;}
.field .err{display:none;font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--brand);margin-top:6px;}
.field.invalid input,.field.invalid textarea{border-color:var(--brand);}
.field.invalid .err{display:block;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--s5);}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);}

/* ───────── Tool result panel ───────── */
.result{margin-top:var(--s5);padding:var(--s5);border:1px solid var(--g300);
  border-left:3px solid var(--brand);border-radius:var(--radius);background:#fafafa;
  font-family:var(--sans);display:none;}
.result.show{display:block;animation:fade .3s ease;}
.result .big{font-size:var(--fs-h1);font-weight:600;line-height:1;}
.result .lbl{font-size:var(--fs-eyebrow);color:var(--g600);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;}
.result .note{font-family:var(--serif);font-size:var(--fs-meta);color:var(--g600);margin-top:var(--s3);}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* ───────── Tracking timeline ───────── */
.track-steps{list-style:none;margin:var(--s4) 0 0;padding:0;}
.track-steps li{position:relative;padding:0 0 var(--s5) var(--s8);border-left:2px solid var(--g300);}
.track-steps li:last-child{border-left-color:transparent;padding-bottom:0;}
.track-steps li::before{content:"";position:absolute;left:-7px;top:2px;width:12px;height:12px;border-radius:50%;background:var(--g400);}
.track-steps li.done::before{background:var(--brand);}
.track-steps li.now::before{background:var(--brand);box-shadow:0 0 0 4px rgba(220,65,43,.18);}
.track-steps .t-title{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;}
.track-steps .t-meta{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g500);margin-top:2px;}

/* ───────── FAQ accordion ───────── */
.faq{border-top:1px solid var(--g300);}
.faq-solo{max-width:860px;}
.faq-item.faq-hidden{display:none;}
/* "read more" → reveals the remaining questions inline (no modal).
   Count-style expand row: hairline on TOP ties it to the list above as a
   closing control (not a斷尾 bottom line into empty space); a light fill
   separates it from the white question rows so it reads as a control, not a
   6th question. Left = how many remain, right = the action. */
.faq-more{margin-top:0;}
.faq-more-btn{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:var(--g600);
  background:var(--surface-sub,#F4F4F4);border:0;border-top:1px solid var(--g300);cursor:pointer;
  width:100%;padding:var(--s4) var(--s4);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s4);
  text-align:left;transition:background .2s,color .2s;}
.faq-more-btn:hover{color:var(--brand);background:#ececec;}
.faq-more-btn .fm-label{color:var(--g500);font-weight:500;}
.faq-more-btn:hover .fm-label{color:var(--g600);}
.faq-more-btn .fm-action{display:inline-flex;align-items:center;gap:var(--s2);color:var(--brand);}
.faq-more-btn .ar{transition:transform .2s;}
.faq-more-btn:hover .ar{transform:translateY(2px);}
.faq-item{border-bottom:1px solid var(--g300);}
.faq-q{position:relative;width:100%;text-align:left;border:0;background:none;cursor:pointer;
  font-family:var(--sans);font-size:var(--fs-lead);font-weight:500;color:var(--black);
  margin:0 calc(-1*var(--s4));padding:var(--s5) var(--s4);display:flex;align-items:center;justify-content:space-between;gap:var(--s4);transition:color .18s,background-color .18s ease-out;}
.faq-q::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--brand);transform:scaleY(0);transform-origin:top;transition:transform .18s ease-out;}
.faq-q:hover{color:var(--brand);background:var(--surface-sub,#F4F4F4);}
.faq-q:hover::before{transform:scaleY(1);}
.faq-q .ico{color:var(--brand);font-size:var(--fs-h3);flex:none;transition:transform .2s;}
.faq-item.open .faq-q .ico{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-item.open .faq-a{max-height:1600px;}
.faq-a p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.7;color:var(--g700);margin:0 0 var(--s5);max-width:72ch;}
/* ── FAQ Direction A: sticky contact card + numbered Q&A ── */
.faq-aside{position:sticky;top:calc(var(--header-h,62px) + var(--s6));align-self:start;}
/* QA 兩欄 + sticky 右欄（learn 系列共用） */
.qa-grid{display:grid;grid-template-columns:minmax(0,820px) minmax(0,300px);gap:var(--s12);align-items:start;}
.qa-grid .qa-list{max-width:none;}
.faq-jump{border-top:2px solid var(--black);padding-top:var(--s4);}
.faq-jump .fj-k{font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.08em;color:var(--g600);margin:0 0 var(--s2);}
.faq-jump ol{list-style:none;margin:0;padding:0;}
.faq-jump li{margin:0;}
.faq-jump a{display:flex;gap:var(--s2);align-items:baseline;padding:var(--s2) 0;font-size:var(--fs-meta);line-height:1.45;color:var(--g700);text-decoration:none;border-bottom:1px solid var(--g300);transition:color .18s,padding-left .18s,box-shadow .18s;}
.faq-jump li:last-child a{border-bottom:0;}
.faq-jump a .fj-n{flex:none;font-family:var(--serif);font-weight:700;color:var(--g500);font-size:var(--fs-eyebrow);min-width:20px;}
.faq-jump a:hover{color:var(--black);padding-left:4px;}
.faq-jump a:hover .fj-n,.faq-jump a.active .fj-n{color:var(--brand);}
.faq-jump a.active{color:var(--black);font-weight:600;box-shadow:inset 2px 0 0 var(--brand);padding-left:10px;}
@media(max-width:1080px){
  .qa-grid{grid-template-columns:1fr;}
  .qa-grid .faq-aside{position:static;margin-top:var(--s10);}
  .faq-jump{display:none;}
  .qa-grid .faq-card{margin-top:0;}
}
@media(prefers-reduced-motion:reduce){.faq-jump a{transition:none;}.faq-q,.faq-q::before{transition:none;}}
.faq-card{margin-top:var(--s6);border:1px solid var(--black);border-radius:var(--radius);padding:var(--s8);}
.faq-card h3{font-family:var(--serif);font-size:var(--fs-lead);font-weight:600;margin:0 0 var(--s3);color:var(--black);}
.faq-card p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.7;color:var(--g700);margin:0 0 var(--s5);}
.faq-card .fc-line{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;text-transform:uppercase;letter-spacing:.06em;
  padding:15px 24px;border-radius:var(--radius);background:var(--black);color:#fff;transition:background .15s;}
.faq-card .fc-line:hover{background:var(--g700);}
.faq-card .fc-line svg{width:18px;height:18px;flex:none;}
.faq-card .fc-alt{display:block;text-align:center;margin:var(--s4) 0 0;font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);}
.faq-card .fc-alt a{color:var(--brand);}
.faq-q .num{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:var(--g400);flex:none;width:26px;}
.faq-item.open .faq-q .num,.faq-q:hover .num{color:var(--brand);}
.faq-q .q-txt{flex:1;display:flex;flex-direction:column;gap:var(--s1);}
.faq-q .faq-cat{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--g500);}
.faq-item.open .faq-q .faq-cat,.faq-q:hover .faq-cat{color:var(--brand);}
.faq-q .ico{width:28px;height:28px;border:1px solid var(--g400);border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;font-size:var(--fs-lead);line-height:1;
  color:var(--g700);transition:transform .2s,background .15s,border-color .15s,color .15s;}
.faq-q:hover .ico{border-color:var(--brand);color:var(--brand);}
.faq-item.open .faq-q .ico{background:var(--brand);border-color:var(--brand);color:#fff;}

/* ───────── Misc utilities ───────── */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s15);align-items:start;}
.muted{color:var(--g600);}
.center{text-align:center;}
.maxw{max-width:760px;margin-left:auto;margin-right:auto;}

/* ───────── Responsive ───────── */
@media(max-width:1200px){
  .cards{grid-template-columns:repeat(2,1fr);gap:var(--s8) var(--s6);}
  .statrow{grid-template-columns:repeat(2,1fr);gap:var(--s8) var(--s6);}
}
@media(max-width:951px){
  .feature{grid-template-columns:1fr;gap:var(--s8);}
  .feature-media{order:-1;}
  .feat-article{grid-template-columns:1fr;gap:var(--s6);}
  .feat-article .feat-media{order:-1;}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .subsidy-tl{grid-template-columns:1fr;gap:var(--s6);}
  .subsidy-tl::before{display:none;}
  .tl-node{padding-top:var(--s6);padding-left:var(--s6);}
  .tl-node::before{left:0;top:5px;}
  .prog-cards{grid-template-columns:1fr;}
  .steps{grid-template-columns:repeat(2,1fr);gap:var(--s8) var(--s6);}
  .tool-grid{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;gap:var(--s8);}
  .foot-top{grid-template-columns:1fr;gap:var(--s8);}
  .foot-links{grid-template-columns:repeat(2,1fr);gap:var(--s8) var(--s6);}
}
@media(max-width:768px){
  :root{--gutter:18px;}
  .page-hero .wrap{padding-top:var(--s11);padding-bottom:var(--s11);}
  .sec{padding:var(--s11) 0;}
  .sec-head{flex-direction:column;align-items:flex-start;gap:var(--s4);margin-bottom:var(--s8);}
  .form-grid{grid-template-columns:1fr;}
  .dual{grid-template-columns:1fr;}
  .dual-col{min-height:auto;padding:var(--s11) var(--s6);}
  .dual-col:first-child{border:0;}
  .dual-secondary{border-left:0;border-top:1px solid var(--g300);}
  .dual-col h2{font-size:var(--fs-h2);}
  .dual-btn-light,.dual-btn-outline{width:100%;justify-content:center;}
  .cards.cols-3{grid-template-columns:repeat(2,1fr);}
  .cards.cols-3.hard-cards{grid-template-columns:1fr;}
  .svc-grid:not(.svc-iconic){grid-template-columns:1fr;}
}
@media(max-width:600px){
  .cards{grid-template-columns:1fr;}
  .cards.cols-3{grid-template-columns:1fr;}
  .svc-grid{grid-template-columns:1fr;}
  .svc-grid.svc-iconic{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .statrow{grid-template-columns:1fr;}
  .row-2{grid-template-columns:1fr;}
  .mega-sub{grid-template-columns:1fr;}
  .foot-links{grid-template-columns:1fr;}
  .news-row{flex-direction:column;}
  .news-row button{padding:var(--s4);}
}

/* ════════════════════════════════════════════════════════════════════
 * Conversion chrome + spec-gap components (整合規格 0.2 / per-page)
 * All injected globally via site.js on sub-pages; hardcoded on index.html.
 * ════════════════════════════════════════════════════════════════════ */

/* ── Header inline CTA (固定詢價入口) ── */
.head-cta{display:flex;align-items:center;gap:var(--s3);margin-left:var(--s2);}
.head-cta .hbtn{
  font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;padding:9px 16px;border-radius:var(--radius);white-space:nowrap;
  display:inline-flex;align-items:center;gap:var(--s2);cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;
}
.head-cta .hbtn-quote{background:none;color:var(--g700);border:1px solid var(--g700);}
.head-cta .hbtn-quote:hover{background:var(--g700);color:#fff;}
.head-cta .hbtn-line{border:1px solid var(--g400);color:var(--g700);}
.head-cta .hbtn-line:hover{border-color:var(--brand);color:var(--brand);}
@media(max-width:768px){.head-cta .hbtn-line{display:none;}}
@media(max-width:600px){.head-cta .hbtn-quote .lbl{display:none;}}

/* ── Desktop primary nav (≥951px) — hub-page links, single source ── */
.mainnav{display:none;}
.mainnav a{font-family:var(--sans);font-size:var(--fs-meta);font-weight:500;color:var(--g700);
  padding:20px 0;position:relative;white-space:nowrap;letter-spacing:.05em;transition:color .15s;}
.mainnav a:hover{color:var(--brand);}
.mainnav a:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:2px;}
.mainnav a[aria-current="page"]{color:var(--black);font-weight:600;}
.mainnav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--black);}
@media(min-width:951px){
  .mainnav{display:flex;align-items:center;gap:var(--s5);margin:0 auto 0 var(--s8);}
  .header .menu-btn{display:none;}
}
/* Desktop nav dropdowns (≥951px) */
.mainnav .navitem{position:relative;display:flex;align-items:center;}
.mainnav .navitem.has-sub>a{display:inline-flex;align-items:center;gap:var(--s1);}
.mainnav .navitem.has-sub>a::before{content:"";order:2;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-1px);opacity:.45;transition:transform .2s,opacity .2s;}
.mainnav .navitem.has-sub:hover>a::before,
.mainnav .navitem.has-sub:focus-within>a::before,
.mainnav .navitem.has-sub.open>a::before{opacity:.85;transform:rotate(225deg) translateY(2px);}
.navsub{position:absolute;top:100%;left:-14px;z-index:65;min-width:228px;background:var(--white);
  border:1px solid var(--g300);border-radius:var(--radius);box-shadow:0 10px 28px rgba(0,0,0,.10);
  padding:var(--s2);display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;}
.mainnav .navitem.has-sub:hover .navsub,
.mainnav .navitem.has-sub:focus-within .navsub,
.mainnav .navitem.has-sub.open .navsub{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .18s ease,transform .18s ease;}
.navsub a{font-family:var(--sans);font-size:var(--fs-meta);font-weight:500;color:var(--g700);padding:9px 12px;
  border-radius:4px;white-space:nowrap;letter-spacing:0;transition:background .12s,color .12s;}
.navsub a::after{display:none;}
.navsub a:hover{background:var(--bg);color:var(--brand);}
.navsub .sub-all{color:var(--black);font-weight:600;border-bottom:1px solid var(--g300);border-radius:0;margin-bottom:4px;}
.navsub .sub-all:hover{background:transparent;color:var(--brand);}

/* ── Trust / cert badge row (信任替代列) ── */
.certrow{display:flex;flex-wrap:wrap;gap:var(--s5) var(--s8);align-items:center;}
.cert{display:flex;flex-direction:column;gap:4px;min-width:150px;}
.cert .ct{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:var(--black);display:flex;align-items:center;gap:8px;}
.cert .ct .tick{color:var(--brand);font-weight:700;}
.cert .cd{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g500);line-height:1.4;}
.cert .todo{font-style:normal;color:var(--g400);background:#f4f4f4;border:1px dashed var(--g400);
  border-radius:var(--radius);padding:0 6px;font-size:var(--fs-eyebrow);}

/* ── Footer cert strip (dark) ── */
.foot-cert{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;padding:var(--s6) 0 var(--s8);border-top:1px solid var(--g300);border-bottom:1px solid var(--g300);}
.foot-cert .fc{font-family:var(--sans);font-size:var(--fs-lead);color:var(--g600);display:flex;align-items:center;justify-content:center;gap:var(--s2);padding:var(--s2) var(--s5);text-align:center;}
.foot-cert .fc+.fc{border-left:1px solid var(--g300);}
.foot-cert .fc .tick{color:var(--brand);font-weight:700;flex:none;}
.foot-cert .fc .fc-n{color:var(--black);font-weight:600;}
@media(max-width:680px){
  .foot-cert{gap:6px var(--s2);}
  .foot-cert .fc{padding:8px var(--s3);}
  .foot-cert .fc+.fc{border-left:0;}
}

/* ── Lead-capture hook (tools lead magnet) ── */
.leadbox{margin-top:var(--s5);padding:var(--s5);border:1px dashed var(--brand);border-radius:var(--radius);background:#fff8f8;}
.leadbox p{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g700);margin:0 0 var(--s3);line-height:1.6;}
.leadbox .lead-row{display:flex;gap:var(--s2);flex-wrap:wrap;}
.leadbox input{flex:1;min-width:160px;font-family:var(--sans);font-size:var(--fs-meta);border:1px solid var(--g400);
  border-radius:var(--radius);padding:10px 12px;outline:none;}
.leadbox input:focus{border-color:var(--brand);}
.leadbox button{background:var(--brand);color:#fff;border:0;font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;
  letter-spacing:.04em;padding:0 20px;border-radius:var(--radius);cursor:pointer;white-space:nowrap;}
.leadbox button:hover{background:var(--brand-hover);}
.leadbox .lead-note{font-size:var(--fs-eyebrow);color:var(--g500);margin:var(--s2) 0 0;}
.leadbox.done .lead-row{display:none;}
.leadbox .ok{display:none;font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:#17a34a;}
.leadbox.done .ok{display:block;}

/* ── Optional-field marker + submit hint (contact form) ── */
.opt{font-weight:400;font-size:var(--fs-eyebrow);color:var(--g500);margin-left:5px;letter-spacing:0;}
.submit-hint{font-family:var(--sans);font-size:var(--fs-meta);line-height:1.5;color:var(--g500);margin:var(--s4) 0 0;}

/* ── Tool result → contact bridge card (reusable) ── */
.bridge{margin-top:var(--s5);padding:var(--s5);border:1px solid var(--g300);border-radius:var(--radius);background:#f7f7f7;}
.bridge h3{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;margin:0 0 var(--s2);}
.bridge p{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);line-height:1.6;margin:0 0 var(--s4);}
.bridge .btn-bridge{background:none;color:var(--brand);border:1px solid var(--brand);padding:11px 22px;}
.bridge .btn-bridge:hover{background:var(--brand);color:#fff;}

/* ── Readiness quiz (出海準備度評估) ── */
.quiz{border:1px solid var(--g300);border-radius:var(--radius);background:var(--white);padding:var(--s8);max-width:720px;}
.quiz fieldset{border:0;margin:0 0 var(--s6);padding:0;}
.quiz legend{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;margin-bottom:var(--s3);}
.quiz .opts{display:flex;flex-wrap:wrap;gap:var(--s2);}
.quiz .opts label{font-family:var(--sans);font-size:var(--fs-meta);border:1px solid var(--g400);border-radius:var(--radius);
  padding:9px 16px;cursor:pointer;transition:all .15s;color:var(--g700);}
.quiz .opts input{position:absolute;opacity:0;width:0;height:0;}
.quiz .opts input:checked+label,.quiz .opts label:has(input:checked){background:var(--brand);border-color:var(--brand);color:#fff;}
.quiz-result{margin-top:var(--s5);padding:var(--s6);border:1px solid var(--g300);border-left:3px solid var(--brand);
  border-radius:var(--radius);background:#fafafa;display:none;}
.quiz-result.show{display:block;animation:fade .3s ease;}
.quiz-result .score{font-family:var(--sans);font-size:var(--fs-stat);font-weight:600;line-height:1;color:var(--brand);}

/* ── Glossary entry card (insights) ── */
.glosscard{border-top:2px solid var(--black);padding-top:var(--s4);
  display:flex;flex-direction:column;gap:var(--s3);}
.glosscard .terms{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin-top:var(--s2);}
.glosscard .terms .term{display:flex;flex-direction:column;gap:2px;padding:var(--s3) var(--s4) var(--s3) 0;
  border-top:1px solid var(--g300);}
.glosscard .terms .term:nth-child(2n){padding-left:var(--s4);}
.glosscard .terms .term b{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:var(--black);}
.glosscard .terms .term span{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.5;color:var(--g600);}
@media(max-width:640px){.glosscard .terms{grid-template-columns:1fr;}
  .glosscard .terms .term:nth-child(2n){padding-left:0;}}

/* ── Cluster tag (主題叢集) ── */
.cluster-tag{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;color:var(--brand);
  text-transform:uppercase;}

/* ── About: team + office ── */
.team-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s8);}
.member{display:grid;grid-template-columns:120px 1fr;gap:var(--s5);align-items:start;}
.member .photo{aspect-ratio:1;border-radius:var(--radius);background:linear-gradient(135deg,#e9e9e9,#cfcfcf);
  position:relative;overflow:hidden;}
.member .photo .ph-tag{position:absolute;inset:auto 0 0 0;background:rgba(0,0,0,.55);color:#fff;
  font-family:var(--sans);font-size:var(--fs-eyebrow);text-align:center;padding:var(--s1);}
.member h3{font-size:var(--fs-lead);font-weight:600;margin:0 0 4px;}
.member .role{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--brand);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--s3);}
.member p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.6;color:var(--g600);margin:0;}
.office-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);}
.office{border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s5);}
.office h3{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;margin:0 0 6px;}
.office p{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);line-height:1.6;margin:0;}
/* 完整據點通訊錄（about）：依大區分組，含法人名＋地址＋電話 */
.office-group+.office-group{margin-top:var(--s8);}
.og-head{display:flex;align-items:baseline;gap:var(--s3);margin-bottom:var(--s5);padding-bottom:var(--s3);border-bottom:1px solid var(--g300);}
.og-region{font-family:var(--sans);font-size:var(--fs-h3);font-weight:600;letter-spacing:.01em;}
.og-count{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);}
.office-hq{display:inline-block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;color:var(--brand);border:1px solid var(--brand);border-radius:999px;padding:1px 8px;margin-left:8px;vertical-align:middle;letter-spacing:.04em;}
.office .office-ent{font-size:var(--fs-meta);color:var(--g700);line-height:1.55;margin:0 0 var(--s3);}
.office-addr{font-style:normal;font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);line-height:1.6;margin:0 0 var(--s2);}
.office-tel{display:inline-block;font-family:var(--sans);font-size:var(--fs-meta);color:var(--g700);text-decoration:none;transition:color .15s;}
.office-tel:hover{color:var(--brand);}
.sec--dark .og-head{border-color:rgba(255,255,255,.16);}
.sec--dark .og-count{color:rgba(255,255,255,.55);}
.sec--dark .office .office-ent{color:rgba(255,255,255,.82);}
.sec--dark .office-addr{color:rgba(255,255,255,.55);}
.sec--dark .office-tel{color:rgba(255,255,255,.7);}
@media(max-width:951px){.team-grid{grid-template-columns:1fr;} .office-row{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.office-row{grid-template-columns:1fr;} .member{grid-template-columns:90px 1fr;}}

/* ── Tool-embed band (import lead magnet strip) ── */
.tool-band{background:var(--surface-sub,#F4F4F4);color:var(--black);border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s10);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s8);flex-wrap:wrap;}
.tool-band h3{font-size:var(--fs-h3);font-weight:600;margin:0 0 var(--s2);}
.tool-band p{font-family:var(--serif);font-size:var(--fs-body);color:var(--g700);margin:0;max-width:48ch;}
.tool-band .tb-actions{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center;}
/* secondary (AI) button reads dark on the light band */
.tool-band .btn-outline{color:var(--black);border-color:var(--g400);}
.tool-band .btn-outline:hover{background:var(--black);border-color:var(--black);color:var(--white);}

/* ── Carbon calculator (運輸碳排比較) ── */
.co2-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:var(--s10);align-items:start;}
.co2-panel{padding:var(--s6);border:1px solid var(--g300);border-left:3px solid var(--brand);
  border-radius:var(--radius);background:#fafafa;font-family:var(--sans);}
.co2-panel .lbl{font-size:var(--fs-eyebrow);color:var(--g600);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--s4);}
.co2-headline{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;line-height:1.4;margin:0 0 var(--s5);}
.co2-headline .hot{color:var(--brand);}
.co2-row{margin-bottom:var(--s5);}
.co2-row .head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;}
.co2-row .mode{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;}
.co2-row .mode .sub{font-weight:400;color:var(--g500);font-size:var(--fs-eyebrow);}
.co2-row .val{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;font-variant-numeric:tabular-nums;}
.co2-track{height:14px;background:#ececec;border-radius:var(--radius);overflow:hidden;}
.co2-fill{height:100%;width:0;border-radius:var(--radius);transition:width .6s cubic-bezier(.2,0,0,1);}
.co2-fill.sea{background:#17a34a;}
.co2-fill.road{background:#EAB308;}
.co2-fill.air{background:var(--brand);}
.co2-eq{margin-top:var(--s5);padding-top:var(--s5);border-top:1px solid var(--g300);
  font-family:var(--sans);font-size:var(--fs-meta);color:var(--g700);line-height:1.65;}
.co2-eq strong{color:var(--black);}
.co2-why{border-top:2px solid var(--black);padding-top:var(--s5);margin-top:var(--s8);}
.co2-why h3{font-family:var(--serif);font-size:var(--fs-body);font-weight:600;margin:0 0 var(--s4);line-height:1.3;}
.co2-why ul{margin:0;padding:0;list-style:none;font-family:var(--sans);font-size:var(--fs-meta);color:var(--g700);line-height:1.6;}
.co2-why ul li{padding:var(--s3) 0;border-top:1px solid var(--g300);}
.co2-why ul li:first-child{border-top:none;padding-top:0;}
.co2-why ul li strong{color:var(--black);font-weight:600;}
.co2-why .disc{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g500);margin:var(--s4) 0 0;line-height:1.6;}
/* distance read-out + methodology line */
.co2-dist{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g600);margin:0 0 var(--s4);font-variant-numeric:tabular-nums;line-height:1.6;}
.co2-dist strong{color:var(--black);font-weight:600;}
.co2-dist .sub{color:var(--g500);font-size:var(--fs-eyebrow);}
.co2-row.na .co2-track{background:repeating-linear-gradient(45deg,#f2f2f2,#f2f2f2 6px,#ececec 6px,#ececec 12px);}
.co2-row.na .val{color:var(--g500);font-weight:400;font-variant-numeric:normal;}
.co2-method{font-family:var(--sans);font-size:var(--fs-eyebrow);line-height:1.6;color:var(--g500);margin:var(--s5) 0 0;padding-top:var(--s4);border-top:1px dashed var(--g300);}
.co2-method strong{color:var(--g700);font-weight:600;}
@media(max-width:951px){.co2-grid{grid-template-columns:1fr;gap:var(--s8);}}

/* ── Learn hub hero wash ── */
.ph-learn .bgwash{background:linear-gradient(110deg,#0e0e0e 42%,rgba(20,140,110,.26) 80%,transparent),radial-gradient(120% 140% at 80% 24%,#103a30,#070f0c 60%);}

/* ── Learn hub: section label + video placeholder ── */
.learn-row{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6);}
@media(max-width:951px){.learn-row{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.learn-row{grid-template-columns:1fr;}}
.vid-ph{aspect-ratio:16/9;border-radius:var(--radius);border:1px dashed var(--g400);background:#f4f4f4;
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:var(--g500);font-family:var(--sans);font-size:var(--fs-meta);}
.vid-ph .play{width:54px;height:54px;border-radius:50%;background:var(--g300);display:flex;align-items:center;justify-content:center;}
.vid-ph .play svg{width:20px;height:20px;fill:var(--g600);margin-left:3px;}

/* ── Learn hub: keyword search ── */
.learn-search{position:relative;max-width:640px;}
.learn-search input{width:100%;font-family:var(--sans);font-size:var(--fs-body);color:var(--black);
  border:1px solid var(--g400);border-radius:var(--radius);padding:var(--s4) 44px;background:#fff;transition:border-color .15s;}
.learn-search input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(220,65,43,.1);}
.learn-search .ls-ico{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--g500);pointer-events:none;}
.learn-search .ls-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:none;
  font-size:var(--fs-h3);line-height:1;color:var(--g500);cursor:pointer;padding:var(--s2);display:none;}
.learn-search.has-q .ls-clear{display:block;}
.learn-search.has-q .ls-clear:hover{color:var(--brand);}
.gloss-results{display:none;margin-top:var(--s6);}
.gloss-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:var(--s3);}
.gloss-hit{border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s4) var(--s5);}
.gloss-hit h4{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;margin:0 0 6px;}
.gloss-hit p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.6;color:var(--g600);margin:0;}
.gloss-hit mark{background:rgba(220,65,43,.13);color:var(--brand);padding:0 1px;border-radius:2px;}
.search-empty{font-family:var(--serif);color:var(--g600);font-size:var(--fs-body);margin-top:var(--s6);}

/* ── Learn hub: journey flowchart (connected stepper) ── */
.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:var(--s8);counter-reset:fl;}
.flow-node{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 var(--s3);text-decoration:none;}
.flow-node::after{content:"";position:absolute;top:21px;left:50%;width:100%;height:2px;background:var(--g300);z-index:0;}
.flow-node:last-child::after{display:none;}
.flow-num{position:relative;z-index:1;width:44px;height:44px;border-radius:50%;background:#fff;border:2px solid var(--g400);
  display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-size:var(--fs-body);font-weight:600;color:var(--g600);
  counter-increment:fl;transition:border-color .15s,color .15s;}
.flow-num::before{content:counter(fl);}
.flow-node h3{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;color:var(--black);margin:var(--s4) 0 var(--s2);}
.flow-node p{font-family:var(--serif);font-size:var(--fs-meta);line-height:1.6;color:var(--g600);margin:0;}
.flow-node .fl-pain{display:block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;color:var(--brand);margin-top:7px;}
.flow-node:hover .flow-num{border-color:var(--brand);color:var(--brand);}
.flow-node:hover h3{color:var(--brand);}
@media(max-width:760px){
  .gloss-grid{grid-template-columns:1fr;}
  .flow{grid-template-columns:1fr;gap:var(--s5);}
  .flow-node{flex-direction:row;text-align:left;gap:var(--s4);padding:0;align-items:flex-start;}
  .flow-node::after{top:44px;left:21px;width:2px;height:calc(100% + var(--s5));}
  .flow-num{flex:0 0 44px;}
}

/* ── Article body (入門教學) ── */
.article{max-width:720px;margin:0 auto;}
.article .meta{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g500);margin-bottom:var(--s6);display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);align-items:center;}
.article h2{font-size:var(--fs-h3);font-weight:600;letter-spacing:-.01em;margin:var(--s10) 0 var(--s4);}
.article h3{font-size:var(--fs-lead);font-weight:600;margin:var(--s8) 0 var(--s3);}
.article p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.78;color:var(--g700);margin:0 0 var(--s5);}
.article ul,.article ol{font-family:var(--serif);font-size:var(--fs-body);line-height:1.7;color:var(--g700);margin:0 0 var(--s5);padding-left:1.3em;}
.article li{margin-bottom:var(--s3);}
.article a.inlink{color:var(--brand);border-bottom:1px solid rgba(220,65,43,.3);}
.article a.inlink:hover{border-bottom-color:var(--brand);}
.article .lede{font-family:var(--serif);font-size:var(--fs-lead);line-height:1.6;color:var(--black);margin-bottom:var(--s8);}
.inline-tool{border:1px solid var(--g300);border-left:3px solid var(--brand);border-radius:var(--radius);
  background:#fafafa;padding:var(--s6);margin:var(--s8) 0;}
.inline-tool .eyebrow{margin-bottom:var(--s3);}
.inline-tool h3{font-family:var(--sans);font-size:var(--fs-lead);font-weight:600;margin:0 0 var(--s3);}
.inline-tool p{font-family:var(--serif);font-size:var(--fs-body);color:var(--g600);line-height:1.6;margin:0 0 var(--s4);}
.article-cta{border-top:1px solid var(--g300);margin-top:var(--s10);padding-top:var(--s8);}
.article-cta h3{font-size:var(--fs-h3);font-weight:600;margin:0 0 var(--s3);}
.article-cta p{font-family:var(--serif);font-size:var(--fs-body);color:var(--g600);margin:0 0 var(--s5);}
.takeaway{background:var(--bg);border:1px solid var(--g300);border-left:3px solid var(--brand);border-radius:var(--radius);padding:var(--s6);margin:var(--s8) 0;}
.takeaway .eyebrow{margin-bottom:var(--s2);}
.takeaway h3{font-family:var(--sans);font-size:var(--fs-lead);font-weight:600;margin:0 0 var(--s3);}
.takeaway ul{margin:0;font-size:var(--fs-body);}
.takeaway li{margin-bottom:6px;}
.source-note{font-family:var(--sans);font-size:var(--fs-eyebrow);line-height:1.6;color:var(--g500);border-top:1px solid var(--g300);margin-top:var(--s8);padding-top:var(--s4);}
.source-note strong{color:var(--g600);font-weight:600;}

/* hero photo treatment */
.page-hero.has-photo{background-color:#0e0e0e;background-size:cover;background-position:center right;background-repeat:no-repeat;}
.page-hero.has-photo .bgwash{opacity:1;background:linear-gradient(100deg,#0e0e0e 20%,rgba(14,14,14,.76) 44%,rgba(14,14,14,.34) 70%,rgba(14,14,14,.04) 100%);}
/* import 主視覺左側調淡一級：圖1 卡車本身左邊已偏暗，漸層放輕讓品牌卡車多露出，白字仍可讀 */
.ph-import.has-photo .bgwash{background:linear-gradient(100deg,rgba(14,14,14,.88) 14%,rgba(14,14,14,.56) 42%,rgba(14,14,14,.22) 70%,rgba(14,14,14,.02) 100%);}

/* ── Tophat + header overlay the dark page-hero (mirrors homepage), turn solid white on scroll ── */
.sitehead{position:absolute;top:0;left:0;right:0;z-index:60;border-bottom:1px solid transparent;transition:background .25s,border-color .25s,box-shadow .25s;}
.sitehead.scrolled{position:fixed;background:var(--white);border-bottom-color:var(--g300);box-shadow:0 1px 10px rgba(0,0,0,.06);}
.sitehead .header{position:static;height:var(--header-h);border-bottom:0;background:transparent;}
.sitehead .tophat-trust{margin-right:auto;color:var(--g600);display:inline-flex;align-items:center;gap:6px;text-transform:none;letter-spacing:.02em;}
.sitehead .tophat-trust::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brand);flex:none;}
.sitehead:not(.scrolled) .tophat{background:transparent;border-bottom-color:rgba(255,255,255,.28);}
.sitehead:not(.scrolled) .tophat a,.sitehead:not(.scrolled) .tophat span{color:rgba(255,255,255,.82);}
.sitehead:not(.scrolled) .tophat .tophat-trust{color:rgba(255,255,255,.9);}
.sitehead:not(.scrolled) .tophat .lang b{color:#fff;}
.sitehead:not(.scrolled) .tophat a:hover{color:#fff;}
.sitehead:not(.scrolled) .menu-btn,.sitehead:not(.scrolled) .menu-btn:hover{color:#fff;}
.sitehead:not(.scrolled) .menu-btn .bars span,.sitehead:not(.scrolled) .menu-btn:hover .bars span{background:#fff;}
.sitehead:not(.scrolled) .brand-mark .bw{color:#fff;}
.sitehead:not(.scrolled) .brand-mark .bw-en{color:rgba(255,255,255,.74);}
.sitehead:not(.scrolled) .icon-btn{color:#fff;}
.sitehead:not(.scrolled) .icon-btn:hover{color:#fff;opacity:.78;}
.sitehead:not(.scrolled) .mainnav>.navitem>a,.sitehead:not(.scrolled) .mainnav>a{color:rgba(255,255,255,.86);}
.sitehead:not(.scrolled) .mainnav>.navitem>a:hover,.sitehead:not(.scrolled) .mainnav>a:hover{color:#fff;}
.sitehead:not(.scrolled) .mainnav>.navitem>a[aria-current="page"],.sitehead:not(.scrolled) .mainnav>a[aria-current="page"]{color:#fff;}
.sitehead:not(.scrolled) .mainnav>.navitem>a[aria-current="page"]::after{background:#fff;}
body:has(.page-hero) .page-hero .wrap{padding-top:calc(var(--header-h) + 34px + var(--s8));}
@media(max-width:768px){.sitehead .tophat .hide-sm{display:none;}}

/* ───────── Tool landing pages (freight-calculator + 5 future tool pages) ───────── */
/* Compact hero so the tool itself sits high in the first screen. */
.tool-hero .wrap{padding-top:var(--s11);padding-bottom:var(--s10);}
.tool-hero h1{font-size:var(--fs-h1);max-width:24ch;margin-bottom:var(--s4);}
.tool-hero p.lead{max-width:50ch;}
/* mobile: featured-tool primary action goes full-width */
@media(max-width:600px){.tool-featured>.btn-primary{width:100%;}}

/* Explainer prose block (SEO body copy) */
.tool-prose{max-width:64ch;}
.tool-prose h2{font-size:var(--fs-h2);font-weight:600;letter-spacing:-.01em;margin:0 0 var(--s5);}
.tool-prose p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.75;color:var(--g700);margin:0 0 var(--s4);}
.tool-prose p:last-child{margin-bottom:0;}

/* Related services / tools row */
.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--s4);margin-top:var(--s6);}
.related-grid a{display:block;border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s5);text-decoration:none;background:#fff;transition:border-color .15s;}
.related-grid a:hover{border-color:var(--g500);}
.related-grid .rk{display:block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--g600);}
.related-grid .rt{display:block;font-family:var(--sans);font-size:var(--fs-body);font-weight:600;color:var(--black);margin:6px 0 4px;}
.related-grid .rd{display:block;font-family:var(--serif);font-size:var(--fs-meta);color:var(--g600);line-height:1.5;}
@media(max-width:768px){.related-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.related-grid{grid-template-columns:1fr;}}
/* 工具啟動頁：兩張大卡並排（主秀份量，不動共用 .related-grid） */
.related-grid.tools-launch{grid-template-columns:1fr 1fr;gap:var(--s5);}
.tools-launch a{display:flex;flex-direction:column;padding:var(--s6);min-height:200px;position:relative;}
.tools-launch a:hover{border-color:var(--black);}
.tools-launch .tl-top{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s4);}
.tools-launch .tl-ic{width:34px;height:34px;flex:0 0 34px;color:var(--g500);transition:transform .25s cubic-bezier(.25,1,.5,1),color .25s cubic-bezier(.25,1,.5,1);}
.tools-launch a:hover .tl-ic{transform:translateY(-3px) scale(1.06);color:var(--brand);}
.tools-launch .rk{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--g600);}
.tools-launch .rt{font-family:var(--sans);font-size:var(--fs-h3);font-weight:600;color:var(--black);margin:0 0 var(--s2);line-height:1.25;}
.tools-launch .rd{font-family:var(--serif);font-size:var(--fs-body);color:var(--g600);line-height:1.6;margin-bottom:var(--s5);}
.tools-launch .tl-go{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;}
.tools-launch .tl-go .arr{transition:transform .2s;}
.tools-launch a:hover .tl-go .arr{transform:translateX(3px);}
.tools-launch .tl-go.tl-primary{color:var(--brand);}
.tools-launch .tl-go.tl-ext{color:var(--black);}
.tools-launch .tl-ext-badge{position:absolute;top:var(--s4);right:var(--s4);font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:500;letter-spacing:.05em;color:var(--g500);border:1px solid var(--g300);border-radius:var(--radius);padding:2px 7px;}
@media(prefers-reduced-motion:reduce){.tools-launch a:hover .tl-ic{transform:none;}}
@media(prefers-reduced-motion:reduce){.social a,.social a:hover{transform:none;}.social a::after,.social a:hover::after{display:none;}}
@media(max-width:600px){.related-grid.tools-launch{grid-template-columns:1fr;}}

/* ===== Figure / image system — drop-in, image-ready =====================
   Usage:
     <figure class="fig fig-wide">
       <img src="..." alt="...">
       <figcaption class="fig-cap">說明文字</figcaption>
     </figure>
   Variants: .fig-wide (16:9) · .fig-photo (4:3) · .fig-square (1:1)
   Side-by-side: wrap two .fig in <div class="fig-row">                     */
.fig{margin:var(--fig-my) 0;}
.fig img{display:block;width:100%;height:auto;border-radius:var(--radius);}
.fig.fig-wide img{aspect-ratio:var(--ar-wide);object-fit:cover;}
.fig.fig-photo img{aspect-ratio:var(--ar-photo);object-fit:cover;}
.fig.fig-square img{aspect-ratio:var(--ar-square);object-fit:cover;}
.fig-cap{font-family:var(--sans);font-size:var(--fs-caption);line-height:var(--lh-meta);
  color:var(--g500);margin-top:var(--fig-cap-gap);padding-left:2px;
  border-left:2px solid var(--brand);padding-left:10px;}
.fig-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter);margin:var(--fig-my) 0;}
.fig-row .fig{margin:0;}
/* inline figure inside prose/article keeps the column rhythm */
.prose .fig,.article .fig{margin:var(--space-block) 0;}
@media(max-width:680px){.fig-row{grid-template-columns:1fr;}}

/* --- Photo placeholder (temporary stand-in until real work photos land) ---
   Drop a .fig-ph inside a .fig instead of <img>. Diagonal hatch + dashed
   border = universal "image to come" signal; stays in the B/W/red system.
   <figure class="fig fig-photo">
     <div class="fig-ph"><span class="fig-ph-t">照片待放</span>
       <span class="fig-ph-s">報關現場實拍</span></div>
     <figcaption class="fig-cap">說明（實拍照片待補）</figcaption>
   </figure>                                                                  */
.fig-ph{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--s2);text-align:center;border-radius:var(--radius);
  border:1.5px dashed var(--g400);
  color:var(--g500);
  background-color:#FAFAFA;
  background-image:repeating-linear-gradient(135deg,
    rgba(0,0,0,.035) 0,rgba(0,0,0,.035) 1px,transparent 1px,transparent 11px);
}
.fig .fig-ph{width:100%;}
.fig.fig-wide .fig-ph{aspect-ratio:var(--ar-wide);}
.fig.fig-photo .fig-ph{aspect-ratio:var(--ar-photo);}
.fig.fig-square .fig-ph{aspect-ratio:var(--ar-square);}
.fig-ph::before{
  content:"";width:34px;height:26px;margin-bottom:var(--s1);
  border:1.5px solid var(--g400);border-radius:2px;
  background:
    radial-gradient(circle 3px at 24px 8px,var(--g400) 99%,transparent) no-repeat,
    linear-gradient(135deg,transparent 56%,var(--g400) 56%,var(--g400) 70%,transparent 70%) no-repeat;
  background-size:100% 100%;opacity:.85;}
.fig-ph-t{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--brand);}
.fig-ph-s{font-family:var(--sans);font-size:var(--fs-meta);color:var(--g500);
  letter-spacing:.02em;}

/* ── Flexport 式交錯圖文帶 .media-row ──────────────────────────────
   共用元件（每一內容層配一個成對視覺、左右交錯，好讀＞克制）。
   用法：.media-row > (.fig.mr-media + .mr-text)。預設圖在左、文在右；
   要交錯成圖在右，外層加 .mr-flip。手機自動收單欄、圖在上。
   圖種照鐵律：流程/比較→SVG；真實場景→.fig-ph 佔位。 */
.media-row{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--s11);align-items:start}
.media-row.mr-flip{grid-template-columns:1.15fr .85fr}
.media-row .mr-media{margin:0}
.media-row.mr-flip .mr-media{order:2}
/* media-row 內的真實照一律走 16:9 矮帶（4:3 會 towering 壓過文字） */
.media-row .mr-media.fig-photo img,.media-row .mr-media.fig-photo .fig-ph{aspect-ratio:var(--ar-wide)}
.mr-text .eyebrow{margin-bottom:var(--s3)}
.mr-text h2{font-family:var(--serif);font-size:var(--fs-h2);line-height:1.3;margin:0 0 var(--s4);color:var(--black)}
.mr-lead{font-family:var(--serif);font-size:var(--fs-lead);line-height:1.7;color:var(--g700);margin:0;max-width:46ch}
.mr-reasons{margin-top:var(--s6);display:flex;flex-direction:column;gap:var(--s6)}
.mr-reason .num{display:block;font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;letter-spacing:.06em;color:var(--brand);margin-bottom:var(--s2)}
.mr-reason h3{font-family:var(--sans);font-size:var(--fs-h3);margin:0 0 var(--s2)}
.mr-reason p{font-family:var(--serif);font-size:var(--fs-body);line-height:1.7;color:var(--g700);margin:0}
.sec--dark .mr-text h2{color:#fff}
.sec--dark .mr-lead,.sec--dark .mr-reason p{color:rgba(255,255,255,.72)}
.sec--dark .mr-reason h3{color:#fff}
.sec--dark .mr-media .fig-cap{color:rgba(255,255,255,.6)}
@media(max-width:760px){
  .media-row{grid-template-columns:1fr;gap:var(--s7)}
  .media-row .mr-media,.media-row.mr-flip .mr-media{order:-1}
  .mr-lead{max-width:none}
}

/* 區塊捲動進場 — 共用,沿用站上減動慣例 (需 <html class="js"> + [data-reveal]) */
.js [data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .62s cubic-bezier(.22,1,.36,1),transform .62s cubic-bezier(.22,1,.36,1);will-change:opacity,transform;}
.js [data-reveal].rv-in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.js [data-reveal],.js [data-reveal].rv-in{opacity:1;transform:none;transition:none;}}

/* ── Article template: breadcrumb / TL;DR / related / coming-soon ── */
.art-crumb{max-width:720px;margin:0 auto var(--s6);font-family:var(--sans);font-size:var(--fs-meta);color:var(--g500);}
.art-crumb a{color:var(--g500);}
.art-crumb a:hover{color:var(--brand);}
.art-crumb .sep{margin:0 .5em;color:var(--g300);}
.art-crumb [aria-current]{color:var(--g700);}
.tldr{background:var(--surface-sub);border:1px solid var(--g300);border-radius:var(--radius);
  padding:var(--s6) var(--s6) var(--s5);margin:0 0 var(--s8);}
.tldr .tldr-label{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--brand);margin:0 0 var(--s3);display:flex;align-items:center;gap:.5em;}
.tldr .tldr-label::before{content:"";width:18px;height:2px;background:var(--brand);display:inline-block;}
.tldr ol{margin:0;padding-left:1.4em;font-family:var(--serif);font-size:var(--fs-body);line-height:1.7;color:var(--g700);}
.tldr li{margin-bottom:var(--s2);}
.tldr li:last-child{margin-bottom:0;}
.related{max-width:720px;margin:var(--s10) auto 0;border-top:1px solid var(--g300);padding-top:var(--s8);}
.related h2{font-family:var(--sans);font-size:var(--fs-h3);font-weight:600;margin:0 0 var(--s6);}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);}
.rel-card{display:block;border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s5);
  transition:border-color .15s,transform .15s;}
.rel-card:hover{border-color:var(--brand);transform:translateY(-2px);}
.rel-card .eyebrow{margin:0 0 var(--s2);}
.rel-card h3{font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;line-height:1.45;color:var(--black);margin:0;}
@media(max-width:680px){.related-grid{grid-template-columns:1fr;}}
/* Coming-soon list cards (unpublished articles — no dead # link) */
.card.soon{opacity:.62;}
.card.soon .cover{pointer-events:none;cursor:default;}
.card.soon .card-media .ph{filter:grayscale(.4);}
.soon-badge{display:inline-block;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;
  letter-spacing:.06em;color:var(--g600);border:1px solid var(--g300);border-radius:999px;
  padding:2px 10px;margin-top:var(--s3);}

/* ── Article blockquote (引言區塊) ── */
.article blockquote{font-family:var(--serif);font-size:var(--fs-lead);line-height:1.6;color:var(--black);
  border-left:3px solid var(--brand);margin:var(--s8) 0;padding:var(--s1) 0 var(--s1) var(--s5);}
/* ── Reusable article table (desktop table → ≤600px card rows) ── */
.art-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:var(--s8) 0;}
.art-table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:var(--fs-meta);min-width:520px;}
.art-table th{text-align:left;font-weight:600;color:var(--black);border-bottom:2px solid var(--black);padding:var(--s2) var(--s3) var(--s2) 0;}
.art-table td{color:var(--g700);border-bottom:1px solid var(--g300);padding:var(--s3) var(--s3) var(--s3) 0;vertical-align:top;}
.art-table td.ct-head{font-weight:600;color:var(--black);}
@media(max-width:600px){
  .art-tablewrap{overflow-x:visible;}
  .art-table{min-width:0;}
  .art-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
  .art-table tr{display:block;border:1px solid var(--g300);border-radius:var(--radius);padding:var(--s4);margin-bottom:var(--s4);}
  .art-table td{display:block;border:0;padding:0;}
  .art-table td.ct-head{font-size:var(--fs-body);padding-bottom:var(--s3);margin-bottom:var(--s3);border-bottom:1px solid var(--g300);}
  .art-table td[data-label]{margin-top:var(--s3);}
  .art-table td[data-label]::before{content:attr(data-label);display:block;font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;color:var(--g500);margin-bottom:2px;}
}

/* brand logo mark in header lockup */
.brand-mark .brand-logo{height:28px;width:auto;display:block;flex:none;}
@media(max-width:600px){.brand-mark .brand-logo{height:24px;}}

/* Footer brand lockup (logo + copyright) */
.foot-brand{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;}
.foot-brand .foot-logo{height:32px;width:auto;flex:none;display:block;}
.foot-brand .copy{margin:0;}
@media (max-width:680px){.foot-brand{gap:var(--s2);}.foot-brand .foot-logo{height:26px;}}


/* ═══════════════════════════════════════════════════════════════
   關稅雷達 — 全站側邊抽屜（樣式；markup＋JS 由 js/site.js 注入）
   首頁 index.html 為自含內聯版，本段供其餘 41 頁共用
   ═══════════════════════════════════════════════════════════════ */
  .tradar-tab{position:fixed;right:0;top:42%;z-index:60;display:flex;flex-direction:column;align-items:center;gap:6px;
    background:#9C2A1A;color:rgba(255,255,255,.92);border:0;cursor:pointer;padding:11px 6px;border-radius:5px 0 0 5px;
    writing-mode:vertical-rl;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:2px;
    box-shadow:-2px 3px 10px rgba(0,0,0,.18);opacity:.9;transition:transform .2s,background .2s,opacity .2s;}
  .tradar-tab:hover{background:var(--brand);opacity:1;transform:translateX(-3px);}
  /* 標籤上的迷你掃描盤 — 抽屜內 .tr-scope 的縮小預告，白底紅 tab 上以白線呈現 */
  .tradar-tab .td-scope{writing-mode:horizontal-tb;position:relative;flex:none;width:15px;height:15px;border-radius:50%;overflow:hidden;
    border:1px solid rgba(255,255,255,.55);
    background-image:radial-gradient(circle,transparent 0 42%,rgba(255,255,255,.5) 42% 49%,transparent 49%);}
  .tradar-tab .td-scope::before,.tradar-tab .td-scope::after{content:'';position:absolute;background:rgba(255,255,255,.42);}
  .tradar-tab .td-scope::before{top:0;bottom:0;left:50%;width:1px;transform:translateX(-.5px);}
  .tradar-tab .td-scope::after{left:0;right:0;top:50%;height:1px;transform:translateY(-.5px);}
  .tradar-tab .td-sweep{position:absolute;inset:0;border-radius:50%;
    background:conic-gradient(from 0deg,rgba(255,255,255,.9),rgba(255,255,255,0) 82deg);
    animation:tr-spin 3.2s linear infinite;}
  .tradar-tab .td-blip{position:absolute;top:29%;left:61%;width:3px;height:3px;border-radius:50%;background:#fff;opacity:0;
    box-shadow:0 0 4px rgba(255,255,255,.95);animation:tr-blink 3.2s linear infinite;animation-delay:.4s;}
  @keyframes tdpulse{0%{box-shadow:0 0 0 0 rgba(220,65,43,.5);}70%{box-shadow:0 0 0 8px rgba(220,65,43,0);}100%{box-shadow:0 0 0 0 rgba(220,65,43,0);}}
  .tradar-bd{position:fixed;inset:0;background:rgba(0,0,0,.34);z-index:69;opacity:0;visibility:hidden;transition:opacity .25s;}
  .tradar-bd.open{opacity:1;visibility:visible;}
  .tradar-panel{position:fixed;top:0;right:0;height:100%;width:368px;max-width:88vw;z-index:70;background:var(--white);
    box-shadow:-6px 0 30px rgba(0,0,0,.24);transform:translateX(100%);transition:transform .3s cubic-bezier(.2,.7,.2,1);
    display:flex;flex-direction:column;}
  .tradar-panel.open{transform:translateX(0);}
  .tradar-hd{position:relative;padding:24px 22px 18px;border-bottom:1px solid var(--g300);}
  .tradar-hd .tr-top{display:flex;align-items:center;gap:14px;margin-bottom:15px;}
  .tradar-hd .tr-kis{min-width:0;}
  .tradar-hd .td-k{display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;
    letter-spacing:.12em;color:var(--brand);margin:0 0 5px;}
  .tradar-hd .td-k .dot{width:8px;height:8px;border-radius:50%;background:var(--brand);animation:tdpulse 2.2s ease-out infinite;}
  /* 雷達掃描盤 — 同心圓刻度 + 旋轉掃描線 + blip 光點，純黑白紅 */
  .tr-scope{position:relative;flex:none;width:66px;height:66px;border-radius:50%;overflow:hidden;
    border:1px solid var(--g300);background:var(--white);
    background-image:
      radial-gradient(circle,transparent 0 30%,var(--g300) 30% 31%,transparent 31%),
      radial-gradient(circle,transparent 0 61%,var(--g300) 61% 62%,transparent 62%);}
  .tr-scope::before,.tr-scope::after{content:'';position:absolute;background:var(--g300);}
  .tr-scope::before{top:0;bottom:0;left:50%;width:1px;transform:translateX(-.5px);}
  .tr-scope::after{left:0;right:0;top:50%;height:1px;transform:translateY(-.5px);}
  .tr-sweep{position:absolute;inset:0;border-radius:50%;
    background:conic-gradient(from 0deg,rgba(220,65,43,.32),rgba(220,65,43,0) 64deg);
    animation:tr-spin 3.2s linear infinite;}
  .tr-blip{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--brand);opacity:0;
    box-shadow:0 0 6px rgba(220,65,43,.85);animation:tr-blink 3.2s linear infinite;}
  .tr-blip.b1{top:27%;left:61%;animation-delay:.35s;}
  .tr-blip.b2{top:59%;left:37%;animation-delay:1.55s;}
  .tr-blip.b3{top:64%;left:66%;animation-delay:2.35s;}
  @keyframes tr-spin{to{transform:rotate(360deg);}}
  @keyframes tr-blink{0%,100%{opacity:0;}6%{opacity:1;}42%{opacity:.12;}}
  @keyframes tr-ping{0%{box-shadow:0 0 0 0 rgba(220,65,43,.5);}70%{box-shadow:0 0 0 7px rgba(220,65,43,0);}100%{box-shadow:0 0 0 0 rgba(220,65,43,0);}}
  .tr-status{display:flex;align-items:center;gap:6px;margin:0;font-family:var(--sans);font-size:var(--fs-eyebrow);
    font-weight:500;letter-spacing:.04em;color:var(--g600);}
  .tr-status::before{content:'';flex:none;width:6px;height:6px;border-radius:50%;background:var(--brand);animation:tr-ping 1.8s ease-out infinite;}
  .tradar-hd h3{font-family:var(--sans);font-size:var(--fs-lead);font-weight:600;color:var(--black);margin:0 0 7px;line-height:1.35;}
  .tradar-hd .td-sub{font-family:var(--serif);font-size:var(--fs-meta);color:var(--g600);margin:0;line-height:1.55;}
  .tradar-x{position:absolute;top:16px;right:16px;width:32px;height:32px;border:1px solid var(--g300);background:none;
    border-radius:50%;cursor:pointer;font-size:var(--fs-lead);color:var(--g600);line-height:1;transition:.15s;}
  .tradar-x:hover{border-color:var(--black);color:var(--black);}
  .tradar-list{overflow-y:auto;flex:1;}
  .tradar-item{position:relative;display:block;padding:16px 22px;text-decoration:none;border-bottom:1px solid var(--bg);transition:background .15s;overflow:hidden;}
  .tradar-item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand);transform:scaleY(0);transform-origin:top;transition:transform .25s ease;}
  .tradar-item:hover{background:var(--bg);}
  .tradar-item:hover::before{transform:scaleY(1);}
  /* 清單逐筆「被偵測」淡入上浮 */
  .tradar-panel .tradar-item{opacity:0;transform:translateY(9px);}
  .tradar-panel.open .tradar-item{animation:tr-rise .42s cubic-bezier(.2,.7,.2,1) forwards;}
  .tradar-panel.open .tradar-item:nth-child(1){animation-delay:.14s;}
  .tradar-panel.open .tradar-item:nth-child(2){animation-delay:.20s;}
  .tradar-panel.open .tradar-item:nth-child(3){animation-delay:.26s;}
  .tradar-panel.open .tradar-item:nth-child(4){animation-delay:.32s;}
  @keyframes tr-rise{to{opacity:1;transform:none;}}
  .tradar-item .meta{display:flex;align-items:center;gap:8px;margin-bottom:7px;}
  .tradar-item .tag{font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;background:var(--black);color:#fff;padding:2px 9px;border-radius:999px;}
  .tradar-item .tag.edu{background:none;color:var(--g700);border:1px solid var(--g500);}
  .tradar-item .new{display:inline-flex;align-items:center;gap:5px;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:700;color:var(--brand);letter-spacing:.06em;}
  .tradar-item .new::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--brand);animation:tr-ping 1.8s ease-out infinite;}
  .tradar-item .date{font-family:var(--sans);font-size:var(--fs-eyebrow);color:var(--g500);margin-left:auto;}
  .tradar-item .ti{font-family:var(--sans);font-size:var(--fs-body);font-weight:600;line-height:1.5;color:var(--black);transition:color .15s;}
  .tradar-item:hover .ti{color:var(--brand);}
  .tradar-ft{padding:16px 22px;border-top:1px solid var(--g300);}
  .tradar-ft a{display:block;text-align:center;font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:#fff;
    background:var(--brand);padding:11px;border-radius:3px;text-decoration:none;transition:background .15s;}
  .tradar-ft a:hover{background:#b00000;}
  /* 面板底部電子報訂閱塊 — 開抽屜看關稅快訊的人，正是會想每月收情報的人 */
  .tradar-sub{padding:18px 22px;border-top:1px solid var(--g300);background:var(--surface-sub,#F4F4F4);}
  .tradar-sub .ts-k{display:flex;align-items:center;gap:7px;margin:0 0 6px;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.12em;color:var(--brand);}
  .tradar-sub .ts-k .ts-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--brand);animation:tr-ping 1.8s ease-out infinite;}
  .tradar-sub .ts-line{margin:0 0 12px;font-family:var(--serif);font-size:var(--fs-meta);line-height:1.55;color:var(--g700);}
  .tradar-sub .ts-form{display:flex;gap:7px;}
  .tradar-sub .ts-form input{flex:1;min-width:0;font-family:var(--sans);font-size:var(--fs-meta);padding:10px 12px;border:1px solid var(--g300);border-radius:3px;background:var(--white);color:var(--black);}
  .tradar-sub .ts-form input:focus{outline:none;border-color:var(--brand);}
  .tradar-sub .ts-form button{flex:none;font-family:var(--sans);font-size:var(--fs-meta);font-weight:600;color:#fff;background:var(--brand);border:0;padding:10px 16px;border-radius:3px;cursor:pointer;white-space:nowrap;transition:background .15s;}
  .tradar-sub .ts-form button:hover{background:#b00000;}
  .tradar-sub .ts-done{margin:0;font-family:var(--sans);font-size:var(--fs-meta);line-height:1.5;color:var(--g700);padding:6px 0 2px;}
  .tradar-sub .ts-done b{color:var(--brand);font-weight:600;}
  .tradar-sub .ts-more{display:inline-block;margin-top:13px;font-family:var(--sans);font-size:var(--fs-eyebrow);font-weight:600;letter-spacing:.04em;color:var(--g600);text-decoration:none;transition:color .15s;}
  .tradar-sub .ts-more:hover{color:var(--brand);}
  @media(max-width:560px){.tradar-tab{top:auto;bottom:128px;}}
  @media(prefers-reduced-motion:reduce){
    .tradar-tab .td-sweep,.tradar-tab .td-blip,.tradar-hd .td-k .dot,.tr-sweep,.tr-blip,.tr-status::before,.tradar-item .new::before{animation:none;}
    .tr-blip,.tradar-tab .td-blip{opacity:.7;}
    .tradar-panel,.tradar-bd{transition:none;}
    .tradar-panel .tradar-item{opacity:1;transform:none;}
    .tradar-panel.open .tradar-item{animation:none;}}

/* ── legal pages (shared) — 從 privacy/terms/cookies/accessibility 抽出，全站共用 ── */
  .legal{ max-width:780px; }
  .legal-meta{ font-family:var(--sans); font-size:var(--fs-meta); color:var(--g600); border-bottom:1px solid var(--g300); padding-bottom:var(--s4); margin-bottom:var(--s6); }
  .legal-intro{ font-family:var(--serif); font-size:var(--fs-lead); line-height:1.75; color:var(--g700); margin:0 0 var(--s8); }
  .legal-sec{ margin:0 0 var(--s8); }
  .legal-sec > h2{ font-family:var(--sans); font-size:var(--fs-lead); font-weight:700; color:var(--black); margin:0 0 var(--s3); padding-top:var(--s5); border-top:2px solid var(--black); display:flex; gap:.6em; }
  .legal-sec > h2 .n{ color:var(--brand); font-variant-numeric:tabular-nums; }
  .legal-sec h3{ font-family:var(--sans); font-size:var(--fs-body); font-weight:600; color:var(--black); margin:var(--s5) 0 var(--s2); }
  .legal-sec p{ font-family:var(--serif); font-size:var(--fs-body); line-height:1.8; color:var(--g700); margin:0 0 var(--s3); }
  .legal-sec ul{ margin:0 0 var(--s3) 1.1em; padding:0; }
  .legal-sec li{ font-family:var(--serif); font-size:var(--fs-body); line-height:1.8; color:var(--g700); margin:0 0 .4em; }
  .legal-sec b{ color:var(--black); }
  .legal-note{ background:transparent; border-left:3px solid var(--brand); padding:var(--s2) 0 var(--s2) var(--s4); margin:var(--s4) 0; font-family:var(--sans); font-size:var(--fs-meta); line-height:1.7; color:var(--g600); }
  .legal-toc{ font-family:var(--sans); font-size:var(--fs-meta); line-height:1.9; margin:0 0 var(--s8); padding:var(--s5); border:1px solid var(--g300); }
  .legal-toc strong{ display:block; font-size:var(--fs-meta); letter-spacing:.04em; text-transform:uppercase; color:var(--g600); margin-bottom:var(--s2); }
  .legal-toc a{ color:var(--g700); text-decoration:none; }
  .legal-toc a:hover{ color:var(--brand); }
  .legal-contact{ font-family:var(--sans); font-size:var(--fs-body); line-height:1.9; }
  .legal-contact b{ color:var(--black); }