/* ============================================================
   GridLens — Light Editorial Public Landing (proposal 04)
   Sample-style editorial structure on the canonical LIGHT GridLens
   identity: Paper bg, Source Serif 4 + Sora (bundled), navy/sage,
   Aperture lockup. Honest copy only.
   ============================================================ */

@font-face { font-family: "Sora"; src: url("fonts/sora-latin.woff2") format("woff2"); font-weight: 100 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("fonts/source-serif-4-latin.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("fonts/jetbrains-mono.woff2") format("woff2"); font-weight: 100 800; font-style: normal; font-display: swap; }

:root {
  --navy:#0d1b2a; --ink:#0b1d31; --steel:#264653; --graphite:#1a1d21;
  --muted:#52636c; --faint:#7d8d96;
  --paper:#fbfaf7; --panel:#f7f8f8; --stone:#f1f3f5; --mist:#dce4ea; --line:#d8dfe1;
  --sage:#62877a; --sage-dark:#52746c; --sage-soft:#dfe9e4;
  --amber:#c6a15b; --cyan:#7bc4d5;
  --shadow:0 22px 55px rgba(13,27,42,.10);
  --font-ui:"Sora", ui-sans-serif, system-ui, sans-serif;
  --font-serif:"Source Serif 4", Georgia, serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --ease:cubic-bezier(.4,0,.2,1); --ease-out:cubic-bezier(.16,1,.3,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-ui); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }

.shell { max-width:1180px; margin-inline:auto; padding-inline:clamp(20px,5vw,48px); }
.section { padding-block:clamp(64px,9vw,120px); }

/* ---------- labels ---------- */
.label { font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--steel); display:inline-flex; align-items:center; gap:10px; }
.label::before { content:""; width:22px; height:2px; background:var(--sage); }
.kicker { color:var(--steel); text-transform:uppercase; letter-spacing:.15em; font-weight:700; font-size:.68rem; margin:0 0 1.1rem; }
.label .num { color:var(--sage); }

/* ---------- header ---------- */
.site-header { position:sticky; top:0; z-index:50; background:rgba(251,250,247,.9); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
.header-inner { display:flex; align-items:center; gap:26px; min-height:116px; }
.brand { display:flex; flex-direction:column; align-items:flex-start; gap:5px; line-height:0; }
.brand .lockup { height:78px; width:auto; }
.brand small { font-family:var(--font-mono); font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--sage-dark); line-height:1.2; }
.main-nav { margin-left:auto; display:flex; align-items:center; gap:clamp(16px,2.6vw,32px); }
.main-nav a:not(.cta) { font-size:14px; font-weight:500; color:var(--muted); }
.main-nav a:not(.cta):hover { color:var(--ink); }
.cta { display:inline-flex; align-items:center; gap:8px; background:var(--sage); color:var(--paper); font-weight:700; font-size:13.5px; padding:11px 18px; border-radius:5px; border:1px solid var(--sage); transition:background .2s var(--ease),transform .2s var(--ease); }
.cta:hover { background:var(--sage-dark); border-color:var(--sage-dark); }
.cta-lg { font-size:15px; padding:14px 22px; }
.cta .arr { transition:transform .2s var(--ease); }
.cta:hover .arr { transform:translate(2px,-2px); }
.mobile-toggle { display:none; background:none; border:0; font:inherit; font-weight:700; color:var(--ink); cursor:pointer; }

/* ---------- hero ---------- */
.hero { padding:clamp(56px,7vw,96px) 0 clamp(40px,6vw,72px); background:radial-gradient(circle at 80% 8%, rgba(98,135,122,.16), transparent 26rem), linear-gradient(120deg, var(--paper) 0%, var(--stone) 100%); overflow:hidden; }
.eyebrow { color:var(--steel); text-transform:uppercase; letter-spacing:.15em; font-weight:700; font-size:.7rem; margin:0 0 1.3rem; }
.eyebrow .tick { color:var(--sage); }
.hero h1 { font-family:var(--font-serif); font-weight:600; font-size:clamp(3.1rem,6vw,6rem); line-height:1.0; letter-spacing:-.04em; margin:0 0 1.1rem; max-width:15ch; text-wrap:balance; }
.hero h1::after { content:""; display:block; width:4.5rem; height:3px; margin-top:1.4rem; background:var(--sage); }
.hero h1 .em { font-style:italic; color:var(--sage-dark); }
.hero-lede { color:var(--muted); font-size:clamp(1.05rem,1.5vw,1.2rem); max-width:60ch; }
.hero-lede b { color:var(--ink); font-weight:600; }
.hero-actions { display:flex; align-items:center; gap:clamp(16px,3vw,30px); margin-top:2.2rem; flex-wrap:wrap; }
.text-link { display:inline-flex; align-items:center; gap:.5rem; color:var(--steel); font-weight:700; font-size:.88rem; border-bottom:1px solid var(--line); padding-bottom:2px; }
.text-link:hover { color:var(--sage-dark); }
.hero-foot { margin-top:clamp(36px,5vw,56px); padding-top:18px; border-top:1px solid var(--line); }
.hero-foot .label { font-size:10.5px; }

/* operating proof card under hero */
.op-panel { margin-top:clamp(40px,6vw,64px); background:#fff; border:1px solid rgba(13,27,42,.12); border-radius:10px; box-shadow:var(--shadow); overflow:hidden; }
.op-head { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 20px; border-bottom:1px solid var(--line); }
.op-head .k { font-size:.62rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--sage-dark); }
.op-pill { display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .7rem; border-radius:999px; background:var(--navy); color:#fff; font-size:.62rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.op-dot { width:.45rem; height:.45rem; border-radius:50%; background:var(--sage); }
.op-body { padding:clamp(22px,3vw,34px); display:grid; grid-template-columns:minmax(0,1.5fr) minmax(220px,.8fr); gap:clamp(24px,4vw,50px); }
.op-sum h3 { font-family:var(--font-serif); font-weight:600; font-size:clamp(1.9rem,3.2vw,2.8rem); letter-spacing:-.03em; margin:.2rem 0 .8rem; line-height:1.05; }
.op-tags { display:flex; flex-wrap:wrap; gap:.45rem; color:var(--steel); font-size:.72rem; font-weight:700; margin-top:.4rem; }
.op-sum p { color:var(--muted); font-size:.92rem; max-width:50ch; margin-top:1rem; }
.op-conf { display:grid; align-content:center; gap:.3rem; padding-left:1.6rem; border-left:1px solid var(--line); }
.op-conf .num { font-family:var(--font-serif); font-weight:600; font-size:3rem; letter-spacing:-.03em; color:var(--ink); line-height:1; }
.op-conf .cap { font-size:.6rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--sage-dark); }
.op-rows { border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr 1fr; }
.op-row { padding:14px 20px; border-right:1px solid var(--line); }
.op-row:last-child { border-right:0; }
.op-row .k { font-size:.58rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--sage-dark); }
.op-row b { display:block; font-size:.84rem; margin-top:4px; color:var(--ink); font-weight:600; }

/* ---------- posture marquee (light) ---------- */
.posture { border-block:1px solid var(--line); padding-block:14px; background:var(--paper); overflow:hidden; }
.posture .shell { margin-bottom:6px; }
.marquee { overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
.marquee-track { display:flex; width:max-content; animation:slide 36s linear infinite; }
.marquee:hover .marquee-track { animation-play-state:paused; }
.m-term { font-family:var(--font-mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); white-space:nowrap; padding-inline:24px; display:inline-flex; align-items:center; gap:24px; }
.m-term::after { content:"·"; color:var(--sage); }
.m-term.strong { color:var(--ink); }
@keyframes slide { to { transform:translateX(-50%); } }

/* ---------- section head ---------- */
.section-head { max-width:760px; margin-bottom:clamp(32px,4.5vw,56px); }
.section-head h2 { font-family:var(--font-serif); font-weight:600; font-size:clamp(2.3rem,4.5vw,4.3rem); letter-spacing:-.035em; line-height:1.03; margin:.9rem 0 0; }
.section-head .lede { color:var(--muted); margin-top:1.1rem; font-size:1.05rem; max-width:56ch; }
.section-head h2 .em { font-style:italic; color:var(--sage-dark); }
.head-row { display:flex; justify-content:space-between; align-items:baseline; gap:20px; flex-wrap:wrap; }

/* quiet math band */
.quiet-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.quiet-cell { background:var(--stone); border:1px solid var(--line); border-radius:8px; padding:clamp(22px,2.4vw,30px); }
.quiet-cell .idx { font-family:var(--font-mono); font-size:11px; color:var(--sage); letter-spacing:.1em; }
.quiet-cell h3 { font-family:var(--font-serif); font-weight:600; font-size:1.5rem; letter-spacing:-.02em; margin:.8rem 0 .5rem; line-height:1.15; }
.quiet-cell p { margin:0; color:var(--muted); font-size:.92rem; }
.quiet-cell .tag { display:inline-block; margin-top:16px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--sage-dark); border:1px solid var(--sage); border-radius:999px; padding:4px 9px; }

/* audience cards */
.aud-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.aud-card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:clamp(22px,2.6vw,30px); position:relative; transition:transform .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease); }
.aud-card:hover { transform:translateY(-3px); border-color:var(--sage); box-shadow:var(--shadow); }
.aud-card .idx { font-family:var(--font-mono); font-size:11px; color:var(--sage); }
.aud-card .rule { display:block; width:34px; height:2px; background:var(--sage-soft); margin:12px 0; }
.aud-card h3 { font-family:var(--font-serif); font-weight:600; font-size:clamp(1.4rem,2vw,1.9rem); letter-spacing:-.02em; margin:0 0 .5rem; }
.aud-card p { color:var(--muted); font-size:.92rem; margin:0; }
.aud-card .go { margin-top:18px; color:var(--steel); font-weight:700; font-size:.84rem; display:inline-flex; gap:8px; align-items:center; }
.aud-card .go .arr { color:var(--sage); transition:transform .2s var(--ease); }
.aud-card:hover .go .arr { transform:translate(3px,0); }

/* ---------- early-signal figure ---------- */
.statement .head { font-family:var(--font-serif); font-weight:600; font-size:clamp(2.4rem,4.6vw,4.4rem); letter-spacing:-.035em; line-height:1.03; margin:.4rem 0 1rem; max-width:24ch; text-wrap:balance; }
.statement .head em { font-style:italic; color:var(--sage-dark); }
.statement .sub { color:var(--muted); font-size:clamp(1.05rem,1.6vw,1.2rem); max-width:56ch; }
.figure { margin-top:clamp(32px,5vw,52px); border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#fff; position:relative; }
.figure-svg { width:100%; display:block; }
.fig-tag { position:absolute; top:18px; left:18px; font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--sage-dark); background:rgba(251,250,247,.88); border:1px solid var(--line); border-radius:999px; padding:6px 12px; display:inline-flex; align-items:center; gap:8px; }
.fig-tag::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--sage); }
.fig-note { position:absolute; left:20px; bottom:56px; max-width:320px; }
.fig-note b { font-family:var(--font-serif); font-weight:600; font-style:italic; font-size:clamp(1.2rem,2vw,1.6rem); line-height:1.15; color:var(--ink); }
.fig-note span { display:block; margin-top:6px; color:var(--muted); font-size:.86rem; }
.fig-hint { position:absolute; right:20px; bottom:58px; text-align:right; font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.fig-hint b { color:var(--sage-dark); }
.fig-caption { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:13px 18px; border-top:1px solid var(--line); background:var(--panel); color:var(--steel); font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; }

/* ---------- loop 5 steps ---------- */
.loop-grid { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid var(--line); margin-top:clamp(28px,4vw,48px); }
.loop-step { padding:1.6rem 1.4rem 1.2rem 0; border-bottom:1px solid var(--line); }
.loop-step + .loop-step { border-left:1px solid var(--line); padding-left:1.4rem; }
.loop-step .n { font-family:var(--font-mono); font-size:11px; color:var(--sage); letter-spacing:.1em; }
.loop-step h3 { font-family:var(--font-serif); font-weight:600; font-size:1.5rem; letter-spacing:-.02em; margin:.7rem 0 .5rem; }
.loop-step p { color:var(--muted); font-size:.86rem; margin:0; }
.loop-step .focus { color:var(--sage-dark); font-weight:600; }

/* ---------- pull quote ---------- */
.quote-band { text-align:center; padding-block:clamp(70px,10vw,120px); }
.quote-mark { font-family:var(--font-serif); font-size:90px; line-height:0; color:var(--sage); opacity:.4; display:block; margin:0 0 14px; }
.quote { font-family:var(--font-serif); font-weight:500; font-style:italic; font-size:clamp(1.5rem,3vw,2.6rem); line-height:1.3; letter-spacing:-.01em; max-width:26ch; margin:0 auto; text-wrap:balance; color:var(--ink); }
.quote cite { display:block; margin-top:26px; font-style:normal; }
.quote cite .who { font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--sage-dark); }
.quote cite .at { display:block; margin-top:4px; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em; color:var(--muted); }

/* ---------- case file ---------- */
.case { background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(20px,3vw,44px); padding:clamp(24px,3vw,40px); align-items:center; }
.case .label { margin-bottom:12px; }
.case h3 { font-family:var(--font-serif); font-weight:600; font-size:clamp(1.6rem,2.6vw,2.4rem); letter-spacing:-.025em; margin:0 0 .8rem; line-height:1.12; }
.case-lede { color:var(--muted); font-size:.96rem; max-width:50ch; }
.case-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:22px; }
.case-metric { border:1px solid var(--line); border-radius:6px; padding:14px 16px; background:var(--panel); }
.case-metric .v { font-family:var(--font-serif); font-weight:600; font-size:1.8rem; color:var(--ink); letter-spacing:-.02em; line-height:1; }
.case-metric .v small { font-size:1rem; color:var(--sage-dark); }
.case-metric .k { display:block; margin-top:8px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); }
.case-note { margin-top:18px; font-family:var(--font-mono); font-size:11px; color:var(--muted); }
.case-art { display:flex; align-items:center; justify-content:center; background:var(--stone); border-radius:8px; padding:20px; }
.case-art svg { width:100%; max-width:300px; }

/* ---------- sources ---------- */
.src-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:clamp(26px,4vw,44px); }
.src-chip { border:1px solid var(--line); border-radius:6px; background:#fff; padding:18px; display:flex; flex-direction:column; gap:5px; transition:border-color .2s; }
.src-chip:hover { border-color:var(--sage); }
.src-chip .k { font-weight:600; color:var(--ink); }
.src-chip .sub { font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--sage-dark); }

/* ---------- privacy ---------- */
.band-private { background:var(--stone); border-block:1px solid var(--line); }
.pill-grid { display:flex; flex-wrap:wrap; gap:10px; margin-top:clamp(26px,4vw,40px); }
.pill { border:1px solid var(--line); border-radius:999px; padding:12px 18px; font-size:14px; background:#fff; color:var(--ink); }
.pill b { color:var(--sage-dark); }
.pill .ck { color:var(--sage); }

/* ---------- closer ---------- */
.close { padding-block:clamp(80px,12vw,150px); }
.close h2 { font-family:var(--font-serif); font-weight:600; font-size:clamp(2.6rem,5.6vw,5rem); letter-spacing:-.035em; line-height:1.0; margin:0 0 1rem; max-width:18ch; text-wrap:balance; }
.close h2 em { font-style:italic; color:var(--sage-dark); }
.close .sub { color:var(--muted); font-size:1.1rem; max-width:46ch; }
.close-actions { margin-top:2.2rem; display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.private-note { font-family:var(--font-mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }

/* ---------- footer ---------- */
.site-footer { border-top:1px solid var(--line); padding-block:28px 36px; color:var(--muted); font-size:.84rem; }
.footer-inner { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.footer-inner .links { display:flex; gap:20px; }
.footer-inner a:hover { color:var(--ink); }

.skip-link { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { position:fixed; left:1rem; top:1rem; width:auto; height:auto; overflow:visible;
  background:var(--ink); color:#fff; padding:.7rem 1.1rem; border-radius:6px; font-weight:600; z-index:300;
  box-shadow:0 6px 18px rgba(11,29,49,.35); }

/* reveal — enhancement only; content visible without JS */
.reveal { opacity:1; transform:none; }
html.js .reveal { opacity:0; transform:translateY(16px); }
html.js .reveal.in { opacity:1; transform:none; transition:opacity .7s var(--ease-out), transform .7s var(--ease-out); }

@media (max-width:920px){
  .quiet-grid,.aud-grid,.src-grid { grid-template-columns:1fr; }
  .loop-grid { grid-template-columns:1fr; border-top:1px solid var(--line); }
  .loop-step,.loop-step+.loop-step { border-left:0; padding-left:0; }
  .case { grid-template-columns:1fr; }
  .op-body { grid-template-columns:1fr; }
  .op-conf { border-left:0; padding-left:0; border-top:1px solid var(--line); padding-top:1rem; }
  .op-rows { grid-template-columns:1fr; }
  .op-row { border-right:0; border-bottom:1px solid var(--line); }
  .op-row:last-child { border-bottom:0; }
  .main-nav .nav-links { display:none; }
  .mobile-toggle { display:inline-block; }
  .brand small { display:none; }
  .hero h1 { max-width:12ch; }
}
@media (max-width:520px){ .case-metrics{ grid-template-columns:1fr; } .fig-note{ position:static; padding:14px 16px; } .fig-hint{ display:none; } .src-grid{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important; } .reveal{ opacity:1; transform:none; } }

/* ============================================================
   Signal Floor / LIVE monitor (copied graphic from reference)
   Dark operating-view telemetry card, inset into the light hero.
   ============================================================ */
.hero-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,430px); gap:clamp(2.5rem,6vw,5.5rem); align-items:center; }
.hero-copy { max-width:640px; }
.hero-copy h1 { max-width:15ch; }

.sf-monitor {
  position:relative; overflow:hidden;
  border-radius:12px; border:1px solid rgba(220,228,234,.14);
  background:radial-gradient(120% 90% at 100% 0%, rgba(123,162,143,.16), transparent 55%), linear-gradient(180deg, #0e2132 0%, #0a1722 100%);
  color:#eef3f6; padding:clamp(18px,2vw,24px);
  box-shadow:0 28px 70px -34px rgba(11,29,49,.7);
  display:flex; flex-direction:column; gap:14px;
}
.sf-mon-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.sf-mon-title { font-family:var(--font-mono); font-size:11px; letter-spacing:.18em; color:#9db2c2; }
.sf-live { display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:10px; letter-spacing:.16em; color:var(--sage); }
.sf-pulse { width:7px; height:7px; border-radius:50%; background:var(--sage); box-shadow:0 0 0 0 rgba(98,135,122,.6); animation:sfPulse 2.4s ease-in-out infinite; }
@keyframes sfPulse { 0%{box-shadow:0 0 0 0 rgba(98,135,122,.55)} 60%{box-shadow:0 0 0 9px rgba(98,135,122,0)} 100%{box-shadow:0 0 0 0 rgba(98,135,122,0)} }
.sf-wave { position:relative; display:flex; align-items:flex-end; gap:2px; height:clamp(90px,11vw,120px); }
.sf-wave::after { content:""; position:absolute; left:0; right:0; top:0; height:38%; pointer-events:none; background:linear-gradient(180deg, transparent, rgba(98,135,122,.10) 50%, rgba(98,135,122,.22) 82%, transparent); transform:translateY(-130%); animation:sfScan 5.5s linear infinite; }
@keyframes sfScan { to { transform:translateY(340%); } }
.sf-wave i { flex:1; min-width:2px; border-radius:2px 2px 0 0; background:linear-gradient(180deg, #a9cfbe, #52746c); transform-origin:bottom; animation:sfBar 3.2s ease-in-out infinite; }
@keyframes sfBar { 0%,100%{transform:scaleY(.12)} 50%{transform:scaleY(1)} }
.sf-spectrum { display:flex; align-items:center; gap:1px; height:16px; opacity:.8; }
.sf-spectrum i { flex:1; border-radius:1px; background:#52746c; animation:sfBar 2.2s ease-in-out infinite reverse; }
.sf-rows { display:flex; flex-direction:column; }
.sf-row { display:flex; align-items:baseline; justify-content:space-between; gap:16px; padding:9px 0; border-top:1px solid rgba(220,228,234,.12); }
.sf-row .lbl { font-family:var(--font-mono); font-size:9.5px; letter-spacing:.16em; color:#9db2c2; }
.sf-row .val { font-family:var(--font-mono); font-size:14.5px; letter-spacing:.04em; color:#eef3f6; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sf-row .val .unit { margin-left:3px; font-size:11px; color:#a9cfbe; }
.sf-mon-foot { font-family:var(--font-mono); font-size:9.5px; letter-spacing:.05em; line-height:1.6; color:#7d93a6; }

@media (max-width:1000px){ .hero-grid{ grid-template-columns:1fr; gap:2.5rem; } .hero-copy{ max-width:720px; } .sf-monitor{ max-width:560px; } }
@media (prefers-reduced-motion:reduce){ .sf-wave i,.sf-spectrum i{ animation:none !important; } .sf-pulse,.sf-wave::after{ animation:none !important; } }

/* ============================================================
   Power-gap timeline figure (horizontal start/stop bars)
   ============================================================ */
.figure-gaps { border:1px solid var(--line); border-radius:10px; background:#fff; overflow:hidden; margin-top:clamp(32px,5vw,52px); }
.gaps-tool { display:flex; justify-content:space-between; align-items:baseline; gap:16px; flex-wrap:wrap; padding:15px 20px; border-bottom:1px solid var(--line); background:var(--panel); }
.gaps-tool .note { font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; color:var(--muted); }
.gaps { padding:4px 20px 20px; }
.axis-row { display:grid; grid-template-columns:minmax(190px,250px) 1fr; gap:22px; }
.axis-row .axis-name { display:block; }
.axis { display:grid; grid-template-columns:repeat(12,1fr); border-bottom:1px solid var(--line); }
.axis span { font-family:var(--font-mono); font-size:8.5px; color:var(--muted); text-align:center; padding:5px 0 4px; }
.gap-row { display:grid; grid-template-columns:minmax(190px,250px) 1fr; gap:22px; align-items:center; padding:16px 0; border-bottom:1px solid var(--line); }
.gap-row:last-child { border-bottom:0; }
.gap-name .n { font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; color:var(--sage); }
.gap-name b { display:block; font-weight:600; font-size:.95rem; color:var(--ink); margin-top:3px; line-height:1.2; }
.gap-name small { display:block; font-family:var(--font-mono); font-size:9px; letter-spacing:.04em; color:var(--muted); margin-top:4px; }
.gap-track { position:relative; height:36px; }
.gap-track .bar { position:absolute; top:50%; transform:translateY(-50%); height:22px; border-radius:5px; display:flex; align-items:center; justify-content:space-between; padding:0 10px; background:linear-gradient(90deg, var(--sage-dark), var(--sage)); border:none; box-shadow:0 2px 8px rgba(98,135,122,.32); }
.gap-track .bar::before { content:""; position:absolute; left:-2px; top:50%; width:6px; height:6px; border-radius:50%; background:#fff; transform:translate(-50%,-50%); box-shadow:0 0 0 2px var(--sage-dark); }
.gap-track .bar .d { font-family:var(--font-mono); font-size:8.5px; letter-spacing:.03em; color:#fff; white-space:nowrap; font-weight:700; }
.gap-track .mark { position:absolute; top:0; bottom:0; width:1px; background:var(--amber); opacity:.5; }
.gaps-foot { padding:10px 20px 14px; border-top:1px solid var(--line); font-family:var(--font-mono); font-size:10px; letter-spacing:.04em; color:var(--muted); background:var(--panel); }
@media (max-width:640px){ .gap-row{ grid-template-columns:1fr; gap:6px; } .gap-name{ margin-bottom:2px; } }



/* --- header mark sizing (approved landing logo) --- */
.brand .mark { height:78px; width:auto; }
.brand { gap:6px; }