/* VS page template styles, taken from monzo-v-starling (24 Sep 2026) for battles and generated VS pages */
/* ─────────────────────────────────────────────────────────────
   Local fallback so the page reviews correctly off-domain.
   Layered, so the live Spark Intel stylesheet wins on anything
   it defines. Page-specific rules follow, unlayered.
   ───────────────────────────────────────────────────────────── */
@layer sparkfallback {
  :root {
    --navy-950:#000d1f; --navy-900:#00112A; --navy-800:#001940; --navy-700:#02376A;
    --navy-600:#095180; --navy-500:#187EB5;
    --accent-blue:#00ADD8; --accent-cyan:#35C2E0; --accent-indigo:#0094CA;
    --accent-teal:#6FCAC5; --accent-amber:#F79940;
    --text-primary:#f1f5f9; --text-secondary:#b4c4d6; --text-muted:#94adc8;
    --glass-bg:rgba(255,255,255,0.05); --glass-border:rgba(255,255,255,0.10);
    --glass-bg-strong:rgba(255,255,255,0.07); --glass-border-strong:rgba(255,255,255,0.12);
    --surface-body:#00112A; --surface-elevated:#001940; --surface-card:rgba(255,255,255,0.035);
    --surface-card-hover:rgba(255,255,255,0.08); --surface-nav:rgba(0,17,42,0.65);
    --surface-footer:#00112A; --surface-pill:rgba(255,255,255,0.04);
    --surface-pill-hover:rgba(0,173,216,0.16); --surface-table-hover:rgba(0,173,216,0.07);
    --surface-overlay:rgba(0,17,42,0.85);
    --border-default:rgba(255,255,255,0.07); --border-subtle:rgba(255,255,255,0.04);
    --border-card:rgba(255,255,255,0.07); --border-table:rgba(255,255,255,0.08);
    --border-table-row:rgba(255,255,255,0.03);
    --text-heading:#f1f5f9; --text-link:#82D2E7; --text-link-hover:#c0f0ff;
    --shadow-card:0 16px 40px rgba(0,0,0,0.25), 0 0 60px rgba(0,173,216,0.10);
    --positive:#34d399; --negative:#f87171;
    --positive-bg:rgba(52,211,153,0.10); --negative-bg:rgba(248,113,113,0.10);
    --divider:rgba(255,255,255,0.1);
  }
  [data-theme="light"] {
    --navy-950:#f8fafc; --navy-900:#ffffff; --navy-800:#f1f5f9; --navy-700:#e2e8f0;
    --navy-600:#cbd5e1; --navy-500:#0284c7;
    --accent-blue:#0284c7; --accent-cyan:#0891b2; --accent-indigo:#0369a1;
    --accent-teal:#0d9488; --accent-amber:#d97706;
    --text-primary:#0f172a; --text-secondary:#475569; --text-muted:#64748b;
    --glass-bg:rgba(255,255,255,0.70); --glass-border:rgba(0,0,0,0.08);
    --glass-bg-strong:rgba(255,255,255,0.85); --glass-border-strong:rgba(0,0,0,0.10);
    --surface-body:#f8fafc; --surface-elevated:#ffffff; --surface-card:rgba(255,255,255,0.80);
    --surface-card-hover:rgba(255,255,255,0.95); --surface-nav:rgba(255,255,255,0.80);
    --surface-footer:#f1f5f9; --surface-pill:rgba(0,0,0,0.04);
    --surface-pill-hover:rgba(2,132,199,0.10); --surface-table-hover:rgba(2,132,199,0.06);
    --surface-overlay:rgba(241,245,249,0.92);
    --border-default:rgba(0,0,0,0.08); --border-subtle:rgba(0,0,0,0.04);
    --border-card:rgba(0,0,0,0.08); --border-table:rgba(0,0,0,0.08);
    --border-table-row:rgba(0,0,0,0.04);
    --text-heading:#0f172a; --text-link:#0369a1; --text-link-hover:#0284c7;
    --shadow-card:0 4px 24px rgba(0,0,0,0.06), 0 1px 4px rgba(0,0,0,0.04);
    --positive:#059669; --negative:#dc2626;
    --positive-bg:rgba(5,150,105,0.08); --negative-bg:rgba(220,38,38,0.08);
    --divider:rgba(0,0,0,0.08);
  }
  *,*::before,*::after { box-sizing:border-box; }
  html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
  body {
    margin:0; background-color:var(--surface-body); color:var(--text-primary);
    font-family:'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    -webkit-font-smoothing:antialiased; overflow-x:hidden;
  }
  h1,h2,h3,h4,h5,h6 { letter-spacing:-0.03em; line-height:1.1; margin:0; }
  h1,h2 { font-weight:400; }
  h3,h4 { font-weight:500; }
  p { line-height:1.75; margin:0; }
  .section { padding:4.5rem 0; }
  .section-sm { padding:2.75rem 0; }
  @media (min-width:768px){ .section{padding:6.5rem 0;} .section-sm{padding:4rem 0;} }
  .glass-panel {
    background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:1.25rem;
    backdrop-filter:blur(12px);
    transition:border-color .35s ease, background .35s ease, transform .35s cubic-bezier(.4,0,.2,1), box-shadow .35s ease;
  }
  .glass-panel:hover { border-color:rgba(0,173,216,0.30); background:var(--surface-card-hover); transform:translateY(-2px); box-shadow:var(--shadow-card); }
  .glass-panel-strong { background:var(--glass-bg-strong); border:1px solid var(--glass-border-strong); border-radius:1.5rem; backdrop-filter:blur(20px); }
  .category-card {
    background:var(--surface-card); border:1px solid var(--border-card); border-radius:1.25rem;
    padding:2rem; transition:all .35s cubic-bezier(.4,0,.2,1); position:relative; overflow:hidden;
    text-decoration:none; color:inherit; display:block;
  }
  .category-card:hover { border-color:rgba(0,173,216,0.35); background:var(--surface-card-hover); transform:translateY(-3px); box-shadow:var(--shadow-card); }
  .divider { height:1px; background:linear-gradient(90deg, transparent, var(--divider), transparent); }
  .line-accent { width:48px; height:2px; background:linear-gradient(90deg, var(--accent-blue), var(--accent-cyan)); border-radius:2px; }
  .stat-block { text-align:center; padding:1.5rem; }
  .stat-number { font-size:2.5rem; font-weight:800; letter-spacing:-0.04em; line-height:1; }
  @media (min-width:640px){ .stat-number{font-size:3.5rem;} }
  .sub-tag, .sub-tag-teal, .sub-tag-amber {
    display:inline-block; padding:.3rem .75rem; border-radius:100px;
    font-size:.75rem; font-weight:500; letter-spacing:.01em; text-decoration:none;
  }
  .sub-tag { background:rgba(0,173,216,0.08); border:1px solid rgba(0,173,216,0.12); color:#82D2E7; }
  .sub-tag-teal { background:rgba(111,202,197,0.08); border:1px solid rgba(111,202,197,0.2); color:#6FCAC5; }
  .sub-tag-amber { background:rgba(247,153,64,0.08); border:1px solid rgba(247,153,64,0.2); color:#F79940; }
  [data-theme="light"] .sub-tag { background:rgba(2,132,199,0.06); border-color:rgba(2,132,199,0.12); color:#0369a1; }
  [data-theme="light"] .sub-tag-teal { background:rgba(13,148,136,0.06); border-color:rgba(13,148,136,0.15); color:#0f766e; }
  [data-theme="light"] .sub-tag-amber { background:rgba(217,119,6,0.06); border-color:rgba(217,119,6,0.15); color:#92400e; }
  .nav-blur { background:var(--surface-nav); backdrop-filter:saturate(180%) blur(20px); }
  .nav-link { color:var(--text-muted); text-decoration:none; font-size:.875rem; letter-spacing:-0.01em; transition:color .25s ease; }
  .nav-link:hover { color:var(--text-link); }
  .btn-primary {
    display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.75rem;
    background:linear-gradient(135deg,#00ADD8,#0094CA); color:#fff; font-weight:500;
    font-size:.875rem; border-radius:100px; text-decoration:none; letter-spacing:-0.01em;
    transition:transform .2s ease, box-shadow .3s ease, filter .2s ease;
  }
  .btn-primary:hover { transform:translateY(-2px) scale(1.04); filter:brightness(1.2); }
  .btn-secondary {
    display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.75rem;
    background:var(--surface-pill); color:var(--text-primary); font-weight:500; font-size:.875rem;
    border:1px solid var(--border-default); border-radius:100px; text-decoration:none;
    letter-spacing:-0.01em; transition:background .25s ease, border-color .25s ease, transform .2s ease;
  }
  .btn-secondary:hover { border-color:rgba(0,173,216,0.3); transform:translateY(-2px); }
  .hero-gradient { position:relative; overflow:hidden; }
  .hero-gradient::before {
    content:''; position:absolute; top:-20%; left:50%; transform:translateX(-50%);
    width:160%; height:120%; pointer-events:none; z-index:0;
    background:
      radial-gradient(ellipse 70% 55% at 50% 0%, rgba(0,173,216,0.22), transparent 70%),
      radial-gradient(ellipse 50% 45% at 30% 15%, rgba(0,148,202,0.14), transparent 60%),
      radial-gradient(ellipse 50% 45% at 70% 15%, rgba(53,194,224,0.10), transparent 60%),
      radial-gradient(ellipse 80% 40% at 50% 90%, rgba(0,25,64,0.60), transparent 70%);
  }
  [data-theme="light"] .hero-gradient::before {
    background:
      radial-gradient(ellipse 70% 55% at 50% 0%, rgba(2,132,199,0.10), transparent 70%),
      radial-gradient(ellipse 50% 45% at 30% 15%, rgba(3,105,161,0.06), transparent 60%),
      radial-gradient(ellipse 80% 40% at 50% 90%, rgba(241,245,249,0.60), transparent 70%);
  }
  .hero-mesh {
    position:absolute; inset:0; pointer-events:none; z-index:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
    background-size:60px 60px;
    mask-image:radial-gradient(ellipse 80% 70% at 50% 30%, black 20%, transparent 70%);
    -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%, black 20%, transparent 70%);
  }
  [data-theme="light"] .hero-mesh {
    background-image:
      linear-gradient(rgba(0,0,0,0.03) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,0,0,0.03) 1px, transparent 1px);
  }
  .section-nav { display:flex; justify-content:center; flex-wrap:wrap; gap:.5rem; padding:1rem 0; overflow-x:auto; scrollbar-width:none; }
  .section-nav::-webkit-scrollbar { display:none; }
  .section-nav a {
    flex-shrink:0; display:inline-flex; align-items:center; padding:.4rem 1rem; border-radius:9999px;
    font-size:.8125rem; font-weight:500; color:var(--text-secondary); background:var(--surface-pill);
    border:1px solid var(--border-default); text-decoration:none; white-space:nowrap;
    transition:color .2s, background .2s, border-color .2s;
  }
  .section-nav a:hover { color:var(--text-link-hover); background:var(--surface-pill-hover); border-color:rgba(0,173,216,0.4); }
  section:has(nav.section-nav) {
    padding:0; position:sticky; top:80px; z-index:40; background:var(--surface-overlay);
    backdrop-filter:blur(16px); border-bottom:1px solid var(--border-subtle);
  }
  section[id] { scroll-margin-top:148px; }
  .report-table { border-collapse:collapse; border-spacing:0; }
  .report-table thead th {
    padding:.75rem; font-weight:500; font-size:.75rem; text-transform:uppercase; letter-spacing:.06em;
    color:var(--text-muted); text-align:right; border-bottom:1px solid var(--border-table); white-space:nowrap;
  }
  .report-table thead th:first-child { text-align:left; }
  .report-table tbody td {
    padding:.6rem .75rem; text-align:right; color:var(--text-secondary);
    border-bottom:1px solid var(--border-table-row); white-space:nowrap;
  }
  .report-table tbody td:first-child { text-align:left; color:var(--text-primary); font-weight:400; }
  .report-table tbody tr:hover td { background:var(--surface-table-hover); }
  .faq-item { border-bottom:1px solid var(--border-subtle); }
  .faq-question {
    display:flex; justify-content:space-between; align-items:center; width:100%; padding:1.25rem 0;
    background:none; border:none; color:var(--text-primary); font-size:1rem; font-weight:500;
    text-align:left; cursor:pointer; letter-spacing:-0.01em; font-family:inherit; transition:color .2s ease;
  }
  .faq-question:hover { color:var(--text-link); }
  .faq-icon { flex-shrink:0; width:1.125rem; height:1.125rem; color:var(--text-muted); transition:transform .3s ease, color .2s ease; }
  .faq-item.open .faq-icon { transform:rotate(45deg); color:var(--accent-blue); }
  .faq-answer { max-height:0; overflow:hidden; transition:max-height .4s cubic-bezier(.4,0,.2,1), padding .4s ease; }
  .faq-item.open .faq-answer { max-height:500px; padding-bottom:1.25rem; }
  .fade-up { opacity:0; transform:translateY(30px); transition:opacity .7s cubic-bezier(.4,0,.2,1), transform .7s cubic-bezier(.4,0,.2,1); }
  .fade-up.visible { opacity:1; transform:translateY(0); }
  .stagger-children > .fade-up:nth-child(2) { transition-delay:.1s; }
  .stagger-children > .fade-up:nth-child(3) { transition-delay:.15s; }
  .stagger-children > .fade-up:nth-child(4) { transition-delay:.2s; }
  .skip-link { position:absolute; top:-100%; left:1rem; background:var(--accent-blue); color:#fff; padding:.75rem 1.5rem; border-radius:.5rem; font-weight:500; z-index:100; text-decoration:none; }
  .skip-link:focus { top:1rem; }
  .theme-toggle {
    display:inline-flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem;
    padding:0; border:1px solid var(--border-default); border-radius:.5rem; background:var(--surface-pill);
    color:var(--text-muted); cursor:pointer; flex-shrink:0;
    transition:color .25s ease, background .25s ease, border-color .25s ease, transform .15s ease;
  }
  .theme-toggle:hover { color:var(--accent-blue); border-color:rgba(0,173,216,0.4); transform:scale(1.08); }
  .theme-toggle svg { width:1.125rem; height:1.125rem; }
  .theme-toggle .icon-sun { display:none; }
  .theme-toggle .icon-moon { display:block; }
  [data-theme="light"] .theme-toggle .icon-sun { display:block; }
  [data-theme="light"] .theme-toggle .icon-moon { display:none; }
  .back-to-top {
    position:fixed; bottom:1.75rem; right:1.75rem; width:2.5rem; height:2.5rem; border-radius:50%;
    background:var(--surface-pill); border:1px solid var(--border-default); color:var(--text-muted);
    display:flex; align-items:center; justify-content:center; cursor:pointer; opacity:0; visibility:hidden;
    transform:translateY(8px); z-index:50; backdrop-filter:blur(8px);
    transition:opacity .25s ease, visibility .25s ease, transform .25s ease, background .2s ease, color .2s ease;
  }
  .back-to-top.is-visible { opacity:1; visibility:visible; transform:translateY(0); }
  :focus-visible { outline:2px solid var(--accent-blue); outline-offset:2px; border-radius:4px; }
}

/* ─────────────────────────────────────────────────────────────
   Page-specific layout and the signature flow diagram
   ───────────────────────────────────────────────────────────── */
.vs-wrap { max-width:72rem; margin:0 auto; padding:0 1.5rem; }
.vs-wrap-narrow { max-width:52rem; margin:0 auto; padding:0 1.5rem; }
.vs-header {
  position:fixed; top:0; left:0; right:0; z-index:50; height:80px;
  display:flex; align-items:center; border-bottom:1px solid var(--border-subtle);
}
.vs-header-inner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; width:100%; }
.vs-header img { height:34px; width:auto; }
.vs-nav-links { display:none; gap:1.75rem; align-items:center; }
@media (min-width:900px) { .vs-nav-links { display:flex; } }
.vs-eyebrow {
  font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.18em;
  color:var(--accent-amber);
}
.vs-label {
  font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.14em;
  color:var(--text-muted);
}
.vs-standfirst { font-size:1.0625rem; color:var(--text-secondary); max-width:46rem; }
.vs-body p { color:var(--text-secondary); margin-bottom:1.1rem; max-width:46rem; }
.vs-body p:last-child { margin-bottom:0; }
.vs-h1 { font-size:2.1rem; margin:1.1rem 0 1.25rem; max-width:24ch; }
@media (min-width:768px) { .vs-h1 { font-size:3.1rem; max-width:20ch; } }
.vs-h2 { font-size:1.65rem; margin-bottom:1.1rem; max-width:26ch; }
@media (min-width:768px) { .vs-h2 { font-size:2.1rem; } }
.vs-breadcrumb { display:flex; flex-wrap:wrap; gap:.5rem; font-size:.8125rem; color:var(--text-muted); padding-bottom:1.75rem; }
.vs-breadcrumb a { color:var(--text-muted); text-decoration:none; }
.vs-breadcrumb a:hover { color:var(--text-link); }
.vs-byline { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; font-size:.8125rem; color:var(--text-muted); }
.vs-byline strong { color:var(--text-primary); font-weight:500; }
.vs-hero-stats { display:grid; grid-template-columns:1fr; gap:.75rem; margin-top:2.75rem; }
@media (min-width:640px) { .vs-hero-stats { grid-template-columns:repeat(3,1fr); } }
.vs-hero-stats .stat-block { padding:1.5rem 1rem; }
.vs-figure-num { font-variant-numeric:tabular-nums; }
.vs-stat-cap { font-size:.8125rem; color:var(--text-muted); margin-top:.6rem; line-height:1.5; }
.vs-grid-2 { display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:768px) { .vs-grid-2 { grid-template-columns:1fr 1fr; gap:1.25rem; } }
.vs-grid-3 { display:grid; grid-template-columns:1fr; gap:1rem; }
@media (min-width:768px) { .vs-grid-3 { grid-template-columns:repeat(3,1fr); } }
.vs-h2h { width:100%; font-variant-numeric:tabular-nums; }
.vs-h2h th, .vs-h2h td { padding:.7rem .9rem; }
.vs-h2h thead th { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); font-weight:500; border-bottom:1px solid var(--border-table); text-align:right; }
.vs-h2h thead th:first-child { text-align:left; }
.vs-h2h tbody td { text-align:right; color:var(--text-primary); font-weight:500; border-bottom:1px solid var(--border-table-row); white-space:nowrap; }
.vs-h2h tbody td:first-child { text-align:left; color:var(--text-secondary); font-weight:400; white-space:normal; }
.vs-h2h tbody td:last-child { color:var(--text-muted); font-weight:400; }
.vs-neg { color:var(--negative); }
.vs-pos { color:var(--positive); }
.vs-takeaways { list-style:none; margin:0; padding:0; counter-reset:finding; }
.vs-takeaways li {
  position:relative; padding:1.1rem 0 1.1rem 3rem; border-bottom:1px solid var(--border-subtle);
  color:var(--text-secondary); line-height:1.7; counter-increment:finding;
}
.vs-takeaways li:last-child { border-bottom:none; }
.vs-takeaways li::before {
  content:counter(finding,decimal-leading-zero); position:absolute; left:0; top:1.25rem;
  font-size:.75rem; font-weight:600; letter-spacing:.08em; color:var(--accent-blue);
  font-variant-numeric:tabular-nums;
}
.vs-scroll { overflow-x:auto; }
.vs-scroll table { min-width:38rem; width:100%; }
/* Below 760px the paired tables stack, so both banks stay on screen together
   rather than sitting either side of a horizontal scroll. */
@media (max-width:760px) {
  .vs-scroll .vs-h2h, .vs-scroll .vs-ledger { min-width:0; }
  .vs-h2h thead, .vs-ledger thead { display:none; }
  .vs-h2h tbody tr, .vs-ledger tbody tr {
    display:grid; grid-template-columns:1fr 1fr; gap:.1rem .75rem;
    padding:.9rem 0; border-bottom:1px solid var(--border-table-row);
  }
  .vs-h2h tbody td, .vs-ledger tbody td {
    border-bottom:none; padding:0; white-space:normal; text-align:left;
    font-size:.95rem; font-weight:600; color:var(--text-primary);
  }
  .vs-h2h tbody td:first-child, .vs-ledger tbody td:first-child {
    grid-column:1 / -1; margin-bottom:.45rem; font-size:.7rem; font-weight:500;
    text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted);
  }
  .vs-h2h tbody td:nth-child(2)::before, .vs-ledger tbody td:nth-child(2)::before { content:'Monzo'; }
  .vs-h2h tbody td:nth-child(3)::before, .vs-ledger tbody td:nth-child(3)::before { content:'Starling'; }
  .vs-h2h tbody td:nth-child(2)::before, .vs-h2h tbody td:nth-child(3)::before,
  .vs-ledger tbody td:nth-child(2)::before, .vs-ledger tbody td:nth-child(3)::before {
    display:block; margin-bottom:.15rem; font-size:.65rem; font-weight:500;
    text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted);
  }
  .vs-h2h tbody td:nth-child(4) {
    grid-column:1 / -1; margin-top:.5rem; font-size:.8125rem; font-weight:400; color:var(--text-muted);
  }
  .vs-ledger tbody td[colspan] { grid-column:1 / -1; margin-bottom:0; }
  .vs-h2h tbody td.vs-pos, .vs-ledger tbody td.vs-pos { color:var(--positive); }
  .vs-h2h tbody td.vs-neg, .vs-ledger tbody td.vs-neg { color:var(--negative); }
  .vs-legend { gap:.75rem 1.25rem; margin-top:1rem; }
}
.vs-flow { --flow-payroll:var(--accent-indigo); --flow-running:var(--accent-amber); --flow-profit:var(--accent-teal); --flow-fill:0.22; }
[data-theme="light"] .vs-flow { --flow-fill:0.14; }
.vs-flow .vs-svg-mobile { display:none; }
.vs-flow .vs-svg-desktop { display:block; width:100%; height:auto; }
@media (max-width:640px) {
  .vs-flow .vs-svg-mobile { display:block; width:100%; height:auto; }
  .vs-flow .vs-svg-desktop { display:none; }
}
.vs-legend { display:flex; flex-wrap:wrap; gap:1.25rem; margin-top:1.5rem; font-size:.8125rem; color:var(--text-secondary); }
.vs-legend span { display:inline-flex; align-items:center; gap:.5rem; }
.vs-legend i { width:.85rem; height:.85rem; border-radius:3px; border:1.5px solid currentColor; background:currentColor; opacity:.9; }
.vs-key-payroll { color:var(--accent-indigo); }
.vs-key-running { color:var(--accent-amber); }
.vs-key-profit { color:var(--accent-teal); }
.vs-caption { font-size:.8125rem; color:var(--text-muted); margin-top:1.25rem; line-height:1.6; }
.vs-footer { background:var(--surface-footer); border-top:1px solid var(--border-subtle); padding:3.5rem 0 2.5rem; }
.vs-footer a { color:var(--text-muted); text-decoration:none; font-size:.875rem; line-height:2; }
.vs-footer a:hover { color:var(--text-link); }
.vs-footer h4 { font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-primary); margin-bottom:.75rem; }
.vs-footer-grid { display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width:768px) { .vs-footer-grid { grid-template-columns:2fr 1fr 1fr 1fr; } }
.vs-note { font-size:.75rem; color:var(--text-muted); }
@media (prefers-reduced-motion:reduce) {
  .fade-up { opacity:1; transform:none; transition:none; }
  html { scroll-behavior:auto; }
}
/* Shared VS hero clearance for the fixed navigation. */
.vs-article-page > main{
  padding-top:80px;
}
.vs-article-page > main > .hero-gradient{
  padding-top:2rem!important;
}
.hero-content{
  position:relative;
  z-index:1;
}
.spk-wrap{
  width:min(1120px,92vw);
  margin:0 auto;
}
.spk-hero-inner{
  padding:2rem 0 0;
}
.spk-eyebrow{
  color:var(--accent-cyan);
  font-size:.75rem;
  letter-spacing:.14em;
  line-height:1.5;
  text-transform:uppercase;
  margin:0 0 1.25rem;
}
.spk-h1{
  color:var(--text-primary);
  font-family:Inter,system-ui,sans-serif;
  font-size:clamp(2rem,5.2vw,3.4rem);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.03em;
  max-width:20ch;
  margin:0;
}
.spk-standfirst{
  max-width:62ch;
  margin:1.5rem 0 0;
  color:var(--text-secondary);
  font-size:1.0625rem;
  line-height:1.75;
}
.spk-standfirst p{
  color:var(--text-secondary);
}
.spk-byline{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem 1rem;
  margin-top:2rem;
  color:var(--text-muted);
  font-size:.8125rem;
  line-height:1.5;
}
.spk-byline strong{
  color:var(--text-secondary);
  font-weight:500;
}
.spk-byline time{
  color:var(--text-primary);
}

/* Scrollbars on wide tables: match the site, not the browser default (24 Sep 2026) */
.vs-scroll{scrollbar-color:var(--accent-blue) rgba(255,255,255,.06);scrollbar-width:thin}
.vs-scroll::-webkit-scrollbar{height:8px}
.vs-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.06);border-radius:999px}
.vs-scroll::-webkit-scrollbar-thumb{background:var(--accent-blue);border-radius:999px}
.vs-scroll::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}