/* ==========================================================================
   贝博艾弗森体育 · 共享样式 /assets/site.css
   夜间球场指挥台：墨绿基底 · 暗夜蓝分区 · 荧光橙行动点 · 电光青索引
   ========================================================================== */

/* ---------- 变量 ---------- */
:root{
  --ink:#061310;
  --night:#0B1B2B;
  --panel:#10241F;
  --line:#2B4A42;
  --text:#F5F7F2;
  --muted:#8FA39B;
  --orange:#FF6A1A;
  --cyan:#21E6C1;
  --red:#E23B2E;
  --yellow:#F5C518;

  --maxw:1280px;
  --gutter:clamp(16px,4vw,40px);
  --step:8px;
  --radius-pill:999px;
  --radius-card:14px;

  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --font-display:"Barlow Condensed","Oswald","Arial Narrow",var(--font-mono);

  --ease:cubic-bezier(.2,.7,.3,1);
  --shadow-float:0 22px 48px -30px rgba(0,0,0,.92);
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.75;
  color:var(--text);
  background-color:var(--ink);
  background-image:
    repeating-linear-gradient(0deg,rgba(43,74,66,.16) 0 1px,transparent 1px 96px),
    repeating-linear-gradient(90deg,rgba(43,74,66,.16) 0 1px,transparent 1px 96px),
    radial-gradient(1100px 620px at 84% -10%,rgba(33,230,193,.11),transparent 62%),
    radial-gradient(900px 540px at 2% 2%,rgba(255,106,26,.08),transparent 60%),
    linear-gradient(180deg,#061310 0%,#071512 46%,#061310 100%);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%;height:auto}
main{position:relative;z-index:1}
#main-content{scroll-margin-top:104px}
h1,h2,h3,h4,h5,p,ul,ol,figure,blockquote,address{margin:0}
ul,ol{padding-left:1.15em}
::selection{background:var(--cyan);color:#04110d}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:4px}

/* ---------- 排版 ---------- */
h1,h2,h3,h4,h5{font-weight:700;line-height:1.18;letter-spacing:-.01em;color:var(--text);margin:0 0 .55em}
h1{font-size:clamp(28px,4.4vw,42px)}
h2{font-size:clamp(22px,2.9vw,26px)}
h3{font-size:clamp(18px,2.2vw,20px)}
h4{font-size:16px}
p{margin:0 0 1em}
a{color:var(--cyan);text-decoration:none;transition:color .18s var(--ease)}
a:hover{color:#7BF4DE}
strong{font-weight:700;color:#FFFFFF}
small{font-size:.8125rem}
hr{border:0;border-top:1px solid var(--line);margin:clamp(24px,4vw,40px) 0}

.wrap{width:min(100% - var(--gutter) * 2, var(--maxw));margin-inline:auto}
.prose{max-width:36em;font-size:clamp(15px,1.6vw,17px);color:#DCE5DF}
.prose h2,.prose h3{margin-top:1.5em}
.prose p:last-child{margin-bottom:0}
.stack{display:grid;gap:calc(var(--step) * 2)}
.grid-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:calc(var(--step) * 2)}
.grid-12 > *{min-width:0}
.flow-grid{display:grid;gap:calc(var(--step) * 3);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cyan);margin:0 0 12px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--cyan);opacity:.7}
.index-num{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;
  color:var(--muted);font-variant-numeric:tabular-nums;
}
.display-num{
  font-family:var(--font-display);font-weight:700;line-height:.9;
  font-size:clamp(48px,8vw,96px);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;color:var(--text);
}
.section-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  border-bottom:1px dashed var(--line);padding-bottom:12px;margin-bottom:24px;
}
.section-head h2{margin:0}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 20px;border:1px solid transparent;border-radius:var(--radius-pill);
  font-family:var(--font-body);font-size:14px;font-weight:700;letter-spacing:.04em;
  text-decoration:none;cursor:pointer;
  transition:background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease);
}
.btn--primary{background:var(--orange);color:#0A0F0C;box-shadow:0 12px 26px -14px rgba(255,106,26,.9)}
.btn--primary:hover{background:#FF8342;color:#0A0F0C;transform:translateY(-1px)}
.btn--primary:active{transform:translateY(0)}
.btn--ghost{background:transparent;border-color:var(--line);color:var(--text)}
.btn--ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.btn--ghost:active{background:rgba(33,230,193,.08)}

/* ---------- 跳转链接 ---------- */
.skip-link{
  position:absolute;left:50%;top:8px;z-index:200;
  transform:translate(-50%,-180%);
  padding:10px 18px;border-radius:var(--radius-pill);
  background:var(--cyan);color:#04110d;font-size:14px;font-weight:700;
  transition:transform .18s var(--ease);
}
.skip-link:focus,.skip-link:focus-visible{transform:translate(-50%,0);color:#04110d}

/* ---------- 悬浮胶囊头部 ---------- */
.site-header{
  position:sticky;top:0;z-index:80;
  padding:14px var(--gutter) 8px;
  background:linear-gradient(180deg,rgba(6,19,16,.94),rgba(6,19,16,.55) 62%,rgba(6,19,16,0));
}
.header-shell{
  width:min(100%,var(--maxw));margin-inline:auto;
  display:flex;align-items:center;gap:clamp(10px,2vw,24px);
  min-height:66px;padding:0 10px 0 20px;
  background:linear-gradient(118deg,rgba(16,36,31,.94),rgba(11,27,43,.94));
  border:1px solid var(--line);border-radius:var(--radius-pill);
  box-shadow:var(--shadow-float),inset 0 1px 0 rgba(245,247,242,.06);
  transition:min-height .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease),box-shadow .22s var(--ease);
}
.site-header[data-scrolled="true"] .header-shell{
  min-height:54px;
  background:linear-gradient(118deg,rgba(16,36,31,.99),rgba(11,27,43,.99));
  border-color:#356054;
  box-shadow:0 18px 34px -26px rgba(0,0,0,1);
}
.site-header[data-open] .header-shell{border-color:rgba(33,230,193,.5)}

/* 品牌徽标 */
.brand{
  display:inline-flex;align-items:center;gap:10px;flex:none;
  color:var(--text);text-decoration:none;
}
.brand:hover{color:var(--text)}
.brand-mark{
  position:relative;flex:none;width:30px;height:30px;
  display:grid;place-items:center;overflow:hidden;
  border:1px solid var(--cyan);border-radius:9px;
  background:rgba(6,19,16,.6);
  transition:border-color .18s var(--ease),background .18s var(--ease);
}
.brand:hover .brand-mark{border-color:var(--orange);background:rgba(255,106,26,.1)}
.brand-mark__line{
  position:absolute;left:-8px;right:-8px;top:50%;height:1px;
  background:var(--cyan);opacity:.55;transform:rotate(-26deg);
}
.brand-mark__dot{
  position:relative;width:7px;height:7px;border-radius:50%;
  background:var(--orange);box-shadow:0 0 12px rgba(255,106,26,.9);
}
.brand-text{display:grid;gap:1px;line-height:1.15}
.brand-text__name{font-size:16px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.brand-text__meta{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap;
  transition:opacity .2s var(--ease);
}
.site-header[data-scrolled="true"] .brand-text__meta{opacity:.62}

/* 导航 */
.site-nav{display:flex;align-items:center;gap:10px;margin-left:auto}
.site-nav__list{
  list-style:none;display:flex;align-items:center;gap:2px;margin:0;padding:4px;
  background:rgba(6,19,16,.55);
  border:1px solid rgba(43,74,66,.75);border-radius:var(--radius-pill);
}
.site-nav__link{
  display:inline-flex;align-items:center;min-height:36px;padding:0 14px;
  border-radius:var(--radius-pill);
  font-size:14px;letter-spacing:.02em;color:var(--muted);text-decoration:none;white-space:nowrap;
  transition:color .18s var(--ease),background .18s var(--ease),box-shadow .18s var(--ease);
}
.site-nav__link:hover,.site-nav__link:focus-visible{
  color:var(--text);background:rgba(33,230,193,.1);
}
.site-nav__link[aria-current="page"]{
  color:var(--cyan);font-weight:700;background:rgba(33,230,193,.13);
  box-shadow:inset 0 0 0 1px rgba(33,230,193,.55);
}
.site-nav__cta{display:none}
.header-cta{flex:none}

/* 移动端开关 */
.nav-toggle{
  display:none;align-items:center;gap:8px;margin-left:auto;
  min-height:40px;padding:0 14px;
  border:1px solid var(--line);border-radius:var(--radius-pill);
  background:rgba(6,19,16,.55);color:var(--text);cursor:pointer;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  transition:border-color .18s var(--ease),color .18s var(--ease);
}
.nav-toggle:hover{border-color:var(--cyan);color:var(--cyan)}
.nav-toggle__bars{display:grid;gap:4px;width:18px}
.nav-toggle__bars span{
  display:block;height:2px;border-radius:2px;background:currentColor;
  transition:transform .2s var(--ease),opacity .16s linear;
}
.nav-toggle__text{line-height:1}
.site-header[data-open] .nav-toggle__bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.site-header[data-open] .nav-toggle__bars span:nth-child(2){opacity:0}
.site-header[data-open] .nav-toggle__bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* 滚动进度 */
.scroll-meter{
  width:min(100% - var(--gutter) * 0,var(--maxw));
  margin:10px auto 0;height:2px;border-radius:2px;overflow:hidden;
  background:rgba(43,74,66,.55);
}
.scroll-meter__bar{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--cyan),var(--orange));
  transition:width .12s linear;
}

/* ---------- 页脚 ---------- */
.site-footer{
  position:relative;z-index:1;
  margin-top:clamp(56px,9vw,112px);
  border-top:1px solid var(--line);
  background:linear-gradient(180deg,rgba(11,27,43,.72),rgba(6,19,16,.98) 72%);
}
.footer-shell{
  width:min(100% - var(--gutter) * 2,var(--maxw));margin-inline:auto;
  padding:clamp(36px,5.5vw,68px) 0 clamp(24px,3.5vw,40px);
  display:grid;grid-template-columns:minmax(240px,1fr) minmax(0,1.55fr);
  gap:clamp(28px,5vw,64px);align-items:start;
}
.footer-brand{display:grid;justify-items:start;gap:0;align-content:start}
.footer-brand .brand{margin-bottom:16px}
.footer-brand__meta{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cyan);margin:0 0 10px;
}
.footer-brand__note{
  font-size:14px;line-height:1.7;color:var(--muted);
  max-width:30em;margin:0 0 20px;
}
.footer-groups{
  display:grid;gap:clamp(20px,3vw,32px);
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.footer-group{min-width:0}
.footer-group__heading{
  font-family:var(--font-mono);font-size:11px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);margin:0 0 14px;
  padding-bottom:10px;border-bottom:1px solid rgba(43,74,66,.7);
}
.footer-group__list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.footer-group__link{
  display:inline-block;font-size:14.5px;color:#C9D6D0;text-decoration:none;
  transition:color .18s var(--ease),transform .18s var(--ease);
}
.footer-group__link:hover,.footer-group__link:focus-visible{color:var(--cyan);transform:translateX(2px)}
.footer-contact{font-style:normal;display:grid;gap:8px}
.footer-contact__line{
  font-size:14px;color:#C9D6D0;line-height:1.6;word-break:break-word;
}
.footer-contact__line:nth-child(-n+2){
  font-family:var(--font-mono);font-size:13px;letter-spacing:.02em;
  font-variant-numeric:tabular-nums;color:var(--text);
}
.footer-base{
  width:min(100% - var(--gutter) * 2,var(--maxw));margin-inline:auto;
  border-top:1px dashed rgba(43,74,66,.85);
  padding:16px 0 26px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.03em;color:var(--muted);
}
.footer-base__legal{margin:0}
.footer-base__links{list-style:none;display:flex;flex-wrap:wrap;gap:18px;margin:0;padding:0}
.footer-base__link{color:var(--muted);text-decoration:none;transition:color .18s var(--ease)}
.footer-base__link:hover,.footer-base__link:focus-visible{color:var(--cyan)}

/* ---------- 面板 / 索引组 / 标签 / 徽标 ---------- */
.panel{
  position:relative;padding:18px;
  background:linear-gradient(160deg,rgba(16,36,31,.92),rgba(11,27,43,.72));
  border:1px solid var(--line);border-radius:var(--radius-card);
  transition:border-color .2s var(--ease),transform .2s var(--ease);
}
.panel:hover{border-color:#3C6A5F;transform:translateY(-2px)}
.panel__index{
  display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cyan);margin-bottom:10px;
}
.panel__title{font-size:17px;font-weight:700;margin:0 0 8px;line-height:1.35}
.panel__meta{font-size:13px;color:var(--muted);margin:0}

.tag{
  display:inline-flex;align-items:center;gap:6px;
  min-height:32px;padding:4px 13px;
  border:1px solid var(--line);border-radius:var(--radius-pill);
  background:rgba(6,19,16,.6);color:var(--muted);
  font-size:13px;line-height:1.4;cursor:pointer;
  transition:color .18s var(--ease),border-color .18s var(--ease),background .18s var(--ease);
}
.tag:hover{color:var(--text);border-color:#3C6A5F}
.tag[aria-pressed="true"]{
  color:#04110d;font-weight:700;
  background:var(--cyan);border-color:var(--cyan);
  box-shadow:0 8px 20px -14px rgba(33,230,193,.9);
}
.badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:2px 8px;border-radius:4px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;line-height:1.6;white-space:nowrap;
}
.badge--red{background:var(--red);color:#150403}
.badge--yellow{background:var(--yellow);color:#1A1503}
.badge--outline{background:transparent;border:1px solid var(--line);color:var(--muted)}

.index-group{
  border:1px solid var(--line);border-radius:var(--radius-card);
  background:rgba(16,36,31,.6);overflow:hidden;
  transition:border-color .2s var(--ease);
}
.index-group + .index-group{margin-top:10px}
.index-group[open]{border-color:#3C6A5F}
.index-group__summary{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;cursor:pointer;list-style:none;
  font-size:15.5px;font-weight:700;color:var(--text);
  transition:background .18s var(--ease);
}
.index-group__summary::-webkit-details-marker{display:none}
.index-group__summary:hover{background:rgba(33,230,193,.06)}
.index-group__mark{
  margin-left:auto;flex:none;width:18px;height:18px;position:relative;
  transition:transform .22s var(--ease);
}
.index-group__mark::before,
.index-group__mark::after{
  content:"";position:absolute;left:50%;top:50%;background:var(--cyan);
  transform:translate(-50%,-50%);
}
.index-group__mark::before{width:12px;height:1px}
.index-group__mark::after{width:1px;height:12px}
.index-group[open] .index-group__mark{transform:rotate(45deg)}
.index-group__body{
  padding:14px 16px 16px;font-size:14.5px;color:var(--muted);
  border-top:1px dashed var(--line);
}
.index-group__body p:last-child{margin-bottom:0}

/* ---------- 面包屑 ---------- */
.breadcrumbs{font-family:var(--font-mono);font-size:12px;letter-spacing:.04em;color:var(--muted)}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.breadcrumbs li{display:inline-flex;align-items:center;gap:8px}
.breadcrumbs li + li::before{content:"/";color:var(--line)}
.breadcrumbs a{color:var(--muted);text-decoration:none}
.breadcrumbs a:hover,.breadcrumbs a:focus-visible{color:var(--cyan)}
.breadcrumbs [aria-current="page"]{color:var(--text)}

/* ---------- 响应式图片容器（页面阶段放置占位用） ---------- */
.media-frame{
  position:relative;overflow:hidden;
  border:1px solid var(--line);border-radius:var(--radius-card);
  background:linear-gradient(155deg,#0B1B2B,#10241F 70%,#0A1A16);
  aspect-ratio:16 / 9;
}
.media-frame > img,
.media-frame > video{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.72) brightness(.86);
}
.media-frame::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,19,16,0) 42%,rgba(6,19,16,.78) 100%);
}
.media-frame--wide{aspect-ratio:21 / 9}
.media-frame--square{aspect-ratio:1 / 1}
.media-frame--tall{aspect-ratio:3 / 4}
.media-frame__tag{position:absolute;left:10px;top:10px;z-index:2}
.media-frame__cap{
  position:absolute;left:14px;right:14px;bottom:12px;z-index:2;
  margin:0;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:#DCE5DF;
}

/* ---------- 显现动效 ---------- */
[data-anim="on"] .reveal{
  opacity:0;transform:translateY(12px);
  transition:opacity .28s var(--ease),transform .28s var(--ease);
  transition-delay:var(--reveal-delay,0ms);
}
[data-anim="on"] .reveal.is-visible{opacity:1;transform:none}

/* ---------- 平板 ---------- */
@media (max-width:1080px){
  .nav-toggle{display:inline-flex}
  .header-cta{display:none}
  .site-nav{
    position:absolute;left:0;right:0;top:calc(100% + 6px);
    margin:0 var(--gutter);
    display:flex;flex-direction:column;align-items:stretch;gap:12px;
    padding:14px;border:1px solid var(--line);border-radius:22px;
    background:linear-gradient(160deg,rgba(16,36,31,.99),rgba(11,27,43,.99));
    box-shadow:var(--shadow-float);
    max-height:calc(100vh - 130px);overflow-y:auto;
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);
    transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s;
  }
  [data-nav][data-open]{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .site-nav__list{
    flex-direction:column;align-items:stretch;gap:2px;
    padding:0;background:none;border:0;border-radius:0;
  }
  .site-nav__link{
    justify-content:flex-start;min-height:48px;padding:0 14px;
    border-radius:12px;font-size:15px;color:var(--text);
  }
  .site-nav__link[aria-current="page"]{
    color:var(--cyan);box-shadow:inset 0 0 0 1px rgba(33,230,193,.5);
  }
  .site-nav__cta{display:inline-flex;width:100%}
  body[data-nav-lock]{overflow:hidden}

  .footer-shell{grid-template-columns:1fr;gap:clamp(24px,4vw,40px)}
  .grid-12{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* ---------- 手机 ---------- */
@media (max-width:720px){
  body{font-size:15.5px}
  .site-header{padding:10px var(--gutter) 6px}
  .header-shell{min-height:58px;padding:0 8px 0 14px;border-radius:20px}
  .site-header[data-scrolled="true"] .header-shell{min-height:52px}
  .brand-text__name{font-size:15px}
  .brand-text__meta{font-size:9px;letter-spacing:.1em}
  .nav-toggle__text{display:none}
  .nav-toggle{padding:0 12px}
  .scroll-meter{margin-top:8px}
  .site-nav{top:calc(100% + 2px);margin:0 var(--gutter);border-radius:18px}
  .footer-shell{padding-top:32px}
  .footer-groups{grid-template-columns:1fr 1fr}
  .footer-base{flex-direction:column;align-items:flex-start}
  .section-head{flex-direction:column;align-items:flex-start;gap:6px}
  .grid-12{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:420px){
  .brand-text__meta{display:none}
  .footer-groups{grid-template-columns:1fr}
}

/* ---------- 动效降级 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  [data-anim="on"] .reveal{opacity:1;transform:none}
  .site-nav{transition:none}
  .panel:hover{transform:none}
  .footer-group__link:hover{transform:none}
}