/* =========================================================
   金年汇指南 — 共享样式 / assets/site.css
   冰雪数字港 × 稳重服务台
   ========================================================= */

:root{
  --ice:#EEF4FB;
  --ice-2:#E1EBF7;
  --ice-deep:#0E2A4A;
  --ice-deep-2:#0B2039;
  --night:#131A33;
  --gold:#C9A227;
  --gold-light:#F2D280;
  --aurora:#37D7C4;
  --electric:#1FB6C1;
  --violet:#7B6CF6;
  --ink:#1B2430;
  --mist:#5A6B7B;
  --white:#FFFFFF;
  --gold-line:#E8D9A6;
  --line-soft:rgba(14,42,74,.12);
  --rail-w:268px;
  --radius-s:10px;
  --radius-m:16px;
  --radius-l:22px;
  --shadow-panel:0 18px 44px -34px rgba(14,42,74,.55);
  --font-sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans CJK SC",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-mono:"SFMono-Regular","JetBrains Mono","Cascadia Mono",Consolas,"Liberation Mono",Menlo,monospace;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}
html.nav-open,html.nav-open body{overflow:hidden;}

body{
  margin:0;
  background:var(--ice);
  color:var(--ink);
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.85;
  font-weight:400;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img,picture,svg,video{display:block;max-width:100%;}
button{font:inherit;color:inherit;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4,p,figure{overflow-wrap:break-word;margin:0;}
h1{font-size:clamp(32px,4.6vw,54px);font-weight:900;line-height:1.2;letter-spacing:-.01em;}
h2{font-size:clamp(23px,2.7vw,33px);font-weight:800;line-height:1.32;}
h3{font-size:19px;font-weight:700;line-height:1.5;}
::selection{background:rgba(201,162,39,.28);color:#1B2430;}

:focus-visible{outline:2px solid var(--electric);outline-offset:3px;border-radius:4px;}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- 头部：进度条 / 顶栏 / 侧边轨道 ---------- */

.skip-link{
  position:absolute;top:-72px;left:14px;z-index:200;
  padding:10px 18px;border-radius:0 0 12px 12px;
  background:var(--night);color:#FFF3D0;
  border:1px solid rgba(232,217,166,.45);border-top:0;
  font-size:14px;letter-spacing:.06em;
  transition:top .22s ease;
}
.skip-link:focus{top:0;}

.read-progress{
  position:fixed;top:0;left:0;right:0;height:2px;
  background:rgba(14,42,74,.09);
  z-index:130;pointer-events:none;
}
.read-progress__bar{
  display:block;height:100%;width:100%;
  transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--aurora),var(--electric) 34%,var(--gold-light) 72%,var(--gold));
  transition:transform .12s linear;
}

.brand{
  display:flex;align-items:center;gap:12px;
  text-decoration:none;color:inherit;
}
.brand__mark{
  flex:none;width:38px;height:38px;border-radius:11px;
  display:grid;place-items:center;
  font-family:var(--font-mono);font-size:15px;font-weight:700;color:#231B04;
  background:linear-gradient(140deg,#F6E2A8,#C9A227);
  box-shadow:0 8px 20px -10px rgba(201,162,39,.9),inset 0 0 0 1px rgba(255,255,255,.55);
}
.brand__text{display:flex;flex-direction:column;line-height:1.25;min-width:0;}
.brand__name{font-size:16px;font-weight:800;letter-spacing:.06em;color:#F2F7FD;}
.brand__tag{
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(55,215,196,.88);
}

.topbar{display:none;}

.nav-toggle{
  display:inline-flex;align-items:center;gap:9px;
  padding:9px 15px;border-radius:999px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(14,42,74,.18);
  color:var(--ice-deep);
  font-size:13.5px;letter-spacing:.1em;cursor:pointer;
  transition:border-color .25s ease,background-color .25s ease,color .25s ease;
}
.nav-toggle:hover{border-color:rgba(201,162,39,.7);color:#7A5F0A;}
.nav-toggle__bars{display:inline-flex;flex-direction:column;gap:4px;width:16px;}
.nav-toggle__bars i{
  display:block;height:1.5px;width:100%;border-radius:2px;
  background:currentColor;transition:transform .25s ease;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:first-child{transform:translateY(2.75px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars i:last-child{transform:translateY(-2.75px) rotate(-45deg);}

.rail{
  position:fixed;top:0;left:0;bottom:0;
  width:min(88vw,340px);
  display:flex;flex-direction:column;
  padding:26px 20px 30px;
  background:linear-gradient(178deg,var(--ice-deep-2) 0%,var(--ice-deep) 46%,var(--night) 100%);
  border-right:1px solid rgba(232,217,166,.2);
  box-shadow:26px 0 60px -34px rgba(11,32,57,.8);
  transform:translateX(-104%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;overscroll-behavior:contain;
  color:#DCE8F6;z-index:110;
}
.rail[data-open]{transform:translateX(0);}
.rail::-webkit-scrollbar{width:6px;}
.rail::-webkit-scrollbar-thumb{background:rgba(232,217,166,.24);border-radius:3px;}

.rail__head{flex:none;}
.rail__label{
  display:flex;align-items:center;gap:10px;
  margin:24px 0 0;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(55,215,196,.75);
}
.rail__label-mono{color:rgba(242,210,128,.92);}

.nav{flex:1 1 auto;margin-top:18px;}
.nav__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;}
.nav__item{margin:0;}
.nav__link{
  position:relative;
  display:flex;align-items:center;gap:12px;
  padding:11px 13px;border-radius:var(--radius-s);
  border:1px solid transparent;
  color:rgba(226,238,250,.78);
  font-size:15px;letter-spacing:.05em;
  transition:color .25s ease,background-color .25s ease,border-color .25s ease,transform .25s ease;
}
.nav__link:hover{
  color:#FFFFFF;transform:translateX(2px);
  background:rgba(55,215,196,.08);
  border-color:rgba(232,217,166,.26);
}
.nav__link[aria-current="page"]{
  color:#FFF6DC;
  background:linear-gradient(90deg,rgba(201,162,39,.24),rgba(201,162,39,.02));
  border-color:rgba(232,217,166,.42);
}
.nav__link[aria-current="page"]::before{
  content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,var(--gold-light),var(--gold));
}
.nav__num{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;
  color:rgba(55,215,196,.75);min-width:22px;
}
.nav__link[aria-current="page"] .nav__num{color:var(--gold-light);}
.nav__text{min-width:0;}

.rail__foot{flex:none;padding-top:6px;}
.rail__quick{display:flex;flex-direction:column;gap:8px;margin-top:12px;}
.quick-link{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:11px 14px;border-radius:12px;
  font-size:14px;font-weight:700;letter-spacing:.05em;
  color:#E9F2FC;
  border:1px solid rgba(232,217,166,.28);
  background:rgba(255,255,255,.04);
  transition:background-color .25s ease,border-color .25s ease,transform .25s ease,color .25s ease;
}
.quick-link::after{
  content:"→";font-family:var(--font-mono);font-size:13px;
  color:rgba(55,215,196,.9);transition:transform .25s ease;
}
.quick-link:hover{transform:translateX(2px);border-color:rgba(242,210,128,.65);background:rgba(242,210,128,.1);}
.quick-link:hover::after{transform:translateX(3px);}
.quick-link--gold{
  background:linear-gradient(135deg,rgba(242,210,128,.95),rgba(201,162,39,.95));
  color:#231B04;border-color:transparent;
  box-shadow:0 14px 30px -20px rgba(201,162,39,.95);
}
.quick-link--gold::after{color:#231B04;}
.quick-link--gold:hover{background:linear-gradient(135deg,#F7E4AE,#D5AE2F);border-color:transparent;}

.rail__meta{
  margin-top:16px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;
  color:rgba(226,238,250,.5);
}
.rail__readout{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-top:14px;padding-top:12px;
  border-top:1px solid rgba(232,217,166,.16);
  font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;
  color:rgba(226,238,250,.55);
}
.rail__readout-val{color:var(--aurora);}

.nav-scrim{
  position:fixed;inset:0;z-index:105;
  padding:0;border:0;cursor:pointer;
  background:rgba(14,42,74,.44);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
}
.nav-scrim[hidden]{display:none;}

@media (max-width:1023px){
  .topbar{
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    position:fixed;top:0;left:0;right:0;height:62px;padding:0 16px;
    background:rgba(238,244,251,.94);
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(14,42,74,.1);
    z-index:100;
  }
  body{padding-top:62px;}
  .brand--bar .brand__mark{width:32px;height:32px;border-radius:9px;font-size:13px;}
  .brand--bar .brand__name{color:var(--ice-deep);font-size:15px;}
  .brand--bar .brand__tag{color:#137C86;}
  .rail__head .brand{display:none;}
  .rail__label:first-child{margin-top:0;}
}

@media (min-width:1024px){
  body{padding-left:var(--rail-w);}
  .rail{
    width:var(--rail-w);
    transform:none;
    box-shadow:none;
    padding:30px 22px 26px;
    transition:none;
  }
  .rail::after{
    content:"";position:absolute;top:0;right:0;width:1px;height:100%;
    background:linear-gradient(180deg,rgba(55,215,196,.5),rgba(232,217,166,.34) 55%,transparent);
    pointer-events:none;
  }
}

/* ---------- 页脚 ---------- */

.site-footer{
  position:relative;
  margin-top:88px;
  background:linear-gradient(180deg,var(--ice-deep) 0%,#0B1B33 56%,var(--night) 100%);
  color:rgba(226,238,250,.82);
  overflow:hidden;
}
.site-footer::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(242,210,128,.75),rgba(55,215,196,.5),transparent);
}
.footer__aurora{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(58% 44% at 10% 0%,rgba(55,215,196,.16),transparent 62%),
    radial-gradient(46% 40% at 90% 100%,rgba(201,162,39,.17),transparent 64%);
}
.footer__inner{
  position:relative;z-index:1;
  max-width:1180px;margin:0 auto;
  padding:62px 32px 42px;
  display:grid;grid-template-columns:1.1fr 1.4fr 1fr;gap:48px;
}
.footer__brandline{font-size:17px;font-weight:800;letter-spacing:.05em;color:#F2F7FD;}
.footer__domain{
  margin-top:8px;
  font-family:var(--font-mono);font-size:13px;letter-spacing:.1em;
  color:var(--aurora);
}
.footer__icp{
  margin-top:6px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;
  color:rgba(226,238,250,.55);
}
.footer__note{
  margin-top:18px;max-width:40ch;
  font-size:13.5px;line-height:1.8;
  color:rgba(226,238,250,.6);
}
.footer__nav{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;
}
.footer__gtitle{
  font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-light);
}
.footer__links{
  list-style:none;margin:14px 0 0;padding:0;
  display:flex;flex-direction:column;gap:10px;
}
.footer__link{
  font-size:14.5px;letter-spacing:.04em;
  color:rgba(226,238,250,.74);
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:color .25s ease,border-color .25s ease;
}
.footer__link:hover{color:#FFF3D0;border-bottom-color:rgba(232,217,166,.6);}
.footer__links--contact{gap:16px;}
.footer__clabel{
  display:block;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(55,215,196,.72);
}
.footer__cvalue{
  display:block;margin-top:5px;
  font-size:13.5px;line-height:1.75;
  color:rgba(226,238,250,.7);
}
.copy-btn{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:5px;padding:0 0 2px;
  border:0;border-bottom:1px dashed rgba(55,215,196,.45);
  background:none;cursor:pointer;text-align:left;
  font-family:var(--font-mono);font-size:13px;letter-spacing:.04em;
  color:rgba(236,244,253,.92);
  transition:color .25s ease,border-color .25s ease;
}
.copy-btn::after{
  content:"复制";
  font-family:var(--font-sans);font-size:11px;letter-spacing:.08em;
  color:rgba(226,238,250,.45);
}
.copy-btn:hover{color:#FFF3D0;border-bottom-color:var(--gold);}
.copy-btn.is-copied{color:var(--aurora);border-bottom-color:var(--aurora);}
.copy-btn.is-copied::after{content:"";}
.footer__base{
  position:relative;z-index:1;
  max-width:1180px;margin:0 auto;
  padding:20px 32px 34px;
  border-top:1px solid rgba(232,217,166,.16);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;
  color:rgba(226,238,250,.5);
}

@media (max-width:1023px){
  .footer__inner{grid-template-columns:1fr 1fr;gap:36px;padding:48px 24px 34px;}
  .footer__brand{grid-column:1 / -1;}
  .footer__base{padding:18px 24px 30px;}
}
@media (max-width:700px){
  .footer__inner{grid-template-columns:1fr;gap:30px;padding:42px 18px 30px;}
  .footer__nav{grid-template-columns:1fr 1fr;gap:22px 18px;}
  .footer__base{padding:18px 18px 28px;font-size:11.5px;}
}

/* ---------- 通用排版与容器 ---------- */

.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 32px;}

.section{padding:56px 0;}
.section--tight{padding:32px 0;}
.section--night{
  background:linear-gradient(160deg,var(--ice-deep),var(--night));
  color:#E6EFFA;
}
.section--night .section__note{color:rgba(226,238,250,.68);}
.section__head{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:16px 28px;margin-bottom:30px;
}
.section__title{max-width:24ch;color:var(--ice-deep);}
.section--night .section__title{color:#F2F7FD;}
.section__note{max-width:48ch;font-size:15px;color:var(--mist);}

.page-head{padding:52px 0 30px;}
.page-head__eyebrow{margin-bottom:18px;}
.page-head__title{max-width:24ch;}
.page-head__lede{margin-top:20px;max-width:62ch;font-size:17.5px;color:var(--mist);}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;
  color:#12707A;
}
.eyebrow::before{
  content:"";width:26px;height:1px;
  background:linear-gradient(90deg,var(--gold),rgba(201,162,39,0));
}
.section--night .eyebrow{color:var(--aurora);}

.num{
  font-family:var(--font-mono);font-size:12.5px;letter-spacing:.14em;
  color:var(--gold);
}

.rule{
  height:1px;border:0;margin:0;
  background:linear-gradient(90deg,rgba(201,162,39,.55),rgba(232,217,166,.18) 45%,transparent);
}

.stack{display:flex;flex-direction:column;gap:20px;}
.stack--sm{gap:10px;}
.stack--lg{gap:34px;}
.cluster{display:flex;flex-wrap:wrap;align-items:center;gap:12px;}

.grid{display:grid;gap:24px;}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}

/* ---------- 组件 ---------- */

.panel{
  position:relative;
  background:var(--white);
  border:1px solid rgba(232,217,166,.7);
  border-radius:var(--radius-l);
  padding:26px 26px 24px;
  box-shadow:var(--shadow-panel);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.panel:hover{
  transform:translateY(-3px);
  border-color:rgba(201,162,39,.75);
  box-shadow:0 26px 54px -34px rgba(14,42,74,.6);
}
.panel--lift{transform:translateY(-8px);}
.panel--lift:hover{transform:translateY(-11px);}
.panel--night{
  background:linear-gradient(158deg,var(--night),var(--ice-deep));
  border-color:rgba(55,215,196,.24);
  color:#E6EFFA;
}
.panel--night h3,.panel--night h2{color:#F2F7FD;}

.tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border-radius:999px;
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;
  color:#12707A;background:rgba(55,215,196,.1);
  border:1px solid rgba(31,182,193,.35);
}
.tag--gold{color:#7A5F0A;background:rgba(242,210,128,.2);border-color:rgba(201,162,39,.45);}
.tag--violet{color:#4538BE;background:rgba(123,108,246,.12);border-color:rgba(123,108,246,.4);}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:13px 24px;border-radius:999px;
  font-size:15px;font-weight:700;letter-spacing:.05em;
  border:1px solid transparent;cursor:pointer;
  transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease,color .25s ease,border-color .25s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn--gold{
  background:linear-gradient(135deg,var(--gold-light),var(--gold));
  color:#241C05;
  box-shadow:0 14px 30px -18px rgba(201,162,39,.9);
}
.btn--gold:hover{box-shadow:0 20px 38px -18px rgba(201,162,39,.95);}
.btn--ghost{
  background:rgba(255,255,255,.72);
  border-color:rgba(14,42,74,.22);
  color:var(--ice-deep);
}
.btn--ghost:hover{border-color:var(--gold);color:#7A5F0A;}
.btn--ink{background:var(--night);color:#EAF3FF;}
.btn--ink:hover{background:var(--ice-deep);}

.breadcrumb{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;
  color:var(--mist);
}
.breadcrumb ol{
  display:flex;flex-wrap:wrap;gap:8px;
  list-style:none;margin:0;padding:0;
}
.breadcrumb li{display:flex;align-items:center;gap:8px;}
.breadcrumb li:not(:last-child)::after{content:"/";color:rgba(90,107,123,.5);}
.breadcrumb a{transition:color .25s ease;}
.breadcrumb a:hover{color:var(--electric);}
.breadcrumb [aria-current="page"]{color:var(--ice-deep);}

.media-frame{
  position:relative;overflow:hidden;
  border-radius:var(--radius-l);
  border:1px solid rgba(232,217,166,.55);
  background:linear-gradient(150deg,#16233E,var(--ice-deep) 55%,var(--night));
  box-shadow:0 26px 54px -36px rgba(11,27,51,.8);
}
.media-frame > img,
.media-frame > picture > img{
  display:block;width:100%;height:100%;
  object-fit:cover;object-position:center;
}
.media-frame--wide{aspect-ratio:16 / 9;}
.media-frame--tall{aspect-ratio:3 / 4;}
.media-frame--square{aspect-ratio:1 / 1;}
.media-frame__glow{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(118% 78% at 16% 10%,rgba(55,215,196,.22),transparent 56%),
    radial-gradient(88% 66% at 88% 92%,rgba(201,162,39,.24),transparent 60%);
}

/* ---------- 动效 ---------- */

html.js [data-reveal]{
  opacity:0;transform:translateY(12px);
  transition:opacity .4s ease,transform .4s ease;
}
html.js [data-reveal].is-visible{opacity:1;transform:none;}
html.js .panel[data-reveal].panel--lift.is-visible{transform:translateY(-8px);}

@media (max-width:560px){
  .wrap{padding:0 18px;}
  .page-head{padding:38px 0 24px;}
  .section{padding:42px 0;}
  .panel{padding:22px 20px 20px;border-radius:18px;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  html.js [data-reveal]{opacity:1 !important;transform:none !important;}
  .panel:hover,.panel--lift,.panel--lift:hover,.btn:hover,.nav__link:hover,.quick-link:hover{transform:none !important;}
}
