/* =========================================================
   三亿看台 · 共享样式 /assets/site.css
   视觉母题：赛博看台（夜色球场 + 导播画面 + 精密网格）
   ========================================================= */

/* ---------- 01 Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img,picture,svg,video{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
a{color:inherit;text-decoration:none}
table{border-collapse:collapse;border-spacing:0}
[hidden]{display:none!important}
:focus-visible{outline:2px solid #00E5D0;outline-offset:3px}

/* ---------- 02 Tokens ---------- */
:root{
  --ink-900:#070B14;
  --ink-800:#0E1626;
  --ink-700:#18233A;
  --teal-900:#06303A;
  --cyan-400:#00E5D0;
  --orange-500:#FF6A1F;
  --magenta-500:#E0177F;
  --gold-400:#F2C14E;
  --paper-100:#E8EEF7;
  --mist-400:#8C9BB5;
  --live-500:#FF3B57;
  --white-000:#FFFFFF;

  --line:1px solid var(--ink-700);
  --line-cy:1px solid rgba(0,229,208,.35);
  --line-or:1px solid rgba(255,106,31,.4);
  --radius:2px;

  --wrap:1320px;
  --gutter:clamp(16px,4vw,40px);
  --sp-1:8px;--sp-2:16px;--sp-3:24px;--sp-4:40px;--sp-5:64px;

  --font-sans:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono","Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

/* ---------- 03 Base ---------- */
html{background:var(--ink-900)}
body{
  min-height:100vh;
  background-color:var(--ink-900);
  background-image:
    radial-gradient(1100px 520px at 84% -6%, rgba(0,229,208,.10), transparent 62%),
    radial-gradient(880px 460px at 4% 2%, rgba(255,106,31,.07), transparent 60%),
    linear-gradient(rgba(24,35,58,.45) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24,35,58,.45) 1px, transparent 1px);
  background-size:auto,auto,64px 64px,64px 64px;
  color:var(--paper-100);
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.75;
  font-weight:400;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{font-weight:800;line-height:1.15;letter-spacing:-.01em}
strong,b{font-weight:800}
::selection{background:rgba(0,229,208,.28);color:var(--white-000)}

/* ---------- 04 Layout ---------- */
.st-wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.st-section{padding-block:clamp(40px,6vw,72px)}
.st-section--tight{padding-block:clamp(24px,3.5vw,40px)}

/* ---------- 05 Typography ---------- */
.st-display{
  font-weight:900;font-size:clamp(32px,5.2vw,72px);
  line-height:1.04;letter-spacing:-.03em;color:var(--paper-100);
}
.st-h2{font-size:clamp(24px,3.2vw,40px);font-weight:900;letter-spacing:-.02em;line-height:1.12}
.st-h3{font-size:clamp(18px,2vw,22px);font-weight:800;line-height:1.28}
.st-lede{font-size:clamp(16px,1.4vw,19px);max-width:46ch;color:rgba(232,238,247,.88);line-height:1.75}
.st-note{font-size:13px;line-height:1.65;color:var(--mist-400)}
.st-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12px;font-weight:700;letter-spacing:.18em;color:var(--cyan-400);
}
.st-eyebrow::before{content:"";width:18px;height:1px;background:var(--cyan-400)}
.st-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.st-vertical{
  writing-mode:vertical-rl;
  font-size:12px;letter-spacing:.18em;color:var(--mist-400);line-height:1;
}
.st-slant{display:inline-block;transform:skewX(-4deg)}
.st-kpi{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-weight:800;font-size:clamp(40px,7vw,88px);line-height:.92;
  letter-spacing:-.02em;color:var(--white-000);
}
.st-kpi__unit{font-size:.3em;font-weight:600;letter-spacing:.1em;color:var(--mist-400);margin-left:.4em;font-family:var(--font-sans)}
.st-kpi--cy{color:var(--cyan-400)}
.st-kpi--or{color:var(--orange-500)}
.st-kpi--gd{color:var(--gold-400)}

/* ---------- 06 Buttons ---------- */
.st-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 20px;border:1px solid var(--cyan-400);border-radius:var(--radius);
  color:var(--cyan-400);font-size:15px;font-weight:700;letter-spacing:.02em;
  line-height:1.2;transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.st-btn:hover{background:rgba(0,229,208,.12);box-shadow:0 0 0 1px rgba(0,229,208,.35)}
.st-btn--solid{background:var(--cyan-400);color:var(--ink-900);border-color:var(--cyan-400)}
.st-btn--solid:hover{background:var(--white-000);border-color:var(--white-000);color:var(--ink-900)}
.st-btn--orange{border-color:var(--orange-500);color:var(--orange-500)}
.st-btn--orange:hover{background:rgba(255,106,31,.14);box-shadow:0 0 0 1px rgba(255,106,31,.35)}

/* ---------- 07 Tags / plates ---------- */
.st-tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:3px 8px;border:1px solid var(--ink-700);border-radius:var(--radius);
  background:rgba(7,11,20,.6);
  font-size:11px;letter-spacing:.16em;line-height:1.5;color:var(--mist-400);
  white-space:nowrap;
}
.st-tag--cyan{color:var(--cyan-400);border-color:rgba(0,229,208,.45)}
.st-tag--orange{color:var(--orange-500);border-color:rgba(255,106,31,.45)}
.st-tag--magenta{color:var(--magenta-500);border-color:rgba(224,23,127,.5)}
.st-tag--gold{color:var(--gold-400);border-color:rgba(242,193,78,.5)}
.st-tag--live{color:var(--live-500);border-color:rgba(255,59,87,.5)}
.st-plate{
  position:absolute;left:0;bottom:0;z-index:2;
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px;
  background:rgba(7,11,20,.86);
  border-top:1px solid rgba(0,229,208,.35);
  border-right:1px solid rgba(0,229,208,.35);
  font-size:11px;letter-spacing:.16em;line-height:1.4;color:var(--cyan-400);
  transition:transform .18s ease;
}
.st-cell:hover .st-plate,.st-card:hover .st-plate{transform:translateX(6px)}

/* ---------- 08 Media ---------- */
.st-media{
  position:relative;overflow:hidden;
  aspect-ratio:16/9;
  background:var(--ink-800);
  border:1px solid var(--ink-700);border-radius:var(--radius);
}
.st-media img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.92) contrast(1.08) brightness(.86);
}
.st-media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 100%, rgba(0,229,208,.16), transparent 58%),
    linear-gradient(180deg, rgba(7,11,20,0) 42%, rgba(7,11,20,.78) 100%),
    repeating-linear-gradient(180deg, rgba(0,229,208,.05) 0 1px, transparent 1px 4px);
}
.st-media--wide{aspect-ratio:21/9}
.st-media--tall{aspect-ratio:3/4}
.st-media--empty{
  background-image:repeating-linear-gradient(135deg, rgba(24,35,58,.9) 0 2px, transparent 2px 12px);
}
.st-media__no{
  position:absolute;left:8px;bottom:8px;z-index:3;
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:12px;letter-spacing:.12em;color:var(--cyan-400);
  background:rgba(7,11,20,.78);border:1px solid rgba(0,229,208,.35);
  padding:2px 7px;border-radius:var(--radius);
}

/* ---------- 09 Cells & cards ---------- */
.st-cell{
  position:relative;display:flex;flex-direction:column;gap:12px;
  padding:20px;overflow:hidden;
  background:var(--ink-800);border:1px solid var(--ink-700);border-radius:var(--radius);
  transition:border-color .18s ease,transform .18s ease;
}
.st-cell:hover{border-color:rgba(0,229,208,.55);transform:translateY(-2px)}
.st-cell__title{font-size:clamp(17px,1.9vw,22px);font-weight:800;line-height:1.25;letter-spacing:-.01em}
.st-cell__text{font-size:14px;line-height:1.7;color:var(--mist-400)}

.st-card{
  position:relative;display:flex;flex-direction:column;gap:10px;
  padding:18px;overflow:hidden;
  background:var(--ink-800);border:1px solid var(--ink-700);border-radius:var(--radius);
  transition:border-color .18s ease,transform .18s ease;
}
.st-card:hover{border-color:rgba(0,229,208,.55);transform:translateY(-2px)}
.st-card__meta{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:.08em;color:var(--mist-400)}
.st-card__title{font-size:17px;font-weight:800;line-height:1.4}
.st-card__text{font-size:14px;line-height:1.7;color:var(--mist-400)}

.st-scan::after{
  content:"";position:absolute;left:0;right:0;top:-38%;height:36%;z-index:1;pointer-events:none;
  background:linear-gradient(180deg, rgba(0,229,208,0), rgba(0,229,208,.09), rgba(0,229,208,0));
  animation:st-scan 8s linear infinite;
}
@keyframes st-scan{
  0%{transform:translateY(0)}
  100%{transform:translateY(380%)}
}

/* ---------- 10 Bento grid ---------- */
.st-grid{display:grid;gap:var(--sp-2)}
.st-grid--12{
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-auto-rows:minmax(96px,auto);
}
.st-cell--1x1{grid-column:span 3}
.st-cell--2x1{grid-column:span 6}
.st-cell--2x2{grid-column:span 6;grid-row:span 2}
.st-cell--3x2{grid-column:span 9;grid-row:span 2}

/* ---------- 11 Band / crumb / table / filters ---------- */
.st-band{
  position:relative;overflow:hidden;
  background:var(--teal-900);
  border-top:1px solid var(--ink-700);border-bottom:1px solid var(--ink-700);
}
.st-band::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(45deg, rgba(224,23,127,.09) 0 1px, transparent 1px 18px),
    repeating-linear-gradient(-45deg, rgba(242,193,78,.07) 0 1px, transparent 1px 18px);
}
.st-band__inner{
  position:relative;z-index:1;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;
  padding-block:20px;
}
.st-band__title{font-size:clamp(15px,1.6vw,18px);font-weight:800;letter-spacing:.02em}
.st-band__meta{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:.1em;color:var(--cyan-400)}

.st-crumb{
  border-bottom:1px solid var(--ink-700);
  padding-block:12px;font-size:12px;letter-spacing:.06em;color:var(--mist-400);
}
.st-crumb__list{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.st-crumb__list li:not(:last-child)::after{content:"/";margin-left:8px;color:#2C3A55}
.st-crumb__list a{color:var(--cyan-400)}
.st-crumb__list a:hover{color:var(--white-000)}

.st-table__wrap{
  overflow-x:auto;border:1px solid var(--ink-700);border-radius:var(--radius);
  background:rgba(14,22,38,.6);
}
.st-table{width:100%;font-size:14px;min-width:520px}
.st-table caption{
  text-align:left;padding:10px 12px;
  font-size:12px;letter-spacing:.16em;color:var(--mist-400);
  background:var(--ink-800);border-bottom:1px solid var(--ink-700);
}
.st-table th,.st-table td{
  padding:10px 12px;text-align:left;vertical-align:middle;
  border-bottom:1px solid var(--ink-700);
}
.st-table thead th{
  background:var(--teal-900);color:var(--mist-400);
  font-size:12px;font-weight:600;letter-spacing:.14em;white-space:nowrap;
}
.st-table tbody tr:nth-child(even){background:rgba(6,48,58,.38)}
.st-table tbody tr:hover{background:rgba(0,229,208,.07)}
.st-table td.st-table__num{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-weight:700;color:var(--paper-100);white-space:nowrap;
}

.st-filters{display:flex;flex-wrap:wrap;gap:8px}
.st-filter{
  display:inline-flex;align-items:center;
  padding:8px 14px;border:1px solid var(--ink-700);border-radius:var(--radius);
  font-size:13px;letter-spacing:.08em;color:var(--mist-400);line-height:1.3;
  transition:color .16s ease,border-color .16s ease,background .16s ease;
}
.st-filter:hover{color:var(--paper-100);border-color:rgba(0,229,208,.5)}
.st-filter[aria-pressed="true"]{
  color:var(--ink-900);background:var(--cyan-400);
  border-color:var(--cyan-400);font-weight:700;
}
.st-filter__count{font-family:var(--font-mono);font-size:11px;margin-left:6px;opacity:.72}
.st-filter-empty{
  padding:28px 20px;border:1px dashed var(--ink-700);border-radius:var(--radius);
  text-align:center;font-size:14px;color:var(--mist-400);
}

/* ---------- 12 Reveal & filter motion ---------- */
[data-reveal]{transition:opacity .5s ease,transform .5s ease}
.st-js [data-reveal]{opacity:0;transform:translateY(14px)}
[data-reveal].is-visible{opacity:1;transform:none}
.st-fadein{animation:st-fadein .18s ease both}
@keyframes st-fadein{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:none}
}

/* ---------- 13 Skiplink ---------- */
.st-skip{
  position:absolute;left:var(--gutter);top:-120px;z-index:200;
  padding:10px 16px;border-radius:var(--radius);
  background:var(--cyan-400);color:var(--ink-900);
  font-size:14px;font-weight:700;letter-spacing:.04em;
  transition:top .2s ease;
}
.st-skip:focus{top:10px}

/* ---------- 14 Header ---------- */
.st-header{
  position:sticky;top:0;z-index:60;
  background:var(--ink-900);
  border-bottom:1px solid var(--ink-700);
  transition:box-shadow .2s ease,border-color .2s ease;
}
.st-header.is-scrolled{box-shadow:0 14px 34px rgba(0,0,0,.6);border-bottom-color:rgba(0,229,208,.28)}

/* 比分带 */
.st-scorebar{
  position:relative;display:flex;align-items:stretch;
  height:46px;overflow:hidden;
  background:var(--teal-900);
  border-bottom:1px solid var(--ink-700);
}
.st-scorebar::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(45deg, rgba(224,23,127,.08) 0 1px, transparent 1px 16px),
    repeating-linear-gradient(-45deg, rgba(242,193,78,.06) 0 1px, transparent 1px 16px);
}
.st-scorebar__track{
  position:relative;z-index:1;flex:1 1 auto;min-width:0;
  display:flex;align-items:center;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent);
}
.st-scorebar__group{
  display:flex;align-items:center;gap:32px;
  flex:0 0 auto;padding-right:32px;
  animation:st-ticker 40s linear infinite;
}
.st-scorebar__track:hover .st-scorebar__group,
.st-scorebar__track:focus-within .st-scorebar__group{animation-play-state:paused}
@keyframes st-ticker{
  from{transform:translateX(0)}
  to{transform:translateX(-100%)}
}
.st-scorebar__cta{
  position:relative;z-index:2;flex:0 0 auto;
  display:inline-flex;align-items:center;
  padding:0 18px;
  background:var(--cyan-400);color:var(--ink-900);
  border-left:1px solid rgba(7,11,20,.25);
  font-size:13px;font-weight:800;letter-spacing:.12em;
  transition:background .18s ease,color .18s ease;
}
.st-scorebar__cta:hover{background:var(--white-000);color:var(--ink-900)}
.st-score{
  display:inline-flex;align-items:center;gap:8px;
  white-space:nowrap;font-size:13px;line-height:1;
}
.st-score__team{color:rgba(232,238,247,.82);font-weight:500}
.st-score__num{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:16px;font-weight:800;color:var(--paper-100);
}
.st-score__num--lead{color:var(--cyan-400)}
.st-score__sep{color:var(--ink-700);font-family:var(--font-mono);font-weight:700}
.st-score__meta{font-size:11px;letter-spacing:.16em;color:var(--mist-400)}
.st-score__dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--live-500);box-shadow:0 0 0 3px rgba(255,59,87,.18);
  animation:st-pulse 1.6s ease-in-out infinite;
}
@keyframes st-pulse{
  0%,100%{opacity:1}
  50%{opacity:.35}
}

/* 品牌与导航 */
.st-masthead{background:var(--ink-900)}
.st-masthead__inner{
  max-width:var(--wrap);margin-inline:auto;
  padding:12px var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);
}
.st-brand{display:flex;flex-direction:column;gap:2px;min-width:0}
.st-brand__mark{
  display:inline-block;transform:skewX(-4deg);
  font-size:clamp(20px,2.4vw,27px);font-weight:900;
  letter-spacing:-.03em;line-height:1.1;color:var(--paper-100);
}
.st-brand__accent{color:var(--cyan-400)}
.st-brand__tagline{
  font-size:11px;letter-spacing:.18em;color:var(--mist-400);
  padding-left:1px;
}
.st-nav__list{display:flex;align-items:center;gap:2px}
.st-nav__link{
  position:relative;display:block;
  padding:10px 12px;
  font-size:15px;font-weight:600;color:var(--paper-100);
  transition:color .16s ease;
}
.st-nav__link:hover{color:var(--cyan-400)}
.st-nav__link[aria-current="page"]{color:var(--cyan-400)}
.st-nav__link[aria-current="page"]::after{
  content:"";position:absolute;left:12px;right:12px;bottom:2px;
  height:2px;background:var(--orange-500);
}
.st-navtoggle{
  display:none;align-items:center;gap:9px;
  padding:9px 13px;
  border:1px solid var(--ink-700);border-radius:var(--radius);
  color:var(--paper-100);
  font-size:12px;letter-spacing:.16em;
  transition:border-color .18s ease,color .18s ease;
}
.st-navtoggle:hover{border-color:rgba(0,229,208,.5)}
.st-navtoggle[aria-expanded="true"]{border-color:var(--cyan-400);color:var(--cyan-400)}
.st-navtoggle__bars{display:flex;flex-direction:column;gap:3px;width:16px}
.st-navtoggle__bars i{display:block;width:100%;height:2px;background:var(--cyan-400)}
.st-navtoggle__bars i:nth-child(2){width:66%}
.st-navtoggle__label{line-height:1}

/* 滚动进度 */
.st-progress{
  position:absolute;left:0;right:0;bottom:0;height:2px;z-index:6;
  pointer-events:none;
}
.st-progress__bar{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--cyan-400),var(--orange-500));
  transition:width .12s linear;
}

/* ---------- 15 Footer ---------- */
.st-footer{
  position:relative;overflow:hidden;
  margin-top:clamp(48px,7vw,96px);
  background:var(--ink-800);
  border-top:1px solid var(--ink-700);
  color:var(--paper-100);
}
.st-footer::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(45deg, rgba(224,23,127,.07) 0 1px, transparent 1px 20px),
    repeating-linear-gradient(-45deg, rgba(242,193,78,.06) 0 1px, transparent 1px 20px),
    radial-gradient(680px 300px at 12% 0%, rgba(0,229,208,.08), transparent 70%);
}
.st-footer__grid{
  position:relative;z-index:1;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--sp-4) var(--sp-3);
  padding-block:clamp(36px,5vw,60px);
}
.st-fcol{display:flex;flex-direction:column;gap:16px;min-width:0}
.st-fcol__title{
  font-size:12px;font-weight:700;letter-spacing:.18em;color:var(--cyan-400);
  padding-bottom:10px;border-bottom:1px solid var(--ink-700);
}
.st-fcol__list{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--mist-400)}
.st-fcol__list a{
  color:var(--paper-100);transition:color .16s ease,padding-left .16s ease;
  display:inline-block;
}
.st-fcol__list a:hover{color:var(--cyan-400);padding-left:6px}
.st-fcol__more{
  align-self:flex-start;margin-top:auto;
  padding:8px 14px;border:1px solid var(--ink-700);border-radius:var(--radius);
  font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--orange-500);
  transition:border-color .18s ease,background .18s ease;
}
.st-fcol__more:hover{border-color:var(--orange-500);background:rgba(255,106,31,.12)}
.st-contact{display:flex;flex-direction:column;gap:12px;font-size:14px}
.st-contact__row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;min-width:0}
.st-contact__key{
  flex:0 0 auto;min-width:60px;
  font-size:11px;letter-spacing:.16em;color:var(--mist-400);
}
.st-contact__val{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:13px;color:var(--paper-100);
  word-break:break-all;line-height:1.6;
}
.st-contact__val--text{font-family:var(--font-sans);font-size:13px;color:rgba(232,238,247,.9)}
.st-copy{
  padding:2px 8px;
  border:1px solid var(--ink-700);border-radius:var(--radius);
  font-size:11px;letter-spacing:.12em;color:var(--cyan-400);line-height:1.6;
  transition:border-color .16s ease,background .16s ease,color .16s ease;
}
.st-copy:hover{border-color:var(--cyan-400);background:rgba(0,229,208,.1)}
.st-copy[data-copied="true"]{color:var(--gold-400);border-color:var(--gold-400)}
.st-footer__base{
  position:relative;z-index:1;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 24px;
  padding-block:18px;
  border-top:1px solid var(--ink-700);
  font-size:12px;letter-spacing:.08em;color:var(--mist-400);
}
.st-footer__slogan{color:rgba(232,238,247,.9)}
.st-footer__legal{font-family:var(--font-mono);font-variant-numeric:tabular-nums}

/* ---------- 16 Responsive ---------- */
@media (max-width:1080px){
  .st-masthead__inner{flex-wrap:wrap;padding-block:10px}
  .st-navtoggle{display:inline-flex}
  .st-nav{flex:1 1 100%}
  .st-nav__list{flex-direction:column;align-items:stretch;gap:0}
  .st-nav__link{padding:13px 4px;border-bottom:1px solid var(--ink-700);font-size:16px}
  .st-nav__link[aria-current="page"]::after{left:4px;right:auto;bottom:8px;width:26px}

  .st-js .st-nav{
    position:fixed;top:0;right:0;bottom:0;z-index:80;
    width:min(86vw,360px);
    padding:calc(var(--sp-5) + 12px) var(--sp-3) var(--sp-4);
    background:var(--ink-800);
    border-left:1px solid var(--ink-700);
    box-shadow:-24px 0 48px rgba(0,0,0,.55);
    overflow-y:auto;
    transform:translateX(102%);
    transition:transform .22s ease;
  }
  .st-header[data-open] .st-nav{transform:translateX(0)}
  .st-header[data-open]::after{
    content:"";position:fixed;inset:0;z-index:70;
    background:rgba(7,11,20,.74);
  }

  .st-grid--12{grid-template-columns:repeat(6,minmax(0,1fr))}
  .st-cell--1x1{grid-column:span 3}
  .st-cell--2x1{grid-column:span 6}
  .st-cell--2x2{grid-column:span 6}
  .st-cell--3x2{grid-column:span 6}

  .st-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:760px){
  body{font-size:16px}
  .st-scorebar{height:42px}
  .st-scorebar__cta{padding:0 14px;font-size:12px;letter-spacing:.08em}
  .st-score__team{max-width:5.5em;overflow:hidden;text-overflow:ellipsis}
  .st-score__meta{letter-spacing:.1em}
  .st-footer__base{flex-direction:column;align-items:flex-start}
}

@media (max-width:680px){
  .st-grid--12{grid-template-columns:1fr;grid-auto-rows:auto}
  .st-cell--1x1,.st-cell--2x1,.st-cell--2x2,.st-cell--3x2{grid-column:span 1;grid-row:auto}
  .st-footer__grid{grid-template-columns:1fr;gap:28px}
  .st-contact__key{min-width:100%}
}

/* ---------- 17 Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  .st-scorebar__group{animation:none}
  .st-score__dot{animation:none}
  .st-scan::after{display:none}
  .st-progress__bar{transition:none}
  .st-js [data-reveal]{opacity:1;transform:none}
  [data-reveal]{transition:none}
  .st-fadein{animation:none}
  .st-cell:hover,.st-card:hover{transform:none}
}