/* ============================================================
   SinoHealthGateway 设计系统 —— 承 T06 v2.0 WEBSITE_DESIGN_SYSTEM
   唯一色源 = P5 石墨缎墨（5 色）；派生中性色仅由透明度/明度派生。
   禁用：金色/黄铜、鲜红、鲜绿、橙、奶油、浅暖底、彩虹渐变。
   ============================================================ */

:root{
  /* P5 石墨缎墨 */
  --shg-ink-900:#161A20;
  --shg-ink-800:#1F2937;
  --shg-ink-600:#475569;
  --shg-ink-400:#6B7280;
  --shg-accent:#0E7490;
  /* 派生中性色 */
  --shg-surface:#FFFFFF;
  --shg-surface-subtle:#F4F6F8;
  --shg-border:#DDE3E9;
  /* 状态色（仅系统提示） */
  --shg-alert-info:#0E7490;
  --shg-alert-caution:#8A6D1F;
  --shg-alert-block:#7F1D1D;
  /* 字阶（1.250 Major Third，基准 16px） */
  --fs-display:40px; --lh-display:1.2;
  --fs-h1:32px;      --lh-h1:1.25;
  --fs-h2:25px;      --lh-h2:1.3;
  --fs-h3:20px;      --lh-h3:1.4;
  --fs-body:16px;    --lh-body:1.65;
  --fs-small:14px;   --lh-small:1.6;
  --fs-caption:12px; --lh-caption:1.5;
  /* 8pt 间距 */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px;
  --radius:6px;
  --content-max:1140px;
}

*{box-sizing:border-box}
/* 注意：不使用 scroll-behavior:smooth —— 它会破坏整页截图拼接与部分辅助技术定位 */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"PT Sans",Arial,
    "Noto Sans SC","Microsoft YaHei",sans-serif;
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  color:var(--shg-ink-800);
  background:var(--shg-surface);
}
/* 数字等宽 */
table, .num, .fee-table td{font-variant-numeric:tabular-nums}

a{color:var(--shg-accent)}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--shg-accent);outline-offset:2px}
h1,h2,h3{color:var(--shg-ink-800);font-weight:700}
h1{font-size:var(--fs-h1);line-height:var(--lh-h1);margin:var(--sp-2) 0 var(--sp-3)}
h2{font-size:var(--fs-h2);line-height:var(--lh-h2);margin:var(--sp-7) 0 var(--sp-3)}
h3{font-size:var(--fs-h3);line-height:var(--lh-h3);margin:var(--sp-5) 0 var(--sp-2)}
p{margin:0 0 var(--sp-4)}
.lead{font-size:18px;color:var(--shg-ink-600);margin:0 0 var(--sp-4)}
.small{font-size:var(--fs-small);color:var(--shg-ink-400)}
.caption{font-size:var(--fs-caption);line-height:var(--lh-caption);color:var(--shg-ink-400)}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Header ---------- */
.site-header{background:var(--shg-ink-800);color:#fff}
.site-header .bar{max-width:var(--content-max);margin:0 auto;padding:0 var(--sp-5);
  display:flex;align-items:center;gap:var(--sp-5);min-height:64px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:var(--sp-3);color:#fff;font-weight:700;
  font-size:17px;letter-spacing:.02em;text-decoration:none}
.brand:hover{text-decoration:none}
.brand .mark{display:block;height:40px;width:auto}
.brand .mark svg{display:block;height:40px}
.brand .mark .kh{fill:#fff}
nav.main{display:flex;gap:var(--sp-4);flex-wrap:wrap;margin-left:auto}
nav.main a{color:#D7DEE6;font-size:var(--fs-small);text-decoration:none;padding:6px 2px}
nav.main a:hover{color:#fff;text-decoration:none}
nav.main a[aria-current="page"]{color:#fff;border-bottom:2px solid var(--shg-accent)}
.lang{display:flex;gap:6px}
.lang a{color:#9FB0C0;font-size:var(--fs-caption);border:1px solid #3B4A5A;border-radius:4px;
  padding:2px 8px;text-decoration:none}
.lang a[aria-current="true"]{color:#fff;border-color:var(--shg-accent);background:var(--shg-accent)}
.nav-toggle{display:none;margin-left:auto;background:none;border:1px solid #3B4A5A;
  border-radius:4px;color:#fff;font:inherit;font-size:var(--fs-small);padding:8px 12px}
@media (max-width:860px){
  .nav-toggle{display:block}
  nav.main{display:none;width:100%;flex-direction:column;gap:0;margin:0 0 var(--sp-3)}
  nav.main.open{display:flex}
  nav.main a{padding:12px 4px;border-bottom:1px solid #2c3a49}
  .lang{margin-left:0}
}

/* ---------- 布局 ---------- */
main{max-width:var(--content-max);margin:0 auto;padding:0 var(--sp-5) var(--sp-8)}
.crumb{font-size:var(--fs-small);color:var(--shg-ink-400);padding:var(--sp-4) 0 var(--sp-1)}
.crumb a{color:var(--shg-ink-400)}
.crumb [aria-current]{color:var(--shg-ink-600)}
section{margin-top:var(--sp-7)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
@media (max-width:860px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

/* ---------- Hero ---------- */
.hero{padding:var(--sp-5) 0 var(--sp-2)}
.hero .display{font-size:var(--fs-display);line-height:var(--lh-display);font-weight:700;
  color:var(--shg-ink-800);margin:0 0 var(--sp-3)}
.hero .sub{font-size:18px;color:var(--shg-ink-600);max-width:46em;margin:0 0 var(--sp-4)}
.cta-row{display:flex;gap:var(--sp-3);flex-wrap:wrap;margin:var(--sp-4) 0}

/* ---------- Buttons（每页 ≤1 个 Primary） ---------- */
.btn{display:inline-block;padding:11px 20px;min-height:44px;border-radius:var(--radius);
  font-weight:600;font-size:15px;line-height:1.35;border:1px solid transparent;
  text-decoration:none;text-align:center}
.btn:hover{text-decoration:none}
.btn.primary{background:var(--shg-accent);color:#fff}
.btn.primary:hover{background:#0c6580}
.btn.secondary{border-color:var(--shg-ink-600);color:var(--shg-ink-800);background:transparent}
.btn.secondary:hover{border-color:var(--shg-ink-800)}
.link-more{font-weight:600}
@media (max-width:720px){.btn{width:100%}}

/* ---------- Cards ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--sp-4);margin:var(--sp-4) 0;align-items:start}
.card{border:1px solid var(--shg-border);border-radius:var(--radius);padding:var(--sp-4);
  background:var(--shg-surface);display:flex;flex-direction:column;gap:var(--sp-2)}
.card h3{margin:0;font-size:17px}
.card p{margin:0;font-size:var(--fs-small);color:var(--shg-ink-600)}
.card .grow{flex:1}
.tag{display:inline-block;font-size:var(--fs-caption);color:var(--shg-ink-600);
  border:1px solid var(--shg-border);border-radius:10px;padding:1px 8px;align-self:flex-start}
.card .meta{font-size:var(--fs-small);color:var(--shg-ink-600)}
.card .meta b{color:var(--shg-ink-800)}
.card .three-part{border-top:1px solid var(--shg-border);padding-top:var(--sp-2);
  font-size:var(--fs-small);color:var(--shg-ink-600)}
.card .three-part dt{float:left;clear:left;width:7.5em;color:var(--shg-ink-400)}
.card .three-part dd{margin:0 0 2px var(7.5em);margin-left:7.5em}

/* ---------- 表格 ---------- */
.table-wrap{margin:var(--sp-4) 0}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.data{border-collapse:collapse;width:100%;font-size:var(--fs-small)}
table.data th{background:var(--shg-ink-800);color:#fff;text-align:left;
  padding:8px 10px;font-weight:600;white-space:nowrap}
table.data td{border-bottom:1px solid var(--shg-border);padding:8px 10px;vertical-align:top}
table.data tr:nth-child(even) td{background:var(--shg-surface-subtle)}
/* 费用双栏表：两轨并列、永不合并；移动端横向滚动，禁止压成单栏 */
.fee-dual{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin:var(--sp-4) 0}
.fee-dual .track{border:1px solid var(--shg-border);border-radius:var(--radius);padding:var(--sp-4);min-width:0}
.fee-dual .track h3{margin-top:0;font-size:16px}
.fee-dual .track ul{margin:0;padding-left:1.2em}
.fee-dual .track li{margin-bottom:4px}
.fee-dual .track .who{border-top:1px solid var(--shg-border);margin-top:var(--sp-3);
  padding-top:var(--sp-2);font-size:var(--fs-small)}
.fee-dual .track .who b{color:var(--shg-ink-800)}
@media (max-width:720px){
  /* 关键约束：双轨在移动端保持双栏（横向滚动），不得纵向堆叠 */
  .fee-dual{grid-template-columns:1fr 1fr;overflow-x:auto}
  .fee-dual .track{min-width:280px}
}

/* ---------- Alerts ---------- */
.alert{border-left:4px solid var(--shg-alert-info);background:#F0F5F7;
  padding:10px 14px;border-radius:0 4px 4px 0;margin:var(--sp-4) 0;font-size:15px}
.alert.caution{border-color:var(--shg-alert-caution);background:#F8F6EF}
.alert.block{border-color:var(--shg-alert-block);background:#F9F3F3}

/* ---------- 责任分工矩阵 / 流程 ---------- */
.matrix-wrap{overflow-x:auto}
.steps{list-style:none;padding:0;margin:var(--sp-4) 0;counter-reset:s}
.steps li{border-bottom:1px solid var(--shg-border);padding:10px 0;display:flex;gap:var(--sp-3)}
.steps li .no{color:var(--shg-accent);font-weight:700;min-width:2.2em;font-variant-numeric:tabular-nums}
.steps li .role{flex:0 0 9.5em;color:var(--shg-ink-400);font-size:var(--fs-small)}
.steps li .body{flex:1}
.steps li.human-check{background:#F8F6EF}
.steps li.human-check .no::after{content:" ⚑";color:var(--shg-alert-caution)}
.badge-human{display:inline-block;font-size:var(--fs-caption);color:var(--shg-alert-caution);
  border:1px dashed var(--shg-alert-caution);border-radius:4px;padding:1px 6px;white-space:nowrap}

/* ---------- FAQ ---------- */
.faq-list{margin:var(--sp-4) 0}
.faq-item{border-top:1px solid var(--shg-border);padding:var(--sp-3) 0}
.faq-item .q{font-weight:700;margin:0 0 6px}
.faq-item .a{color:var(--shg-ink-600);font-size:15px;margin:0}
.faq-item .a a{font-weight:600}
details.faq-item{border-top:1px solid var(--shg-border);padding:0}
details.faq-item summary{cursor:pointer;font-weight:700;padding:var(--sp-3) 0;list-style:none;position:relative}
details.faq-item summary::-webkit-details-marker{display:none}
details.faq-item summary::after{content:"+";position:absolute;right:4px;color:var(--shg-accent);font-weight:700}
details.faq-item[open] summary::after{content:"–"}
details.faq-item .a{padding:0 0 var(--sp-3)}
details.faq-item .a p{margin:0 0 6px}
.faq-nav{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:var(--sp-4) 0}
.faq-nav a{font-size:var(--fs-small);border:1px solid var(--shg-border);border-radius:14px;padding:3px 12px;text-decoration:none}

/* ---------- CTA 区块 ---------- */
.cta-block{border:1px solid var(--shg-border);border-radius:var(--radius);
  background:var(--shg-surface-subtle);padding:var(--sp-5);margin-top:var(--sp-7)}
.cta-block h2{margin:0 0 var(--sp-2);font-size:var(--fs-h3)}
.cta-block p{margin:0 0 var(--sp-3);color:var(--shg-ink-600);font-size:var(--fs-small)}

/* ---------- Trust 块（YMYL 信任件，6 字段） ---------- */
.trust{border:1px solid var(--shg-border);border-radius:var(--radius);background:var(--shg-surface-subtle);
  padding:var(--sp-4);font-size:13px;color:var(--shg-ink-600);margin-top:var(--sp-7)}
.trust h2{font-size:var(--fs-h3);margin:0 0 var(--sp-2)}
.trust dl{display:grid;grid-template-columns:170px 1fr;gap:4px 12px;margin:0}
.trust dt{color:var(--shg-ink-400)}
.trust dd{margin:0}
@media (max-width:560px){.trust dl{grid-template-columns:1fr}.trust dt{margin-top:6px}}

/* ---------- Footer ---------- */
.site-footer{background:var(--shg-ink-900);color:#9FB0C0;padding:var(--sp-6) var(--sp-5);font-size:13px;margin-top:var(--sp-8)}
.site-footer .in{max-width:var(--content-max);margin:0 auto;display:flex;gap:var(--sp-5);flex-wrap:wrap}
.site-footer .col{min-width:180px;flex:1}
.site-footer h3{color:#fff;font-size:var(--fs-small);margin:0 0 var(--sp-2)}
.site-footer a{color:#C7D3DE;text-decoration:none}
.site-footer a:hover{text-decoration:underline;color:#fff}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:6px}
.site-footer .legal{border-top:1px solid #2c3a49;margin-top:var(--sp-4);padding-top:var(--sp-3);
  font-size:var(--fs-caption);color:#7B8B9B}
/* 桌面端页眉单行（语言胶囊保持右侧） */
@media (min-width:861px){
  .site-header .bar{flex-wrap:nowrap}
  nav.main{flex-wrap:nowrap;gap:var(--sp-4)}
}

/* ---------- 表单（三段式） ---------- */
.form-progress{display:flex;gap:var(--sp-2);align-items:center;margin:var(--sp-4) 0;font-size:var(--fs-small);color:var(--shg-ink-400)}
.form-progress .dot{width:26px;height:26px;border-radius:50%;border:2px solid var(--shg-border);
  display:inline-flex;align-items:center;justify-content:center;font-weight:700;color:var(--shg-ink-400)}
.form-progress .dot.current{border-color:var(--shg-accent);color:var(--shg-accent)}
.form-progress .dot.done{border-color:var(--shg-accent);background:var(--shg-accent);color:#fff}
.form-progress .sep{flex:1;height:1px;background:var(--shg-border);min-width:16px}
form .step{border:1px solid var(--shg-border);border-radius:var(--radius);padding:var(--sp-4);margin:var(--sp-4) 0}
form .step > legend{font-weight:700;padding:0 6px;font-size:16px}
form .step .hint{font-size:var(--fs-small);color:var(--shg-ink-400);margin:0 0 var(--sp-2)}
.field{margin:var(--sp-3) 0}
.field > label{display:block;font-size:var(--fs-small);color:var(--shg-ink-600);margin-bottom:4px;font-weight:600}
.field .req{color:var(--shg-alert-block)}
.field input[type="text"],.field input[type="email"],.field input[type="tel"],
.field select,.field textarea{width:100%;padding:10px;border:1px solid var(--shg-border);
  border-radius:4px;font-size:15px;font-family:inherit;color:var(--shg-ink-800);background:#fff}
.field .note{font-size:var(--fs-caption);color:var(--shg-ink-400);margin-top:4px}
.field .error{display:none;color:var(--shg-alert-block);font-size:var(--fs-small);margin-top:4px}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--shg-alert-block)}
.field.invalid .error{display:block}
fieldset.consent{border:0;padding:0;margin:var(--sp-4) 0 0}
fieldset.consent legend{font-size:var(--fs-small);font-weight:600;color:var(--shg-ink-600);padding:0}
.chk{display:flex;gap:8px;align-items:flex-start;font-size:var(--fs-small);margin:var(--sp-4) 0;color:var(--shg-ink-800)}
.chk+.chk{margin-top:var(--sp-4)}
.chk input{width:18px;height:18px;flex:0 0 auto;margin-top:2px}
.chk label{font-weight:400}
.form-actions{display:flex;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-4)}
.form-status{margin:var(--sp-4) 0}
.form-status [role="alert"]{border-left:4px solid var(--shg-alert-block);background:#F9F3F3;padding:10px 14px;border-radius:0 4px 4px 0}
.form-status [role="status"]{border-left:4px solid var(--shg-alert-info);background:#F0F5F7;padding:10px 14px;border-radius:0 4px 4px 0}
/* 无 JS 时：三个 fieldset 全部可见；有 JS 时分步显示 */
body.js-enabled form.wizard .step{display:none}
body.js-enabled form.wizard .step.current{display:block}

/* ---------- 图示 ---------- */
figure.fig{margin:var(--sp-5) auto;max-width:560px}
figure.fig img{width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--shg-border);display:block}
figure.fig.dark img{border-color:transparent}
figure.fig figcaption{font-size:var(--fs-caption);color:var(--shg-ink-400);margin-top:6px}
figure.fig.side{float:right;width:320px;margin:0 0 var(--sp-4) var(--sp-5)}
@media (max-width:720px){figure.fig.side{float:none;width:100%;margin:var(--sp-4) 0}}

/* ---------- 待公示占位 ---------- */
.pending{color:var(--shg-alert-caution);font-style:italic}

/* ---------- 页面专用 ---------- */
.two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--sp-5)}
@media (max-width:860px){.two-col{grid-template-columns:1fr}}
.kv{border:1px solid var(--shg-border);border-radius:var(--radius);margin:var(--sp-4) 0}
.kv > div{display:grid;grid-template-columns:180px 1fr;border-top:1px solid var(--shg-border)}
.kv > div:first-child{border-top:0}
.kv dt{margin:0;padding:8px 12px;background:var(--shg-surface-subtle);color:var(--shg-ink-400);font-size:var(--fs-small)}
.kv dd{margin:0;padding:8px 12px;font-size:var(--fs-small)}
@media (max-width:560px){.kv > div{grid-template-columns:1fr}.kv dt{padding-bottom:0}}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--shg-accent);color:#fff;padding:8px 16px;z-index:99}
.skip-link:focus{left:0}