/* ============================================================
   DEFENDO · static port of defendo.org in the Saario Academy design language.
   One structure, one component set. The identity is ONE attribute on <html>:
     data-variety="street" | "redline" | "manual"
   Base = the Saario tokens (ink scale, one crimson, IBM Plex). Mono is a scalpel:
   small labels, ticks, numerals, metadata only — never buttons, nav or body.
   Part 1: fonts + tokens · Part 2: components · Part 3: the three varieties.
   ============================================================ */

@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-400.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-500.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-mono-600.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:300 700;font-stretch:100%;font-display:swap;src:url(../fonts/ibm-plex-sans-300-700.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Sans Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-condensed-600.woff2) format('woff2');}
@font-face{font-family:'IBM Plex Sans Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/ibm-plex-sans-condensed-700.woff2) format('woff2');}

:root{
  --ink-900:#0E0F12; --ink-850:#121419; --ink-800:#16181d;
  --ink-700:#1C1F24; --ink-600:#2A2E35; --ink-500:#3A3F47;
  --ink-400:#565C66; --ink-200:#9AA1AB; --ink-100:#CDD2D9;
  --bone:#F4F2EE; --crimson:#D6122B; --crimson-hi:#ec2138; --crimson-700:#8E0E22;
  --on-media:#F4F2EE; --deep:#0a0b0d;
  --scrim:14,15,18;

  /* Defendo family colours — identity, never theme-flipped */
  --fam-red:#D6122B; --fam-blue:#4A7DA6; --fam-green:#5A7D5E; --fam-white:#F4F2EE;

  --sans:'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --cond:'IBM Plex Sans Condensed', 'IBM Plex Sans', sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;

  --maxw:1320px;
  --pad:clamp(20px, 5.2vw, 88px);
  --ease:cubic-bezier(.16,1,.3,1);

  /* variety dials (defaults = street) */
  --d-weight:600; --d-track:.012em; --d-case:uppercase; --d-lh:1;
  --xl:clamp(3.2rem, 1.6rem + 8.2vw, 8.6rem);
  --lg:clamp(2rem, 1.3rem + 3.1vw, 3.9rem);
  --md:clamp(1.5rem, 1.15rem + 1.7vw, 2.5rem);
  --ph-filter:grayscale(1) contrast(1.1) brightness(.84);
  --band-filter:grayscale(1) contrast(1.08) brightness(.8);
  --grain:.05;
  --radius:2px;
}

:root[data-theme="light"]{
  --ink-900:#E1DBD0; --ink-850:#DBD5C9; --ink-800:#D6D0C3;
  --ink-700:#D1CBBD; --ink-600:#BEB7A7; --ink-500:#9C9485;
  --ink-400:#6A665D; --ink-200:#48453F; --ink-100:#2A2823;
  --bone:#17181B; --crimson:#B3122B; --crimson-hi:#cc1a34; --deep:#D8D2C6;
}
/* everything that sits over a dark photo keeps the dark palette */
:root[data-theme="light"] .site-header,
:root[data-theme="light"] .mobile-menu,
:root[data-theme="light"] .hero,
:root[data-theme="light"] .band{
  --ink-900:#0E0F12; --ink-850:#121419; --ink-800:#16181d;
  --ink-700:#1C1F24; --ink-600:#2A2E35; --ink-500:#3A3F47;
  --ink-400:#565C66; --ink-200:#9AA1AB; --ink-100:#CDD2D9;
  --bone:#F4F2EE; --crimson:#D6122B;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--ink-900); color:var(--bone);
  font-family:var(--sans); font-weight:400; line-height:1.5;
  font-size:clamp(1rem, .96rem + .3vw, 1.12rem);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden; counter-reset:sec;
}
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } *,*::before,*::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; } }
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--crimson); color:#F4F2EE; }
:focus-visible{ outline:2px solid var(--crimson); outline-offset:3px; }
p{ margin:0 0 1rem; }
ul{ margin:0; padding:0; list-style:none; }
[id]{ scroll-margin-top:88px; }
.skip{ position:absolute; left:-999px; top:8px; z-index:9999; background:var(--bone); color:var(--ink-900); padding:.6em 1em; font-weight:500; }
.skip:focus{ left:8px; }
.vh{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.grain{ position:fixed; inset:0; z-index:9000; pointer-events:none; opacity:var(--grain); mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px 180px; }

/* ------------------------------------------------------------ primitives */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.section{ padding-block:clamp(80px, 12vh, 168px); position:relative; counter-increment:sec; }
.section.tone{ background:var(--ink-850); border-block:1px solid var(--ink-700); }
.section.tight{ padding-block:clamp(56px, 8vh, 104px); }

.eyebrow{ font-family:var(--mono); font-weight:500; font-size:.72rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--ink-200); display:flex; align-items:center; gap:.9em; margin:0 0 1.7rem; }
.eyebrow .idx{ color:var(--crimson); }
.eyebrow .idx::before{ content:counter(sec, decimal-leading-zero); }
.eyebrow .tick{ width:14px; height:1px; background:var(--crimson); display:inline-block; }

.display{ font-family:var(--cond); font-weight:var(--d-weight); letter-spacing:var(--d-track); text-transform:var(--d-case);
  line-height:var(--d-lh); margin:0; color:var(--bone); text-wrap:balance; }
.h-xl{ font-size:var(--xl); }
.h-lg{ font-size:var(--lg); }
.h-md{ font-size:var(--md); }
.h-sm{ font-family:var(--cond); font-weight:700; letter-spacing:-.005em; line-height:1.06; margin:0;
  font-size:clamp(1.25rem, 1.05rem + .8vw, 1.7rem); color:var(--bone); }

.lead{ color:var(--ink-200); font-weight:300; max-width:60ch; font-size:clamp(1.05rem, 1rem + .45vw, 1.3rem); line-height:1.62; }
.lead.bone{ color:var(--ink-100); }
.body{ color:var(--ink-200); font-weight:300; line-height:1.64; max-width:62ch; font-size:clamp(1rem,.96rem+.3vw,1.12rem); }
.body strong, .lead strong{ color:var(--bone); font-weight:500; }
.head{ margin-bottom:clamp(34px,5vh,60px); }
.head .lead{ margin-top:1.5rem; }

.actions{ display:flex; flex-wrap:wrap; gap:14px 22px; align-items:center; margin-top:clamp(24px,3.4vh,40px); }
.btn{ font-family:var(--sans); font-weight:500; font-size:.96rem; letter-spacing:.005em; display:inline-flex; align-items:center; gap:.7em;
  padding:1.02em 1.7em; border:1px solid transparent; border-radius:var(--radius); cursor:pointer;
  transition:background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease); }
.btn .arw{ transition:transform .35s var(--ease); }
.btn:hover .arw{ transform:translateX(5px); }
.btn-primary{ background:var(--crimson); color:#F4F2EE; }
.btn-primary:hover{ background:var(--crimson-hi); }
.btn-ghost{ background:transparent; color:var(--bone); border-color:var(--ink-400); }
.btn-ghost:hover{ border-color:var(--bone); }
.link{ font-family:var(--sans); font-weight:500; font-size:.98rem; color:var(--bone); display:inline-flex; align-items:center; gap:.6em;
  padding-bottom:.3em; border-bottom:1px solid var(--ink-500); transition:border-color .35s var(--ease); }
.link .arw{ color:var(--crimson); transition:transform .35s var(--ease); }
.link:hover{ border-color:var(--bone); }
.link:hover .arw{ transform:translateX(5px); }
.txtlink{ color:var(--bone); border-bottom:1px solid var(--ink-500); }
.txtlink:hover{ border-color:var(--crimson); }

/* photographs */
.ph{ position:relative; margin:0; background:var(--deep); overflow:hidden; }
.ph img{ width:100%; height:100%; object-fit:cover; filter:var(--ph-filter); }
.ph.r-43{ aspect-ratio:4/3; } .ph.r-32{ aspect-ratio:3/2; } .ph.r-45{ aspect-ratio:4/5; } .ph.r-916{ aspect-ratio:9/16; } .ph.r-11{ aspect-ratio:1/1; }
.ph figcaption, .cap{ font-family:var(--mono); font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-400); margin-top:.9rem; }

/* ------------------------------------------------------------ header */
.site-header{ position:fixed; top:0; left:0; right:0; z-index:8000; display:flex; align-items:center; justify-content:space-between;
  padding:14px var(--pad); background:transparent; border-bottom:1px solid transparent;
  transition:background .4s var(--ease), border-color .4s var(--ease); }
.site-header::before{ content:""; position:absolute; left:0; right:0; top:0; height:220%; z-index:-1; pointer-events:none;
  background:linear-gradient(to bottom, rgba(var(--scrim),.78) 0%, rgba(var(--scrim),.34) 46%, rgba(var(--scrim),0) 100%); transition:opacity .4s var(--ease); }
.site-header.scrolled{ background:rgba(var(--scrim),.9); backdrop-filter:blur(14px) saturate(120%); -webkit-backdrop-filter:blur(14px) saturate(120%); border-bottom-color:var(--ink-700); }
.site-header.scrolled::before{ opacity:0; }
.brand{ display:inline-flex; align-items:center; gap:12px; color:var(--bone); }
.brand .badge{ width:38px; height:38px; flex:0 0 auto; }
.brand .badge img{ width:100%; height:100%; }
.brand .wm{ font-family:var(--cond); font-weight:700; font-size:1.42rem; letter-spacing:.2em; line-height:1; text-transform:uppercase; }
.brand .wtag{ display:none; font-family:var(--mono); font-size:.56rem; letter-spacing:.24em; color:var(--ink-200); margin-top:5px; white-space:nowrap; }
.brand .wmcol{ display:flex; flex-direction:column; }
.nav{ display:flex; align-items:center; gap:clamp(14px, 1.9vw, 32px); flex-wrap:nowrap; }
.nav a.navlink{ font-family:var(--sans); font-weight:400; font-size:.88rem; letter-spacing:.02em; color:var(--ink-100); position:relative; padding:.3em 0; white-space:nowrap; transition:color .3s var(--ease); }
.nav a.navlink::after{ content:""; position:absolute; left:0; bottom:-2px; height:1px; width:0; background:var(--crimson); transition:width .3s var(--ease); }
.nav a.navlink:hover{ color:var(--bone); }
.nav a.navlink:hover::after, .nav a.navlink[aria-current="page"]::after{ width:100%; }
.nav a.navlink[aria-current="page"]{ color:var(--bone); }
.nav .nav-cta{ font-family:var(--sans); font-weight:500; font-size:.84rem; letter-spacing:.02em; color:var(--bone); border:1px solid var(--ink-400);
  border-radius:var(--radius); padding:.62em 1.1em; white-space:nowrap; transition:border-color .3s var(--ease), background .3s var(--ease); }
.nav .nav-cta:hover{ border-color:var(--bone); }
.theme-toggle{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; padding:0; flex:0 0 auto; background:transparent;
  border:1px solid var(--ink-400); border-radius:var(--radius); color:var(--on-media); cursor:pointer; }
.theme-toggle:hover{ border-color:var(--bone); }
.theme-toggle svg{ width:16px; height:16px; display:block; }
.theme-toggle .i-sun{ display:none; }
:root[data-theme="light"] .theme-toggle .i-sun{ display:block; }
:root[data-theme="light"] .theme-toggle .i-moon{ display:none; }
.nav-toggle{ display:none; }
.mobile-menu{ display:none; }
@media (max-width:1080px){
  .nav .navlink, .nav .nav-cta{ display:none; }
  .nav-toggle{ display:inline-flex; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:10px 4px 10px 10px; }
  .nav-toggle span{ width:24px; height:1.5px; background:var(--bone); }
  .mobile-menu{ position:fixed; inset:0; z-index:8600; background:rgba(var(--scrim),.985); display:flex; flex-direction:column; justify-content:center;
    gap:6px; padding:var(--pad); transform:translateY(-100%); visibility:hidden; transition:transform .5s var(--ease), visibility 0s .5s; }
  .mobile-menu.open{ transform:translateY(0); visibility:visible; transition:transform .5s var(--ease); }
  .mobile-menu a{ font-family:var(--cond); font-weight:600; font-size:clamp(1.55rem,8vw,2.4rem); color:var(--bone); padding:.18em 0;
    border-bottom:1px solid var(--ink-600); display:flex; justify-content:space-between; align-items:center; text-transform:var(--d-case); letter-spacing:var(--d-track); }
  .mobile-menu a .n{ font-family:var(--mono); font-size:.8rem; color:var(--ink-400); letter-spacing:.1em; }
  .mobile-menu a[aria-current="page"] .n{ color:var(--crimson); }
  .mobile-menu .mclose{ position:absolute; top:18px; right:var(--pad); font-family:var(--sans); font-size:.9rem; color:var(--ink-100); background:none; border:0; cursor:pointer; padding:8px 0; }
}

/* ------------------------------------------------------------ hero */
.hero{ position:relative; min-height:92vh; min-height:92svh; display:flex; align-items:flex-end; overflow:hidden; background:var(--deep); }
.hero.inner{ min-height:clamp(420px, 62vh, 640px); }
.hero-media{ position:absolute; inset:0; background-size:cover; background-position:center 32%; filter:var(--band-filter); }
.scrim{ position:absolute; inset:0; z-index:2; pointer-events:none; }
.scrim.btm{ background:linear-gradient(to top, var(--ink-900) 0%, rgba(var(--scrim),.62) 30%, rgba(var(--scrim),.12) 62%, rgba(var(--scrim),.36) 100%); }
.scrim.left{ background:linear-gradient(90deg, rgba(var(--scrim),.96) 0%, rgba(var(--scrim),.82) 34%, rgba(var(--scrim),.28) 64%, rgba(var(--scrim),.06) 100%); }
.hero .wrap{ position:relative; z-index:3; padding-bottom:clamp(64px, 10vh, 120px); padding-top:150px; }
.hero .display{ max-width:14ch; }
.hero .slogan{ font-family:var(--cond); font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:var(--ink-100);
  font-size:clamp(1rem, .9rem + .9vw, 1.6rem); margin:1.2rem 0 0; }
.hero .slogan b{ color:inherit; font-weight:600; }
.hero-meta{ position:absolute; left:var(--pad); right:var(--pad); bottom:clamp(18px,3vh,30px); z-index:3; font-family:var(--mono); font-size:.66rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ink-400); display:flex; justify-content:space-between; gap:20px; }
.hero .eyebrow .idx{ display:none; }
.person .ph img, .founder .ph img{ filter:var(--portrait-filter, var(--ph-filter)); }
.motif{ position:absolute; z-index:2; pointer-events:none; display:none; }
@media (max-width:700px){
  .hero .scrim.btm{ background:linear-gradient(to top, var(--ink-900) 0%, rgba(var(--scrim),.82) 36%, rgba(var(--scrim),.5) 70%, rgba(var(--scrim),.44) 100%); }
  .hero .wrap{ padding-bottom:clamp(84px,13vh,130px); }
  .hero-meta{ font-size:.58rem; letter-spacing:.16em; }
}

/* the source's hero carousel, ported as a still strip */
.strip{ border-block:1px solid var(--ink-700); background:var(--deep); }
.strip ul{ display:flex; gap:2px; overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:thin; scrollbar-color:var(--ink-500) transparent; }
.strip li{ flex:0 0 clamp(150px, 15vw, 230px); scroll-snap-align:start; }
.strip .ph{ aspect-ratio:3/2; }
.strip .ph img{ opacity:.82; transition:opacity .4s var(--ease); }
.strip li:hover .ph img{ opacity:1; }

/* ------------------------------------------------------------ feature rows (image + text) */
.rows{ display:grid; gap:clamp(56px, 9vh, 120px); }
.row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px, 5vw, 88px); align-items:center; }
.row:nth-child(even) .ph, .row.flip .ph{ order:2; }
.row .h-md{ margin-bottom:1.2rem; }
.row .ph{ aspect-ratio:3/2; }
@media (max-width:860px){ .row{ grid-template-columns:1fr; } .row:nth-child(even) .ph, .row.flip .ph{ order:0; } }

.checks{ display:grid; gap:0; margin:0; border-top:1px solid var(--ink-700); }
.checks li{ display:grid; grid-template-columns:22px 1fr; gap:14px; align-items:baseline; padding:.95em 0; border-bottom:1px solid var(--ink-700);
  color:var(--ink-100); font-weight:300; line-height:1.5; }
.checks li::before{ content:""; width:9px; height:9px; background:var(--crimson); transform:rotate(45deg); position:relative; top:-1px; }
.plain{ border-top:1px solid var(--ink-700); margin-top:1.2rem; }
.plain li{ padding:.8em 0; border-bottom:1px solid var(--ink-700); color:var(--ink-100); font-weight:300; line-height:1.5; }
.plain.cols{ columns:2; column-gap:clamp(24px,4vw,56px); border-top:0; }
.plain.cols li{ break-inside:avoid; }
@media (max-width:700px){ .plain.cols{ columns:1; } }

/* ------------------------------------------------------------ pillars */
.ctick{ width:9px; height:9px; transform:rotate(45deg); flex:0 0 auto; display:inline-block; position:relative; top:-1px; }
.ct-red{ background:var(--fam-red); } .ct-blue{ background:var(--fam-blue); } .ct-green{ background:var(--fam-green); }
.ct-white{ background:var(--fam-white); outline:1px solid rgba(86,92,102,.7); }
.pillars{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:clamp(14px,1.6vw,26px); }
.pillar{ display:flex; flex-direction:column; border-top:2px solid var(--pc, var(--ink-500)); background:var(--ink-850); transition:background .4s var(--ease); }
.pillar:hover{ background:var(--ink-800); }
.pillar.p-red{ --pc:var(--fam-red); } .pillar.p-blue{ --pc:var(--fam-blue); } .pillar.p-green{ --pc:var(--fam-green); } .pillar.p-white{ --pc:var(--fam-white); }
.pillar .ph{ aspect-ratio:4/5; }
.pillar .ph img{ transition:transform 1.2s var(--ease); }
.pillar:hover .ph img{ transform:scale(1.03); }
.pillar .pb{ padding:clamp(18px,1.8vw,28px); display:flex; flex-direction:column; gap:.7rem; flex:1; }
.pillar .pn{ display:flex; align-items:baseline; gap:.7em; }
.pillar h3{ font-family:var(--cond); font-weight:700; font-size:clamp(1.6rem,1.2rem+1.2vw,2.3rem); letter-spacing:.02em; line-height:1; margin:0; text-transform:uppercase; }
.pillar .tagl{ color:var(--ink-100); font-size:.98rem; line-height:1.45; margin:0; }
.pillar .desc{ color:var(--ink-200); font-weight:300; font-size:.96rem; line-height:1.56; margin:0; }
.pillar .who{ margin-top:.3rem; }
.pillar .who dt{ font-family:var(--mono); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-400); margin-bottom:.5rem; }
.pillar .who dd{ margin:0; color:var(--ink-100); font-size:.92rem; font-weight:300; padding:.34em 0; border-top:1px solid var(--ink-700); }
.pillar .link{ margin-top:auto; align-self:flex-start; font-size:.92rem; }
.pillar .pb > .link{ margin-top:auto; }
@media (max-width:1100px){ .pillars{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:560px){ .pillars{ grid-template-columns:1fr; } .pillar .ph{ aspect-ratio:3/2; } }

/* programme detail blocks */
.prog{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(28px,5vw,88px); align-items:start;
  padding-block:clamp(48px,7vh,88px); border-top:1px solid var(--ink-700); }
.prog:first-of-type{ border-top:0; padding-top:0; }
.prog .pn{ display:flex; align-items:center; gap:.8em; margin-bottom:1.3rem; }
.prog .pn .ctick{ width:12px; height:12px; }
.prog .sub{ font-family:var(--mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-400); margin:1.8rem 0 0; }
.prog .lvls{ margin:1.2rem 0; border-left:1px solid var(--crimson); padding-left:clamp(16px,1.6vw,24px); display:grid; gap:.7rem; }
.prog .lvls li{ color:var(--ink-100); font-weight:300; line-height:1.5; }
.prog .director{ margin-top:1.4rem; padding:1.1rem 0 0; border-top:1px solid var(--ink-700); color:var(--ink-100); font-weight:300; line-height:1.56; font-size:.98rem; }
.video{ position:relative; display:block; margin:0; background:var(--deep); aspect-ratio:9/16; max-width:340px; width:100%; justify-self:end; overflow:hidden; }
.video img{ width:100%; height:100%; object-fit:cover; filter:var(--ph-filter); }
.video .play{ position:absolute; left:16px; bottom:16px; width:52px; height:52px; border-radius:50%; border:1px solid rgba(244,242,238,.7);
  background:rgba(var(--scrim),.5); display:grid; place-items:center; color:#F4F2EE; transition:background .3s var(--ease), border-color .3s var(--ease); }
.video:hover .play, .video:focus-visible .play{ background:var(--crimson); border-color:var(--crimson); }
.video .play svg{ width:16px; height:16px; margin-left:3px; }
.video .vt{ position:absolute; right:14px; top:14px; font-family:var(--mono); font-size:.6rem; letter-spacing:.18em; color:#F4F2EE; background:rgba(var(--scrim),.6); padding:.4em .7em; }
@media (max-width:860px){ .prog{ grid-template-columns:1fr; } .video{ justify-self:start; max-width:260px; } }

/* ------------------------------------------------------------ level ladder */
.ladder{ border-top:1px solid var(--ink-700); position:relative; }
.lvl{ display:grid; grid-template-columns:84px 132px minmax(200px,1fr) minmax(0,1.5fr) minmax(190px,.9fr); gap:12px clamp(18px,2.2vw,40px);
  padding:clamp(22px,2.8vh,34px) 0; border-bottom:1px solid var(--ink-700); align-items:start; position:relative; }
.lvl .n{ font-family:var(--mono); font-weight:500; font-size:.78rem; letter-spacing:.14em; color:var(--crimson); padding-top:.45em; display:flex; align-items:center; gap:10px; }
.lvl .n img{ width:26px; height:26px; }
.lvl .ph{ aspect-ratio:4/3; }
.lvl h3{ font-family:var(--cond); font-weight:700; letter-spacing:-.005em; line-height:1.02; font-size:clamp(1.45rem, 1.15rem + 1.1vw, 2.1rem); margin:0; color:var(--bone); text-transform:uppercase; }
.lvl h3 .sub{ display:block; font-family:var(--mono); font-weight:500; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-400); margin-top:.8em; }
.lvl .theme{ color:var(--ink-200); font-weight:300; font-size:clamp(.96rem,.92rem+.3vw,1.06rem); line-height:1.6; margin:0; }
.lvl .req li{ font-family:var(--mono); font-size:.7rem; letter-spacing:.06em; line-height:1.6; color:var(--ink-100); padding:.35em 0; border-bottom:1px solid var(--ink-700); }
.lvl .req li:last-child{ border-bottom:0; color:var(--ink-200); }
@media (max-width:1100px){
  .lvl{ grid-template-columns:84px 120px 1fr; }
  .lvl .theme, .lvl .req{ grid-column:2 / -1; }
}
@media (max-width:560px){
  .lvl{ grid-template-columns:64px 1fr; }
  .lvl .ph{ grid-column:1 / -1; grid-row:1; aspect-ratio:3/2; }
  .lvl .theme, .lvl .req{ grid-column:1 / -1; }
}

/* ------------------------------------------------------------ quotes · cells · faq */
.qstrip{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(34px,5vh,60px) clamp(28px,4vw,72px); }
.qstrip figure{ margin:0; padding-left:clamp(16px,1.6vw,24px); border-left:1px solid var(--crimson); }
.qstrip figcaption{ font-family:var(--mono); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--crimson); margin-bottom:1rem; }
.qstrip blockquote{ margin:0; }
.qstrip blockquote p{ font-family:var(--cond); font-weight:600; letter-spacing:-.005em; line-height:1.22; font-size:clamp(1.15rem, 1rem + .8vw, 1.6rem); color:var(--bone); margin:0; }
@media (max-width:820px){ .qstrip{ grid-template-columns:1fr; } }

.cells{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--ink-700); }
.cell{ padding:clamp(22px,2.4vw,38px) clamp(18px,2vw,34px) clamp(22px,2.4vw,38px) 0; border-bottom:1px solid var(--ink-700); }
.cell .cn{ font-family:var(--mono); font-size:.66rem; letter-spacing:.2em; color:var(--crimson); display:block; margin-bottom:1rem; }
.cell h3{ font-family:var(--cond); font-weight:700; font-size:clamp(1.25rem,1.05rem+.8vw,1.7rem); letter-spacing:-.005em; margin:0 0 .5rem; line-height:1.06; }
.cell p{ color:var(--ink-200); font-weight:300; font-size:.98rem; line-height:1.56; margin:0; max-width:32ch; }
@media (max-width:900px){ .cells{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .cells{ grid-template-columns:1fr; } }

.faq details{ border-bottom:1px solid var(--ink-700); }
.faq details:first-of-type{ border-top:1px solid var(--ink-700); }
.faq summary{ list-style:none; cursor:pointer; display:flex; align-items:baseline; justify-content:space-between; gap:24px; padding:clamp(18px,2.4vh,28px) 0; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary h3{ font-family:var(--cond); font-weight:700; letter-spacing:-.005em; line-height:1.1; font-size:clamp(1.2rem, 1.05rem + .7vw, 1.6rem); margin:0; color:var(--bone); }
.faq summary .pm{ font-family:var(--mono); font-size:1rem; color:var(--crimson); flex:0 0 auto; transition:transform .35s var(--ease); }
.faq details[open] summary .pm{ transform:rotate(45deg); }
.faq details p{ color:var(--ink-200); font-weight:300; line-height:1.62; margin:0 0 clamp(20px,2.6vh,30px); max-width:64ch; }
.faqgrid{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr); gap:clamp(28px,5vw,88px); align-items:start; }
@media (max-width:860px){ .faqgrid{ grid-template-columns:1fr; } }

/* ------------------------------------------------------------ bands */
.band{ position:relative; display:flex; align-items:center; overflow:hidden; min-height:clamp(460px, 70vh, 760px); background:var(--deep); counter-increment:sec; }
.band-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:var(--band-filter); }
.band .wrap{ position:relative; z-index:3; padding-block:clamp(88px, 12vh, 150px); }
.band .col{ max-width:56ch; }
.band .display{ margin-bottom:1.2rem; }
.band .lead{ color:var(--ink-100); }
.cta{ background:var(--ink-850); border-top:1px solid var(--ink-700); position:relative; overflow:hidden; }
.cta .lead{ margin-top:1.2rem; }

/* map / countries */
.mapgrid{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,5vw,88px); align-items:center; }
.mapfig{ margin:0; max-width:380px; }
.mapfig img{ width:100%; opacity:.9; }
:root[data-theme="light"] .mapfig img{ filter:invert(1) brightness(.5); }
.countries{ border-top:1px solid var(--ink-700); }
.countries a{ display:grid; grid-template-columns:56px 1fr auto; gap:14px; align-items:baseline; padding:clamp(16px,2vh,24px) 0; border-bottom:1px solid var(--ink-700); transition:padding .35s var(--ease); }
.countries a:hover{ padding-left:10px; }
.countries .cc{ font-family:var(--mono); font-size:.74rem; letter-spacing:.2em; color:var(--crimson); }
.countries .cn{ font-family:var(--cond); font-weight:700; font-size:clamp(1.4rem,1.1rem+1.1vw,2.1rem); line-height:1; text-transform:var(--d-case); letter-spacing:var(--d-track); }
.countries .cu{ font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; color:var(--ink-200); }
@media (max-width:860px){ .mapgrid{ grid-template-columns:1fr; } .mapfig{ max-width:240px; } }

/* ------------------------------------------------------------ people */
.founder{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(28px,5vw,88px); align-items:start; }
.founder .ph{ aspect-ratio:4/5; }
.founder .h-lg{ margin-bottom:1.4rem; }
@media (max-width:860px){ .founder{ grid-template-columns:1fr; } .founder .ph{ max-width:420px; } }
.team{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 clamp(28px,4vw,72px); border-top:1px solid var(--ink-700); }
.person{ display:grid; grid-template-columns:132px 1fr; gap:clamp(16px,2vw,30px); padding:clamp(26px,3.4vh,40px) 0; border-bottom:1px solid var(--ink-700); align-items:start; }
.person .ph{ aspect-ratio:3/4; }
.person h3{ font-family:var(--cond); font-weight:700; font-size:clamp(1.3rem,1.1rem+.8vw,1.75rem); line-height:1.04; margin:0; text-transform:uppercase; letter-spacing:.01em; }
.person .rank{ font-family:var(--mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--crimson); margin:.7rem 0 .9rem; }
.person p{ color:var(--ink-200); font-weight:300; font-size:.96rem; line-height:1.58; margin:0; }
.person .fb{ display:inline-block; margin-top:.9rem; font-size:.88rem; color:var(--ink-100); border-bottom:1px solid var(--ink-500); }
.person .fb:hover{ border-color:var(--crimson); }
@media (max-width:980px){ .team{ grid-template-columns:1fr; } }
@media (max-width:480px){ .person{ grid-template-columns:92px 1fr; } }

/* two-column requirement blocks */
.duo{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(28px,5vw,88px); align-items:start; }
.duo > div{ border-top:1px solid var(--ink-700); padding-top:clamp(22px,3vh,34px); }
.duo .h-sm{ margin-bottom:1rem; text-transform:var(--d-case); letter-spacing:var(--d-track); }
@media (max-width:860px){ .duo{ grid-template-columns:1fr; } }

/* ------------------------------------------------------------ events */
.filters{ display:grid; gap:14px; margin-bottom:clamp(28px,4vh,44px); }
.fgroup{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; border:0; padding:0; margin:0; }
.fgroup legend{ font-family:var(--mono); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-400); padding:0; margin-bottom:.7rem; float:left; width:150px; padding-top:.75em; }
.chip{ font-family:var(--sans); font-size:.84rem; font-weight:400; color:var(--ink-100); background:transparent; border:1px solid var(--ink-600); border-radius:var(--radius);
  padding:.5em .9em; cursor:pointer; transition:border-color .3s var(--ease), color .3s var(--ease), background .3s var(--ease); }
.chip .c{ font-family:var(--mono); font-size:.66rem; color:var(--ink-400); margin-left:.5em; }
.chip:hover{ border-color:var(--ink-200); }
.chip[aria-pressed="true"]{ border-color:var(--crimson); color:var(--bone); background:rgba(214,18,43,.12); }
.chip[aria-pressed="true"] .c{ color:var(--ink-100); }
.evcount{ font-family:var(--mono); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-400); margin:0 0 14px; }
.evlist{ border-top:1px solid var(--ink-700); }
.evlist .month{ font-family:var(--mono); font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-400); padding:26px 0 10px; border-bottom:1px solid var(--ink-700); }
.ev{ border-bottom:1px solid var(--ink-700); }
.ev[hidden]{ display:none; }
.ev summary{ list-style:none; cursor:pointer; display:grid; grid-template-columns:92px minmax(0,1fr) minmax(0,auto) 22px; gap:10px clamp(16px,2.2vw,40px); align-items:baseline; padding:clamp(16px,2vh,24px) 0; }
.ev summary::-webkit-details-marker{ display:none; }
.ev .d{ font-family:var(--mono); font-weight:500; font-size:.76rem; letter-spacing:.16em; color:var(--crimson); text-transform:uppercase; white-space:nowrap; }
.ev h3{ font-family:var(--cond); font-weight:700; letter-spacing:-.005em; line-height:1.06; font-size:clamp(1.2rem, 1.02rem + .8vw, 1.65rem); margin:0; color:var(--bone); }
.ev h3 .pl{ display:block; font-family:var(--sans); font-weight:300; font-size:.92rem; color:var(--ink-200); letter-spacing:0; margin-top:.4em; }
.ev .tags{ display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; }
.tag{ font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-200); border:1px solid var(--ink-600); border-radius:var(--radius); padding:.45em .7em; white-space:nowrap; }
.tag.prog-t{ color:var(--bone); border-color:var(--ink-400); }
.ev .pm{ font-family:var(--mono); color:var(--crimson); transition:transform .35s var(--ease); justify-self:end; }
.ev[open] .pm{ transform:rotate(45deg); }
.evbody{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:clamp(24px,4vw,64px); padding:6px 0 clamp(28px,4vh,44px) calc(92px + clamp(16px,2.2vw,40px)); }
.evbody .desc{ color:var(--ink-200); font-weight:300; line-height:1.62; font-size:.98rem; white-space:pre-line; max-width:68ch; margin:0; }
.evbody .side .ph{ aspect-ratio:3/2; margin-bottom:18px; }
.evmeta{ margin:0; }
.evmeta div{ display:grid; grid-template-columns:96px 1fr; gap:12px; padding:.6em 0; border-top:1px solid var(--ink-700); }
.evmeta dt{ font-family:var(--mono); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-400); padding-top:.25em; }
.evmeta dd{ margin:0; color:var(--ink-100); font-size:.94rem; font-weight:300; overflow-wrap:anywhere; }
.evbody .link{ margin-top:18px; font-size:.92rem; }
@media (max-width:900px){
  .ev summary{ grid-template-columns:78px minmax(0,1fr) 22px; }
  .ev .tags{ grid-column:2; grid-row:2; justify-content:flex-start; }
  .evbody{ grid-template-columns:1fr; padding-left:0; }
  .fgroup legend{ float:none; width:auto; display:block; padding-top:0; }
}

/* ------------------------------------------------------------ contact + forms */
.contactgrid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(32px,6vw,104px); align-items:start; }
.channels{ border-top:1px solid var(--ink-700); margin-top:clamp(26px,4vh,44px); }
.channels a{ display:block; padding:clamp(18px,2.4vh,28px) 0; border-bottom:1px solid var(--ink-700); }
.channels .k{ font-family:var(--mono); font-size:.64rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-400); display:block; margin-bottom:.55rem; }
.channels .v{ font-family:var(--cond); font-weight:700; font-size:clamp(1.5rem,1.2rem+1.3vw,2.3rem); line-height:1.05; color:var(--bone); transition:color .3s var(--ease); overflow-wrap:anywhere; }
.channels a:hover .v{ color:var(--crimson); }
.form{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px clamp(18px,2vw,30px); }
.form .full{ grid-column:1 / -1; }
.field label{ display:block; font-family:var(--sans); font-size:.9rem; font-weight:500; color:var(--ink-100); margin-bottom:.55rem; line-height:1.4; }
.field input, .field textarea{ width:100%; font-family:var(--sans); font-size:1rem; color:var(--bone); background:var(--ink-850); border:1px solid var(--ink-600);
  border-radius:var(--radius); padding:.85em 1em; transition:border-color .3s var(--ease); color-scheme:dark; }
:root[data-theme="light"] .field input, :root[data-theme="light"] .field textarea{ color-scheme:light; }
.field textarea{ min-height:150px; resize:vertical; line-height:1.5; }
.field input:hover, .field textarea:hover{ border-color:var(--ink-400); }
.field input:focus-visible, .field textarea:focus-visible{ outline:none; border-color:var(--crimson); box-shadow:0 0 0 1px var(--crimson); }
.form .note{ font-family:var(--mono); font-size:.66rem; letter-spacing:.06em; color:var(--ink-400); line-height:1.7; margin:0; }
@media (max-width:860px){ .contactgrid{ grid-template-columns:1fr; } }
@media (max-width:560px){ .form{ grid-template-columns:1fr; } }

.empty{ border:1px solid var(--ink-700); padding:clamp(28px,4vw,56px); color:var(--ink-200); font-weight:300; max-width:70ch; }
.empty .k{ font-family:var(--mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--crimson); display:block; margin-bottom:1rem; }

/* ------------------------------------------------------------ footer */
.site-footer{ background:var(--deep); border-top:1px solid var(--ink-700); padding-block:clamp(56px,8vh,96px); }
.foot-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:clamp(28px,3vw,56px); }
.foot-brand .brand{ margin-bottom:18px; }
.foot-brand p{ font-family:var(--cond); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-100); font-size:1rem; margin:0 0 26px; }
.foot-brand .academy{ display:inline-block; opacity:.8; transition:opacity .3s var(--ease); }
.foot-brand .academy:hover{ opacity:1; }
.foot-brand .academy img{ height:46px; width:auto; }
.foot-brand .academy .l{ display:none; }
:root[data-theme="light"] .foot-brand .academy .d{ display:none; }
:root[data-theme="light"] .foot-brand .academy .l{ display:block; }
.foot-col h2{ font-family:var(--mono); font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-400); margin:0 0 1.1rem; font-weight:500; }
.foot-col a{ display:block; color:var(--ink-100); font-size:.95rem; padding:.34em 0; transition:color .3s var(--ease); }
.foot-col a:hover{ color:var(--bone); }
.foot-base{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-top:clamp(44px,6vh,72px); padding-top:26px; border-top:1px solid var(--ink-700); }
.foot-base p, .foot-base a{ font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; color:var(--ink-400); margin:0; }
.foot-base a:hover{ color:var(--bone); }
@media (max-width:820px){ .foot-grid{ grid-template-columns:1fr 1fr; gap:40px 28px; } .foot-brand{ grid-column:1 / -1; } }

/* ------------------------------------------------------------ reveal */
.js .reveal{ opacity:0; transform:translateY(22px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.js .reveal.in{ opacity:1; transform:none; }
.js .reveal[data-d="1"]{ transition-delay:.1s; } .js .reveal[data-d="2"]{ transition-delay:.2s; } .js .reveal[data-d="3"]{ transition-delay:.3s; }
@media (prefers-reduced-motion:reduce){ .js .reveal{ opacity:1; transform:none; transition:none; } }