:root{--doc:1020px}

  [data-theme="midnight"]{--paper:#0A0D12;--card:#0F172A;--ink:#F6F7F5;--muted:#9AA6BC;--muted2:#8794AE;
    --blue:#1756FF;--cyan:#00E1FF;--teal:#2FE0BE;
    --line:rgba(255,255,255,.12);--line2:rgba(255,255,255,.07)}

  /* HERO — quiet, type-led */
  .ahero{max-width:var(--doc);margin:0 auto;padding:clamp(150px,24vh,240px) clamp(24px,5vw,64px) clamp(40px,7vh,80px)}
  .ahero .eyebrow{margin-bottom:26px}
  .ahero h1{font-size:clamp(30px,5vw,64px);max-width:20ch;letter-spacing:-.03em}
  .ahero h1 .k{color:var(--blue)}
  .ahero .lede{margin-top:28px;max-width:52ch;color:var(--muted);font-size:clamp(16px,1.4vw,20px)}
  .thread{margin-top:44px;height:96px;position:relative}
  .thread .ln{position:absolute;left:0;top:0;width:2px;height:100%;background:linear-gradient(180deg,var(--blue),transparent)}
  .thread .sig{position:absolute;left:-4px;width:10px;height:10px;border-radius:50%;background:var(--blue);box-shadow:0 0 14px 3px color-mix(in srgb,var(--blue) 60%,transparent);animation:sigdrop 3s ease-in-out infinite}
  @keyframes sigdrop{0%{top:-2px;opacity:0}15%{opacity:1}85%{opacity:1}100%{top:92px;opacity:0}}

  /* full-bleed B&W photography band */
  .band{position:relative;left:50%;transform:translateX(-50%);width:100vw;margin:clamp(30px,6vh,70px) 0 0}
  .photo{position:relative;height:clamp(320px,56vh,600px);display:grid;place-items:center;filter:grayscale(1) contrast(1.02);
    background:linear-gradient(120deg,#b9bdc0,#e7e9ea 55%,#cccfd1)}
  [data-theme="midnight"] .photo{background:linear-gradient(120deg,#0f1620,#232c38 55%,#161d27)}
  .photo .cap{text-align:center;color:#3a4048;font-family:var(--display);font-weight:500}
  [data-theme="midnight"] .photo .cap{color:#aeb6c2}
  .photo .cap .t{font-size:clamp(18px,2.2vw,26px)}
  .photo .cap .n{font-size:11px;letter-spacing:.22em;text-transform:uppercase;margin-top:10px;opacity:.7}
  .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;display:block}
  .photo:not(.map) img{object-position:center top}
  .photo.map{filter:none;background:#0A0D12}
  .photo.map::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(7,11,20,.72),rgba(7,11,20,.35) 40%,transparent 66%)}
  .mapcap{position:absolute;z-index:2;left:clamp(24px,6vw,84px);top:50%;transform:translateY(-50%);max-width:34ch;color:#fff}
  .mapcap .row+.row{margin-top:20px}
  .mapcap .lbl{display:block;font-family:var(--body);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-bottom:6px}
  .mapcap .cities{font-family:var(--display);font-weight:500;font-size:clamp(18px,2vw,28px);line-height:1.2;letter-spacing:-.01em;text-shadow:0 2px 18px rgba(0,0,0,.45)}
  @media(max-width:600px){.mapcap .cities{font-size:18px}}

  /* DOC — chapters on a signal-thread spine */
  .doc{max-width:var(--doc);margin:0 auto;padding:0 clamp(24px,5vw,64px)}
  .ch{display:grid;grid-template-columns:60px 1fr;padding:clamp(56px,10vh,110px) 0}
  .ch .rail{position:relative}
  .ch .rail::before{content:"";position:absolute;left:5px;top:-1px;bottom:-1px;width:1px;background:var(--blue);opacity:.16}
  .ch:first-of-type .rail::before{top:14px}
  .ch:last-of-type .rail::before{bottom:auto;height:26px}
  .ch .node{position:absolute;left:0;top:8px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid var(--blue);transition:background .3s,box-shadow .3s}
  .ch.in .node{background:var(--blue);box-shadow:0 0 12px 2px color-mix(in srgb,var(--blue) 55%,transparent)}
  .ch .num{font-family:var(--display);font-weight:600;font-size:12px;color:var(--muted);letter-spacing:.1em;margin-bottom:16px;display:block}
  .ch h2{font-size:clamp(26px,3.6vw,46px);max-width:20ch}.ch h2 .k{color:var(--blue)}
  .ch p{margin-top:20px;max-width:58ch;color:var(--muted);font-size:clamp(16px,1.3vw,19px)}
  .ch p.big{color:var(--ink);font-family:var(--display);font-size:clamp(19px,1.9vw,26px);font-weight:500;max-width:30ch}
  @media(max-width:720px){.ch{grid-template-columns:1fr}.ch .rail{display:none}}

  /* verbs row */
  .verbs{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 12px}
  .verbs span{font-family:var(--display);font-weight:500;font-size:clamp(17px,1.7vw,22px)}
  .verbs span+span::before{content:"·";color:var(--blue);margin-right:12px}

  /* what makes different — Not lines */
  .diff{margin-top:14px}
  .diff .no{font-family:var(--display);font-weight:500;font-size:clamp(20px,2.6vw,34px);color:var(--muted);line-height:1.25}
  .diff .no b{color:var(--ink);font-weight:500}
  .diff .yes{margin-top:22px;font-family:var(--display);font-weight:500;font-size:clamp(20px,2.6vw,34px);color:var(--ink);max-width:24ch;line-height:1.2}
  .diff .yes b{color:var(--blue);font-weight:500}

  /* principles */
  .principles{margin-top:8px;border-top:1px solid var(--line2)}
  .pr{display:grid;grid-template-columns:64px 1fr;gap:20px;padding:24px 0;border-bottom:1px solid var(--line2);align-items:baseline}
  .pr .pn{font-family:var(--display);font-weight:600;color:var(--blue);font-size:15px}
  .pr h3{font-size:clamp(19px,1.9vw,24px)}
  .pr p{margin-top:6px;color:var(--muted);font-size:15.5px;max-width:52ch}
  @media(max-width:560px){.pr{grid-template-columns:1fr;gap:4px}}

  /* MANIFESTO */
  .manifesto{position:relative;left:50%;transform:translateX(-50%);width:100vw;background:var(--ink);color:var(--paper);text-align:center;padding:clamp(90px,16vh,180px) 24px;margin-top:0}
  [data-theme="midnight"] .manifesto{background:#05070b}
  .manifesto .fe{font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--cyan);font-weight:600}
  .manifesto h2{margin:22px auto 0;max-width:20ch;font-size:clamp(30px,5vw,66px);color:#fff;letter-spacing:-.03em}
  .manifesto h2 .k{color:var(--cyan)}
  .manifesto p{margin:26px auto 0;max-width:54ch;color:#AEB6C4;font-size:clamp(15px,1.3vw,18px)}

  .final{text-align:center;padding:clamp(96px,15vh,160px) 0;background:radial-gradient(46% 60% at 50% 50%,rgba(37,99,235,.08),transparent 70%),var(--paper)}
  .final h2{font-size:clamp(32px,5vw,64px);max-width:18ch;margin:0 auto}.final h2 .k{color:var(--blue)}
  .final .cta{margin-top:30px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}