/* =========================================================
   金多宝中国站 · /assets/site.css
   共享层：reset / 变量 / 排版 / 组件 / 头部 / 页脚 / 响应式
   ========================================================= */

/* ---------- 1. 设计变量 ---------- */
:root{
  --gd-black:#0B0F0E;
  --gd-field:#10241C;
  --gd-grass:#1F7A4D;
  --gd-signal:#FFD166;
  --gd-data:#3D8BFD;
  --gd-red:#E5484D;
  --gd-teal:#2FD3B5;
  --gd-paper:#F5F7F4;
  --gd-gray:#9BA6A0;
  --gd-line:#24302B;

  --gd-radius-s:18px;
  --gd-radius-l:28px;
  --gd-shadow:0 12px 32px rgba(0,0,0,.35);

  --gd-font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gd-font-mono:"IBM Plex Mono","JetBrains Mono","Noto Sans Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --gd-s1:8px;  --gd-s2:16px; --gd-s3:24px;
  --gd-s4:40px; --gd-s5:64px; --gd-s6:96px;

  --gd-max:1280px;
  --gd-header-h:64px;
  --gd-ease:cubic-bezier(.2,.8,.2,1);
}

/* ---------- 2. reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--gd-black);
  color:var(--gd-paper);
  font-family:var(--gd-font-body);
  font-size:17px;
  font-weight:400;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-nav-open{overflow:hidden;}
img,svg,video{max-width:100%;height:auto;display:block;}
a{color:inherit;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}
[hidden]{display:none !important;}
hr{border:0;border-top:1px solid var(--gd-line);margin:var(--gd-s5) 0;}

:focus-visible{
  outline:2px solid var(--gd-signal);
  outline-offset:3px;
  border-radius:6px;
}

/* ---------- 3. 中文排版 ---------- */
h1,h2,h3,h4{margin:0;font-weight:900;letter-spacing:-.02em;line-height:1.05;}
h1{font-size:clamp(40px,7vw,96px);line-height:1.02;}
h2{font-size:clamp(28px,4.4vw,56px);}
h3{font-size:clamp(24px,2.6vw,32px);}
h4{font-size:22px;line-height:1.3;}
p{margin:0 0 var(--gd-s2);}
p:last-child{margin-bottom:0;}

.gd-prose{max-width:34em;font-weight:400;color:#DCE3DE;}
.gd-prose strong{color:var(--gd-paper);font-weight:500;}
.gd-mono{
  font-family:var(--gd-font-mono);
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
  font-size:.86em;
}
.gd-mono--data{color:var(--gd-data);}
.gd-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--gd-font-mono);
  font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gd-signal);
}
.gd-eyebrow::before{
  content:"";width:26px;height:1px;background:var(--gd-grass);
}

/* ---------- 4. 布局骨架 ---------- */
.gd-container{
  width:100%;max-width:var(--gd-max);
  margin-inline:auto;
  padding-inline:24px;
}
.gd-section{padding-block:clamp(56px,9vw,140px);}
.gd-section__head{
  display:flex;flex-wrap:wrap;align-items:flex-end;
  gap:var(--gd-s2) var(--gd-s4);
  margin-bottom:clamp(24px,4vw,56px);
}
.gd-section__head p{flex:1 1 320px;max-width:34em;color:var(--gd-gray);}

.gd-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--gd-s3);
}
.gd-col-3,.gd-col-4,.gd-col-5,.gd-col-6,.gd-col-7,.gd-col-8,.gd-col-9,.gd-col-12{grid-column:span 12;}
@media (min-width:720px){
  .gd-col-3{grid-column:span 6;}
  .gd-col-4{grid-column:span 6;}
  .gd-col-5{grid-column:span 12;}
  .gd-col-6{grid-column:span 6;}
  .gd-col-7{grid-column:span 12;}
  .gd-col-8{grid-column:span 12;}
  .gd-col-9{grid-column:span 12;}
  .gd-col-12{grid-column:span 12;}
}
@media (min-width:1040px){
  .gd-col-3{grid-column:span 3;}
  .gd-col-4{grid-column:span 4;}
  .gd-col-5{grid-column:span 5;}
  .gd-col-6{grid-column:span 6;}
  .gd-col-7{grid-column:span 7;}
  .gd-col-8{grid-column:span 8;}
  .gd-col-9{grid-column:span 9;}
  .gd-col-12{grid-column:span 12;}
}

/* 蓝图网格底纹：首屏与数据模块专用 */
.gd-blueprint{position:relative;isolation:isolate;}
.gd-blueprint::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(to right,var(--gd-line) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(36,48,43,.6) 1px,transparent 1px);
  background-size:96px 100%,100% 4px;
  opacity:.55;
}
.gd-blueprint > *{position:relative;z-index:1;}

/* ---------- 5. 通用组件 ---------- */
.gd-rule{height:1px;background:var(--gd-line);margin:var(--gd-s4) 0;}

.gd-panel{
  position:relative;
  background:var(--gd-field);
  border:1px solid var(--gd-line);
  border-radius:var(--gd-radius-l);
  padding:clamp(22px,2.6vw,32px);
  box-shadow:var(--gd-shadow);
}
.gd-panel__head{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:12px;margin-bottom:var(--gd-s3);
}
.gd-panel__title{font-size:22px;font-weight:700;letter-spacing:-.01em;line-height:1.3;}
.gd-panel--paper{
  background:var(--gd-paper);color:var(--gd-black);border-color:rgba(11,15,14,.12);
}
.gd-panel--paper .gd-panel__title{color:var(--gd-black);}
.gd-panel--paper .gd-mono{color:#3C4A44;}

.gd-index{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--gd-font-mono);font-size:13px;letter-spacing:.1em;
  color:var(--gd-signal);
}
.gd-index::after{content:"";width:18px;height:1px;background:var(--gd-grass);}

.gd-stat{display:grid;gap:4px;}
.gd-stat__value{
  font-family:var(--gd-font-mono);font-variant-numeric:tabular-nums;
  font-size:clamp(28px,3.4vw,44px);font-weight:600;line-height:1.1;
  color:var(--gd-signal);letter-spacing:-.01em;
}
.gd-stat__label{font-size:14px;color:var(--gd-gray);}

.gd-tag{
  display:inline-flex;align-items:center;
  padding:4px 10px;border-radius:999px;
  border:1px solid var(--gd-line);
  background:rgba(31,122,77,.16);
  color:#CFE6DA;
  font-size:13px;font-weight:500;line-height:1.5;
}
.gd-tag--data{border-color:rgba(61,139,253,.45);background:rgba(61,139,253,.14);color:#C9DEFF;}
.gd-tag--signal{border-color:rgba(255,209,102,.45);background:rgba(255,209,102,.14);color:var(--gd-signal);}

/* 按钮 */
.gd-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:12px;
  font-size:14px;font-weight:700;letter-spacing:.03em;
  text-decoration:none;white-space:nowrap;cursor:pointer;
  border:1px solid transparent;
  transition:transform .18s var(--gd-ease),background-color .18s var(--gd-ease),border-color .18s var(--gd-ease),color .18s var(--gd-ease);
}
.gd-btn--primary{background:var(--gd-signal);color:var(--gd-black);}
.gd-btn--primary:hover{transform:translateY(-2px);background:#FFDF8E;}
.gd-btn--grass{background:var(--gd-grass);color:var(--gd-paper);}
.gd-btn--grass:hover{transform:translateY(-2px);background:#268F5B;}
.gd-btn--ghost{border-color:var(--gd-line);color:var(--gd-paper);background:rgba(16,36,28,.6);}
.gd-btn--ghost:hover{border-color:var(--gd-grass);color:var(--gd-paper);transform:translateY(-2px);}
.gd-btn--small{padding:7px 14px;font-size:13px;border-radius:10px;}

/* 面包屑 */
.gd-breadcrumb{font-family:var(--gd-font-mono);font-size:13px;color:var(--gd-gray);}
.gd-breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;gap:10px;list-style:none;margin:0;padding:0;}
.gd-breadcrumb__item{display:flex;align-items:center;gap:10px;}
.gd-breadcrumb__item + .gd-breadcrumb__item::before{content:"/";color:var(--gd-line);}
.gd-breadcrumb__item a{text-decoration:none;color:var(--gd-gray);}
.gd-breadcrumb__item a:hover{color:var(--gd-signal);}
.gd-breadcrumb__item[aria-current="page"]{color:var(--gd-paper);}

/* 图片容器基础规则 */
.gd-figure{margin:0;}
.gd-media{
  position:relative;display:block;overflow:hidden;
  border-radius:var(--gd-radius-s);
  border:1px solid var(--gd-line);
  background:linear-gradient(155deg,var(--gd-field) 0%,#0A1712 60%,var(--gd-black) 100%);
  aspect-ratio:16 / 9;
}
.gd-media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(to right,rgba(36,48,43,.7) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(36,48,43,.5) 1px,transparent 1px);
  background-size:48px 100%,100% 48px;
  opacity:.5;
}
.gd-media > img,
.gd-media__img{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;
  display:block;
}
.gd-media--4x3{aspect-ratio:4 / 3;}
.gd-media--1x1{aspect-ratio:1 / 1;}
.gd-media--wide{aspect-ratio:21 / 9;}
.gd-figure__caption{
  margin-top:10px;
  font-family:var(--gd-font-mono);font-size:13px;line-height:1.6;color:var(--gd-gray);
}

/* 主题筛选条 */
.gd-filter{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  padding-bottom:var(--gd-s3);
  border-bottom:1px solid var(--gd-line);
  margin-bottom:var(--gd-s4);
}
.gd-filter__btn{
  padding:8px 16px;border-radius:999px;
  border:1px solid var(--gd-line);
  background:rgba(16,36,28,.5);
  color:var(--gd-gray);
  font-size:13px;font-weight:500;letter-spacing:.02em;
  transition:color .18s var(--gd-ease),border-color .18s var(--gd-ease),background-color .18s var(--gd-ease);
}
.gd-filter__btn:hover{color:var(--gd-paper);border-color:var(--gd-grass);}
.gd-filter__btn[aria-pressed="true"]{
  background:var(--gd-grass);border-color:var(--gd-grass);color:var(--gd-paper);
}
.gd-filter__count{
  margin:0 0 0 auto;
  font-family:var(--gd-font-mono);font-size:13px;color:var(--gd-gray);
}

/* 入场与脉冲 */
html.gd-js [data-reveal]{
  opacity:0;transform:translateY(12px);
  transition:opacity .24s var(--gd-ease),transform .24s var(--gd-ease);
}
html.gd-js [data-reveal].is-visible{opacity:1;transform:none;}

@keyframes gd-pulse{
  0%,100%{opacity:.92;}
  50%{opacity:1;}
}
.gd-pulse{animation:gd-pulse 3s ease-in-out infinite;}

/* ---------- 6. 头部 ---------- */
.gd-header{
  position:sticky;top:0;z-index:60;
  background:rgba(11,15,14,.9);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--gd-line);
}
.gd-header[data-open]{background:var(--gd-black);}

.gd-skip{
  position:absolute;left:20px;top:-120px;z-index:200;
  padding:10px 18px;border-radius:10px;
  background:var(--gd-signal);color:var(--gd-black);
  font-weight:700;font-size:14px;text-decoration:none;
  transition:top .18s var(--gd-ease);
}
.gd-skip:focus{top:12px;}

.gd-header__bar{
  position:relative;z-index:2;
  display:flex;align-items:center;gap:clamp(12px,2vw,28px);
  width:100%;max-width:var(--gd-max);
  min-height:var(--gd-header-h);
  margin-inline:auto;
  padding-inline:24px;
}

.gd-brand{
  display:inline-flex;align-items:center;gap:12px;
  flex:0 0 auto;text-decoration:none;color:var(--gd-paper);
}
.gd-brand__mark{
  display:grid;place-items:center;
  width:36px;height:36px;border-radius:11px;
  background:linear-gradient(135deg,var(--gd-grass),#14563A);
  border:1px solid rgba(47,211,181,.3);
  color:var(--gd-signal);
  font-family:var(--gd-font-mono);font-size:11px;font-weight:600;letter-spacing:.06em;
}
.gd-brand__text{display:flex;flex-direction:column;line-height:1.25;}
.gd-brand__name{font-size:15px;font-weight:700;letter-spacing:.02em;}
.gd-brand__meta{
  font-family:var(--gd-font-mono);font-size:11px;letter-spacing:.06em;color:var(--gd-gray);
}
.gd-brand__batch{
  flex:0 0 auto;
  padding:5px 12px;border-radius:999px;
  border:1px solid var(--gd-line);
  font-family:var(--gd-font-mono);font-size:12px;letter-spacing:.04em;
  color:var(--gd-gray);white-space:nowrap;
}
.gd-brand__batch b{color:var(--gd-data);font-weight:600;}

.gd-nav-toggle{
  display:none;align-items:center;gap:10px;
  margin-left:auto;
  padding:9px 14px;border-radius:12px;
  border:1px solid var(--gd-line);
  color:var(--gd-paper);
  font-family:var(--gd-font-mono);font-size:12.5px;letter-spacing:.08em;
}
.gd-nav-toggle__bars{
  position:relative;display:block;width:16px;height:2px;
  background:var(--gd-signal);border-radius:2px;
}
.gd-nav-toggle__bars::after{
  content:"";position:absolute;left:0;top:5px;width:16px;height:2px;
  background:var(--gd-signal);border-radius:2px;
  transition:transform .18s var(--gd-ease),top .18s var(--gd-ease);
}
.gd-header[data-open] .gd-nav-toggle{border-color:var(--gd-grass);}
.gd-header[data-open] .gd-nav-toggle__bars{background:var(--gd-grass);}
.gd-header[data-open] .gd-nav-toggle__bars::after{top:0;transform:rotate(90deg);background:var(--gd-grass);}

.gd-nav{
  display:flex;align-items:center;gap:clamp(8px,1.6vw,20px);
  margin-left:auto;
}
.gd-nav__list{
  display:flex;align-items:center;gap:2px;
  list-style:none;margin:0;padding:0;
}
.gd-nav__item{display:flex;}
.gd-nav__link{
  display:inline-flex;align-items:baseline;gap:7px;
  padding:9px 11px;border-radius:10px;
  border-bottom:2px solid transparent;
  color:var(--gd-gray);text-decoration:none;
  font-size:14px;font-weight:500;letter-spacing:.01em;
  transition:color .18s var(--gd-ease),background-color .18s var(--gd-ease),border-color .18s var(--gd-ease);
}
.gd-nav__index{
  font-family:var(--gd-font-mono);font-size:11px;letter-spacing:.06em;
  color:rgba(155,166,160,.65);
  transition:color .18s var(--gd-ease);
}
.gd-nav__link:hover{color:var(--gd-paper);background:var(--gd-field);}
.gd-nav__link:hover .gd-nav__index{color:var(--gd-teal);}
.gd-nav__link[aria-current="page"]{
  color:var(--gd-paper);
  background:rgba(31,122,77,.22);
  border-bottom-color:var(--gd-grass);
}
.gd-nav__link[aria-current="page"] .gd-nav__index{color:var(--gd-signal);}
.gd-nav__cta{padding:10px 18px;}

.gd-progress{
  position:absolute;left:0;right:0;bottom:-1px;height:2px;
  overflow:hidden;background:transparent;z-index:3;
}
.gd-progress__bar{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--gd-grass) 0%,var(--gd-teal) 55%,var(--gd-signal) 100%);
  transition:width .1s linear;
}

/* ---------- 7. 页脚 ---------- */
.gd-footer{
  margin-top:clamp(64px,10vw,140px);
  background:var(--gd-field);
  border-top:1px solid var(--gd-line);
  color:var(--gd-paper);
}
.gd-footer__inner{padding-block:clamp(36px,5vw,64px) clamp(24px,3.5vw,40px);}

.gd-footer__status{
  display:flex;flex-wrap:wrap;gap:10px 32px;
  padding-bottom:clamp(20px,3vw,32px);
  border-bottom:1px solid var(--gd-line);
  font-family:var(--gd-font-mono);font-size:12.5px;letter-spacing:.04em;color:var(--gd-gray);
}
.gd-footer__status b{color:var(--gd-signal);font-weight:600;}

.gd-footer__top{
  display:grid;
  grid-template-columns:minmax(240px,1fr) minmax(0,2.2fr);
  gap:clamp(28px,5vw,64px);
  padding-block:clamp(28px,4vw,48px);
}
.gd-footer__brand{display:grid;gap:var(--gd-s2);align-content:start;}
.gd-footer__note{
  max-width:30em;font-size:14px;line-height:1.75;color:var(--gd-gray);margin:0;
}
.gd-footer__cols{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,3vw,32px);
}
.gd-footer__title{
  font-size:15px;font-weight:700;letter-spacing:.02em;line-height:1.4;
  margin:0 0 14px;padding-left:12px;position:relative;
}
.gd-footer__title::before{
  content:"";position:absolute;left:0;top:.55em;
  width:3px;height:12px;background:var(--gd-grass);border-radius:2px;
}
.gd-footer__title a{color:var(--gd-paper);text-decoration:none;}
.gd-footer__title a:hover{color:var(--gd-signal);}
.gd-footer__list{
  list-style:none;margin:0;padding:0;
  display:grid;gap:8px;
  font-size:14px;line-height:1.6;color:var(--gd-gray);
}

.gd-footer__contact{
  display:flex;flex-wrap:wrap;gap:10px 36px;
  padding-block:var(--gd-s3);
  border-top:1px solid var(--gd-line);
  font-size:14px;color:var(--gd-gray);
}
.gd-footer__contact-line{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;}
.gd-footer__label{
  font-family:var(--gd-font-mono);font-size:12px;letter-spacing:.08em;
  color:var(--gd-paper);text-transform:uppercase;
}
.gd-footer__hint{flex:1 1 260px;margin:0;font-size:13.5px;}
.gd-footer__hint a{color:var(--gd-teal);text-decoration:none;border-bottom:1px solid rgba(47,211,181,.4);}
.gd-footer__hint a:hover{color:var(--gd-signal);border-bottom-color:var(--gd-signal);}

.gd-footer__legal{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;
  gap:12px 28px;
  padding-top:var(--gd-s3);
  border-top:1px solid var(--gd-line);
  font-family:var(--gd-font-mono);font-size:12.5px;line-height:1.7;color:var(--gd-gray);
}
.gd-footer__legal p{margin:0;}
.gd-footer__legal-links{display:flex;flex-wrap:wrap;gap:18px;}
.gd-footer__legal-links a{color:var(--gd-gray);text-decoration:none;border-bottom:1px solid transparent;}
.gd-footer__legal-links a:hover{color:var(--gd-signal);border-bottom-color:var(--gd-signal);}

/* ---------- 8. 响应式 ---------- */
@media (max-width:1100px){
  .gd-nav__link{padding:9px 8px;font-size:13.5px;}
  .gd-nav{gap:8px;}
  .gd-nav__cta{padding:9px 14px;font-size:13px;}
}

@media (max-width:960px){
  .gd-header__bar{padding-inline:18px;min-height:58px;}
  .gd-brand__batch{display:none;}
  .gd-nav-toggle{display:inline-flex;}

  .gd-nav{
    position:fixed;inset:0;z-index:1;
    display:block;
    margin:0;
    padding:84px 22px 40px;
    background:var(--gd-black);
    background-image:
      linear-gradient(to right,var(--gd-line) 1px,transparent 1px),
      linear-gradient(to bottom,rgba(36,48,43,.55) 1px,transparent 1px);
    background-size:64px 100%,100% 4px;
    overflow-y:auto;
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .2s var(--gd-ease),transform .2s var(--gd-ease),visibility .2s linear;
  }
  .gd-header[data-open] .gd-nav{opacity:1;visibility:visible;transform:none;}

  .gd-nav__list{display:grid;gap:0;}
  .gd-nav__item{display:block;}
  .gd-nav__link{
    display:flex;align-items:baseline;gap:16px;
    padding:18px 4px;border-radius:0;
    border-bottom:1px solid var(--gd-line);
    border-left:3px solid transparent;
    font-size:clamp(20px,5vw,26px);font-weight:700;letter-spacing:-.01em;
  }
  .gd-nav__link:hover{background:transparent;color:var(--gd-signal);}
  .gd-nav__index{font-size:13px;}
  .gd-nav__link[aria-current="page"]{
    background:transparent;
    border-bottom-color:var(--gd-line);
    border-left-color:var(--gd-grass);
    padding-left:14px;
  }
  .gd-nav__cta{width:100%;margin-top:var(--gd-s4);padding:15px 20px;font-size:15px;}

  .gd-footer__top{grid-template-columns:1fr;}
  .gd-footer__cols{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:560px){
  body{font-size:16px;}
  .gd-container{padding-inline:18px;}
  .gd-brand__meta{display:none;}
  .gd-panel{border-radius:var(--gd-radius-s);}
  .gd-footer__cols{grid-template-columns:1fr;gap:24px;}
  .gd-footer__contact{flex-direction:column;gap:10px;}
  .gd-footer__legal{flex-direction:column;align-items:flex-start;}
  .gd-filter__count{margin-left:0;flex-basis:100%;}
}

/* ---------- 9. 可访问性 ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  html.gd-js [data-reveal]{opacity:1 !important;transform:none !important;}
  .gd-progress__bar{transition:none;}
}