/* Lerato Bodibe Foundation — site styles (Foundation Profile look and feel)
   Black ground, signal yellow, heavy Montserrat caps, black-and-white photography. */
:root{
  --black:#0B0B0B; --char:#141414; --char-2:#1C1C1C; --line-d:#2C2C2C;
  --yellow:#FECF03; --yellow-2:#E5B800; --yellow-soft:#FFF6CC;
  --white:#FFFFFF; --paper:#F4F4F1; --line:#DEDDD6;
  --text:#121212; --muted:#595955; --on-dark:#FFFFFF; --on-dark-muted:#B9B9B4;
  --clay:#B23A1E;
  --f:"Montserrat", "Helvetica Neue", Arial, system-ui, sans-serif;
  --wrap:1240px; --gutter:clamp(16px,4vw,40px);
  --r:4px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--black);color:var(--on-dark);font-family:var(--f);font-size:1.02rem;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration-color:var(--yellow);text-decoration-thickness:2px;text-underline-offset:4px}
a:hover{color:var(--yellow)}
.light a:hover{color:var(--text);text-decoration-color:var(--text)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--f);margin:0;text-wrap:balance;line-height:1;letter-spacing:-.01em}
h1,h2{font-weight:900;text-transform:uppercase}
h1{font-size:clamp(2.5rem,6.2vw,5.4rem);line-height:.95}
h2{font-size:clamp(1.9rem,4vw,3.3rem);line-height:.98}
h3{font-size:clamp(1.05rem,1.5vw,1.25rem);font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:1.15}
h4{font-size:1rem;font-weight:700}
p{margin:0}
.y{color:var(--yellow)}
.light .y{color:var(--text);background:linear-gradient(transparent 62%,var(--yellow) 62%)}
.skip{position:absolute;left:-999px;top:0;background:var(--yellow);color:#000;padding:.6rem 1rem;z-index:100;font-weight:700}
.skip:focus{left:1rem}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.label{display:inline-flex;align-items:center;gap:.9rem;font-size:.78rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--yellow)}
.label::before{content:"";width:44px;height:3px;background:var(--yellow);flex:none}
.light .label{color:var(--text)}
.rule{display:block;width:56px;height:3px;background:var(--yellow);border:0;margin:1.4rem 0}
.lede{font-size:clamp(1.05rem,1.35vw,1.2rem);line-height:1.6;color:var(--on-dark-muted);max-width:60ch}
.light .lede{color:var(--muted)}
.prose{max-width:68ch}
.prose p+p,.prose p+ul,.prose ul+p,.prose h2+p,.prose h3+p{margin-top:1rem}
.prose h2{margin-top:2.75rem;margin-bottom:.35rem;font-size:clamp(1.4rem,2.4vw,1.9rem)}
.prose h3{margin-top:1.75rem;margin-bottom:.35rem}
.prose ul{padding-left:1.2rem}.prose li{margin:.35rem 0}
.prose li::marker{color:var(--yellow-2)}
.mono{font-variant-numeric:tabular-nums;letter-spacing:.04em;font-weight:600}
.tabnum{font-variant-numeric:tabular-nums}

/* Buttons */
.btn{display:inline-flex;align-items:stretch;gap:0;font-family:var(--f);font-weight:700;font-size:.82rem;letter-spacing:.2em;text-transform:uppercase;line-height:1;border:2px solid var(--yellow);text-decoration:none;cursor:pointer;background:transparent;color:var(--on-dark);transition:background .15s,color .15s,transform .15s;border-radius:0}
.btn .t{padding:1.05rem 1.3rem;display:flex;align-items:center}
.btn .ar{background:var(--yellow);color:#000;display:grid;place-items:center;padding:0 1rem}
.btn svg{width:20px;height:20px}
.btn:hover{transform:translateY(-1px);color:var(--on-dark)}
.btn:hover .ar{background:#fff}
.btn-y{background:var(--yellow);color:#000}
.btn-y .ar{background:#000;color:var(--yellow)}
.btn-y:hover{background:#FFD92E;color:#000}
.btn-y:hover .ar{background:#000;color:#fff}
.btn-k{border-color:#000;background:#000;color:#fff}
.btn-k .ar{background:var(--yellow);color:#000}
.btn-k:hover{color:#fff}
.light .btn:not(.btn-y):not(.btn-k),.band .btn:not(.btn-y):not(.btn-k){color:#000;border-color:#000}
.light .btn:not(.btn-y):not(.btn-k) .ar,.band .btn:not(.btn-y):not(.btn-k) .ar{background:#000;color:var(--yellow)}
.btn-row{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
.textlink{font-weight:700;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;display:inline-flex;gap:.55rem;align-items:center;color:var(--yellow)}
.textlink::after{content:"→";transition:transform .15s;font-size:1rem}
.textlink:hover{color:var(--yellow)}
.textlink:hover::after{transform:translateX(4px)}
.light .textlink{color:var(--text)}

/* Header */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(11,11,11,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-d)}
.hdr{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:80px}
.brand{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:#fff}
.brand img{width:210px;height:auto}
.brand small{white-space:nowrap;font-size:.54rem;letter-spacing:.24em;text-transform:uppercase;color:var(--on-dark-muted);display:flex;align-items:center;gap:.5rem;font-weight:600}
.brand small::before{content:"";width:22px;height:2px;background:var(--yellow)}
.nav{display:flex;align-items:center}
.nav>ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:0}
.nav li{position:relative}
.nav a.top,.nav button.top{white-space:nowrap;display:flex;align-items:center;gap:.35rem;padding:.7rem .62rem;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff;text-decoration:none;background:none;border:0;font-family:inherit;cursor:pointer}
.nav a.top:hover,.nav button.top:hover,.nav li:focus-within>.top{color:var(--yellow)}
.nav .top[aria-current="page"],.nav .top.is-active{color:var(--yellow)}
.nav .caret{width:9px;height:9px}
.sub{position:absolute;left:0;top:100%;min-width:300px;background:var(--char);border:1px solid var(--line-d);border-top:3px solid var(--yellow);padding:.5rem;list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(6px);transition:.16s ease;box-shadow:0 24px 48px -20px rgba(0,0,0,.8)}
.nav li:hover>.sub,.nav li:focus-within>.sub{opacity:1;visibility:visible;transform:none}
.sub a{display:block;padding:.65rem .8rem;text-decoration:none;color:#fff;font-size:.9rem;font-weight:600;line-height:1.35}
.sub a small{display:block;color:var(--on-dark-muted);font-size:.78rem;font-weight:400;margin-top:2px}
.sub a:hover{background:var(--char-2);color:var(--yellow)}
.sub .plat{font-size:.62rem;letter-spacing:.2em;color:var(--yellow);margin-right:.5rem;font-weight:800}
.nav .btn{margin-left:.6rem}
.nav .btn .t{padding:.85rem 1rem}
.menu-btn{display:none;background:var(--yellow);color:#000;border:0;padding:.75rem 1rem;font-weight:800;font-family:inherit;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;gap:.5rem;align-items:center;cursor:pointer}
.menu-btn svg{width:18px;height:18px}
@media (max-width:1180px){
  .menu-btn{display:inline-flex}
  .brand img{width:180px}
  .nav{position:fixed;inset:80px 0 0 0;background:var(--black);padding:1rem var(--gutter) 3rem;overflow-y:auto;border-top:1px solid var(--line-d);display:none}
  .nav.open{display:block}
  .nav>ul{flex-direction:column;align-items:stretch}
  .nav a.top,.nav button.top{font-size:1rem;padding:1rem .2rem;border-bottom:1px solid var(--line-d);width:100%;justify-content:space-between}
  .sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:.25rem 0 .75rem .5rem;min-width:0;display:none;background:transparent}
  .nav li.expanded>.sub{display:block}
  .nav .btn{margin:1.5rem 0 0;width:100%}
  .nav .btn .t{flex:1;justify-content:center}
}

/* Sections */
.section{padding-block:clamp(4rem,8vw,7rem)}
.section.tight{padding-block:clamp(3rem,5vw,4.5rem)}
.dark{background:var(--black);color:var(--on-dark)}
.char{background:var(--char);color:var(--on-dark)}
.light{background:var(--white);color:var(--text);color-scheme:light}
.paper{background:var(--paper);color:var(--text);color-scheme:light}
.paper .lede{color:var(--muted)}
.paper .label{color:var(--text)}
.paper .textlink{color:var(--text)}
.paper .y{color:var(--text);background:linear-gradient(transparent 62%,var(--yellow) 62%)}
.sec-head{display:grid;gap:1.1rem;margin-bottom:clamp(2.2rem,4vw,3.5rem);max-width:820px}
.sec-head.split{max-width:none;grid-template-columns:1.15fr 1fr;align-items:end;gap:2.5rem}
@media (max-width:860px){.sec-head.split{grid-template-columns:1fr;gap:1.1rem}}

/* Hero (home) */
.hero{position:relative;background:var(--black);overflow:hidden}
.hero-inner{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.8fr) 210px;min-height:min(760px,88vh)}
.hero-copy{position:relative;z-index:2;padding:clamp(2.5rem,6vw,5rem) 0 clamp(2.5rem,5vw,4rem);display:flex;flex-direction:column;justify-content:center}
.hero-copy .tagline{font-size:.8rem;letter-spacing:.3em;text-transform:uppercase;font-weight:600;color:#fff;line-height:1.7}
.hero h1{font-size:clamp(2.7rem,5.6vw,5.3rem);line-height:.9;letter-spacing:-.015em}
.hero h1 .y{display:block}
.hero .lede{color:#E7E7E2;margin-top:1.4rem;max-width:44ch}
.hero .btn-row{margin-top:2rem}
.hero-photo{position:relative;margin-left:-18%;z-index:1}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 20%;filter:grayscale(1) contrast(1.05)}
.hero-photo::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--black) 0%,rgba(11,11,11,.55) 22%,transparent 50%)}
.hero-side{position:relative;background:var(--yellow);overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;padding:2rem 1.4rem;gap:1.1rem;color:#000}
.hero-side img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.hero-side::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(254,207,3,.25),rgba(0,0,0,.35));z-index:1}
.hero-side>*:not(img){position:relative;z-index:2}
.hero-side .vr{width:2px;height:56px;background:#000}
.hero-side ul{list-style:none;margin:0;padding:0;display:grid;gap:1.05rem;text-align:right}
.hero-side a{font-size:.68rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#000;text-decoration:none}
.hero-side a:hover{color:#fff}
.hero-meta{position:relative;z-index:3;border-top:1px solid var(--line-d);padding-block:1rem;display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;font-weight:600}
.hero-meta::before{content:"";width:44px;height:3px;background:var(--yellow)}
.hero-meta span+span::before{content:"|";color:var(--yellow);margin-right:1rem}
@media (max-width:1100px){.hero-inner{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.hero-side{display:none}}
@media (max-width:760px){
  .hero-inner{grid-template-columns:1fr;min-height:0}
  .hero-photo{margin:0 calc(var(--gutter)*-1);height:340px;order:-1}
  .hero-photo::before{background:linear-gradient(0deg,var(--black) 0%,transparent 55%)}
  .hero-copy{padding-top:0}
}

/* Interior page hero */
.phero{position:relative;background:var(--black);overflow:hidden;border-bottom:1px solid var(--line-d)}
.phero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);min-height:440px}
.phero-copy{padding-block:clamp(2.5rem,5vw,4.5rem);position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center}
.phero h1{margin-top:1.2rem;font-size:clamp(2.2rem,5vw,4.2rem)}
.phero .lede{margin-top:1.2rem}
.phero .btn-row{margin-top:1.9rem}
.phero-photo{position:relative;margin-right:calc(var(--gutter)*-1);margin-left:-12%}
.phero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%;filter:grayscale(1)}
.phero-photo::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--black) 0%,rgba(11,11,11,.4) 30%,transparent 60%)}
.phero-photo .quote{position:absolute;right:clamp(1rem,3vw,2.5rem);top:clamp(1.5rem,4vw,3rem);z-index:2;max-width:210px}
.phero.noimg .phero-grid{grid-template-columns:1fr;min-height:0}
@media (min-width:1241px){.phero-photo{margin-right:calc((100vw - var(--wrap))/-2 - var(--gutter))}}
@media (max-width:820px){
  .phero-grid{grid-template-columns:1fr;min-height:0}
  .phero-photo{order:-1;height:260px;margin:0 calc(var(--gutter)*-1)}
  .phero-photo::before{background:linear-gradient(0deg,var(--black) 0%,transparent 60%)}
  .phero-photo .quote{display:none}
}
.crumbs{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-muted);font-weight:600}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.crumbs li+li::before{content:"|";margin-right:.45rem;color:var(--yellow)}
.crumbs a{color:var(--on-dark-muted);text-decoration:none}
.crumbs a:hover{color:var(--yellow)}
.bigplat{display:inline-block;background:var(--yellow);color:#000;font-weight:900;letter-spacing:.14em;font-size:.8rem;padding:.35rem .7rem;text-transform:uppercase}

/* Quote */
.quote{border-left:3px solid var(--yellow);padding:.2rem 0 .2rem 1.2rem;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.3;color:#fff;font-weight:500}
.quote::before{content:"\201C";display:block;font-size:2.8rem;line-height:.6;color:var(--yellow);font-weight:900;margin-bottom:.5rem}
.quote b{color:var(--yellow);font-weight:800}

/* Yellow band */
.band{background:var(--yellow);color:#000;color-scheme:light}
.band-inner{display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem 2rem;align-items:center;padding-block:clamp(1.5rem,3vw,2.2rem)}
.band .ico{width:56px;height:56px;color:#000}
.band .div{border-left:2px solid #000;padding-left:2rem}
.band .k{font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;font-weight:600;display:block;margin-bottom:.35rem}
.band p.big{font-weight:800;font-size:clamp(1.1rem,2vw,1.55rem);line-height:1.25}
@media (max-width:760px){.band-inner{grid-template-columns:auto 1fr}.band-inner .btn-row{grid-column:1/-1}.band .div{padding-left:1.2rem}.band .ico{width:40px;height:40px}}
.box-y{background:var(--yellow);color:#000;padding:1.4rem 1.6rem;display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:center}
.box-y .ico{width:44px;height:44px}
.box-y p{font-weight:800;font-size:1.1rem;line-height:1.3;border-left:2px solid #000;padding-left:1.2rem}
.box-y .k{display:block;font-size:.7rem;letter-spacing:.24em;font-weight:600;text-transform:uppercase;margin-bottom:.25rem}

/* Split: text + photo */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.split.wl{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.split .ph{position:relative}
.split .ph img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1)}
.split .ph::after{content:"";position:absolute;right:-12px;bottom:-12px;width:38%;height:38%;border-right:3px solid var(--yellow);border-bottom:3px solid var(--yellow);pointer-events:none}
.split .ph.wide img{aspect-ratio:4/3}
@media (max-width:860px){.split,.split.wl{grid-template-columns:1fr}.split .ph{max-width:520px}}

/* Icon rows */
.icons{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:0}
.icons>div{display:grid;gap:.7rem;justify-items:center;text-align:center;padding:.4rem 1.2rem;border-left:1px solid var(--yellow-2)}
.icons>div:first-child{border-left:0}
.icons .ring{width:64px;height:64px;border:2px solid var(--yellow);border-radius:50%;display:grid;place-items:center;color:var(--yellow)}
.icons .ring svg{width:30px;height:30px}
.icons h3{font-size:.95rem}
.icons p{color:var(--on-dark-muted);font-size:.92rem;line-height:1.45}
.icons p b{color:var(--yellow)}
.light .icons .ring,.paper .icons .ring{color:#000;background:var(--yellow);border-color:var(--yellow)}
.light .icons p,.paper .icons p{color:var(--muted)}
@media (max-width:860px){.icons{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.8rem 0}.icons>div:nth-child(odd){border-left:0}}
@media (max-width:480px){.icons{grid-template-columns:1fr}.icons>div{border-left:0}}

/* Journey chevrons */
.journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.jstep{display:grid;gap:1rem}
.chev{display:flex;align-items:center;gap:0;height:78px}
.chev .c{width:78px;height:78px;border-radius:50%;background:#000;border:3px solid var(--yellow);display:grid;place-items:center;color:var(--yellow);flex:none;position:relative;z-index:1}
.light .chev .c,.paper .chev .c{background:#fff}
.chev .c svg{width:34px;height:34px}
.chev .bar{flex:1;height:58px;background:var(--yellow);color:#000;margin-left:-18px;padding-left:30px;display:flex;flex-direction:column;justify-content:center;clip-path:polygon(0 0,calc(100% - 24px) 0,100% 50%,calc(100% - 24px) 100%,0 100%)}
.chev .bar b{font-weight:900;font-size:1.25rem;letter-spacing:.02em;line-height:1}
.chev .bar span{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;margin-top:3px}
.jstep p{color:var(--on-dark-muted);font-size:.93rem;padding-left:.5rem}
.light .jstep p,.paper .jstep p{color:var(--muted)}
@media (max-width:900px){.journey{grid-template-columns:1fr}}
.model{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;list-style:none;margin:0;padding:0}
.model li{display:flex;align-items:center;gap:.8rem;background:var(--yellow);color:#000;border-radius:999px;padding:.55rem 1.2rem .55rem .55rem;position:relative}
.model li .c{width:48px;height:48px;border-radius:50%;background:#000;color:var(--yellow);display:grid;place-items:center;flex:none}
.model li .c svg{width:24px;height:24px}
.model li b{display:block;font-weight:900;font-size:1rem;letter-spacing:.02em}
.model li span{font-size:.82rem;font-weight:500}
@media (max-width:1000px){.model{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.model{grid-template-columns:1fr}}
.model-detail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4rem;margin-top:1.4rem}
.model-detail p{color:var(--on-dark-muted);font-size:.92rem}
.light .model-detail p,.paper .model-detail p{color:var(--muted)}
@media (max-width:1000px){.model-detail{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.model-detail{grid-template-columns:1fr}}

/* Programme photo cards */
.pcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.pcard{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:400px;overflow:hidden;text-decoration:none;color:#fff;background:var(--char);border-bottom:3px solid transparent;transition:border-color .2s}
.pcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:transform .5s ease}
.pcard::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,11,.1) 0%,rgba(11,11,11,.55) 45%,rgba(11,11,11,.96) 78%);z-index:1}
.pcard>div{position:relative;z-index:2;padding:1.4rem;display:grid;gap:.6rem}
.pcard .ring{width:52px;height:52px;border:2px solid var(--yellow);border-radius:50%;display:grid;place-items:center;color:var(--yellow);background:rgba(0,0,0,.4)}
.pcard .ring svg{width:26px;height:26px}
.pcard h3{color:var(--yellow);font-size:1.02rem}
.pcard p{font-size:.9rem;color:#E4E4DF;line-height:1.5}
.pcard .plat{position:absolute;top:1rem;left:1rem;z-index:2;background:var(--yellow);color:#000;font-size:.62rem;font-weight:900;letter-spacing:.2em;padding:.3rem .55rem}
.pcard:hover{border-color:var(--yellow);color:#fff}
.pcard:hover img{transform:scale(1.04)}
.pcard .textlink{margin-top:.2rem}
@media (max-width:1100px){.pcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.pcards{grid-template-columns:1fr}.pcard{min-height:340px}}
.pcards .intro{background:var(--yellow);color:#000;padding:1.6rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;min-height:400px}
.pcards .intro h3{font-size:1.6rem;font-weight:900;line-height:1}
.pcards .intro p{font-weight:500}
.pcards .intro .label::before{background:#000}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:0}
.stats>div{padding:1.2rem 1.4rem;border-left:1px solid var(--yellow-2);display:grid;gap:.35rem;align-content:start}
.stats>div:first-child{border-left:0;padding-left:0}
.stats .n{font-weight:900;font-size:clamp(2.2rem,4vw,3.3rem);letter-spacing:-.02em;color:var(--yellow);line-height:1}
.stats .l{font-weight:800;text-transform:uppercase;font-size:.82rem;letter-spacing:.08em}
.stats p{color:var(--on-dark-muted);font-size:.9rem;line-height:1.45}
.band .stats .n{color:#000}.band .stats>div{border-color:#000}.band .stats p{color:#222}
.light .stats .n,.paper .stats .n{color:#000}
.light .stats p,.paper .stats p{color:var(--muted)}
@media (max-width:860px){.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 0}.stats>div:nth-child(odd){border-left:0;padding-left:0}}
@media (max-width:480px){.stats{grid-template-columns:1fr}.stats>div{border-left:0;padding-left:0}}
.source{font-size:.78rem;color:var(--on-dark-muted);margin-top:1rem}
.light .source,.paper .source{color:var(--muted)}
.tagpill{display:inline-block;font-size:.62rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;padding:.3rem .55rem;border:1px solid currentColor}
.tagpill.goal{color:var(--yellow)}
.tagpill.done{background:var(--yellow);color:#000;border-color:var(--yellow)}

/* Recorded work list */
.records{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.rec{background:var(--char);border-top:3px solid var(--yellow);padding:1.6rem;display:grid;gap:.7rem;align-content:start;text-decoration:none;color:#fff}
.rec .n{font-size:2.6rem;font-weight:900;color:var(--yellow);line-height:1}
.rec h3{font-size:1rem}
.rec p{color:var(--on-dark-muted);font-size:.93rem}
a.rec:hover{background:var(--char-2);color:#fff}
@media (max-width:900px){.records{grid-template-columns:1fr}}

/* Feature (story) */
.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:var(--char);overflow:hidden}
.feature-ph{position:relative;min-height:420px}
.feature-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.feature-body{padding:clamp(1.75rem,4vw,3.2rem);display:grid;gap:1.1rem;align-content:center}
.feature-body p{color:var(--on-dark-muted)}
.milestones{list-style:none;padding:0;margin:.3rem 0 0;display:grid;gap:.55rem}
.milestones li{display:grid;grid-template-columns:22px 1fr;gap:.7rem;align-items:baseline;font-size:.97rem;font-weight:500}
.milestones li::before{content:"";width:16px;height:3px;background:var(--yellow);transform:translateY(-4px)}
@media (max-width:860px){.feature{grid-template-columns:1fr}.feature-ph{min-height:280px}}

/* Ways / tiles */
.ways{display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));gap:0;border-top:1px solid var(--line-d)}
.way{padding:1.8rem 1.4rem;display:flex;flex-direction:column;gap:.7rem;text-decoration:none;color:#fff;border-left:1px solid var(--line-d);border-bottom:1px solid var(--line-d);transition:background .15s}
.way:hover{background:var(--char);color:#fff}
.way .ring{width:56px;height:56px;border:2px solid var(--yellow);border-radius:50%;display:grid;place-items:center;color:var(--yellow)}
.way .ring svg{width:26px;height:26px}
.way h3{color:var(--yellow)}
.way p{color:var(--on-dark-muted);font-size:.93rem;flex:1}
.light .ways,.paper .ways{border-color:var(--line)}
.light .way,.paper .way{color:var(--text);border-color:var(--line)}
.light .way h3,.paper .way h3{color:var(--text)}
.light .way p,.paper .way p{color:var(--muted)}
.light .way:hover,.paper .way:hover{background:var(--yellow-soft);color:var(--text)}
.light .way .ring,.paper .way .ring{background:var(--yellow);color:#000}
@media (max-width:1100px){.ways{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.ways{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.ways{grid-template-columns:1fr}.way{border-left:0}}

/* Article cards */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.card{background:var(--char);display:flex;flex-direction:column;text-decoration:none;color:#fff;border-bottom:3px solid transparent;transition:border-color .2s}
.card:hover{border-color:var(--yellow);color:#fff}
.card-ph{aspect-ratio:16/10;position:relative;overflow:hidden;max-width:100%}
.card-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:transform .5s}
.card:hover .card-ph img{transform:scale(1.04)}
.card-ph .cat{position:absolute;left:0;bottom:0;background:var(--yellow);color:#000;font-size:.62rem;font-weight:900;letter-spacing:.2em;text-transform:uppercase;padding:.4rem .7rem}
.card-body{padding:1.3rem 1.4rem 1.6rem;display:grid;gap:.6rem;flex:1;align-content:start}
.card-body h3{font-size:1.02rem}
.card-body p{color:var(--on-dark-muted);font-size:.92rem}
.meta{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-muted);font-weight:600}
@media (max-width:960px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.cards{grid-template-columns:1fr}}

/* Chips */
.chips{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:0}
.chips li{border:1px solid var(--line-d);padding:.55rem .9rem;font-size:.85rem;font-weight:600;color:#fff}
.light .chips li,.paper .chips li{border-color:var(--line);color:var(--text);background:#fff}

/* Lists */
.ticklist{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2rem}
.ticklist li{padding:.85rem 0 .85rem 2rem;border-bottom:1px solid var(--line-d);position:relative;font-weight:600;font-size:.97rem}
.ticklist li::before{content:"";position:absolute;left:0;top:1.35rem;width:18px;height:3px;background:var(--yellow)}
.ticklist.one{grid-template-columns:1fr}
.light .ticklist li,.paper .ticklist li{border-color:var(--line)}
.light .ticklist li::before,.paper .ticklist li::before{background:#000}
@media (max-width:620px){.ticklist{grid-template-columns:1fr}}

/* Values */
.values{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line-d)}
.values div{background:var(--black);padding:1.6rem;display:grid;gap:.5rem;align-content:start}
.values h3{color:var(--yellow)}
.values p{color:var(--on-dark-muted);font-size:.93rem}
.values div.hl{background:var(--yellow)}
.values div.hl h3{color:#000}
.values div.hl p{color:#1c1c1c}
.paper .values{background:var(--line)}
.paper .values div{background:#fff}
.paper .values h3{color:#000}
.paper .values p{color:var(--muted)}
@media (max-width:960px){.values{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.values{grid-template-columns:1fr}}

/* Steps */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:1rem;counter-reset:st}
.steps li{counter-increment:st;background:var(--char);border-top:3px solid var(--yellow);padding:1.5rem;display:grid;gap:.5rem;align-content:start}
.steps li::before{content:counter(st,decimal-leading-zero);display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--yellow);color:#000;font-weight:900;font-size:.85rem}
.steps p{color:var(--on-dark-muted);font-size:.93rem}
.light .steps li,.paper .steps li{background:#fff;border:1px solid var(--line);border-top:3px solid var(--yellow)}
.light .steps p,.paper .steps p{color:var(--muted)}
@media (max-width:1000px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* People */
.people{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.person{border-top:3px solid var(--yellow);padding-top:1rem;display:grid;gap:.25rem}
.person b{font-weight:800;font-size:1.02rem}
.person span{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-muted);font-weight:600}
.paper .person span,.light .person span{color:var(--muted)}
@media (max-width:900px){.people{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.people{grid-template-columns:1fr}}

/* Governance strip */
.gov{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:center;border:1px solid var(--line-d);border-left:4px solid var(--yellow);padding:clamp(1.5rem,3vw,2.3rem);background:var(--char)}
.gov dl{display:grid;grid-template-columns:repeat(3,auto);gap:.3rem 2.5rem;margin:1.2rem 0 0;justify-content:start}
.gov dt{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--on-dark-muted);font-weight:600}
.gov dd{margin:0;font-weight:800;font-size:1.02rem;color:#fff;grid-row:2;font-variant-numeric:tabular-nums}
@media (max-width:820px){.gov{grid-template-columns:1fr}.gov dl{grid-template-columns:1fr;gap:.2rem}.gov dd{grid-row:auto;margin-bottom:.7rem}}

/* Final CTA */
.final{position:relative;background:var(--black);overflow:hidden;border-top:1px solid var(--line-d)}
.final-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);min-height:420px}
.final-copy{padding-block:clamp(3rem,6vw,5rem);display:flex;flex-direction:column;justify-content:center;gap:1.2rem;position:relative;z-index:2}
.final h2{font-size:clamp(2rem,4.6vw,3.8rem)}
.final p{color:#E3E3DE;max-width:50ch}
.final-ph{position:relative;margin-left:-15%;margin-right:calc(var(--gutter)*-1)}
.final-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%;filter:grayscale(1)}
.final-ph::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--black),transparent 55%)}
@media (min-width:1241px){.final-ph{margin-right:calc((100vw - var(--wrap))/-2 - var(--gutter))}}
@media (max-width:820px){.final-grid{grid-template-columns:1fr}.final-ph{display:none}}

/* Forms (light) */
.form{display:grid;gap:1.1rem;background:#fff;color:var(--text);border-top:4px solid var(--yellow);padding:clamp(1.3rem,3vw,2.3rem);color-scheme:light;box-shadow:0 30px 60px -40px rgba(0,0,0,.45)}
.form h2{font-size:1.5rem}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
@media (max-width:600px){.form .row{grid-template-columns:1fr}}
.field{display:grid;gap:.4rem}
.field label,.fieldset legend{font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase}
.field .hint{font-size:.84rem;color:var(--muted)}
input,select,textarea{font:inherit;font-size:1rem;color:var(--text);background:#FAFAF8;border:1.5px solid #CFCFC8;border-radius:0;padding:.85rem .9rem;width:100%}
textarea{min-height:140px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:#000;box-shadow:0 0 0 3px var(--yellow);background:#fff}
.req{color:var(--clay)}
.check{display:grid;grid-template-columns:22px 1fr;gap:.7rem;align-items:start;font-size:.9rem;color:var(--muted)}
.check input{width:20px;height:20px;margin-top:2px;accent-color:#000}
.check a{color:var(--text)}
.fieldset{border:0;padding:0;margin:0;display:grid;gap:.6rem}
.choice{display:flex;flex-wrap:wrap;gap:.5rem}
.choice label{position:relative;cursor:pointer}
.choice input{position:absolute;opacity:0;width:1px;height:1px}
.choice span{display:inline-block;border:1.5px solid #CFCFC8;background:#fff;padding:.65rem 1rem;font-weight:700;font-size:.88rem;transition:.12s}
.choice input:checked+span{background:#000;border-color:#000;color:var(--yellow)}
.choice input:focus-visible+span{outline:3px solid var(--yellow);outline-offset:2px}
.form .btn{justify-self:start}
.form-status{padding:1rem 1.1rem;font-size:.95rem;background:var(--paper);color:var(--text)}
.form-status.ok{background:var(--yellow-soft);color:#3B3000;border-left:4px solid var(--yellow)}
.form-status.err{background:#F9E3DD;color:#7A2A15}
.form hr{border:0;height:1px;background:var(--line);margin:0}

/* Donate */
.donate-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media (max-width:900px){.donate-grid{grid-template-columns:1fr}}
.amount-out{font-weight:900;font-size:2.4rem;letter-spacing:-.02em;color:#000}
.ref{background:var(--yellow-soft);padding:.2rem .5rem;font-weight:700;color:#000}

/* Contact cards */
.contact-cards{display:grid;gap:1rem}
.ccard{background:var(--char);border-left:3px solid var(--yellow);padding:1.3rem 1.4rem;display:grid;gap:.3rem;align-content:start}
.ccard h3{font-size:.8rem;letter-spacing:.2em;color:var(--on-dark-muted)}
.ccard .val{font-weight:700;font-size:1.05rem;color:#fff;word-break:break-word}
.ccard p{color:var(--on-dark-muted);font-size:.93rem}
.light .ccard,.paper .ccard{background:#fff;border:1px solid var(--line);border-left:3px solid var(--yellow)}
.light .ccard .val,.paper .ccard .val{color:#000}
.light .ccard p,.paper .ccard p,.light .ccard h3,.paper .ccard h3{color:var(--muted)}
.copy{justify-self:start;margin-top:.35rem;background:none;border:1px solid var(--line-d);padding:.4rem .8rem;font:inherit;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;cursor:pointer;color:var(--yellow)}
.copy:hover{border-color:var(--yellow)}
.light .copy,.paper .copy{color:#000;border-color:var(--line)}
.map-card{position:relative;overflow:hidden;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;gap:.5rem;padding:1.5rem;background:#000}
.map-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.map-card::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.9) 20%,rgba(0,0,0,.2));z-index:1}
.map-card>*:not(img){position:relative;z-index:2}
.map-card p{font-weight:800;font-size:1.2rem;line-height:1.3;color:#fff}

/* FAQ */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:1.3rem 2.5rem 1.3rem 0;position:relative;font-weight:800;font-size:clamp(1rem,1.5vw,1.15rem)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:1rem;width:30px;height:30px;display:grid;place-items:center;background:var(--yellow);color:#000;font-weight:900;font-size:1.2rem;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 0 1.5rem;color:var(--muted);max-width:72ch}
.faq .a p+p{margin-top:.75rem}
.dark .faq,.char .faq{border-color:var(--line-d)}.dark .faq details{border-color:var(--line-d)}.dark .faq .a{color:var(--on-dark-muted)}
.faq-nav{display:grid;gap:.2rem}
.faq-nav a{text-decoration:none;color:var(--muted);padding:.35rem 0;font-weight:600;font-size:.93rem}
.faq-nav a:hover{color:var(--text)}

/* Article */
.article{max-width:760px;margin-inline:auto}
.article .prose{max-width:none;font-size:1.06rem}
.article .prose p{color:#2A2A28}
.pull{border-left:4px solid var(--yellow);padding:.3rem 0 .3rem 1.3rem;margin:2.2rem 0;font-size:1.4rem;font-weight:800;line-height:1.25;color:#000;text-transform:none}
.story-meta{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin:1.6rem 0 0}
.story-meta div{display:grid;gap:.15rem}
.story-meta dt{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--on-dark-muted);font-weight:600}
.story-meta dd{margin:0;color:#fff;font-weight:700}
.light .story-meta dt,.paper .story-meta dt{color:var(--muted)}
.light .story-meta dd,.paper .story-meta dd{color:#000}
.story-block{display:grid;grid-template-columns:200px 1fr;gap:2rem;padding-block:2rem;border-top:1px solid var(--line)}
.story-block h2{font-size:.78rem;font-weight:800;letter-spacing:.24em;text-transform:uppercase;color:#000;margin:0;padding-top:.3rem;display:flex;gap:.7rem;align-items:flex-start}
.story-block h2::before{content:"";width:22px;height:3px;background:var(--yellow);margin-top:.45rem;flex:none}
.story-block .prose p{color:#2A2A28}
@media (max-width:760px){.story-block{grid-template-columns:1fr;gap:.75rem}}

/* Misc */
.mt1{margin-top:1rem}.mt2{margin-top:2rem}.mt3{margin-top:3rem}
.stack{display:grid;gap:1rem}
.stack-lg{display:grid;gap:2rem}
.divider{height:1px;background:var(--line-d);border:0;margin:0}
.light .divider,.paper .divider{background:var(--line)}
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.cols.wl{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
@media (max-width:860px){.cols,.cols.wl{grid-template-columns:1fr}}
.sticky{position:sticky;top:110px}
@media (max-width:860px){.sticky{position:static}}
.pillnav{display:flex;flex-wrap:wrap;gap:.5rem}
.pillnav a{border:1px solid var(--line-d);padding:.55rem .9rem;text-decoration:none;font-weight:700;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#fff}
.pillnav a:hover,.pillnav a[aria-current="page"]{background:var(--yellow);color:#000;border-color:var(--yellow)}
.note{border-left:4px solid var(--yellow);background:var(--yellow-soft);padding:1rem 1.2rem;font-size:.93rem;color:#3B3000;display:flex;gap:.75rem;align-items:flex-start}
.note svg{width:20px;height:20px;flex:none;margin-top:3px}
.dark .note,.char .note{background:rgba(254,207,3,.08);color:#EDE3B5}
.nf{min-height:60vh;display:grid;place-items:center;text-align:center}
.nf .btn-row{justify-content:center}
.bridge{display:grid;border-top:1px solid var(--line-d)}
.bridge div{display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line-d);font-weight:900;text-transform:uppercase;font-size:clamp(1rem,1.8vw,1.3rem)}
.bridge span:last-child{color:var(--yellow)}
.bridge i{height:3px;background:var(--yellow);margin-inline:.6rem;position:relative}
.bridge i::after{content:"";position:absolute;right:-2px;top:-5px;border:6.5px solid transparent;border-left:9px solid var(--yellow);border-right:0}
.founder-img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:62% 20%}

/* Footer */
.site-footer{background:#000;color:var(--on-dark-muted);font-size:.9rem}
.f-cta{background:var(--yellow);color:#000;color-scheme:light}
.f-cta-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:0;align-items:stretch}
.f-cta-grid>div{padding:1.6rem 1.4rem;border-left:2px solid #000;display:flex;gap:.9rem;align-items:center}
.f-cta-grid>div:first-child{border-left:0;padding-left:0;display:block}
.f-cta .k{font-size:.7rem;letter-spacing:.26em;font-weight:600;text-transform:uppercase;display:block}
.f-cta b{font-weight:800;font-size:1.15rem;line-height:1.25;display:block;margin-top:.3rem}
.f-cta .dot{width:44px;height:44px;border-radius:50%;background:#000;color:var(--yellow);display:grid;place-items:center;flex:none}
.f-cta .dot svg{width:20px;height:20px}
.f-cta a,.f-cta span.v{color:#000;font-weight:700;text-decoration:none;font-size:.95rem;word-break:break-word}
@media (max-width:1000px){.f-cta-grid{grid-template-columns:1fr 1fr}.f-cta-grid>div:first-child{grid-column:1/-1;padding-bottom:.5rem}.f-cta-grid>div:nth-child(2){border-left:0;padding-left:0}}
@media (max-width:600px){.f-cta-grid{grid-template-columns:1fr}.f-cta-grid>div{border-left:0;padding-left:0;border-top:1px solid rgba(0,0,0,.2)}}
.fgrid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:2rem;padding-block:3.5rem 2.5rem}
.fgrid h2{font-size:.68rem;letter-spacing:.24em;color:var(--yellow);font-weight:700;margin-bottom:1rem}
.fgrid ul{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.fgrid a{color:#fff;text-decoration:none}
.fgrid a:hover{color:var(--yellow)}
.fbrand img{width:220px}
.fbrand .line{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:#fff;font-weight:600;margin-top:.8rem;line-height:1.8}
.fbrand p{margin-top:1rem;max-width:34ch}
.news{display:flex;gap:0;margin-top:1.2rem;max-width:380px}
.news input{background:#111;border-color:#333;color:#fff;border-right:0}
.news input::placeholder{color:#888}
.news .btn .t{padding:.8rem 1rem}
@media (max-width:1000px){.fgrid{grid-template-columns:1fr 1fr 1fr}.fbrand{grid-column:1/-1}}
@media (max-width:560px){.fgrid{grid-template-columns:1fr 1fr}}
.metabar{border-top:1px solid #222;padding-block:1.2rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem}
.metabar .l{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;font-weight:600}
.metabar .l::before{content:"";width:44px;height:3px;background:var(--yellow)}
.metabar .l span+span::before{content:"|";color:var(--yellow);margin-right:1rem}
.metabar .r{text-align:right;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:#fff;line-height:1.5}
.metabar .r span{color:var(--yellow);display:block}
.fpol{display:flex;flex-wrap:wrap;gap:.4rem 1.3rem;list-style:none;margin:0;padding:0 0 1.5rem;font-size:.8rem}
.fpol a{color:var(--on-dark-muted);text-decoration:none}
.fpol a:hover{color:var(--yellow)}

@media (max-width:1320px) and (min-width:1181px){.brand small{display:none}.nav a.top,.nav button.top{padding:.7rem .5rem;font-size:.7rem}}