@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/SpaceGrotesk-500.woff2') format('woff2')}
@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/SpaceGrotesk-700.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/Figtree-400.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/Figtree-500.woff2') format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/Figtree-600.woff2') format('woff2')}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/SpaceMono-400.woff2') format('woff2')}

:root{
  --cobalt:#1B41C4; --cobalt-2:#1836A6; --cobalt-3:#2E56E0;
  --chalk:#F6F7FB; --paper:#FFFFFF; --mist:#E9ECF6;
  --graphite:#171A22;
  --lime:#C6F24E;                 /* dark grounds only. See the docstring. */

  --ink:#171A22; --ink-2:#454B5C; --ink-3:#5C6377;
  --on-cobalt:#F6F7FB; --on-cobalt-2:#C3CEF5;

  --rule:#DFE3EF; --rule-2:#C7CDDF; --rule-cobalt:#3A5CD4;

  --shell:min(1320px,92vw);
  --bar:92px;
  --r:24px; --r-sm:14px;          /* generously rounded images, per the brief */

  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --back:cubic-bezier(.34,1.56,.64,1);
  --t:.5s;
}


*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--bar) + 24px)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--chalk);color:var(--ink);
  font:400 19px/1.66 Figtree,-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,sans-serif;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}

h1,h2,h3,h4{margin:0;font-family:'Space Grotesk',Figtree,sans-serif;font-weight:700;
  line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
.d0{font-size:clamp(3.4rem,9vw,8.2rem);line-height:.92;letter-spacing:-.05em}
.d1{font-size:clamp(2.6rem,5.4vw,4.6rem);line-height:1;letter-spacing:-.04em}
.d2{font-size:clamp(2.1rem,3.9vw,3.4rem);letter-spacing:-.035em}
.d3{font-size:clamp(1.38rem,2.1vw,1.85rem);letter-spacing:-.025em}
.d4{font-size:1.24rem;letter-spacing:-.015em;font-weight:600;line-height:1.3}
p{margin:0 0 1.15em;max-width:62ch;text-wrap:pretty;color:var(--ink-2)}
p:last-child{margin-bottom:0}
.lead{font-size:clamp(1.2rem,1.5vw,1.42rem);line-height:1.56;color:var(--ink-2);max-width:50ch}
.sm{font-size:1.02rem;line-height:1.6;color:var(--ink-2)}
.mono{font-family:'Space Mono',ui-monospace,Menlo,monospace;font-weight:400;font-size:.84rem;
  letter-spacing:.1em;text-transform:uppercase;font-variant-numeric:tabular-nums}

.eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--cobalt);margin:0 0 22px}
.eyebrow::before{content:"";width:34px;height:3px;background:var(--cobalt);border-radius:3px}
.on-cobalt .eyebrow{color:var(--lime)}
.on-cobalt .eyebrow::before{background:var(--lime)}
.accent{color:var(--cobalt)}
.on-cobalt .accent{color:var(--lime)}

::selection{background:var(--cobalt);color:#fff}
:focus-visible{outline:3px solid var(--cobalt);outline-offset:3px;border-radius:4px}
.on-cobalt :focus-visible{outline-color:var(--lime)}
input,textarea{caret-color:var(--cobalt)}


.top{position:fixed;inset:0 0 auto;z-index:90;height:var(--bar);
  background:rgba(246,247,251,.88);backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid transparent;transition:border-color .3s var(--ease)}
.top.scrolled{border-bottom-color:var(--rule-2)}
.top .in{width:var(--shell);margin:0 auto;height:100%;display:flex;align-items:center;gap:20px}

.brand{display:flex;align-items:center;gap:14px;text-decoration:none;flex:0 0 auto;
  padding:6px 12px 6px 6px;margin-left:-6px;border-radius:999px;
  transition:background .3s var(--ease)}
.brand:hover,.brand:focus-visible{background:var(--mist)}
.brand img{height:48px;width:auto;flex:0 0 auto;transition:transform .55s var(--back)}
.brand:hover img,.brand:focus-visible img{transform:rotate(10deg) scale(1.08)}
.brand .word{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.14rem;
  letter-spacing:-.035em;white-space:nowrap;overflow:hidden;max-width:0;opacity:0;
  transform:translateX(-10px);
  transition:max-width .55s var(--ease),opacity .34s var(--ease),transform .55s var(--ease)}
.brand:hover .word,.brand:focus-visible .word{max-width:270px;opacity:1;transform:none}

/* nav sits in a pill rather than sitting loose on the bar - a different silhouette
   from site 9's underline row */
.nav{display:flex;gap:6px;margin-left:auto;align-items:center;list-style:none;
  margin-block:0;padding:6px;background:var(--mist);border-radius:999px}
.nav > li{position:relative}
.nav a,.nav button{text-decoration:none;font-size:1rem;font-weight:500;color:var(--ink-2);
  background:none;border:0;cursor:pointer;white-space:nowrap;border-radius:999px;
  padding:11px 18px;display:inline-flex;align-items:center;gap:8px;
  transition:background .25s var(--ease),color .25s var(--ease)}
.nav a:hover,.nav button:hover,.nav a[aria-current="page"]{background:var(--paper);color:var(--cobalt)}
.nav .caret{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform .35s var(--ease)}
.nav li.open .caret{transform:rotate(225deg) translateY(-2px)}

.menu{position:absolute;top:calc(100% + 12px);left:50%;translate:-50% 0;width:min(620px,88vw);
  padding:12px;margin:0;list-style:none;background:var(--paper);border:1px solid var(--rule-2);
  border-radius:var(--r);box-shadow:0 30px 70px -26px rgba(23,26,34,.32);
  display:grid;grid-template-columns:1fr 1fr;gap:4px;
  opacity:0;visibility:hidden;transform:translateY(-10px) scale(.97);transform-origin:top center;
  transition:opacity .3s var(--ease),transform .3s var(--back),visibility .3s}
.nav li.open .menu{opacity:1;visibility:visible;transform:none}
.menu a{display:block;padding:14px 16px;border-radius:var(--r-sm);background:none}
.menu a:hover{background:var(--mist)}
.menu .n{display:block;font-family:'Space Grotesk',sans-serif;font-weight:700;color:var(--ink);
  font-size:1.06rem;margin-bottom:3px}
.menu .d{display:block;font-size:.92rem;color:var(--ink-3);line-height:1.45}

.burger{display:none;margin-left:auto;width:52px;height:52px;border:0;border-radius:999px;
  background:var(--mist);cursor:pointer;padding:0;align-items:center;justify-content:center}
.burger span{display:block;width:20px;height:2px;background:var(--ink);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:20px;height:2px;
  background:var(--ink)}
.burger span::before{top:-7px} .burger span::after{top:7px}

.foot{background:var(--graphite);color:var(--on-cobalt);padding:100px 0 42px}
.foot .in{width:var(--shell);margin:0 auto}
.foot-grid{display:grid;grid-template-columns:1.7fr repeat(3,1fr);gap:clamp(28px,4vw,60px);
  align-items:start}
.foot img{height:54px;width:auto;margin-bottom:22px}
.foot .tag{font-size:1.06rem;line-height:1.6;color:var(--on-cobalt-2);max-width:32ch}
.foot h4{color:var(--lime);margin-bottom:18px;font-family:'Space Mono',monospace;font-weight:400;
  font-size:.84rem;letter-spacing:.1em;text-transform:uppercase}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.foot ul a{text-decoration:none;font-size:1.04rem;color:var(--on-cobalt-2);
  transition:color .25s var(--ease)}
.foot ul a:hover{color:var(--lime)}
.foot-base{margin-top:70px;padding-top:26px;border-top:1px solid #2A2E3A;
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:var(--on-cobalt-2)}


main{padding-top:var(--bar)}
.sec{padding:clamp(80px,11vh,160px) 0;position:relative}
.sec > .in{width:var(--shell);margin:0 auto}
.sec.tight{padding:clamp(54px,7vh,100px) 0}
.b-chalk{background:var(--chalk)}
.b-mist{background:var(--mist)}
.b-paper{background:var(--paper)}
/* cobalt as a full field, which is the identity of this site */
.b-cobalt{background:var(--cobalt);color:var(--on-cobalt)}
.b-cobalt p,.b-cobalt .lead,.b-cobalt .sm{color:var(--on-cobalt-2)}
.b-graphite{background:var(--graphite);color:var(--on-cobalt)}
.b-graphite p,.b-graphite .lead{color:var(--on-cobalt-2)}

.head{max-width:54ch;margin-bottom:clamp(40px,5.5vh,72px)}
.head .lead{margin-top:22px}
.rowend{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;
  margin-bottom:clamp(38px,5vh,64px)}
.rowend .head{margin-bottom:0}

.btnrow{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer;
  font-family:Figtree,sans-serif;font-size:1.06rem;font-weight:600;line-height:1;
  padding:19px 32px;border-radius:999px;border:2px solid transparent;
  transition:background .28s var(--ease),color .28s var(--ease),border-color .28s var(--ease),
             transform .28s var(--back)}
.btn.pri{background:var(--cobalt);color:#fff}
.btn.pri:hover{background:var(--cobalt-2);transform:translateY(-3px)}
.btn.sec{border-color:var(--rule-2);color:var(--ink)}
.btn.sec:hover{border-color:var(--cobalt);color:var(--cobalt);transform:translateY(-3px)}
/* on a cobalt field the primary flips to chartreuse with graphite text: 13.4:1 */
.b-cobalt .btn.pri,.b-graphite .btn.pri{background:var(--lime);color:var(--graphite)}
.b-cobalt .btn.pri:hover,.b-graphite .btn.pri:hover{background:#D6F877}
.b-cobalt .btn.sec{border-color:var(--rule-cobalt);color:var(--on-cobalt)}
.b-cobalt .btn.sec:hover{border-color:var(--lime);color:var(--lime)}
.btn .ar{transition:transform .28s var(--ease)}
.btn:hover .ar{transform:translateX(5px)}
.tlink{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--cobalt);
  font-size:1.06rem;font-weight:600;transition:gap .28s var(--ease)}
.tlink:hover{gap:16px}
.b-cobalt .tlink,.b-graphite .tlink{color:var(--lime)}


@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes riseScale{from{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:none}}
@keyframes drift{from{transform:translateY(-4%)}to{transform:translateY(4%)}}

.js .rv{opacity:0;transform:translateY(28px);transition:opacity .55s var(--ease),transform .55s var(--ease)}
.js .rv.vis{opacity:1;transform:none}
.rv.s1{transition-delay:.07s} .rv.s2{transition-delay:.14s} .rv.s3{transition-delay:.21s}
.rv.s4{transition-delay:.28s} .rv.s5{transition-delay:.35s}

@supports (animation-timeline: view()){
  .js .rv{opacity:1;transform:none;transition:none;animation:rise .8s var(--ease) both;
    animation-timeline:view();animation-range:entry 5% cover 26%}
  .js .stagger > *{animation:riseScale .72s var(--back) both;
    animation-timeline:view();animation-range:entry 2% cover 24%}
  .js .par img{animation:drift linear both;animation-timeline:view();animation-range:cover}
}

.stage > *{opacity:0;animation:rise .85s var(--ease-out) both}
.stage > *:nth-child(1){animation-delay:.06s}
.stage > *:nth-child(2){animation-delay:.16s}
.stage > *:nth-child(3){animation-delay:.26s}
.stage > *:nth-child(4){animation-delay:.36s}
.stage > *:nth-child(5){animation-delay:.46s}
.ln{display:block;overflow:hidden}
.ln > span{display:block;opacity:0;animation:rise .95s var(--ease-out) both}
.ln:nth-child(1) > span{animation-delay:.20s}
.ln:nth-child(2) > span{animation-delay:.31s}

@media (prefers-reduced-motion:reduce){
  .js .rv,.js .stagger > *,.stage > *,.ln > span{
    opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
  .js .par img{animation:none!important}
  .btn:hover,.card:hover{transform:none!important}
}


/* ---- hero: a cobalt field ------------------------------------------------------ */
.hero{padding:clamp(60px,9vh,120px) 0 clamp(56px,7vh,100px)}
.wordmark{font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(2.7rem,6.6vw,5.6rem);line-height:.95;letter-spacing:-.05em;
  color:var(--lime);margin:0 0 8px;display:block}
.hero .d1{margin:0 0 30px;max-width:15ch}
.hero .lead{margin-bottom:40px;max-width:46ch}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,1fr);
  gap:clamp(32px,4.5vw,76px);align-items:center}

.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,40px);
  margin-top:clamp(46px,5.5vh,76px);padding-top:clamp(26px,3vh,38px);
  border-top:1px solid var(--rule-cobalt)}
.facts dt{color:var(--on-cobalt-2);margin-bottom:10px}
.facts dd{margin:0;font-family:'Space Grotesk',sans-serif;font-size:1.14rem;line-height:1.38;
  color:var(--on-cobalt);font-weight:700}

.figure{margin:0;border-radius:var(--r);overflow:hidden;background:var(--mist)}
.figure img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:var(--r);
  will-change:transform}
.figure.wide img{aspect-ratio:16/9}
.figcap{margin-top:16px;color:var(--ink-3)}

/* ---- the pinned split: the site 10 signature ------------------------------------ */
/* The left column sticks while the right scrolls past it, and the pinned display
   swaps as each row crosses the midpoint. Different structure from site 9's flat
   list of rows, not just a different colour on the same layout. */
.split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(30px,5vw,90px);align-items:start}
.pinned{position:sticky;top:calc(var(--bar) + clamp(30px,6vh,80px));align-self:start}
.pinned .idx{font-family:'Space Mono',monospace;font-size:.9rem;color:var(--ink-3);
  display:block;margin-bottom:16px}
.pinned .now{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:-.04em;
  font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.02;color:var(--cobalt);min-height:2.1em;
  transition:opacity .3s var(--ease),transform .3s var(--ease)}
.pinned .now.swap{opacity:0;transform:translateY(-10px)}
.pinned .meta{margin-top:18px;color:var(--ink-3)}
.rows{display:grid}
.srow{padding:clamp(28px,3.6vh,44px) 0;border-top:1px solid var(--rule-2);
  transition:opacity .35s var(--ease)}
.rows > *:last-child{border-bottom:1px solid var(--rule-2)}
.srow h3{font-size:clamp(1.5rem,2.5vw,2rem);margin-bottom:12px;letter-spacing:-.03em}
.srow p{font-size:1.06rem;line-height:1.6;margin:0;max-width:44ch}
.srow .tag{color:var(--cobalt);display:block;margin-bottom:12px}
.js .srow{opacity:.42}
.js .srow.on{opacity:1}
@media (prefers-reduced-motion:reduce){.js .srow{opacity:1}}

/* ---- cards ----------------------------------------------------------------------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
  gap:clamp(18px,2.2vw,30px)}
.card{display:flex;flex-direction:column;text-decoration:none;color:inherit;
  background:var(--paper);border-radius:var(--r);overflow:hidden;
  transition:transform .28s var(--ease),box-shadow .28s var(--ease)}
.card .shot{overflow:hidden;background:var(--mist)}
.card .shot img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .7s var(--ease)}
.card .body{padding:clamp(24px,2.6vw,32px);display:flex;flex-direction:column;gap:12px;flex:1}
.card .lbl{color:var(--cobalt)}
.card p{font-size:1.02rem;line-height:1.58;margin:0;flex:1}
.card .go{display:inline-flex;align-items:center;gap:9px;color:var(--cobalt);font-size:1.02rem;
  font-weight:600;transition:gap .25s var(--ease)}
a.card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -22px rgba(27,65,196,.4)}
a.card:hover .shot img{transform:scale(1.06)}
a.card:hover .go{gap:15px}

/* ---- programme index -------------------------------------------------------------- */
.index{display:grid;border-top:1px solid var(--rule-2)}
.entry{border-bottom:1px solid var(--rule);transition:background .25s var(--ease)}
.entry:hover{background:var(--paper)}
.entry summary{cursor:pointer;list-style:none;display:grid;
  grid-template-columns:100px 1fr auto auto;gap:clamp(16px,2.6vw,36px);align-items:baseline;
  padding:clamp(20px,2.4vh,28px) clamp(10px,1vw,18px)}
.entry summary::-webkit-details-marker{display:none}
.entry .ag{font-family:'Space Mono',monospace;font-size:.88rem;letter-spacing:.08em;
  color:var(--cobalt)}
.entry .tp{font-family:'Space Grotesk',sans-serif;font-size:1.22rem;font-weight:700;
  line-height:1.3;color:var(--ink);letter-spacing:-.02em}
.entry .ph,.entry .tl{font-family:'Space Mono',monospace;font-size:.86rem;color:var(--ink-3);
  white-space:nowrap}
.entry .bd{padding:0 clamp(10px,1vw,18px) clamp(24px,2.6vh,32px)
  calc(100px + clamp(16px,2.6vw,36px))}
.entry .bd p{font-size:1.04rem;max-width:62ch;margin:0}
.entry .bd .pt{margin-top:12px;color:var(--ink-3);font-size:.98rem}

/* ---- locations / people / orgs ------------------------------------------------------ */
.locs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
  gap:clamp(14px,1.7vw,22px)}
.loc{background:var(--paper);border-radius:var(--r);padding:32px;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.loc:hover{transform:translateY(-5px);box-shadow:0 22px 44px -22px rgba(27,65,196,.32)}
.loc .k{color:var(--cobalt);display:block;margin-bottom:14px}
.loc h3{font-size:1.26rem;margin-bottom:8px}
.loc .a{font-size:1rem;line-height:1.58;margin:0}
.loc.hq{background:var(--cobalt);color:var(--on-cobalt)}
.loc.hq .k{color:var(--lime)} .loc.hq .a{color:var(--on-cobalt-2)}

.people{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
  gap:clamp(18px,2.2vw,30px)}
.person,.org{background:var(--paper);border-radius:var(--r);padding:clamp(26px,2.6vw,34px)}
.person .role{color:var(--cobalt);display:block;margin:10px 0 18px}
.person p,.org p{font-size:1rem;line-height:1.64}
.person a.li{display:inline-flex;margin-top:18px;font-size:.98rem;color:var(--cobalt);
  text-decoration:none;font-weight:600}
.person a.li:hover{text-decoration:underline}
.orgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
  gap:clamp(18px,2.2vw,30px)}
.org .plate{width:76px;height:76px;display:grid;place-items:center;background:var(--mist);
  border-radius:var(--r-sm);padding:10px;margin-bottom:20px}
.org .plate img{max-width:100%;max-height:100%;object-fit:contain}
.chips{display:flex;flex-wrap:wrap;gap:11px}
.chips span{padding:11px 18px;border-radius:999px;background:var(--paper);
  font-family:'Space Mono',monospace;font-size:.92rem;color:var(--ink-2);
  font-variant-numeric:tabular-nums}

/* ---- carousel ------------------------------------------------------------------------ */
.marquee{overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.mtrack{display:flex;width:max-content;animation:marq 50s linear infinite}
.marquee:hover .mtrack,.marquee:focus-within .mtrack{animation-play-state:paused}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee figure{flex:0 0 auto;width:clamp(140px,13vw,180px);margin:0 clamp(14px,1.6vw,22px) 0 0;
  background:var(--paper);border-radius:var(--r-sm);padding:20px;display:grid;place-items:center;
  aspect-ratio:1}
.marquee img{max-height:100%;width:auto;object-fit:contain}
@media (prefers-reduced-motion:reduce){
  .mtrack{animation:none;flex-wrap:wrap;width:auto;justify-content:center;gap:16px}
  .mtrack figure{margin:0}
  .mtrack figure[aria-hidden="true"]{display:none}
  .marquee{-webkit-mask-image:none;mask-image:none}
}

/* ---- prose ---------------------------------------------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));
  gap:clamp(22px,3vw,48px)}
.stats .fig{font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:1;display:block;
  font-variant-numeric:tabular-nums;color:var(--cobalt)}
.b-cobalt .stats .fig,.b-graphite .stats .fig{color:var(--lime)}
.stats .l{font-size:1rem;line-height:1.5;color:var(--ink-2);margin-top:12px;display:block;max-width:22ch}
.b-cobalt .stats .l{color:var(--on-cobalt-2)}
.bul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.bul li{position:relative;padding-left:26px;font-size:1.04rem;line-height:1.6;color:var(--ink-2)}
.bul li::before{content:"";position:absolute;left:0;top:.62em;width:12px;height:3px;
  background:var(--cobalt);border-radius:2px}
.spec{width:100%;border-collapse:collapse;font-size:1.04rem}
.spec th,.spec td{text-align:left;padding:20px 0;border-top:1px solid var(--rule);vertical-align:top}
.spec th{width:30%;font-family:'Space Mono',monospace;font-size:.84rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);padding-right:28px}
.spec td{color:var(--ink-2)}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:1px solid var(--rule)}
.ruled{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));
  gap:0 clamp(26px,3vw,54px)}
.ruled > div{padding:clamp(26px,2.8vh,34px) 0;border-top:1px solid var(--rule)}
.ruled h3{margin-bottom:12px}
.ruled p{font-size:1.02rem;line-height:1.6;max-width:34ch;margin:0}

.form{display:grid;gap:20px;max-width:560px}
.form label{display:grid;gap:9px;font-size:1rem;font-weight:600}
.form input,.form textarea{padding:16px 18px;border:1px solid var(--rule-2);
  border-radius:var(--r-sm);background:var(--paper);font-size:1.04rem;width:100%;
  transition:border-color .25s var(--ease)}
.form input:focus,.form textarea:focus{outline:none;border-color:var(--cobalt);
  box-shadow:0 0 0 3px rgba(27,65,196,.18)}
.form input:user-invalid{border-color:#B4462F}
.form textarea{resize:vertical;min-height:150px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.status{font-size:1rem;min-height:1.4em;margin:0}
.status.ok{color:#1F7A52} .status.err{color:#B4462F}


@media (max-width:1080px){
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .facts{grid-template-columns:repeat(2,1fr);gap:28px}
  .split{grid-template-columns:1fr;gap:34px}
  .pinned{position:static}
  .pinned .now{min-height:0}
  .js .srow{opacity:1}
  .foot-grid{grid-template-columns:1fr 1fr;gap:38px}
}
@media (max-width:880px){
  :root{--bar:80px}
  .nav,.top .cta{display:none;position:fixed;inset:var(--bar) 0 auto;background:var(--chalk);
    border-bottom:1px solid var(--rule-2);flex-direction:column;align-items:stretch;margin:0;
    padding:18px 4vw;gap:4px;border-radius:0;max-height:calc(100svh - var(--bar));overflow-y:auto}
  .top.open .nav{display:flex}
  .nav > li{display:block}
  .nav a,.nav button{padding:18px;font-size:1.18rem;width:100%;justify-content:space-between;
    background:var(--paper)}
  .menu{position:static;translate:none;width:auto;opacity:1;visibility:visible;transform:none;
    background:none;border:0;box-shadow:none;display:none;grid-template-columns:1fr;padding:6px 0 10px}
  .nav li.open .menu{display:grid}
  .menu a{padding:14px 16px;background:var(--mist);margin-bottom:6px}
  .burger{display:flex}
  .top.open .cta{display:flex;position:static;padding:16px 4vw 22px;justify-content:center}
  .entry summary{grid-template-columns:80px 1fr;row-gap:10px}
  .entry .ph,.entry .tl{grid-column:2}
  .entry .bd{padding-left:calc(80px + clamp(16px,2.6vw,36px))}
  .foot-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:18px}
  .facts{grid-template-columns:1fr;gap:24px}
  .entry summary{grid-template-columns:1fr;row-gap:8px}
  .entry .ph,.entry .tl{grid-column:1}
  .entry .bd{padding-left:clamp(10px,1vw,18px)}
}