:root{
  --blue:#1140C4;
  --blue-deep:#0A1440;
  --yellow:#F5C518;
  --orange:#FE9102;
  --ground:#F5F6F0;
  --surface:#FFFFFF;
  --surface-2:#E9EBE1;
  --ink:#0E1738;
  --text:#3A4460;
  --muted:#6C7590;
  --line:#D7DBCD;
  --line-strong:#B7BEAB;
  --band:#0D1742;
  --band-2:#16225A;
  --band-fg:#F5F7ED;
  --band-soft:rgba(245,247,237,.82);
  --band-dim:rgba(245,247,237,.66);
  --band-edge:rgba(245,247,237,.26);
  --edge:#0E1738;
  --maxw:1160px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --blue:#5C86FF;
    --blue-deep:#070E2C;
    --yellow:#F5C518;
    --orange:#FFA733;
    --ground:#070C1E;
    --surface:#0F1734;
    --surface-2:#161F45;
    --ink:#EEF1E4;
    --text:#B7C0D8;
    --muted:#838EAD;
    --line:#212C5C;
    --line-strong:#313E76;
    --band:#0A1236;
    --band-2:#141E4E;
    --band-fg:#F5F7ED;
    --band-soft:rgba(245,247,237,.82);
    --band-dim:rgba(245,247,237,.66);
    --band-edge:rgba(245,247,237,.24);
    --edge:#37457F;
  }
}
:root[data-theme="dark"]{
  --blue:#5C86FF; --blue-deep:#070E2C; --yellow:#F5C518; --orange:#FFA733;
  --ground:#070C1E; --surface:#0F1734; --surface-2:#161F45;
  --ink:#EEF1E4; --text:#B7C0D8; --muted:#838EAD;
  --line:#212C5C; --line-strong:#313E76;
  --band:#0A1236; --band-2:#141E4E; --band-fg:#F5F7ED;
  --band-soft:rgba(245,247,237,.82); --band-dim:rgba(245,247,237,.66);
  --band-edge:rgba(245,247,237,.24); --edge:#37457F;
}

*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--text);
  font-family:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:"Bricolage Grotesque","Instrument Sans",system-ui,sans-serif;
  font-weight:800;color:var(--ink);margin:0;line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;color:var(--blue);margin:0 0 16px;display:block}
section{padding:74px 0}
.sec-head{display:grid;gap:16px;margin-bottom:38px}
@media(min-width:860px){.sec-head{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end}}
.sec-head h2{font-size:clamp(33px,4.5vw,53px);overflow-wrap:break-word}
.sec-head p{margin:0;color:var(--muted);max-width:56ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:500;letter-spacing:.09em;
  text-transform:uppercase;text-decoration:none;padding:13px 20px;background:var(--blue);
  color:#fff;border:2px solid var(--blue);cursor:pointer;transition:transform .14s ease}
.btn:hover{transform:translate(-2px,-2px)}
.btn.alt{background:var(--yellow);border-color:var(--yellow);color:#0E1738}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn.ghost:hover{border-color:var(--ink)}

/* header */
header.site{position:sticky;top:0;z-index:60;background:var(--ground);border-bottom:2px solid var(--edge)}
.bar{display:flex;align-items:center;gap:16px;height:70px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.brand img{width:36px;height:auto}
.brand .n1{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:19px;
  color:var(--ink);line-height:1.05;letter-spacing:-.01em;display:block}
.brand .n2{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.15em;
  color:var(--muted);text-transform:uppercase;display:block}
nav.main{display:none;gap:15px;margin:0 auto}
@media(min-width:1150px){nav.main{display:flex}}
nav.main a{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.05em;
  text-transform:uppercase;text-decoration:none;color:var(--muted);padding-bottom:2px;
  white-space:nowrap;border-bottom:2px solid transparent}
nav.main a:hover{color:var(--ink);border-color:var(--yellow)}
.lang{margin-left:auto;display:flex;border:2px solid var(--line-strong)}
.lang button{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.08em;
  padding:7px 10px;background:transparent;border:0;color:var(--muted);cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--ground)}
header .btn{display:none}
@media(min-width:640px){header .btn{display:inline-flex;padding:10px 14px}}

/* hero */
.hero{position:relative;padding:0;background:var(--blue-deep);color:var(--band-fg)}
.hero-media{position:absolute;inset:0;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 42%;opacity:.4}
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(102deg,rgba(10,20,64,.96) 0%,rgba(10,20,64,.84) 46%,rgba(10,20,64,.34) 100%)}
.hero-inner{position:relative;padding:66px 0 56px}
.hero .eyebrow{color:var(--yellow)}
.hero h1{color:var(--band-fg);font-size:clamp(46px,7.6vw,92px);max-width:12ch}
.hero .lede{font-size:18.5px;max-width:52ch;margin:22px 0 28px;color:var(--band-soft)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;
  background:var(--band-edge);margin-top:42px}
@media(min-width:760px){.facts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.fact{background:var(--blue-deep);padding:18px 16px}
.fact b{display:block;font-family:"Bricolage Grotesque",sans-serif;font-size:33px;font-weight:800;
  color:var(--yellow);line-height:1;font-variant-numeric:tabular-nums}
.fact span{display:block;margin-top:9px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.09em;text-transform:uppercase;color:var(--band-dim);line-height:1.45}

/* motto rail */
.motto{background:var(--yellow);color:#0E1738;overflow:hidden}
.motto .wrap{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;
  padding-top:13px;padding-bottom:13px;
  font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase}
.motto i{font-style:normal;opacity:.5}

/* story */
.split{display:grid;gap:30px;align-items:center}
@media(min-width:900px){.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:54px}}
.split figure{margin:0}
.split figure img{width:100%;height:auto;border:2px solid var(--edge)}
.split figcaption{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);margin-top:10px}
.split h2{font-size:clamp(31px,4.2vw,46px);margin-bottom:18px}
.split p{margin:0 0 14px;max-width:52ch}
.quote{border-left:4px solid var(--orange);padding:6px 0 6px 20px;margin:24px 0 0;
  font-size:19px;line-height:1.45;color:var(--ink);font-weight:500;max-width:44ch}
.quote cite{display:block;margin-top:8px;font-style:normal;font-family:"IBM Plex Mono",monospace;
  font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}
.people{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:0}
.people li{padding:15px 0;border-top:1px solid var(--line)}
.people li:last-child{border-bottom:1px solid var(--line)}
.people b{display:block;font-family:"Bricolage Grotesque",sans-serif;font-size:19px;
  font-weight:800;color:var(--ink);letter-spacing:-.01em}
.people span{font-size:15px;color:var(--muted)}
.people em{display:block;font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.11em;text-transform:uppercase;color:var(--blue);margin-bottom:3px}

.board{display:grid;gap:2px;background:var(--line);border:2px solid var(--edge);margin-top:44px}
@media(min-width:620px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.board{grid-template-columns:repeat(3,minmax(0,1fr))}}
.member{background:var(--surface);padding:20px 18px;display:flex;flex-direction:column;gap:7px}
.member em{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--blue);line-height:1.5}
.member b{font-family:"Bricolage Grotesque",sans-serif;font-size:19px;font-weight:800;
  color:var(--ink);letter-spacing:-.01em;line-height:1.1;overflow-wrap:break-word}
.member span{font-size:13.5px;color:var(--muted);line-height:1.45}
.board.six{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
@media(min-width:1000px){.board.six{grid-template-columns:repeat(3,minmax(0,1fr))}}
.member.lic{background:var(--band)}
.member.lic em{color:var(--yellow)}
.member.lic b{color:var(--band-fg);font-size:17px}
.member.lic span{color:var(--band-soft)}
.board-head{font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--blue);margin:44px 0 -28px}

/* categories */
.cats{display:grid;gap:2px;background:var(--line)}
@media(min-width:640px){.cats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cat{background:var(--surface);padding:22px 20px 24px;display:flex;flex-direction:column;gap:9px;min-height:172px}
.cat .age{font-family:"Bricolage Grotesque",sans-serif;font-size:38px;font-weight:800;
  color:var(--blue);line-height:.9;letter-spacing:-.03em}
.cat h3{font-size:19px;letter-spacing:-.01em}
.cat p{margin:0;font-size:14.5px;color:var(--muted);line-height:1.5}
.cat.note{background:var(--band);color:var(--band-fg)}
.cat.note h3{color:var(--yellow);font-size:21px}
.cat.note p{color:var(--band-soft)}
.cat.note .age{color:var(--yellow);font-size:26px}

/* teams + strips */
.teams{display:grid;gap:2px;background:var(--line);border:2px solid var(--edge)}
@media(min-width:760px){.teams{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.teams.three{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1080px){.teams.four{grid-template-columns:repeat(4,minmax(0,1fr))}}
.teams figure{margin:0;background:var(--surface);display:flex;flex-direction:column}
.teams img{width:100%;aspect-ratio:3/2;object-fit:cover}
.teams img.fit{object-fit:contain;background:var(--band)}
.teams.portrait img{aspect-ratio:4/5}
.teams figcaption{padding:14px 16px;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
.teams figcaption b{font-family:"Bricolage Grotesque",sans-serif;font-size:17px;font-weight:800;color:var(--ink)}
.teams figcaption span{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}

/* band */
.band{background:var(--band);color:var(--band-fg)}
.band h2,.band h3,.band h4{color:var(--band-fg)}
.band .sec-head p{color:var(--band-soft)}
.sched{display:grid;gap:2px;background:var(--band-edge);border:2px solid var(--band-edge)}
@media(min-width:760px){.sched{grid-template-columns:repeat(4,minmax(0,1fr))}}
.day{background:var(--band-2);padding:22px 20px}
.day .d{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--band-dim)}
.day .t{font-family:"Bricolage Grotesque",sans-serif;font-size:42px;font-weight:800;
  color:var(--yellow);line-height:1;margin:10px 0 8px;font-variant-numeric:tabular-nums}
.day .p{font-size:14px;color:var(--band-soft)}
.sched-note{margin-top:22px;display:grid;gap:16px}
@media(min-width:820px){.sched-note{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}
.tip{border-left:4px solid var(--yellow);padding:2px 0 2px 18px}
.tip h4{font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--yellow);margin-bottom:7px}
.tip p{margin:0;font-size:15px;color:var(--band-soft)}

/* study list */
.prog{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:0}
.prog li{display:flex;gap:14px;padding:14px 0;border-top:1px solid var(--line);align-items:baseline}
.prog li:last-child{border-bottom:1px solid var(--line)}
.prog b{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--blue);
  letter-spacing:.1em;flex:none;min-width:22px}
.prog span{font-size:15.5px}

/* palmares */
.comps{display:grid;gap:2px;background:var(--band-edge);border:2px solid var(--band-edge)}
@media(min-width:1000px){.comps.trois{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:700px){.comps{grid-template-columns:repeat(2,minmax(0,1fr))}}
.comp{background:var(--band-2);padding:20px;display:flex;flex-direction:column;gap:7px}
.comp b{font-family:"Bricolage Grotesque",sans-serif;font-size:21px;font-weight:800;color:var(--band-fg)}
.comp span{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--yellow)}
.shots{display:grid;gap:2px;background:var(--band-edge);border:2px solid var(--band-edge);margin-top:2px}
@media(min-width:760px){.shots{grid-template-columns:1fr 1fr .68fr}}
.shots.huit{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(min-width:1000px){.shots.huit{grid-template-columns:repeat(4,minmax(0,1fr))}}
.shots.huit img{aspect-ratio:4/3}
.shots figure{margin:0;background:var(--band-2)}
.shots img{width:100%;aspect-ratio:3/2;object-fit:cover}
@media(min-width:760px){.shots figure:last-child img{aspect-ratio:auto;height:100%;object-fit:cover}}

.mosaic{display:grid;gap:2px;background:var(--band-edge);border:2px solid var(--band-edge)}
@media(min-width:600px){.mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.mosaic{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mosaic figure{margin:0;background:var(--band-2);display:flex;flex-direction:column}
.mosaic img{width:100%;aspect-ratio:4/3;object-fit:cover}
.mosaic figcaption{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--band-dim);padding:11px 13px}

/* staff / gallery */
.gal{display:grid;gap:2px;background:var(--band-edge)}
@media(min-width:700px){.gal{grid-template-columns:repeat(3,minmax(0,1fr))}}
.gal figure{margin:0;background:var(--band-2);display:flex;flex-direction:column}
.gal img{width:100%;aspect-ratio:3/4;object-fit:cover}
.gal.wide img{aspect-ratio:16/10}
.gal figcaption{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--band-dim);padding:12px 14px}
.strip{display:grid;gap:2px;background:var(--line);border:2px solid var(--edge)}
@media(min-width:760px){.strip{grid-template-columns:1fr .72fr 1fr}}
.strip figure{margin:0;background:var(--surface)}
.strip img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/2}
.strip .tall img{aspect-ratio:2/3}
@media(max-width:759px){.strip .tall img{aspect-ratio:3/2}}

/* fees */
.fees{display:grid;gap:2px;background:var(--line);border:2px solid var(--edge)}
@media(min-width:700px){.fees{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.fees{grid-template-columns:repeat(4,minmax(0,1fr))}}
.fee{background:var(--surface);padding:24px 20px;display:flex;flex-direction:column;gap:8px}
.fee .lbl{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted)}
.fee .amt{font-family:"Bricolage Grotesque",sans-serif;font-size:36px;font-weight:800;
  color:var(--ink);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.fee .amt sup{font-size:14px;font-weight:600;vertical-align:super;color:var(--muted);letter-spacing:0}
.fee p{margin:auto 0 0;font-size:14px;color:var(--muted)}
.fee.hi{background:var(--yellow)}
.fee.hi .lbl{color:#4A3A05}.fee.hi .amt{color:#0E1738}.fee.hi p{color:#4A3A05}

/* contact */
.contact-grid{display:grid;gap:34px}
@media(min-width:940px){.contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:54px}}
.clist{list-style:none;margin:0;padding:0}
.clist li{display:grid;grid-template-columns:118px minmax(0,1fr);gap:16px;padding:15px 0;
  border-top:1px solid var(--band-edge);align-items:baseline}
.clist li:last-child{border-bottom:1px solid var(--band-edge)}
.clist .k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--band-dim)}
.clist .v{font-size:16px;color:var(--band-fg)}
.clist .v a{display:inline-block;text-decoration:none;
  border-bottom:1px solid rgba(245,197,24,.7);margin-bottom:4px}
.clist .v a+a{display:block}
.clist .v a:hover{color:var(--yellow)}
form{display:grid;gap:14px;background:var(--band-2);border:2px solid var(--band-edge);padding:24px}
label{display:grid;gap:6px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;
  letter-spacing:.11em;text-transform:uppercase;color:var(--band-dim)}
input,select{font-family:"Instrument Sans",sans-serif;font-size:16px;padding:11px 12px;
  background:rgba(5,9,26,.6);color:var(--band-fg);border:1px solid var(--band-edge);border-radius:0}
input::placeholder{color:rgba(245,247,237,.45)}
form small{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.04em;
  color:var(--band-soft);line-height:1.6}
.social{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.social a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;
  border:2px solid var(--band-edge);padding:9px 14px;color:var(--band-fg);
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.09em;text-transform:uppercase}
.social a:hover{border-color:var(--yellow);color:var(--yellow)}

footer{background:var(--ground);border-top:2px solid var(--edge);padding:44px 0 50px}
.foot{display:grid;gap:26px}
@media(min-width:800px){.foot{grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,1fr));gap:40px}}
.foot h4{font-family:"IBM Plex Mono",monospace;font-size:10.5px;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.foot p{margin:0 0 6px;font-size:15px}
.foot a{display:block;font-size:15px;text-decoration:none;margin-bottom:6px;color:var(--text)}
.foot a:hover{color:var(--blue)}
.legal{margin-top:32px;padding-top:16px;border-top:1px solid var(--line);
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 22px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
