/* ============================================================
   LOVE体育 · 共享站点样式 /assets/site.css
   数字运动场：轨道导航 + 纵向叙事长卷
   ============================================================ */

/* ---------- 01 变量 ---------- */
:root{
  --c-green:#1F8A4C;
  --c-green-deep:#0E5A31;
  --c-orange:#FF6A1F;
  --c-lime:#E8FF3A;
  --c-ink:#0B1B33;
  --c-ink-2:#16304F;
  --c-paper:#F7F8F4;
  --c-mist:#D7E3D9;
  --c-magenta:#FF2E7E;
  --c-cyan:#5FE0C0;

  --tx:#10233B;
  --tx-soft:#4C637A;
  --tx-invert:#F7F8F4;
  --tx-invert-soft:#A8BED6;

  --ln:#CDDACF;
  --ln-strong:#A9BFB2;
  --ln-dark:rgba(247,248,244,.16);

  --f-display:"HarmonyOS Sans SC","Source Han Sans SC","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --f-body:"PingFang SC","HarmonyOS Sans SC","Noto Sans SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;

  --rail-w:272px;
  --bar-h:64px;
  --maxw:1120px;
  --pad:clamp(16px,4vw,32px);
  --ease:cubic-bezier(.22,.61,.36,1);
  --sh-card:0 1px 0 rgba(11,27,51,.05),0 18px 34px -26px rgba(11,27,51,.55);
}

/* ---------- 02 Reset & 基础 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--bar-h) + 20px);
}
body{
  margin:0;
  background:var(--c-paper);
  color:var(--tx);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.8;
  letter-spacing:.01em;
  overflow-x:hidden;
}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,blockquote,dl,dd,dt,pre{margin:0}
ul,ol{padding:0;list-style:none}
img,svg,video{max-width:100%;display:block}
button{font:inherit;color:inherit}
a{color:var(--c-green-deep)}
strong{font-weight:700}
table{border-collapse:collapse;width:100%}

h1,h2,h3,h4,h5,h6{
  font-family:var(--f-display);
  font-weight:900;
  line-height:1.24;
  letter-spacing:-.02em;
  color:var(--tx);
}
h1{font-size:clamp(30px,6vw,46px)}
h2{font-size:clamp(24px,4vw,32px)}
h3{font-size:clamp(19px,2.6vw,24px)}
h4{font-size:clamp(17px,2.2vw,20px)}

#main-content{display:block;padding-top:var(--bar-h)}

.skip-link{
  position:fixed;
  top:10px;left:10px;z-index:200;
  transform:translateY(-220%);
  padding:10px 16px;
  background:var(--c-lime);
  color:var(--c-ink);
  font-family:var(--f-display);
  font-weight:900;
  font-size:14px;
  text-decoration:none;
  border:2px solid var(--c-ink);
  border-radius:2px;
  transition:transform .18s var(--ease);
}
.skip-link:focus{transform:translateY(0)}

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

.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}
.mono{font-family:var(--f-mono);font-weight:600;letter-spacing:.02em}
.label{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-soft)}

/* ---------- 03 布局工具 ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}

.section{padding-block:clamp(40px,7vw,88px)}
.section--tight{padding-block:clamp(26px,4vw,48px)}
.section--paper{background:var(--c-paper)}
.section--mist{background:linear-gradient(180deg,#EEF4EE 0%,var(--c-mist) 100%)}
.section--ink{background:linear-gradient(160deg,var(--c-ink-2) 0%,var(--c-ink) 100%);color:var(--tx-invert)}
.section--ink h1,.section--ink h2,.section--ink h3,.section--ink h4{color:var(--tx-invert)}
.section--ink .lead{color:var(--tx-invert-soft)}

.section__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 16px;margin-bottom:clamp(18px,3vw,30px)}
.section__num{
  font-family:var(--f-mono);font-weight:600;font-size:13px;letter-spacing:.14em;
  color:var(--c-green-deep);
  padding-left:10px;
  border-left:3px solid var(--c-orange);
}
.section--ink .section__num{color:var(--c-lime)}
.section__title{font-size:clamp(22px,3.6vw,30px)}

.lead{font-size:clamp(17px,2.4vw,20px);line-height:1.75;color:var(--tx-soft);max-width:62ch}

.grid{display:grid;gap:clamp(16px,2.5vw,28px);grid-template-columns:1fr}
.grid--2{grid-template-columns:1fr}
.grid--3{grid-template-columns:1fr}
.grid--4{grid-template-columns:repeat(2,1fr)}

.stack{display:flex;flex-direction:column;gap:clamp(12px,2vw,20px)}

.rule{height:1px;border:0;background:var(--ln);margin:0}
.rule--dashed{background:none;border-top:1px dashed var(--ln-strong)}

/* ---------- 04 按钮 / 标签 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;
  font-family:var(--f-display);font-weight:700;font-size:15px;line-height:1.2;letter-spacing:.02em;
  text-decoration:none;
  border:1px solid transparent;border-radius:2px;
  cursor:pointer;
  transition:transform .18s var(--ease),background-color .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--c-green);color:#fff;box-shadow:0 12px 24px -18px rgba(14,90,49,.95)}
.btn--primary:hover{background:var(--c-green-deep)}
.btn--cta{background:var(--c-orange);color:#170A03;box-shadow:3px 3px 0 rgba(232,255,58,.75)}
.btn--cta:hover{background:#FF8347;transform:translate(-1px,-1px);box-shadow:5px 5px 0 rgba(232,255,58,.85)}
.btn--ghost{background:transparent;color:var(--tx-invert);border-color:var(--ln-dark)}
.btn--ghost:hover{border-color:var(--c-lime);color:var(--c-lime)}
.btn--line{background:transparent;color:var(--c-green-deep);border-color:var(--c-green)}
.btn--line:hover{background:var(--c-green);color:#fff}
.btn--block{width:100%}

.tag{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.08em;
  padding:3px 9px;border-radius:2px;
  background:var(--c-mist);color:var(--c-green-deep);
  border:1px solid var(--ln-strong);
}
.tag--lime{background:var(--c-lime);color:var(--c-ink);border-color:transparent}
.tag--orange{background:var(--c-orange);color:#170A03;border-color:transparent}
.tag--dark{background:var(--c-ink-2);color:var(--c-lime);border-color:rgba(232,255,58,.35)}

/* ---------- 05 面包屑 ---------- */
.crumbs{margin:0 0 clamp(14px,2vw,22px)}
.crumbs__list{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--f-mono);font-size:12px;letter-spacing:.08em}
.crumbs__list li{display:flex;align-items:center;gap:8px}
.crumbs__list li + li::before{content:"/";color:var(--c-orange)}
.crumbs a{color:var(--tx-soft);text-decoration:none}
.crumbs a:hover{color:var(--c-green-deep);text-decoration:underline;text-underline-offset:3px}
.crumbs [aria-current="page"]{color:var(--tx);font-weight:600}
.section--ink .crumbs a{color:var(--tx-invert-soft)}

/* ---------- 06 色带 ---------- */
.band{
  position:relative;
  padding-block:clamp(28px,5vw,54px);
  background:linear-gradient(120deg,var(--c-green) 0%,var(--c-green-deep) 100%);
  color:var(--tx-invert);
  clip-path:polygon(0 22px,100% 0,100% calc(100% - 22px),0 100%);
}
.band--ink{background:linear-gradient(120deg,var(--c-ink-2) 0%,var(--c-ink) 100%)}
.band--lime{background:linear-gradient(120deg,var(--c-lime) 0%,#CBE400 100%);color:var(--c-ink)}
.band h2,.band h3,.band p{color:inherit}
.band .lead{color:inherit;opacity:.9}

/* ---------- 07 面板 / 数据 ---------- */
.panel{
  position:relative;
  background:#fff;
  border:1px solid var(--ln);
  border-radius:2px;
  padding:clamp(18px,3vw,28px);
  box-shadow:var(--sh-card);
}
.panel--paper{background:linear-gradient(180deg,#FFFFFF 0%,#FAFBF6 100%)}
.panel--dark{
  background:linear-gradient(160deg,var(--c-ink-2) 0%,var(--c-ink) 100%);
  color:var(--tx-invert);
  border-color:rgba(232,255,58,.22);
}
.panel--dark h2,.panel--dark h3,.panel--dark h4{color:var(--tx-invert)}
.panel--accent{border-left:4px solid var(--c-green)}
.panel--stack{box-shadow:7px 7px 0 rgba(215,227,217,.95),var(--sh-card)}

.stat{display:flex;flex-direction:column;gap:4px}
.stat__num{font-family:var(--f-mono);font-weight:600;font-size:clamp(26px,5vw,40px);line-height:1;letter-spacing:-.01em;color:var(--c-green-deep)}
.stat__num--lime{color:var(--c-lime)}
.stat__num--orange{color:var(--c-orange)}
.stat__label{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;color:var(--tx-soft)}
.panel--dark .stat__label,.section--ink .stat__label{color:var(--tx-invert-soft)}

/* ---------- 08 图片容器（页面阶段使用） ---------- */
.media{
  position:relative;
  display:block;
  width:100%;
  overflow:hidden;
  background:linear-gradient(135deg,#E6EFE7 0%,var(--c-mist) 100%);
  border:1px solid var(--ln);
  border-radius:2px;
}
.media > img,.media > video{display:block;width:100%;height:100%;object-fit:cover}
.media--16x9{aspect-ratio:16/9}
.media--3x2{aspect-ratio:3/2}
.media--4x3{aspect-ratio:4/3}
.media--1x1{aspect-ratio:1/1}
.media--3x4{aspect-ratio:3/4}
.media--wide{aspect-ratio:21/9}
.media--slant{clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 28px))}
.media--framed{padding:8px;background:#fff}
.media--ph::after{
  content:"";
  position:absolute;inset:0;
  background-image:repeating-linear-gradient(135deg,rgba(31,138,76,.14) 0 2px,transparent 2px 14px);
  pointer-events:none;
}
.media__caption{margin-top:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:var(--tx-soft)}
.section--ink .media__caption{color:var(--tx-invert-soft)}

/* ---------- 09 正文 ---------- */
.prose{max-width:68ch;font-size:16px;line-height:1.85}
.prose > * + *{margin-top:1.05em}
.prose h2{
  font-size:clamp(22px,3.4vw,28px);
  margin-top:1.9em;
  padding-left:14px;
  border-left:4px solid var(--c-green);
}
.prose h3{font-size:clamp(18px,2.6vw,22px);margin-top:1.6em}
.prose a{color:var(--c-green-deep);text-decoration:underline;text-underline-offset:3px}
.prose ul li{position:relative;padding-left:20px;margin-top:.5em}
.prose ul li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:8px;height:8px;background:var(--c-lime);
  border:1px solid var(--c-green-deep);transform:rotate(45deg);
}
.prose ol{counter-reset:prose}
.prose ol li{counter-increment:prose;position:relative;padding-left:36px;margin-top:.5em}
.prose ol li::before{
  content:counter(prose,decimal-leading-zero);
  position:absolute;left:0;top:.1em;
  font-family:var(--f-mono);font-weight:600;font-size:13px;color:var(--c-orange);
}
.prose blockquote{
  padding:12px 18px;border-left:4px solid var(--c-orange);
  background:#fff;font-size:17px;
}
.section--ink .prose{color:var(--tx-invert)}
.section--ink .prose h2{border-left-color:var(--c-lime)}

/* ---------- 10 折叠面板 ---------- */
.fold{border:1px solid var(--ln);border-radius:2px;background:#fff;overflow:hidden}
.fold + .fold{margin-top:12px}
.fold[data-open="true"]{border-color:var(--c-green)}
.fold__btn{
  display:flex;width:100%;align-items:center;justify-content:space-between;gap:14px;
  padding:16px 18px;background:none;border:0;text-align:left;
  font-family:var(--f-display);font-weight:700;font-size:17px;color:var(--tx);
  cursor:pointer;
  transition:background-color .18s var(--ease);
}
.fold__btn:hover{background:#F1F6F1}
.fold__btn::after{
  content:"+";flex:none;line-height:1;
  font-family:var(--f-mono);font-size:20px;color:var(--c-green);
  transition:transform .22s var(--ease),color .22s var(--ease);
}
.fold[data-open="true"] .fold__btn::after{transform:rotate(45deg);color:var(--c-orange)}
.fold__panel{overflow:hidden;max-height:0;transition:max-height .34s var(--ease)}
.fold[data-open="true"] .fold__panel{max-height:80rem}
.fold__inner{padding:0 18px 18px;font-size:15.5px;line-height:1.85;color:var(--tx-soft)}

/* ---------- 11 显现动效 ---------- */
html.has-js [data-reveal]{
  opacity:0;transform:translateY(8px);
  transition:opacity .32s var(--ease),transform .32s var(--ease);
}
html.has-js [data-reveal].is-in{opacity:1;transform:none}

/* ============================================================
   12 头部：移动端状态条 + 全屏抽屉
   ============================================================ */
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:90;
  background:linear-gradient(180deg,var(--c-ink) 0%,#102A48 100%);
  color:var(--tx-invert);
  border-bottom:1px solid var(--ln-dark);
}
.site-header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:var(--bar-h);
  padding:8px 16px;
}

/* 品牌 */
.brand{display:inline-flex;align-items:center;gap:10px;min-width:0;text-decoration:none;color:inherit}
.brand__mark{
  position:relative;flex:none;
  width:34px;height:34px;
  display:grid;place-items:center;
  background:linear-gradient(140deg,var(--c-green) 0%,var(--c-green-deep) 100%);
  color:var(--c-lime);
  font-family:var(--f-display);font-weight:900;font-size:16px;line-height:1;
  border-radius:2px;
  transform:skewX(-6deg);
  box-shadow:3px 3px 0 rgba(255,46,126,.55);
}
.brand__mark > span{display:block;transform:skewX(6deg)}
.brand__text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.brand__name{font-family:var(--f-display);font-weight:900;font-size:18px;letter-spacing:-.02em;color:var(--tx-invert)}
.brand__topic{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--tx-invert-soft);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* 移动导航按钮 */
.nav-toggle{
  display:inline-flex;align-items:center;gap:9px;
  flex:none;
  padding:8px 12px;
  background:transparent;color:var(--tx-invert);
  border:1px solid var(--ln-dark);border-radius:2px;
  font-size:13px;letter-spacing:.08em;
  cursor:pointer;
  transition:border-color .18s var(--ease),color .18s var(--ease);
}
.nav-toggle:hover{border-color:var(--c-lime);color:var(--c-lime)}
.nav-toggle__bars{display:inline-flex;flex-direction:column;gap:4px;width:16px}
.nav-toggle__bars span{display:block;height:2px;background:var(--c-lime);border-radius:2px;transition:transform .2s var(--ease),opacity .2s var(--ease)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-toggle__text{font-family:var(--f-mono);font-size:12px;letter-spacing:.1em}

/* 抽屉导航 */
.rail-nav{
  position:fixed;
  top:var(--bar-h);left:0;right:0;bottom:0;
  display:flex;flex-direction:column;gap:22px;
  padding:24px 20px 40px;
  overflow-y:auto;
  background-color:var(--c-ink);
  background-image:
    linear-gradient(160deg,rgba(31,138,76,.38) 0%,rgba(11,27,51,0) 58%),
    repeating-linear-gradient(115deg,rgba(247,248,244,.045) 0 1px,transparent 1px 20px);
  transform:translateY(-14px);
  opacity:0;visibility:hidden;
  transition:opacity .26s var(--ease),transform .26s var(--ease),visibility .26s linear;
}
.rail-nav[data-open="true"]{transform:none;opacity:1;visibility:visible}

.rail-nav__caption{
  font-family:var(--f-mono);font-size:11px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--c-lime);
}
.rail-nav__list{display:flex;flex-direction:column;gap:2px}
.rail-nav__item{position:relative}
.rail-nav__link{
  display:flex;align-items:baseline;gap:12px;
  padding:12px 12px 12px 14px;
  color:var(--tx-invert);text-decoration:none;
  font-family:var(--f-display);font-weight:700;font-size:17px;letter-spacing:-.01em;
  border-left:2px solid transparent;
  border-radius:0 2px 2px 0;
  transition:color .18s var(--ease),background-color .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease);
}
.rail-nav__link:hover,.rail-nav__link:focus-visible{
  background:rgba(31,138,76,.22);
  border-left-color:var(--c-lime);
  transform:translateX(3px);
}
.rail-nav__link[aria-current="page"]{
  color:var(--c-lime);
  border-left-color:var(--c-lime);
  background:linear-gradient(90deg,rgba(232,255,58,.16) 0%,rgba(232,255,58,0) 100%);
}
.rail-nav__idx{
  flex:none;min-width:2.2ch;
  font-family:var(--f-mono);font-size:11px;font-weight:600;letter-spacing:.06em;
  color:var(--tx-invert-soft);
  transition:color .18s var(--ease);
}
.rail-nav__link[aria-current="page"] .rail-nav__idx{color:var(--c-orange)}
.rail-nav__label{min-width:0}

.rail-nav__foot{
  margin-top:auto;
  display:flex;flex-direction:column;gap:12px;
  padding-top:18px;
  border-top:1px dashed var(--ln-dark);
}
.header-status{
  display:flex;align-items:center;gap:8px;
  font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--tx-invert-soft);
}
.header-status__dot{
  flex:none;width:7px;height:7px;border-radius:50%;
  background:var(--c-lime);
  box-shadow:0 0 0 3px rgba(232,255,58,.18);
  animation:statusPulse 2.4s ease-in-out infinite;
}
@keyframes statusPulse{0%,100%{opacity:1}50%{opacity:.35}}

/* 滚动进度 */
.rail-progress{
  position:absolute;
  left:0;right:0;bottom:0;height:2px;
  background:rgba(247,248,244,.12);
  overflow:hidden;
}
.rail-progress__bar{
  display:block;width:100%;height:100%;
  background:linear-gradient(90deg,var(--c-green) 0%,var(--c-lime) 55%,var(--c-orange) 100%);
  transform:scaleX(var(--progress,0));
  transform-origin:left center;
}

/* 返回顶部 */
.to-top{
  position:fixed;right:16px;bottom:18px;z-index:70;
  width:46px;height:46px;
  display:grid;place-items:center;
  background:var(--c-ink);color:var(--c-lime);
  border:1px solid rgba(232,255,58,.42);border-radius:50%;
  font-size:17px;line-height:1;
  cursor:pointer;
  box-shadow:0 12px 26px -14px rgba(11,27,51,.8);
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .24s var(--ease),transform .24s var(--ease),visibility .24s linear,background-color .18s var(--ease);
}
.to-top[data-visible="true"]{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--c-green);color:#fff}

@media (max-width:1023.98px){
  body.is-nav-open{overflow:hidden}
}

/* ============================================================
   13 页脚：深空蓝斜切 + 四栏
   ============================================================ */
.site-footer{
  position:relative;
  margin-top:clamp(40px,7vw,84px);
  padding:clamp(64px,9vw,104px) 0 26px;
  background:
    radial-gradient(120% 70% at 10% 0%,rgba(31,138,76,.42) 0%,rgba(31,138,76,0) 62%),
    linear-gradient(180deg,var(--c-ink) 0%,#08131F 100%);
  color:var(--tx-invert);
  clip-path:polygon(0 42px,100% 0,100% 100%,0 100%);
}
.footer__inner{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}

.footer__top{display:grid;gap:clamp(26px,4vw,44px);grid-template-columns:1fr}

.footer-brand{border-bottom:1px dashed var(--ln-dark);padding-bottom:20px}
.footer-brand__name{font-family:var(--f-display);font-weight:900;font-size:clamp(26px,5vw,32px);letter-spacing:-.02em;color:var(--tx-invert)}
.footer-brand__topic{
  display:inline-block;margin-top:10px;
  padding:3px 10px;
  background:var(--c-lime);color:var(--c-ink);
  font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.08em;
  transform:skewX(-6deg);
}
.footer-brand__topic > span{display:inline-block;transform:skewX(6deg)}
.footer-brand__note{margin-top:16px;max-width:36ch;font-size:14.5px;line-height:1.85;color:var(--tx-invert-soft)}

.footer__cols{display:grid;gap:clamp(18px,3vw,30px);grid-template-columns:1fr}

.footer-col__title{
  margin:0;
  font-family:var(--f-mono);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--c-lime);
}
.footer-col__btn{
  display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;
  padding:0;margin:0;
  background:none;border:0;
  font:inherit;color:inherit;text-align:left;
  cursor:pointer;
}
.footer-col__btn::after{
  content:"+";flex:none;line-height:1;font-size:16px;color:var(--c-lime);
  transition:transform .22s var(--ease);
}
.footer-col[data-open="true"] .footer-col__btn::after{transform:rotate(45deg)}

.footer-col__list{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.footer-col__list a{
  display:inline-block;
  color:var(--tx-invert-soft);font-size:15px;text-decoration:none;
  border-bottom:1px solid transparent;padding-bottom:2px;
  transition:color .18s var(--ease),border-color .18s var(--ease);
}
.footer-col__list a:hover,.footer-col__list a:focus-visible{color:var(--c-lime);border-bottom-color:var(--c-lime)}

.contact-list{display:grid;gap:14px;margin-top:16px}
.contact-list__row{display:grid;gap:3px}
.contact-list dt{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;color:var(--c-lime)}
.contact-list dd{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14.5px;line-height:1.6;color:var(--tx-invert)}
.contact-list__text{word-break:break-all}
.copy-btn{
  flex:none;
  padding:2px 8px;
  background:transparent;color:var(--tx-invert-soft);
  border:1px solid var(--ln-dark);border-radius:2px;
  font-family:var(--f-mono);font-size:11px;font-weight:600;letter-spacing:.08em;
  cursor:pointer;
  transition:color .18s var(--ease),border-color .18s var(--ease),background-color .18s var(--ease);
}
.copy-btn:hover{border-color:var(--c-lime);color:var(--c-lime)}
.copy-btn[data-copied="true"]{background:var(--c-lime);color:var(--c-ink);border-color:var(--c-lime)}

.footer-legal{
  margin-top:clamp(28px,4vw,44px);
  padding-top:18px;
  border-top:1px dashed var(--ln-dark);
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;
  font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:var(--tx-invert-soft);
}
.footer-legal__item--icp{color:var(--c-lime)}

/* ---------- 14 响应式 ---------- */
@media (max-width:359.98px){
  .brand__topic{display:none}
}

@media (min-width:720px){
  .grid--2{grid-template-columns:repeat(2,1fr)}
  .grid--3{grid-template-columns:repeat(3,1fr)}
  .grid--4{grid-template-columns:repeat(4,1fr)}
  .grid--offset > *:nth-child(even){margin-top:clamp(12px,2.6vw,34px)}
  .footer__cols{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:767.98px){
  .footer-col{padding:14px 0;border-bottom:1px solid var(--ln-dark)}
  .footer-col--static{border-bottom:1px solid var(--ln-dark)}
  .footer-col--static .footer-col__title{color:var(--c-lime)}
  .footer-col__list{
    overflow:hidden;
    max-height:0;
    margin-top:0;
    transition:max-height .3s var(--ease),margin-top .3s var(--ease);
  }
  .footer-col[data-open="true"] .footer-col__list{max-height:14rem;margin-top:12px}
  .footer-col--static .contact-list{margin-top:14px}
}

@media (min-width:1024px){
  body{padding-left:var(--rail-w)}
  html{scroll-padding-top:28px}
  #main-content{padding-top:0}

  .site-header{
    right:auto;bottom:0;
    width:var(--rail-w);
    border-bottom:0;
    border-right:1px solid var(--ln-dark);
    background:
      radial-gradient(90% 38% at 50% 0%,rgba(31,138,76,.42) 0%,rgba(31,138,76,0) 72%),
      linear-gradient(180deg,var(--c-ink) 0%,#08131F 100%);
  }
  .site-header__inner{
    height:100%;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:22px;
    padding:26px 22px 24px;
  }
  .brand{padding-bottom:20px;border-bottom:1px solid var(--ln-dark)}
  .brand__mark{width:38px;height:38px;font-size:18px}
  .brand__name{font-size:19px}
  .brand__topic{font-size:11.5px}
  .nav-toggle{display:none}

  .rail-nav{
    position:static;
    inset:auto;
    flex:1 1 auto;
    min-height:0;
    gap:16px;
    padding:0;
    overflow:visible;
    background:none;
    background-color:transparent;
    transform:none;opacity:1;visibility:visible;
  }
  .rail-nav[data-open="true"]{transform:none;opacity:1;visibility:visible}
  .rail-nav__link{font-size:18px;padding:10px 12px 10px 14px}
  .rail-nav__foot{border-top-style:solid}

  .rail-progress{left:auto;right:0;top:0;bottom:0;width:3px;height:auto}
  .rail-progress__bar{
    width:100%;height:100%;
    transform:scaleY(var(--progress,0));
    transform-origin:top center;
    background:linear-gradient(180deg,var(--c-green) 0%,var(--c-lime) 55%,var(--c-orange) 100%);
  }

  .to-top{right:26px;bottom:26px;width:50px;height:50px}

  .footer__top{grid-template-columns:300px 1fr;align-items:start}
  .footer__cols{grid-template-columns:repeat(4,1fr)}
  .footer-brand{border-bottom:0;padding-bottom:0}
  .footer-col__btn{pointer-events:none;cursor:default}
  .footer-col__btn::after{display:none}
  .footer-col__list{max-height:none}
}

@media (min-width:1280px){
  :root{--maxw:1200px;--rail-w:288px}
}

/* ---------- 15 无障碍与动效降级 ---------- */
@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.has-js [data-reveal]{opacity:1;transform:none}
  .rail-nav{transition:none}
}
