/* ════════════════════════════════════════════════════════════════
   YEEB 2026 · Design D "One Door"
   Institutional civic weight blended with Caribbean warmth.
   Navy-dominant because lime and sky are dark-ground colours: on
   white lime fails contrast and sky washes out. On navy both sing.
   All photography is a single navy duotone so mismatched source
   frames read as one owned system rather than borrowed stock.
   ════════════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box}
:root{
  /* ---- On the brand boards. Five colours, unchanged. ---- */
  --navy:#0D1B3D; --lime:#A6CE39; --sky:#57D6FF; --cream:#F7F6F2; --charcoal:#333B46;

  /* ---- Derived accessibility set. Documented extension to the boards. ---- */
  --ink:#04091A; --deep:#060F26; --limeink:#4F6B0E; --skyink:#05586F;

  /* ---- Three ratified additions, chosen and recorded, not improvised ---- */
  --lime-hover:#B0D34F;              /* lime 88% + cream 12% */
  --error:#8E2118;                   /* single error colour, measured */
  --paper:#FFFFFF; --line-d:#E2E0D8; /* surface + rule. No second off-white. */
  --whatsapp:#25D366;                /* third party brand exception */

  /* The comp's undocumented grey is deleted from this build. It caused 15 of
     its 18 contrast failures. Dim text is charcoal on light ground and cream
     at 74% on dark. No grey is declared here. */
  --dim-d:rgba(247,246,242,.74);
  --line:rgba(255,255,255,.14);

  /* ---- Type scale. Nine sizes. Floor 11.5px. ---- */
  --t-d1:clamp(42px,6.4vw,78px);
  --t-d2:clamp(32px,4.1vw,50px);
  --t-d3:clamp(26px,3vw,36px);
  --t-d4:24px;
  --t-lede:19px;
  --t-body:17px;
  --t-sm:15px;
  --t-xs:13.5px;
  --t-eyebrow:11.5px;

  /* ---- Weights. Four. Board: Black / Bold / Medium / Regular ---- */
  --w-black:700; --w-bold:700; --w-med:500; --w-reg:400;

  --sx:clamp(20px,5vw,72px); --content:1200px; --wrap:calc(var(--content) + var(--sx)*2);
  --r:10px; --r-sm:8px; --tap:44px; --measure:68ch;
  --sp:clamp(72px,9vw,124px);
  --ease:cubic-bezier(.22,1,.36,1);
  --govbar:0px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--deep);color:var(--cream);
  font-family:"Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight:500;font-size:var(--t-body);line-height:1.68;-webkit-font-smoothing:antialiased;
  overflow-x:hidden}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-0.028em;line-height:1.08}
p{margin:0}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
button{font-family:inherit;border:0;background:none;cursor:pointer;color:inherit}
input,textarea,select{font-family:inherit;font-size:var(--t-body);color:var(--navy)}
img{display:block;max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--sx)}
.sec{padding:var(--sp) 0}

/* ── type scale: 8 sizes, sentence case ─────────────────────── */
.t-hero{font-size:var(--t-d1);line-height:1.03;letter-spacing:-0.035em}
.t-1{font-size:var(--t-d2);line-height:1.08;letter-spacing:-0.03em}
.t-2{font-size:var(--t-d3);line-height:1.2;letter-spacing:-0.022em}
.t-3{font-size:var(--t-lede);line-height:1.32;font-weight:700;letter-spacing:-0.014em}
.lede{font-size:var(--t-lede);line-height:1.66;max-width:60ch}
.sm{font-size:var(--t-sm);line-height:1.6}
.xs{font-size:var(--t-xs);line-height:1.55}
.eyebrow{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  display:block;margin-bottom:18px}
.e-lime{color:var(--lime)} .e-sky{color:var(--sky)} .e-ink{color:var(--limeink)}
.on-dark{color:rgba(247,246,242,.74)}
.on-light{color:var(--charcoal)}

/* ── buttons ────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;
  padding:17px 32px;font-size:var(--t-sm);font-weight:700;letter-spacing:-0.005em;
  border-radius:var(--r);transition:transform .3s var(--ease),background .3s,color .3s;position:relative}
.btn:hover{transform:translateY(-2px)}
.btn-lime{background:var(--lime);color:var(--navy)}
.btn-lime:hover{background:#B7DB4E}
.btn-ghost{border:1.5px solid rgba(247,246,242,.34);color:var(--cream)}
.btn-ghost:hover{background:rgba(247,246,242,.1);border-color:var(--cream)}
.btn-navy{background:var(--navy);color:#fff}
.btn-sm{padding:12px 22px;font-size:var(--t-xs)}
.arw{display:inline-flex;align-items:center;gap:9px;font-size:var(--t-sm);font-weight:700;white-space:nowrap}
.arw svg{transition:transform .32s var(--ease)}
.arw:hover svg,a:hover .arw svg{transform:translateX(6px)}
.arw-lime{color:var(--lime)} .arw-ink{color:var(--limeink)}
.ico{width:22px;height:22px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}

/* ── the branch rule: the brand mark as a divider ───────────── */
.branch{display:flex;align-items:center;gap:0;height:3px;width:132px;margin-bottom:26px}
.branch i{display:block;height:3px}
.branch i:nth-child(1){width:52px;background:var(--navy)}
.branch i:nth-child(2){width:48px;background:var(--lime)}
.branch i:nth-child(3){width:32px;background:var(--sky)}
.branch.rev i:nth-child(1){background:var(--cream)}

/* ── surfaces ───────────────────────────────────────────────── */
.s-navy{background:var(--navy);color:var(--cream)}
.s-deep{background:var(--deep);color:var(--cream)}
.s-cream{background:var(--cream);color:var(--navy)}
.s-paper{background:var(--paper);color:var(--navy)}
.s-lime{background:var(--lime);color:var(--navy)}

/* ── photography: one duotone system ────────────────────────── */
.ph{background-size:cover;background-position:center;background-repeat:no-repeat;
  position:relative;overflow:hidden}
.ph--zoom{transition:transform .9s var(--ease)}
a:hover .ph--zoom,.pcard:hover .ph--zoom,.gitem:hover .ph--zoom{transform:scale(1.055)}
.phnote{position:absolute;left:var(--sx);bottom:16px;z-index:4;font-size:var(--t-eyebrow);font-weight:700;
  letter-spacing:.16em;background:rgba(4,9,26,.62);color:rgba(247,246,242,.7);
  padding:5px 10px;border-radius:var(--r-sm)}

/* ── comp chrome ────────────────────────────────────────────── */
.compbar{position:fixed;top:0;left:0;right:0;z-index:900;background:#04091A;color:#fff;
  display:flex;align-items:center;gap:16px;padding:0 20px;height:44px;font-size:var(--t-xs);font-weight:500;
  border-bottom:1px solid rgba(255,255,255,.1)}
.compbar b{font-weight:700;letter-spacing:.12em;white-space:nowrap}
.compbar .sp{flex:1}
.logoctl{padding:5px 12px;font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.28);border-radius:6px;color:#c9d0e2;cursor:pointer;white-space:nowrap;flex:none}
.logoctl:hover{border-color:var(--lime);color:var(--lime)}
.compbar nav{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.compbar nav::-webkit-scrollbar{display:none}
.compbar nav button{padding:5px 12px;font-size:var(--t-eyebrow);font-weight:700;color:#8891a8;border-radius:6px;white-space:nowrap;flex:none}
.compbar nav button.on{background:var(--lime);color:#04091A}
.view{display:none}.view.on{display:block}
/* body padding-top removed: it cleared the design-comp's fixed toolbar, which
   the WordPress theme does not have. The govbar and nav clear themselves. */

/* ── lockup ─────────────────────────────────────────────────── */
.lock{display:flex;align-items:center;gap:11px}
.lock__img{display:none;max-height:52px;width:auto}
.lock.has-img .lock__img{display:block}
.lock.has-img .mk,.lock.has-img .lock__type{display:none}
.foot .lock__img,.mnav .lock__img{max-height:56px}
.lock .wm{font-size:var(--t-d4);line-height:20px;font-weight:700;letter-spacing:-0.04em;display:block}
.lock .sub{font-size:var(--t-eyebrow);line-height:9px;font-weight:700;letter-spacing:.19em;display:block;margin-top:4px;
  opacity:.82;white-space:nowrap}

/* ── nav: transparent to solid ──────────────────────────────── */
.nav{position:fixed;top:0;left:0;right:0;z-index:800;background:transparent;
  transition:background .45s var(--ease),box-shadow .45s,border-color .45s;
  border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(6,15,38,.96);backdrop-filter:blur(16px);border-bottom-color:var(--line)}
.nav .in{max-width:var(--wrap);margin:0 auto;padding:0 var(--sx);height:88px;display:flex;align-items:center;gap:20px}
.nav.scrolled .in{height:74px}
.nav .links{display:flex;gap:20px;margin-left:auto;font-size:var(--t-sm);font-weight:500;white-space:nowrap}
.nav .links a{position:relative;padding:6px 0;color:rgba(247,246,242,.86)}
.nav .links a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--lime);transition:right .34s var(--ease)}
.nav .links a:hover::after,.nav .links a.on::after{right:0}
.nav .act{display:flex;align-items:center;gap:14px;margin-left:20px;white-space:nowrap}
.navburger{display:none;width:44px;height:44px;border-radius:var(--r-sm);align-items:center;
  justify-content:center;flex:none;margin-left:auto;color:var(--cream)}
.navburger i{display:block;width:20px;height:2px;background:currentColor;position:relative;
  transition:background .2s}
.navburger i::before,.navburger i::after{content:"";position:absolute;left:0;width:20px;height:2px;
  background:currentColor;transition:transform .3s var(--ease),top .3s var(--ease)}
.navburger i::before{top:-6px} .navburger i::after{top:6px}
.navburger.open i{background:transparent}
.navburger.open i::before{top:0;transform:rotate(45deg)}
.navburger.open i::after{top:0;transform:rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:790;background:var(--deep);display:none;flex-direction:column;
  padding:120px var(--sx) 40px;overflow-y:auto}
.mnav.open{display:flex}
.mnav a{font-size:var(--t-d4);font-weight:700;letter-spacing:-0.03em;padding:16px 0;
  border-bottom:1px solid var(--line);color:var(--cream)}
.mnav .mact{display:flex;flex-direction:column;gap:12px;margin-top:32px}
.mnav .mact .btn{width:100%}
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:760;display:none;gap:8px;padding:10px 12px;
  background:rgba(6,15,38,.97);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
.mbar a{flex:1;justify-content:center;padding:14px 10px;font-size:var(--t-sm)}

/* ── HERO · Pattern 1 full-bleed ────────────────────────────── */
.hero{position:relative;min-height:min(100vh,880px);display:flex;align-items:flex-end;
  overflow:hidden;padding-bottom:clamp(48px,7vw,90px)}
.hero-bg{position:absolute;top:-12%;bottom:-12%;left:0;right:0;background-size:cover;
  background-position:center 56%;will-change:transform}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(6,15,38,.96) 0%,rgba(6,15,38,.86) 42%,rgba(6,15,38,.5) 74%,rgba(6,15,38,.34) 100%)}
.hero .wrap{position:relative;z-index:3;width:100%;padding-top:150px}
.hero h1{max-width:16ch}
.hero h1 em{font-style:normal;color:var(--lime)}
.hero .lede{margin-top:24px;color:rgba(247,246,242,.8)}
.heroask{display:flex;align-items:center;gap:8px;background:var(--paper);border-radius:var(--r);
  padding:7px 7px 7px 22px;max-width:540px;margin-top:34px}
.heroask input{flex:1;border:0;outline:none;background:none;height:50px;font-size:var(--t-body)}
.heroask .go{width:50px;height:50px;background:var(--lime);display:grid;place-items:center;flex:none;
  border-radius:var(--r-sm);transition:background .25s}
.heroask .go:hover{background:#B7DB4E}
.herochips{display:flex;gap:9px;margin-top:16px;flex-wrap:wrap}
.herochips button{border:1px solid rgba(247,246,242,.3);color:var(--cream);padding:10px 18px;
  font-size:var(--t-xs);font-weight:700;border-radius:var(--r);transition:background .25s,border-color .25s}
.herochips button:hover{background:rgba(247,246,242,.12);border-color:var(--cream)}
.herofacts{display:flex;gap:28px;flex-wrap:wrap;margin-top:38px;padding-top:26px;border-top:1px solid var(--line)}
.herofacts div{display:flex;align-items:center;gap:9px;font-size:var(--t-xs);font-weight:700;color:rgba(247,246,242,.9)}
.herofacts svg{color:var(--lime)}
.scrollcue{position:absolute;right:var(--sx);bottom:44px;z-index:4;display:flex;flex-direction:column;
  align-items:center;gap:12px;font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.2em;color:rgba(247,246,242,.5)}
.scrollcue i{display:block;width:1px;height:56px;background:linear-gradient(rgba(247,246,242,.06),var(--lime))}

/* ── PROOF STRIP · Pattern 6 ────────────────────────────────── */
.proof{padding:clamp(32px,5vw,44px) 0}
.proof .row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px 0}
.proof .c{padding:0 22px;border-left:1px solid rgba(13,27,61,.2)}
.proof .c:first-child{border-left:0;padding-left:0}
.proof .n{font-size:var(--t-d3);line-height:1;font-weight:700;letter-spacing:-0.035em}
.proof .l{font-size:var(--t-xs);font-weight:500;margin-top:6px;color:rgba(13,27,61,.72);line-height:1.35}

/* ── ONE DOOR · Pattern 3 contained editorial ───────────────── */
.editorial{max-width:none}
.edintro{display:grid;grid-template-columns:52fr 48fr;gap:clamp(32px,5vw,72px);align-items:end}
.edintro .t-1{max-width:14ch}
.edintro .lede{max-width:none}
.editorial .t-1{max-width:16ch}
.fnlist{margin-top:56px;border-top:1px solid var(--line-d)}
.fn{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(24px,4vw,56px);padding:22px 0;
  border-bottom:1px solid var(--line-d);align-items:start;transition:padding-left .3s var(--ease)}
.fn:hover{padding-left:12px}
.fn--stack{grid-template-columns:1fr;gap:8px;padding:22px 0}
.fn--stack h3::before{display:none}
.fn--last{border-bottom:0}
.fn h3{position:relative}
.fn h3::before{content:"";position:absolute;left:-18px;top:11px;width:6px;height:6px;
  background:var(--lime);border-radius:1px}
.fn h3{font-size:var(--t-lede);letter-spacing:-0.02em}

/* ── PATHWAYS · Pattern 4 photo-as-card ─────────────────────── */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:var(--wrap);margin:0 auto;padding:0 var(--sx)}
.pcard{position:relative;min-height:470px;display:flex;flex-direction:column;justify-content:flex-end;
  padding:24px 22px;overflow:hidden;border-radius:var(--r);color:var(--cream)}
.pcard .ph{position:absolute;inset:0;z-index:0}
.pcard::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(4,9,26,.96) 0%,rgba(4,9,26,.9) 20%,rgba(4,9,26,.62) 40%,rgba(4,9,26,.2) 68%,rgba(4,9,26,.06) 100%);
  transition:background .4s}
.pcard:hover::after{background:linear-gradient(to top,rgba(13,27,61,.95) 0%,rgba(13,27,61,.8) 34%,rgba(13,27,61,.4) 62%,rgba(13,27,61,.2) 100%)}
.pcard>*{position:relative;z-index:3}
.pcard .w{font-size:var(--t-d3);line-height:1;font-weight:700;letter-spacing:-0.035em;padding-bottom:16px;
  border-bottom:2px solid var(--lime);margin-bottom:16px;display:inline-block}
.pcard:nth-child(2) .w,.pcard:nth-child(4) .w{border-bottom-color:var(--sky)}
.pcard li{font-size:var(--t-sm);line-height:1.8;font-weight:500;color:rgba(247,246,242,.92)}
.pcard .go{position:absolute;top:24px;right:24px;z-index:3;width:44px;height:44px;border-radius:var(--r-sm);
  border:1px solid rgba(247,246,242,.32);display:grid;place-items:center;
  transition:background .3s,border-color .3s,color .3s}
.pcard:hover .go{background:var(--lime);border-color:var(--lime);color:var(--navy)}

/* ── PROCESS · Pattern 5 asymmetric ─────────────────────────── */
.split-5{display:grid;grid-template-columns:38fr 62fr;gap:clamp(40px,6vw,90px);align-items:start}
.split-5--even{grid-template-columns:52fr 48fr}
.steps{border-top:1px solid var(--line-d)}
.step{display:grid;grid-template-columns:34px 1fr;gap:20px;padding:20px 0;
  border-bottom:1px solid var(--line-d);position:relative}
.step .n{position:relative;width:34px;align-self:stretch}
.step .n::before{content:"";position:absolute;left:5px;top:12px;width:11px;height:11px;
  border-radius:999px;border:2px solid var(--limeink);background:var(--cream)}
.step .n::after{content:"";position:absolute;left:10px;top:23px;bottom:-20px;width:1px;
  background:var(--line-d)}
.step:last-child .n::after{display:none}
.step:last-child .n::before{background:var(--lime);border-color:var(--lime)}

/* ── DEPARTMENTS · Pattern 2 split with tabs ────────────────── */
.split-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:start}
.dtabs{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.dtab{display:flex;align-items:center;gap:16px;padding:16px 4px;border-bottom:1px solid var(--line);
  text-align:left;width:100%;transition:padding-left .34s var(--ease),color .25s;color:rgba(247,246,242,.62)}
.dtab:hover{padding-left:12px;color:var(--cream)}
.dtab.on{color:var(--cream);padding-left:12px}
.dtab .bar{width:3px;height:26px;background:transparent;flex:none;transition:background .25s}
.dtab.on .bar{background:var(--lime)}
.dtab .nm{font-size:var(--t-lede);font-weight:700;letter-spacing:-0.018em;flex:1}
.dtab .ix{display:none}
.dpane{display:none}
.dpane.on{display:block;animation:fade .45s var(--ease)}
@keyframes fade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.dphoto{position:relative;aspect-ratio:4/3;overflow:hidden}
.dphoto .ph{position:absolute;inset:0}
.dmeta{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.dmeta span{font-size:var(--t-xs);font-weight:700;letter-spacing:.02em;padding:7px 12px;border-radius:var(--r-sm);
  border:1px solid var(--line);color:rgba(247,246,242,.82)}

/* ── STORY · Pattern 1 parallax quote ───────────────────────── */
.story{position:relative;overflow:hidden;padding:clamp(90px,12vw,160px) 0}
.story .parallax-bg{position:absolute;top:-15%;bottom:-15%;left:0;right:0;
  background-size:cover;background-position:center;will-change:transform}
.story::after{content:"";position:absolute;inset:0;background:rgba(4,9,26,.7)}
.story .wrap{position:relative;z-index:3}
.story blockquote{margin:0;max-width:18ch;font-size:var(--t-d3);line-height:1.24;
  font-weight:700;letter-spacing:-0.028em}
.story blockquote em{font-style:normal;color:var(--lime)}

/* ── GALLERY · Pattern 8 asymmetric + lightbox ──────────────── */
.ggrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:210px;gap:10px;grid-auto-flow:dense;
  max-width:var(--wrap);margin:0 auto;padding:0 var(--sx)}
.gitem{position:relative;overflow:hidden;cursor:pointer;border-radius:var(--r)}
.gitem .ph{position:absolute;inset:0;z-index:0}
.gitem::after{content:"";position:absolute;inset:0;z-index:2;background:rgba(13,27,61,0);transition:background .35s}
.gitem:hover::after{background:rgba(13,27,61,.34)}
.gitem .cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:16px 16px 14px;
  font-size:var(--t-xs);line-height:1.4;font-weight:700;color:#fff;
  background:linear-gradient(to top,rgba(4,9,26,.94) 0%,rgba(4,9,26,.74) 46%,transparent 100%)}
.g-tall{grid-row:span 2} .g-wide{grid-column:span 2}
.lb{position:fixed;inset:0;z-index:1000;background:rgba(4,9,26,.96);display:none;
  align-items:center;justify-content:center;padding:40px}
.lb.on{display:flex}
.lb__panel{max-width:1080px;width:100%;position:relative}
.lb__img{width:100%;aspect-ratio:16/10;border-radius:var(--r);background-size:cover;background-position:center}
.lb__cap{color:rgba(247,246,242,.8);font-size:var(--t-xs);margin-top:16px;display:flex;gap:16px;align-items:center}
.lb__x,.lb__p,.lb__n{position:absolute;width:48px;height:48px;border-radius:var(--r);display:grid;place-items:center;
  border:1px solid rgba(247,246,242,.3);color:#fff;background:rgba(4,9,26,.5);transition:background .25s}
.lb__x:hover,.lb__p:hover,.lb__n:hover{background:var(--lime);color:var(--navy);border-color:var(--lime)}
.lb__x{top:-64px;right:0}
.lb__p{left:-64px;top:50%;transform:translateY(-50%)}
.lb__n{right:-64px;top:50%;transform:translateY(-50%)}
.lb__count{margin-left:auto;font-weight:700;letter-spacing:.1em;font-size:var(--t-eyebrow)}

/* ── NEWS · Pattern 7 stacked cards ─────────────────────────── */
.ngrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ncard .ph{aspect-ratio:16/10;border-radius:var(--r);margin-bottom:14px}
.ncard .d{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.16em;color:var(--limeink);margin-bottom:8px;display:block}
.ncard h3{font-size:var(--t-lede);letter-spacing:-0.018em;line-height:1.32;transition:color .25s}
.ncard:hover h3{color:var(--limeink)}

/* ── FAQ + FORM · Pattern 5 ─────────────────────────────────── */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 4px;font-size:var(--t-lede);font-weight:700;
  letter-spacing:-0.016em;display:flex;align-items:center;gap:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{margin-left:auto;position:relative;width:16px;height:16px;flex:none}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;background:var(--lime);
  transition:transform .3s var(--ease)}
.faq summary .pm::before{left:0;right:0;top:7px;height:2px}
.faq summary .pm::after{top:0;bottom:0;left:7px;width:2px}
.faq details[open] summary .pm::after{transform:rotate(90deg)}
.faq .a{padding:0 4px 24px;color:rgba(247,246,242,.72);font-size:var(--t-body);max-width:60ch}
.form{background:var(--paper);color:var(--navy);border-radius:var(--r);padding:clamp(26px,3vw,36px)}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f{display:flex;flex-direction:column;gap:8px}
.f--full{grid-column:1/-1}
.f label{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--charcoal)}
.f input,.f select,.f textarea{border:1px solid var(--line-d);border-radius:var(--r);padding:14px 15px;
  background:#FBFAF7;outline:none;transition:border-color .25s,background .25s;width:100%}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--navy);background:#fff}
.f textarea{resize:vertical;min-height:120px;line-height:1.6}
.f.err input,.f.err select,.f.err textarea{border-color:#B4342A;background:#FFF7F6}
.f .msg{font-size:var(--t-xs);font-weight:500;color:#B4342A;display:none}
.f.err .msg{display:block}
.formok{display:none;text-align:center;padding:40px 20px}
.formok.on{display:block;animation:fade .5s var(--ease)}
.formok .tick{width:64px;height:64px;background:var(--lime);border-radius:var(--r);display:grid;place-items:center;margin:0 auto 22px}
.privacy{font-size:var(--t-xs);color:var(--charcoal);margin-top:16px;line-height:1.6}

/* ── CTA finale · Pattern 6 ─────────────────────────────────── */
.finale{padding:clamp(64px,8vw,104px) 0;text-align:center}
.finale .t-1{max-width:22ch;margin:0 auto}
.finale .branch{margin:0 auto 26px}

/* ── footer ─────────────────────────────────────────────────── */
.foot{padding:clamp(64px,8vw,96px) 0 44px;border-top:1px solid var(--line)}
.foot .top{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;align-items:end;
  padding-bottom:44px;border-bottom:1px solid var(--line)}
.foot .big em{font-style:normal;color:var(--lime)}
.contactrow{display:flex;flex-direction:column;gap:14px}
.contactrow a{display:flex;align-items:center;gap:12px;font-size:var(--t-body);font-weight:700}
.contactrow a svg{color:var(--lime)}
.promise{display:flex;gap:32px;flex-wrap:wrap;padding:26px 0;border-bottom:1px solid var(--line)}
.promise div{display:flex;align-items:center;gap:9px;font-size:var(--t-xs);font-weight:700;color:rgba(247,246,242,.86)}
.promise svg{color:var(--lime)}
.fcols{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:32px;padding-top:44px}
.fcols h4{font-size:var(--t-eyebrow);letter-spacing:.2em;text-transform:uppercase;color:var(--lime);margin-bottom:18px;font-weight:700}
.fcols li{font-size:var(--t-sm);line-height:2.1;color:rgba(247,246,242,.66)}
.fcols li a:hover{color:var(--lime)}
.legal{font-size:var(--t-xs);color:rgba(247,246,242,.38);margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}

/* ── WhatsApp float ─────────────────────────────────────────── */
.wafloat{position:fixed;right:24px;bottom:96px;z-index:700;display:flex;align-items:center;
  background:#25D366;color:#fff;height:56px;width:56px;padding:0;overflow:hidden;
  border-radius:28px;box-shadow:0 6px 22px rgba(4,9,26,.3);
  transition:width .38s var(--ease),transform .3s var(--ease),opacity .3s}
.wafloat svg{width:26px;height:26px;flex:none;margin:0 15px;stroke-width:1.9}
.wafloat span{white-space:nowrap;font-size:var(--t-xs);font-weight:700;opacity:0;padding-right:22px;
  transition:opacity .22s .12s}
.wafloat:hover{width:190px;transform:translateY(-2px)}
.wafloat:hover span{opacity:1}

/* ── Ask YEEB · floating assistant ──────────────────────────── */
.asklaunch{position:fixed;right:24px;bottom:24px;z-index:701;display:flex;align-items:center;
  background:var(--lime);color:var(--navy);height:60px;width:60px;padding:0;overflow:hidden;
  border:0;border-radius:30px;box-shadow:0 8px 26px rgba(4,9,26,.34);cursor:pointer;
  transition:width .38s var(--ease),transform .3s var(--ease),opacity .28s,background .2s}
.asklaunch .ic{width:60px;flex:none;display:grid;place-items:center}
.asklaunch .ic svg{width:26px;height:26px;stroke-width:2}
.asklaunch .lb{white-space:nowrap;font-size:var(--t-sm);font-weight:700;letter-spacing:-0.01em;
  opacity:0;padding-right:24px;transition:opacity .22s .12s}
.asklaunch .dot{position:absolute;top:13px;right:15px;width:10px;height:10px;border-radius:50%;
  background:var(--sky);border:2px solid var(--lime);transition:opacity .2s}
.asklaunch:hover{width:172px;transform:translateY(-2px);background:#B7DB4E}
.asklaunch:hover .lb{opacity:1}
.asklaunch:hover .dot,.asklaunch.seen .dot{opacity:0}

.askpanel{position:fixed;right:24px;bottom:24px;z-index:960;
  width:min(410px,calc(100vw - 40px));height:min(646px,calc(100vh - 128px));
  background:var(--paper);border-radius:var(--r);box-shadow:0 26px 74px rgba(4,9,26,.44);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(16px) scale(.97);transform-origin:100% 100%;
  transition:opacity .26s var(--ease),transform .34s var(--ease),visibility .26s}
.askpanel.open{opacity:1;visibility:visible;transform:none}
.askpanel .chat{border:0;border-radius:0;min-height:0;flex:1;height:100%}
.askpanel .chat .h{padding:15px 16px}
.askpanel .chat .h .badge{width:38px;height:38px}
.askpanel .thread{padding:18px 16px;gap:10px}
.askpanel .chat .f{padding:12px 16px 16px}
.askpanel .mA,.askpanel .mP{max-width:92%;font-size:var(--t-sm)}
.askpanel .sug{max-width:100%}
.askpanel .sug .ph{width:88px;min-height:88px}
.askpanel .qr{gap:7px;margin-bottom:9px}
.askpanel .qr button{padding:8px 13px;font-size:var(--t-xs)}
.hbtn{width:34px;height:34px;flex:none;display:grid;place-items:center;border:0;background:none;
  color:rgba(255,255,255,.62);cursor:pointer;border-radius:var(--r-sm);transition:color .2s,background .2s}
.hbtn:hover{color:#fff;background:rgba(255,255,255,.1)}
.hbtn svg{width:19px;height:19px}
.hbtn.i{margin-left:auto}
.askinfo{max-height:0;overflow:hidden;background:var(--navy);color:rgba(247,246,242,.8);
  transition:max-height .4s var(--ease)}
.askinfo.open{max-height:340px;overflow-y:auto}
.askinfo .pad{padding:4px 18px 20px}
.askinfo b{color:#fff;font-weight:700;display:block;font-size:var(--t-sm);letter-spacing:-0.01em}
.askinfo .rail{padding:11px 0;border-top:1px solid rgba(255,255,255,.13)}
.askinfo .rail p{font-size:var(--t-xs);line-height:1.5;margin-top:3px;color:rgba(247,246,242,.66)}
body.ask-open .asklaunch{opacity:0;pointer-events:none;transform:scale(.9)}
body.ask-open .wafloat{opacity:0!important;pointer-events:none!important}
body.no-ask .asklaunch,body.no-ask .askpanel,body.no-ask .wafloat{display:none}


/* ── inner views ────────────────────────────────────────────── */
.subhero{position:relative;overflow:hidden;padding:clamp(150px,16vw,210px) 0 clamp(56px,7vw,84px)}
.subhero .parallax-bg{position:absolute;top:-15%;bottom:-15%;left:0;right:0;background-size:cover;background-position:center}
.subhero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(6,15,38,.95),rgba(6,15,38,.72))}
.subhero .wrap{position:relative;z-index:3}
.crumb{font-size:var(--t-xs);font-weight:500;color:rgba(247,246,242,.6);margin-bottom:18px}

.filters{display:flex;gap:8px;flex-wrap:wrap;padding:26px 0;border-bottom:1px solid var(--line-d)}
.filters button{padding:10px 20px;font-size:var(--t-xs);font-weight:700;border:1px solid var(--line-d);
  border-radius:var(--r);transition:background .25s,color .25s,border-color .25s}
.filters button:hover{border-color:var(--navy)}
.filters button.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.prog{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pc{position:relative;background:var(--paper);display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;
  transition:transform .35s var(--ease)}
.pc:hover{transform:translateY(-4px)}
.pc .imgw{position:relative;aspect-ratio:16/10;overflow:hidden}
.pc .imgw .ph{position:absolute;inset:0}
.pc .flag{position:absolute;top:12px;left:12px;z-index:4;background:var(--lime);color:var(--navy);border-radius:var(--r-sm);
  font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.14em;padding:6px 11px}
.pc .flag.full{background:var(--charcoal);color:#fff}
.pc .b{padding:16px;flex:1;display:flex;flex-direction:column}
.pc .dept{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.14em;color:var(--limeink);margin-bottom:6px}
.pc .specs{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.pc .specs span{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-xs);font-weight:500;color:var(--charcoal)}
.pc .specs svg{width:15px;height:15px;flex:none;color:var(--charcoal)}
.pc .left{margin-top:6px;font-size:var(--t-xs);font-weight:700;display:flex;align-items:flex-start;gap:8px;line-height:1.45}
.pc .left i{width:7px;height:7px;margin-top:6px;background:var(--limeink);display:block;flex:none;border-radius:999px}
.pc .left.warn i{background:var(--charcoal)}
.pc .cta{margin-top:auto;padding-top:12px}

/* request flow */
.flow{max-width:820px;margin:0 auto}
.rail{display:flex;gap:6px;margin-bottom:48px}
.rail .sg{flex:1}
.rail .b{height:5px;border-radius:999px;background:var(--line-d)}
.rail .sg.done .b{background:var(--sky)}
.rail .sg.now .b{background:var(--lime)}
.rail .l{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  margin-top:12px;color:var(--charcoal)}
.rail .sg.done .l,.rail .sg.now .l{color:var(--navy)}
.opt{width:100%;text-align:left;display:flex;align-items:center;gap:14px;background:var(--paper);
  border:1px solid var(--line-d);border-radius:var(--r);padding:14px 16px;margin-bottom:8px;
  transition:border-color .25s,background .25s,transform .25s var(--ease)}
.opt:hover{border-color:var(--navy);transform:translateX(4px)}
.opt.on{border-color:var(--limeink);background:#FCFDF7;border-left:3px solid var(--lime)}
.opt .ic{width:42px;height:42px;border:1px solid var(--line-d);border-radius:var(--r-sm);display:grid;place-items:center;flex:none}
.opt.on .ic{background:var(--lime);border-color:var(--lime)}
.opt .ck{margin-left:auto;width:24px;height:24px;border:1.5px solid var(--line-d);border-radius:var(--r-sm);display:grid;place-items:center;flex:none}
.opt.on .ck{background:var(--lime);border-color:var(--lime)}
.opt .ck svg{display:none;width:14px;height:14px;stroke:var(--navy);stroke-width:3;fill:none}
.opt.on .ck svg{display:block}
.note{border-left:3px solid var(--sky);border-radius:var(--r);background:#F4FCFF;padding:18px 20px;margin-top:24px;
  display:flex;gap:16px;align-items:flex-start}
.flowbar{position:sticky;bottom:0;background:rgba(247,246,242,.96);backdrop-filter:blur(10px);
  border-top:1px solid var(--line-d);display:flex;align-items:center;padding:20px 0 40px;margin-top:44px}

/* chat */
.chatwrap{display:grid;grid-template-columns:1fr 400px;gap:40px;align-items:start}
.chat{background:var(--paper);border:1px solid var(--line-d);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;min-height:600px}
.chat .h{background:var(--navy);color:#fff;padding:16px 18px;display:flex;align-items:center;gap:12px}
.chat .h .badge{width:40px;height:40px;background:rgba(87,214,255,.2);border-radius:var(--r-sm);display:grid;place-items:center;color:var(--sky);flex:none}
.thread{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:10px;background:#FBFAF7}
.mA{background:#fff;border:1px solid var(--line-d);border-left:3px solid var(--sky);border-radius:var(--r);padding:14px 16px;
  max-width:86%;font-size:var(--t-sm);line-height:1.6;color:var(--navy)}
.mP{background:var(--navy);color:#fff;border-radius:var(--r);padding:14px 16px;max-width:80%;align-self:flex-end;
  font-size:var(--t-sm);line-height:1.6}
.thread>*{flex:none}
.sug{background:#fff;border:1px solid var(--line-d);border-radius:var(--r);overflow:hidden;max-width:86%;display:flex;gap:0}
.sug .t-3{color:var(--navy)}
.sug .ph{width:100px;flex:none;align-self:stretch;min-height:100px}
.sug .b{padding:12px 14px;flex:1;min-width:0}
.chat .f{border-top:1px solid var(--line-d);padding:14px 18px 18px;background:#fff}
.qr{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.qr button{border:1px solid var(--line-d);border-radius:var(--r);padding:9px 15px;font-size:var(--t-xs);font-weight:700;color:var(--navy);
  transition:border-color .25s}
.qr button:hover{border-color:var(--navy)}
.comp{display:flex;gap:8px;align-items:center;border:1px solid var(--line-d);border-radius:var(--r);padding:5px 5px 5px 16px;background:#FBFAF7}
.comp input{flex:1;border:0;outline:none;background:none;height:44px;font-size:var(--t-sm)}
.comp .s{width:44px;height:44px;background:var(--lime);border-radius:var(--r-sm);display:grid;place-items:center;flex:none}

/* staff console */
.console{display:grid;grid-template-columns:236px 1fr;min-height:840px;background:var(--cream);color:var(--navy)}
.cside{background:var(--navy);color:#fff;padding:30px 0}
.cside .nv{display:flex;align-items:center;gap:13px;padding:13px 24px;font-size:var(--t-sm);font-weight:500;
  color:rgba(255,255,255,.68);border-left:3px solid transparent}
.cside .nv.on{color:#fff;border-left-color:var(--lime);background:rgba(255,255,255,.05)}
.cmain{padding:36px 44px 0;min-width:0}
.ccols{display:grid;grid-template-columns:58fr 42fr;gap:22px;margin-top:28px;align-items:start}
.card{background:#fff;border:1px solid var(--line-d);border-radius:var(--r);padding:22px}
.ai{background:#fff;border:1px solid rgba(87,214,255,.6);border-top:3px solid var(--sky);border-radius:var(--r);overflow:hidden}
.ai .h{padding:16px 24px;background:#F2FBFF;font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--skyink);display:flex;align-items:center;gap:11px}
.ai .b{padding:20px}
.ai h4{font-size:var(--t-eyebrow);letter-spacing:.16em;text-transform:uppercase;color:var(--charcoal);margin:26px 0 12px;font-weight:700}
.ai h4:first-child{margin-top:0}
.airow{display:flex;gap:12px;align-items:flex-start;padding:9px 0;border-top:1px solid var(--line-d)}
.pillN{display:inline-flex;align-items:center;border-radius:var(--r-sm);padding:6px 12px;background:var(--navy);color:#fff;
  font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.pillM{display:inline-flex;align-items:center;border-radius:var(--r-sm);padding:6px 12px;background:var(--cream);color:var(--charcoal);
  font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.conf{height:5px;border-radius:999px;background:var(--line-d);margin-top:10px}
.conf i{display:block;height:100%;border-radius:999px;background:var(--sky)}
.byline{display:flex;gap:16px;flex-wrap:wrap;padding-top:12px;margin-top:12px;border-top:1px solid var(--line-d)}
.byline span{display:flex;align-items:center;gap:8px;font-size:var(--t-xs);font-weight:500;color:var(--charcoal)}
.cbar{position:sticky;bottom:0;background:rgba(247,246,242,.96);backdrop-filter:blur(10px);
  border-top:1px solid var(--line-d);display:flex;align-items:center;gap:24px;padding:20px 0 32px;margin-top:24px}

/* reveals */
/* Reveal-on-scroll only hides content once JS is confirmed (html.has-js). No
   JS, or a script that fails to load, leaves everything visible by default. */
.has-js .rv{opacity:0;transform:translateY(34px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rv.in{opacity:1;transform:none}
.has-js .stag>*{opacity:0;transform:translateY(30px);transition:opacity .75s var(--ease),transform .75s var(--ease)}
.stag.in>*{opacity:1;transform:none}
.hw{display:inline-block;opacity:0;transform:translateY(42px);
  transition:opacity .8s var(--ease),transform .8s var(--ease)}
.hw.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv,.stag>*,.hw{opacity:1!important;transform:none!important;transition:none!important}
  .hero-bg,.parallax-bg{transform:none!important}
}

@media(max-width:1180px){
  .nav .links{display:none}
  .navburger{display:flex}
  .nav .act{display:none}
  .proof .row{grid-template-columns:repeat(3,1fr);gap:22px 0}
  .proof .c:nth-child(4){border-left:0;padding-left:22px}
  .edintro{grid-template-columns:1fr;gap:22px;align-items:start}
  .edintro .t-1{max-width:18ch}
}
@media(max-width:1080px){
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .ngrid,.prog{grid-template-columns:repeat(2,1fr)}
  .split-2,.split-5,.split-5--even,.chatwrap,.foot .top,.console{grid-template-columns:1fr}
  .fcols{grid-template-columns:repeat(2,1fr)}
  .ggrid{grid-template-columns:repeat(2,1fr)}
  .ccols{grid-template-columns:1fr}
  .cside{display:flex;flex-wrap:wrap;gap:4px;padding:16px}
  .cside > div:first-child{width:100%}
  .cside .nv{border-left:0;border-radius:var(--r-sm);padding:10px 14px}
  .cmain{padding:28px var(--sx) 0}
  .story blockquote{max-width:none}
  .chat{min-height:520px}
}
@media(max-width:820px){
  .proof .row{grid-template-columns:repeat(2,1fr);gap:20px 0}
  .proof .c{padding:0 18px;border-left:1px solid rgba(13,27,61,.2)}
  .proof .c:nth-child(odd){padding-left:0;border-left:0}
  .proof .n{font-size:var(--t-d3)}
  .fn{grid-template-columns:1fr;gap:8px}
  .fn h3::before{display:none}
  .step{grid-template-columns:26px 1fr;gap:16px}
  .step .n{width:26px}
  .step .n::before{left:1px} .step .n::after{left:6px}
  .pcard{min-height:340px;padding:22px 20px}
  .pcard .w{font-size:var(--t-d3)}
  .dphoto{aspect-ratio:16/10}
  .lb{padding:20px}
  .lb__x{top:auto;bottom:-58px;right:0}
  .lb__p{left:0;top:auto;bottom:-58px;transform:none}
  .lb__n{right:56px;top:auto;bottom:-58px;transform:none}
  .story{padding:clamp(64px,11vw,110px) 0}
  .subhero{padding-top:clamp(112px,20vw,160px)}
  .heroask{max-width:none}
  .hero{min-height:auto;padding-top:0;padding-bottom:48px;display:block}
  .hero .wrap{padding-top:118px}
  .phnote{position:static;display:block;margin:18px var(--sx) 0;left:auto;bottom:auto;
    max-width:calc(100% - var(--sx)*2)}
  .herofacts{gap:12px 18px;margin-top:28px;padding-top:20px}
  .scrollcue{display:none}
}
@media(max-width:640px){
  .pgrid,.ngrid,.prog,.ggrid,.fcols,.fgrid{grid-template-columns:1fr}
  .g-tall,.g-wide{grid-row:auto;grid-column:auto}
  .ggrid{grid-auto-rows:190px}
  .mbar{display:flex}
  body{padding-bottom:78px}
  .wafloat{display:none}
  .asklaunch{right:16px;bottom:90px;height:54px;width:54px;border-radius:27px}
  .asklaunch .ic{width:54px}
  .asklaunch:hover{width:54px;transform:none}
  .asklaunch:hover .lb{opacity:0}
  .askpanel{right:0;bottom:0;left:0;top:0;width:100%;height:100%;max-height:none;border-radius:0;
    transform:translateY(22px)}
  body.ask-open{overflow:hidden}
  .askpanel .sug{flex-direction:row}
  .askpanel .sug .ph{width:88px;height:auto;min-height:88px}
  .foot{padding-bottom:24px}
  .foot .big{font-size:var(--t-d4)}
  .contactrow a{font-size:var(--t-sm)}
  .sug{max-width:100%;flex-direction:column}
  .sug .ph{width:100%;height:132px;min-height:0}
  .mA,.mP{max-width:94%}
  .filters{gap:6px}
  .filters span{width:100%;margin-left:0!important;padding-top:4px}
  .flowbar,.cbar,.stickybar{flex-wrap:wrap;gap:12px}
  .flowbar .btn,.cbar .btn{width:100%}
  .opt{gap:12px;padding:13px 14px}
  .opt .ic{width:38px;height:38px}
  .lb__n{right:auto;left:56px}
}
@media(max-width:480px){
  .proof .row{grid-template-columns:1fr 1fr;gap:18px 0}
  .proof .n{font-size:var(--t-d4)}
  .proof .l{font-size:var(--t-xs)}
  .pcard{min-height:300px}
  .herofacts div{font-size:var(--t-xs)}
}
@media(max-width:900px){
  .compbar b + span{display:none}
  .compbar nav button{padding:5px 9px;font-size:var(--t-eyebrow)}
}
@media(max-width:400px){
  .lock .wm{font-size:var(--t-lede)}
  .lock .sub{font-size:var(--t-eyebrow);letter-spacing:.14em}
  .mnav a{font-size:var(--t-d4)}
  .compbar b{font-size:var(--t-eyebrow)}
}

/* =========================================================================
   YEEB 2026 One Door: corrections layer.
   Everything below fixes a numbered finding from the brand audit.
   Loaded after the base so it wins on specificity ties.
   ========================================================================= */

/* ---- Montserrat, self hosted. No CDN at runtime. SIL OFL 1.1, see
        assets/fonts/OFL.txt. Four weights, matching the board exactly. ---- */
/* ---- Montserrat, from the YEEB logo pack, converted to woff2.
        Version 9.0, the designer's own files, not a third party cut.
        Four weights and their italics, exactly what the pack ships and
        exactly what the board names: Black, Bold, Medium, Regular.
        Self hosted, no CDN at runtime. SIL OFL 1.1, see fonts/OFL.txt. ---- */
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/montserrat-400.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:italic;font-weight:400;font-display:swap;
  src:url(../fonts/montserrat-400i.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;
  src:url(../fonts/montserrat-500.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:italic;font-weight:500;font-display:swap;
  src:url(../fonts/montserrat-500i.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/montserrat-700.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:italic;font-weight:700;font-display:swap;
  src:url(../fonts/montserrat-700i.woff2) format('woff2')}

/* ---- B1. Focus. One global rule, focus-visible, never focus. The comp had
        a single :focus rule covering form fields only. ---- */
*:focus{outline:none}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:3px solid var(--lime);outline-offset:2px;border-radius:var(--r-sm)}
.s-cream :focus-visible,.s-paper :focus-visible,.s-lime :focus-visible,
.on-light :focus-visible,body.light :focus-visible{outline-color:var(--navy)}
.skip{position:absolute;left:-9999px;top:0;z-index:9999;
  background:var(--navy);color:var(--cream);padding:14px 20px;border-radius:0 0 var(--r) 0;
  font-size:var(--t-sm);font-weight:var(--w-bold)}
.skip:focus{left:0}

/* ---- B2. Touch targets. 44px minimum on every control, from padding on the
        control itself so the visual rhythm is unchanged. ---- */
a[href],button,input[type=submit],input[type=button],select,summary,[role=button]{
  min-height:var(--tap)}
.foot a[href],.links a[href],.mnav a[href],nav a[href]{
  display:inline-flex;align-items:center;min-height:var(--tap)}
.chip,.pill,.filter,.btn,.arw{min-height:var(--tap);display:inline-flex;align-items:center}
input,select,textarea,button{font:inherit}

/* ---- B3. The lockup subtitle rendered at 7px desktop and 6px mobile in
        seven places. Floor is the eyebrow token. ---- */
.lock .sub{font-size:var(--t-eyebrow);line-height:1.25;letter-spacing:.14em}
@media(max-width:400px){.lock .sub{font-size:var(--t-eyebrow);letter-spacing:.10em}}

/* ---- B7. Reading measure. One token, not re-decided per section. ---- */
.prose,.sec p,.lede,.finale p{max-width:var(--measure)}
.prose--wide{max-width:78ch}

/* ---- B9. Government identity. A system bar, not YEEB brand. Charcoal
        ground, cream text, no lime. The arms drop into the reserved slot
        without a layout change. ---- */
.govbar{position:fixed;top:0;left:0;right:0;height:var(--govbar);z-index:900;
  background:var(--charcoal);color:var(--cream);display:flex;align-items:center}
.govbar .in{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--sx);
  display:flex;align-items:center;gap:12px}
.govbar .arms{width:32px;height:32px;flex:none;display:block;object-fit:contain}
.govbar .arms--empty{border:1px dashed rgba(247,246,242,.4);border-radius:3px}
.govbar span{font-size:var(--t-xs);font-weight:var(--w-med);letter-spacing:.02em}
.foot .arms{width:48px;height:48px;display:block;margin-bottom:16px}

/* ---- B10. The branch becomes a rising step. Same three colours, same
        132px footprint, same three segments, ascending left to right.
        The horizontal rule threw away the mark's whole meaning. ---- */
.branch{display:block;width:132px;height:14px;margin-bottom:26px}
.branch i{display:none}
.branch::before{content:"";display:block;width:132px;height:14px;
  background:
    linear-gradient(var(--navy),var(--navy)) 0 11px/52px 3px no-repeat,
    linear-gradient(var(--lime),var(--lime)) 50px 6px/48px 3px no-repeat,
    linear-gradient(var(--sky),var(--sky)) 100px 0/32px 3px no-repeat}
.branch.rev::before{
  background:
    linear-gradient(var(--cream),var(--cream)) 0 11px/52px 3px no-repeat,
    linear-gradient(var(--lime),var(--lime)) 50px 6px/48px 3px no-repeat,
    linear-gradient(var(--sky),var(--sky)) 100px 0/32px 3px no-repeat}

/* ---- B10. Pathway cards take their board icon colour. The board assigns
        these and the comp ignored them. ---- */
.pw--build{--pw:var(--navy)} .pw--work{--pw:var(--navy)}
.pw--learn{--pw:var(--sky)}  .pw--grow{--pw:var(--lime)}
.pw .pw-ico{color:var(--pw)}
.pw .pw-ico circle{stroke:var(--pw)}
.pw h3{color:var(--pw)}
.s-deep .pw--build h3,.s-navy .pw--build h3,
.s-deep .pw--work h3,.s-navy .pw--work h3{color:var(--cream)}
.pw-rule{height:3px;width:44px;background:var(--pw);margin:10px 0 12px}

/* ---- Error state. One colour, and never colour on its own. ---- */
.field--error input,.field--error select,.field--error textarea{border-color:var(--error)}
.field__err{display:flex;gap:8px;align-items:flex-start;color:var(--error);
  font-size:var(--t-xs);font-weight:var(--w-bold);margin-top:6px}
.field__err::before{content:"!";flex:none;width:18px;height:18px;border-radius:50%;
  background:var(--error);color:#fff;font-size:var(--t-eyebrow);line-height:18px;text-align:center}

/* ---- Hover. One lime token. ---- */
.btn-lime:hover,.btn-lime:focus-visible{background:var(--lime-hover)}

/* ---- Layout offset for the government bar ---- */
.nav{top:var(--govbar)}
body{padding-top:0}

/* ---- Labelled placeholder for the participant story. Identical visual
        treatment so the section survives the photo shoot (finding C9). ---- */
.story--placeholder blockquote{opacity:.92}
.ph-label{display:inline-flex;align-items:center;gap:8px;font-size:var(--t-eyebrow);
  font-weight:var(--w-black);letter-spacing:.16em;text-transform:uppercase;
  border:1px dashed currentColor;border-radius:var(--r-sm);padding:8px 12px;margin-bottom:16px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important;
    scroll-behavior:auto !important}
}

/* =========================================================================
   Component layer. The builders use semantic lists where the comp used
   divs, so these map the new markup onto the same visual result and reset
   the browser's default list furniture.
   ========================================================================= */

/* ---- Lists carry meaning, not bullets ---- */
.links ul,.mnav ul,.herofacts,.herochips,.proof .row,.pgrid,.pcard ul,
.steps,.deplist,.foot-list,.pcols ul,.cardlist,.fnlist{
  list-style:none;margin:0;padding:0}

/* ---- Admin bar. WordPress pins its own bar at top:0, so the government
        bar and the site nav both move down when it is present. ---- */
.admin-bar .govbar{top:32px}
.admin-bar .nav{top:calc(var(--govbar) + 32px)}
@media screen and (max-width:782px){
  .admin-bar .govbar{top:46px}
  .admin-bar .nav{top:calc(var(--govbar) + 46px)}
}

/* ---- Primary nav ---- */
.nav .links ul{display:flex;gap:20px;align-items:center}
.nav .links li{display:block}
.nav .links a{display:inline-flex;align-items:center;min-height:var(--tap)}

/* ---- Hero search. Circular lime icon button, as the approved comp draws it.
        The control keeps an aria-label so it is still a labelled submit. ---- */
.heroask .go{width:50px;min-width:0;height:50px;padding:0;flex:none;border:0;cursor:pointer;
  display:grid;place-items:center;color:var(--navy);border-radius:var(--r-sm);background:var(--lime)}
.heroask .go .go-ico{display:block}
.heroask .go:hover,.heroask .go:focus-visible{background:var(--lime-hover)}

/* ---- Hero chips are links now, so they need the button treatment ---- */
.herochips .chip{border:1px solid rgba(247,246,242,.3);color:var(--cream);
  padding:10px 18px;border-radius:999px;font-size:var(--t-xs);font-weight:700;
  background:none;text-decoration:none}
.herochips .chip:hover{background:rgba(247,246,242,.12);border-color:var(--cream)}

/* ---- Trust strip ---- */
.herofacts li{display:flex;align-items:center;gap:9px;font-size:var(--t-xs);
  font-weight:700;color:rgba(247,246,242,.9)}

/* ---- Proof strip ---- */
.proof .c{display:block}
.proof .n{display:block}
.proof .l{display:block}

/* ---- Pathway cards ---- */
.pgrid .pcard{list-style:none}
.pcard>a{position:relative;z-index:3;display:flex;flex-direction:column;
  justify-content:flex-end;height:100%;padding:30px;text-decoration:none;color:inherit;gap:2px}
.pcard{background:var(--navy)}
.pcard .pw-ico{margin-bottom:auto}
.pcard .w{color:var(--cream)}
.pw--learn .w{color:var(--sky)} .pw--grow .w{color:var(--lime)}
.pcard .pw-rule{margin:14px 0 12px}

/* ---- Four functions, one request ---- */
.deplist{margin-top:36px;border-top:1px solid var(--line)}
.deplist li{border-bottom:1px solid var(--line)}
.deplist a{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:22px 0;min-height:var(--tap);color:var(--cream);font-size:var(--t-d4);
  font-weight:700;letter-spacing:-0.02em;text-decoration:none}
.deplist a:hover{color:var(--lime)}
.deplist .tag{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--sky);border:1px solid var(--sky);
  border-radius:999px;padding:6px 12px;white-space:nowrap}
@media(max-width:600px){
  .deplist a{flex-wrap:wrap}
  .deplist .tag{white-space:normal}
}

/* ---- Process steps ---- */
.steps li{border-bottom:1px solid var(--line-d);padding:24px 0}
.steps li:first-child{border-top:1px solid var(--line-d)}

/* ---- Functions list on cream ---- */
.fnlist .fn{border-top:1px solid var(--line-d);padding:24px 0}
.fnlist h3{font-size:var(--t-d4);font-weight:700;letter-spacing:-0.02em;margin:0 0 8px}

/* ---- FAQ ---- */
.faqs{margin-top:36px;border-top:1px solid var(--line)}
.faq{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;
  justify-content:space-between;gap:18px;padding:24px 4px;min-height:var(--tap);
  font-size:var(--t-lede);font-weight:700;color:var(--cream)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:var(--t-d4);font-weight:400;line-height:1;color:var(--lime)}
.faq[open] summary::after{content:"\2212"}
.faq__a{padding:0 0 22px}
.faq__a p{color:var(--dim-d)}

/* ---- Partners ---- */
.pcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:32px;margin:36px 0}
.pcols h3{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;margin:0 0 12px;color:var(--charcoal)}
.pcols li{font-size:var(--t-sm);font-weight:500;line-height:1.9}
.pcols .is-category{color:var(--charcoal);font-style:italic}

/* ---- Contact ---- */
.ctwrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,64px);align-items:start}
@media(max-width:820px){.ctwrap{grid-template-columns:1fr}}
.f{background:var(--paper);border-radius:var(--r);padding:clamp(22px,3vw,34px);
  border:1px solid var(--line-d)}
.field{margin-bottom:18px}
.field label{display:block;font-size:var(--t-xs);font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;margin-bottom:8px;color:var(--charcoal)}
.field input,.field select,.field textarea{width:100%;box-sizing:border-box;
  border:1px solid var(--line-d);border-radius:var(--r-sm);padding:13px 14px;
  min-height:var(--tap);font-size:var(--t-body);color:var(--navy);background:var(--paper)}
.field textarea{min-height:132px;resize:vertical}
.hp{position:absolute;left:-9999px}
.notice-ok{color:var(--limeink);font-weight:700;font-size:var(--t-sm);margin-bottom:16px}

/* ---- Finale ---- */
.finale{padding:var(--sp) 0;text-align:center}
.finale .branch{margin:0 auto 26px}
.finale .prose{margin-left:auto;margin-right:auto}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.fin-sub{margin-top:26px;font-size:var(--t-xs);font-weight:700;letter-spacing:.06em}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:var(--tap);
  padding:13px 32px;border-radius:var(--r);font-size:var(--t-sm);font-weight:700;
  letter-spacing:-0.005em;text-decoration:none;border:1px solid transparent;cursor:pointer}
.btn-lime{background:var(--lime);color:var(--navy)}
.btn-navy{background:var(--navy);color:var(--cream)}
.btn-navy:hover{background:var(--ink)}
.btn-ghost{background:none;color:inherit;border-color:currentColor}
.btn-sm{min-height:var(--tap);padding:11px 22px}

/* ---- Story placeholder ---- */
.story--placeholder{padding:var(--sp) 0}

/* ---- Footer ---- */
.foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;margin-bottom:48px}
@media(max-width:900px){.foot-top{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-top{grid-template-columns:1fr}}
.foot-line{font-size:var(--t-d4);font-weight:700;letter-spacing:-0.025em;line-height:1.2;margin:0 0 16px}
.foot-h{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;margin:0 0 14px;color:var(--lime)}
.foot-list li{font-size:var(--t-sm);font-weight:500;line-height:1.5}
.foot-list a{color:var(--dim-d);text-decoration:none}
.foot-list a:hover{color:var(--cream)}
.foot .legal{font-size:var(--t-xs);color:var(--dim-d);margin:6px 0}
.foot .xs{font-size:var(--t-xs);color:var(--dim-d);line-height:1.7}

/* ---- Generic list page ---- */
.cardlist{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.cardlist li{background:var(--paper);border:1px solid var(--line-d);
  border-radius:var(--r);padding:26px}
.cardlist a{text-decoration:none;color:inherit}

/* ---- Screen reader only ---- */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* ---- Sub hero for inner pages ---- */
.subhero{padding:calc(var(--govbar) + 140px) 0 var(--sp)}
.subhero .branch{margin-bottom:26px}

/* ---- Pathway colour on dark ground.
   The board assigns BUILD navy, WORK navy, LEARN sky, GROW lime. Sky and
   lime read on navy. Navy on navy is 1:1, so on the dark card the navy pair
   renders in cream and keeps the board's pairing by grouping rather than by
   hue. Documented deviation, and it reverses automatically on light ground. */
.s-deep .pw--build .pw-ico,.s-navy .pw--build .pw-ico,
.s-deep .pw--work .pw-ico,.s-navy .pw--work .pw-ico{color:var(--cream)}
.s-deep .pw--build .pw-rule,.s-navy .pw--build .pw-rule,
.s-deep .pw--work .pw-rule,.s-navy .pw--work .pw-rule{background:var(--cream)}
.pcard{border:1px solid var(--line)}
.pcard:hover{border-color:var(--lime)}
.pcard ul li{color:var(--dim-d)}

/* ---- Fixed chrome clearance. The government bar sits above the nav, and
        the WordPress admin bar sits above both for signed in users, so the
        hero and sub hero clear all of it rather than sliding underneath. */
.hero .wrap{padding-top:calc(var(--govbar) + 150px)}
.admin-bar .hero .wrap{padding-top:calc(var(--govbar) + 182px)}
.subhero{padding-top:calc(var(--govbar) + 150px)}
.admin-bar .subhero{padding-top:calc(var(--govbar) + 182px)}
@media(max-width:820px){
  .hero .wrap{padding-top:calc(var(--govbar) + 118px)}
  .admin-bar .hero .wrap{padding-top:calc(var(--govbar) + 164px)}
  .subhero{padding-top:calc(var(--govbar) + 118px)}
  .admin-bar .subhero{padding-top:calc(var(--govbar) + 164px)}
}

/* ---- Five services band, inside the Bureau section ---- */
.svcband{display:grid;grid-template-columns:38fr 62fr;gap:clamp(32px,5vw,72px);
  align-items:start;padding-top:clamp(28px,3.4vw,48px)}
@media(max-width:820px){.svcband{grid-template-columns:1fr}}
.svcband__lead h3{font-size:var(--t-d3);font-weight:700;letter-spacing:-0.03em;
  line-height:1.08;margin:12px 0 0;max-width:16ch}
.svclist li{display:grid;grid-template-columns:236px 1fr;gap:6px 28px;align-items:baseline;
  padding:16px 0;border-top:1px solid var(--line-d)}
.svclist li:last-child{border-bottom:1px solid var(--line-d)}
@media(max-width:640px){.svclist li{grid-template-columns:1fr;gap:6px}}
.svclist b{font-size:var(--t-body);font-weight:700;letter-spacing:-0.02em;color:var(--navy)}
.svclist span{font-size:var(--t-sm);line-height:1.6;color:var(--charcoal)}

/* ---- Partner network on Home ---- */
.partgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px);
  margin-top:clamp(36px,4vw,56px)}
@media(max-width:820px){.partgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.partgrid{grid-template-columns:1fr}}
.parth{font-size:var(--t-xs);font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--limeink);margin:0 0 14px}
.partcol{border-top:2px solid var(--navy);padding-top:18px}
.partlist{list-style:none;margin:0;padding:0;display:grid;gap:0}
.partlist li{font-size:var(--t-sm);font-weight:500;line-height:1.45;color:var(--navy);
  padding:11px 0;border-bottom:1px solid var(--line-d)}
.partlist .is-category{font-style:italic;color:var(--charcoal)}
.foot .xs,.sec .xs{font-size:var(--t-xs)}

/* ---- Reading measure, tuned to real glyphs.
   68ch of Montserrat holds about 80 characters, because the ch unit is the
   width of "0" and that is wider than the average lowercase letter. 58ch
   lands the rendered line inside the 60 to 75 character target. ---- */
:root{--measure:58ch}
.edintro .lede{max-width:var(--measure)}

/* =========================================================================
   Spacing pass and photography.
   ========================================================================= */

/* ---- Vertical rhythm. One scale, three steps, so section padding is not
        re-decided per section. The single --sp was doing every job and left
        band sized gaps where a section had little content. ---- */
:root{
  --sp-lg:clamp(72px,8vw,112px);   /* full editorial sections */
  --sp-md:clamp(52px,5.5vw,76px);  /* bands and short sections */
  --sp-sm:clamp(34px,3.5vw,48px);  /* tight strips */
  --gap:clamp(20px,2.4vw,34px);
}
.sec{padding:var(--sp-lg) 0}
.sec + .sec{padding-top:var(--sp-md)}
.s-cream + .s-cream{padding-top:var(--sp-md)}
.proof{padding:var(--sp-sm) 0}
.finale{padding:var(--sp-lg) 0}
.story{padding:var(--sp-lg) 0}

/* Heading to body rhythm, one rule instead of inline margins */
.sec h2,.finale h2,.story h2{margin:0 0 18px}
.sec .eyebrow,.finale .eyebrow,.story .eyebrow{display:block;margin:0 0 12px}
.sec .lede{margin-top:0}
.rv > .branch{margin-bottom:22px}

/* Section header block gets consistent space before its content */
.editorial,.split-5,.deplist,.faqs,.pgrid,.ggrid,.partgrid,.ctwrap{margin-top:var(--gap)}
.pgrid,.ggrid{margin-top:calc(var(--gap) + 10px)}

/* ---- Photography ---- */
.hero-bg{background-size:cover;background-position:center 56%}
.pcard{background:var(--navy);overflow:hidden}
.pcard .ph{position:absolute;inset:0;z-index:0}
.pcard::after{z-index:1}
.pcard>a{z-index:3}
.pcard .pw-ico,.pcard .pw-rule,.pcard .w,.pcard ul{position:relative;z-index:3}

.ggrid{grid-template-columns:repeat(4,1fr);grid-auto-rows:210px}
.gitem .g-tall,.gitem.g-tall{grid-row:span 2}
.gitem.g-wide{grid-column:span 2}
@media(max-width:820px){.ggrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.ggrid{grid-template-columns:1fr;grid-auto-rows:180px}
  .gitem.g-tall,.gitem.g-wide{grid-row:auto;grid-column:auto}}

/* Placeholder marker on every borrowed frame. These are stand ins and the
   site says so rather than letting them read as finished. */
.cap--ph{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;opacity:.92}

/* ---- Logo lockup ---- */
.lock{display:inline-flex;align-items:center;min-height:var(--tap)}
.lock__img{display:block;height:52px;width:auto;max-width:none}
.foot-logo{display:block;height:56px;width:auto;margin-bottom:20px}
@media(max-width:820px){.lock__img{height:42px}}
.custom-logo{height:52px;width:auto;display:block}

/* =========================================================================
   Weight discipline, to the board.
   Black 900 for headlines and display figures only.
   Bold 700 for subheadings, labels and important text.
   Medium 500 for body copy and supporting text.
   Regular 400 for detail and fine print.
   ========================================================================= */
body{font-weight:var(--w-med)}
h1,h2{font-weight:var(--w-black)}
h3,h4,h5,h6{font-weight:var(--w-bold)}
.eyebrow,.parth,.foot-h,.pcols h3,.field label,.f label,.cap--ph{font-weight:var(--w-bold)}
.btn,.chip,.heroask .go,.nav .links a,.deplist a,.faq summary{font-weight:var(--w-bold)}
p,li,.sm,.lede,.xs,.prose,.svclist span,.partlist li,.foot-list li{font-weight:var(--w-med)}
.legal,.privacy,.foot .xs,.pcols .is-category{font-weight:var(--w-reg)}
.fnlist h3,.svclist b,.askinfo b{font-weight:var(--w-bold)}

/* Display figures keep Black */
.proof .n,.pcard .w,.foot-line,.svcband__lead h3,.story blockquote{font-weight:var(--w-black)}

/* ---- Scrolled nav. The script toggles .scrolled, which is what the
        stylesheet has always expected. It was toggling .solid, so the bar
        never picked up its ground and sat transparent over the content. ---- */
.nav{transition:background .3s var(--ease),border-color .3s var(--ease)}
.nav .in{transition:height .3s var(--ease)}
.nav.scrolled{background:rgba(6,15,38,.96);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.nav.scrolled .lock__img{height:40px}
@supports not (backdrop-filter:blur(1px)){.nav.scrolled{background:rgba(6,15,38,.99)}}
.mnav a,.lock .wm{font-weight:var(--w-bold)}

/* ---- The em in a headline is a colour accent, not an italic. The board
        prints "START HERE." upright. Real italic faces are now loaded, so
        this has to be said explicitly rather than relied on by absence. ---- */
h1 em,h2 em,.t-hero em,.finale h2 em,.story blockquote em{font-style:normal}
h1 em,.t-hero em{color:var(--lime)}
.s-lime h2 em,.finale.s-lime h2 em{color:var(--navy)}
.s-cream h2 em,.s-paper h2 em{color:var(--limeink)}

/* =========================================================================
   Back to the comp. Everything below either restores a value I had changed
   or removes something I had added that the approved design does not have.
   ========================================================================= */

/* ---- Max weight is 700. Black is not used anywhere on the site. ---- */
h1,h2,h3,h4,h5,h6,
.proof .n,.pcard .w,.foot-line,.svcband__lead h3,.story blockquote,
.lock .wm,.mnav a,.eyebrow,.btn,.parth,.foot-h,.pcols h3,.field label,
.f label,.cap--ph,.deplist a,.faq summary,.fnlist h3,.svclist b,.askinfo b,
.heroask .go,.chip,.nav .links a{font-weight:700}

/* ---- The section line, exactly as the comp draws it: three contiguous
        segments, flat, 132 by 3. My stepped gradient version rendered as
        three separated dashes. ---- */
.branch{display:flex;align-items:center;gap:0;height:3px;width:132px;margin-bottom:26px}
.branch::before{content:none;display:none}
.branch i{display:block;height:3px}
.branch i:nth-child(1){width:52px;background:var(--navy)}
.branch i:nth-child(2){width:48px;background:var(--lime)}
.branch i:nth-child(3){width:32px;background:var(--sky)}
.branch.rev i:nth-child(1){background:var(--cream)}

/* ---- Section rhythm, back to the comp's single value ---- */
:root{--sp:clamp(72px,9vw,124px)}
.sec{padding:var(--sp) 0}
.sec + .sec{padding-top:var(--sp)}
.s-cream + .s-cream{padding-top:var(--sp)}
.story{padding:clamp(90px,12vw,160px) 0}
.proof{padding:clamp(32px,5vw,44px) 0}

/* ---- Small text keeps the comp's own spacing. My override is gone. ---- */
.sec .eyebrow,.finale .eyebrow,.story .eyebrow{display:block;margin:0 0 18px}
.sec h2,.finale h2,.story h2{margin:0}
.editorial,.split-5,.deplist,.faqs,.pgrid,.ggrid,.partgrid,.ctwrap{margin-top:0}
.deplist{margin-top:36px}
.faqs{margin-top:36px}
.partgrid{margin-top:clamp(36px,4vw,56px)}

/* ---- The CTA, to the comp ---- */
.finale{padding:clamp(64px,8vw,104px) 0;text-align:center}
.finale h2{max-width:22ch;margin:0 auto}
.finale .branch{margin:0 auto 26px}
.finale .prose,.finale p{margin:22px auto 0}
.cta-row{margin-top:34px}
.fin-sub{margin-top:38px;font-size:var(--t-d4);font-weight:700;letter-spacing:-0.02em}

/* ---- Borders removed. The comp has none of these. ---- */
.pcard{border:0}
.pcard:hover{border:0}
.cardlist li{border:0;background:transparent;padding:0}
.f{background:none;border:0;padding:0;display:flex;flex-direction:column;gap:8px}
.field{margin-bottom:0}
.btn-ghost{border:1.5px solid rgba(13,27,61,.4)}
.s-navy .btn-ghost,.s-deep .btn-ghost{border-color:rgba(247,246,242,.34)}

/* ---- Form fields keep the comp's own hairline, they need an edge to be
        usable. Everything decorative is gone. ---- */
.field input,.field select,.field textarea{border:1px solid var(--line-d);
  border-radius:var(--r);padding:14px 15px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--navy);background:#fff}
.field label{margin-bottom:0}
.ctwrap .f{gap:14px}

/* ---- On the lime ground the lime segment is lime on lime and disappears,
        which reads as a broken two dash rule. The comp has the same problem.
        On lime the middle segment takes navy so all three read. ---- */
.s-lime .branch i:nth-child(2){background:var(--navy)}
.s-lime .branch i:nth-child(3){background:var(--skyink)}

/* =========================================================================
   Layout corrections (v1.2.6). The semantic-list reset earlier in this file
   (list-style none) also zeroed margin and padding on elements that depend on
   them. These rules sit last so they win, and they restore the comp's spacing:
   the hero chip and trust gaps, the space under the Bureau heading, and the
   pathway grid held inside the 1200px content measure like every other band.
   ========================================================================= */
.herochips{margin-top:18px}
.herofacts{margin-top:36px;padding-top:26px;border-top:1px solid var(--line)}
.fnlist{margin-top:clamp(44px,5vw,60px);border-top:1px solid var(--line-d)}
/* Pathways sits inside the 1200px content measure like every other section. */
.pgrid{max-width:var(--wrap);margin-left:auto;margin-right:auto;
  padding-left:var(--sx);padding-right:var(--sx)}
/* Pathway cards carry the comp's corner "go" arrow, not a themed icon. */
.pcard .go{position:absolute;top:22px;right:22px;z-index:3;width:44px;height:44px;
  border-radius:var(--r-sm);border:1px solid rgba(247,246,242,.34);display:grid;
  place-items:center;color:var(--cream);background:rgba(4,9,26,.28);
  transition:background .25s var(--ease),border-color .25s}
.pcard:hover .go{background:var(--lime);border-color:var(--lime);color:var(--navy)}
.pcard .go .ico{width:18px;height:18px}
/* Trust-strip icons take the lime accent, matching the comp. */
.herofacts svg{color:var(--lime);width:17px;height:17px;flex:none}
/* Hero send button icon sits navy on the lime square. */
.heroask .go .ico{width:22px;height:22px;color:var(--navy)}

/* Pathway cards: drop the inner padding (there was a doubled inset from
   .pcard and .pcard>a). The small rule above the word is removed in markup;
   the lime/sky underline under each word (.pcard .w border) stays. */
.pcard{padding:0}
.pcard>a{padding:20px}

/* =========================================================================
   Full-bleed YEEB bands inside Elementor. When the Home page renders through
   Elementor, each YEEB band is one boxed section by default, which caps the
   themed background at 1140px and shows the page background at the sides. Each
   band is really a full-bleed section (its own background spans the viewport)
   with the .wrap inside holding content to 1200px, so strip Elementor's boxed
   width and the column/widget padding around the YEEB widgets only.
   ========================================================================= */
.elementor-section:has([class*="elementor-widget-yeeb-band-"],.elementor-widget-yeeb-hero,.elementor-widget-yeeb-home-band) .elementor-container{
  max-width:100%!important;padding-left:0!important;padding-right:0!important;width:100%}
.elementor-column:has([class*="elementor-widget-yeeb-band-"],.elementor-widget-yeeb-hero,.elementor-widget-yeeb-home-band){padding:0!important}
.elementor-column:has([class*="elementor-widget-yeeb-band-"],.elementor-widget-yeeb-hero,.elementor-widget-yeeb-home-band) .elementor-widget-wrap{padding:0!important}
[class*="elementor-widget-yeeb-band-"],.elementor-widget-yeeb-hero,.elementor-widget-yeeb-home-band{width:100%}
[class*="elementor-widget-yeeb-band-"] .elementor-widget-container,
.elementor-widget-yeeb-hero .elementor-widget-container,
.elementor-widget-yeeb-home-band .elementor-widget-container{padding:0!important;margin:0!important}

/* Footer social row. Renders only for the platforms the Bureau has set. */
.foot-social{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}
.foot-social a{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;
  border:1px solid rgba(247,246,242,.24);color:rgba(247,246,242,.85);
  transition:background .2s,color .2s,border-color .2s,transform .2s var(--ease)}
.foot-social a:hover{background:var(--lime);color:var(--navy);border-color:var(--lime);transform:translateY(-2px)}
.foot-social .soc-ico{width:19px;height:19px;fill:currentColor;stroke:none}

/* Pathway cards a touch more compact on phones. */
@media(max-width:600px){.pcard{min-height:280px}}

/* Inner-page body: tighter than a full editorial band so a short page intro
   does not leave a big empty gap before the next section or the closing CTA. */
.page-body{padding-top:clamp(44px,5vw,72px);padding-bottom:clamp(28px,3.5vw,48px)}
.s-cream.page-body + .s-cream{padding-top:clamp(28px,3.5vw,48px)}

/* Editorial notes. Red so it is obvious at a glance that these are production
   reminders (permissions, placeholders, photography), not client-facing copy.
   Remove the class, or the line, once the note no longer applies. */
.note-editor{color:#C0281B!important;font-weight:600}
.note-editor::before{content:"Note: ";font-weight:700;letter-spacing:.02em}
.s-navy .note-editor,.s-deep .note-editor{color:#FF8A7A!important}

/* ── 1.3.0: the pathway finder and the age note ─────────────── */
.finder{margin-top:52px;padding:clamp(28px,4vw,48px);border:1px solid var(--line);border-radius:var(--r);
  display:grid;grid-template-columns:minmax(0,34fr) minmax(0,66fr);gap:clamp(28px,5vw,64px);align-items:start}
.finder__lead .t-2{margin-bottom:14px}
.finder__q{border:0;margin:0 0 22px;padding:0;min-width:0}
.finder__q legend{padding:0;margin-bottom:12px;color:var(--cream)}
.finder__opts{display:flex;flex-wrap:wrap;gap:8px}
.finder__opt{position:relative;display:inline-flex;align-items:center;min-height:var(--tap);padding:9px 16px;
  border:1px solid rgba(247,246,242,.3);border-radius:999px;font-size:var(--t-sm);font-weight:500;cursor:pointer;
  transition:background .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease)}
.finder__opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.finder__opt:hover{background:rgba(247,246,242,.1);border-color:var(--cream)}
.finder__opt.is-on,.finder__opt:has(input:checked){background:var(--lime);border-color:var(--lime);color:var(--navy);font-weight:700}
.finder__opt:has(input:focus-visible){outline:3px solid var(--sky);outline-offset:2px}
.finder__act{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:8px}
.finder__skip{text-decoration:underline;text-underline-offset:3px}
.finder__result{grid-column:1/-1;margin-top:8px;padding-top:28px;border-top:1px solid var(--line)}
.finder__result .t-2,.finder__result .t-3{margin-bottom:12px}
.finder__p{max-width:60ch;color:rgba(247,246,242,.86);margin-bottom:18px}
.finder__result .btn{margin-bottom:10px}
.age-note{margin-top:10px;padding:12px 14px;border-left:3px solid var(--lime);background:#fff;border-radius:0 var(--r-sm) var(--r-sm) 0}
@media (max-width:900px){.finder{grid-template-columns:1fr}}

/* ── 1.3.0: the four pathways in the hero, as the client wrote them ── */
.heropaths{margin-top:22px}
.heropaths__q{font-size:var(--t-eyebrow);font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--lime);margin-bottom:12px}
.heropaths__list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:960px}
.hpath{display:flex;flex-direction:column;gap:4px;min-height:var(--tap);padding:14px 16px;border:1px solid rgba(247,246,242,.28);border-radius:var(--r);
  background:rgba(4,9,26,.35);color:var(--cream);transition:background .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}
.hpath b{font-size:var(--t-lede);font-weight:700;letter-spacing:-0.02em;text-transform:uppercase}
.hpath span{font-size:var(--t-xs);line-height:1.5;color:rgba(247,246,242,.82)}
.hpath:hover{background:rgba(247,246,242,.12);border-color:var(--cream);transform:translateY(-2px)}
.hpath--build b,.hpath--work b{color:var(--cream)} .hpath--learn b{color:var(--sky)} .hpath--grow b{color:var(--lime)}
@media (max-width:900px){.heropaths__list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.heropaths__list{grid-template-columns:1fr}}

/* ── 1.3.0: every link that looks like a button says so with an arrow ── */
.btn .btn__arrow{width:18px;height:18px;flex:none;transition:transform .2s var(--ease)}
.btn:hover .btn__arrow{transform:translateX(3px)}
.btn-sm .btn__arrow{width:15px;height:15px}
.hpath{position:relative;padding-right:44px}
.hpath .btn__arrow{position:absolute;right:14px;top:16px;width:20px;height:20px;color:var(--lime);transition:transform .2s var(--ease)}
.hpath:hover .btn__arrow{transform:translateX(3px)}

/* ── 1.3.0: the tick on a picked answer, and the Ask YEEB page ─────── */
.finder__opt{gap:8px}
.finder__tick{width:16px;height:16px;flex:none;display:none;stroke-width:2.6;margin-left:2px}
.finder__opt.is-on .finder__tick,.finder__opt:has(input:checked) .finder__tick{display:inline-block}
.askgrid{display:grid;grid-template-columns:minmax(0,62fr) minmax(0,38fr);gap:clamp(20px,3vw,36px);align-items:start}
.askchat .yeeb-ai--inline{font-family:inherit}
.askside{display:flex;flex-direction:column;gap:16px}
.askcard{background:var(--paper);border:1px solid var(--line-d);border-radius:var(--r);padding:clamp(18px,2.4vw,26px);color:var(--navy)}
.askcard .t-3{margin-bottom:12px;color:var(--navy)}
.asklist li{padding:11px 0;border-top:1px solid var(--line-d);font-size:var(--t-sm);color:var(--charcoal)}
.asklist li:first-child{border-top:0;padding-top:0}
.asklist--steps{counter-reset:ask;list-style:none}
.asklist--steps li{counter-increment:ask;display:flex;gap:12px;align-items:baseline}
.asklist--steps li::before{content:counter(ask);flex:none;width:22px;height:22px;border-radius:50%;background:var(--lime);color:var(--navy);font-size:var(--t-xs);font-weight:700;display:inline-flex;align-items:center;justify-content:center;transform:translateY(-1px)}
.asklist a,.askmore{display:inline-flex;align-items:center;gap:8px;color:var(--navy);font-weight:700}
.asklist a .btn__arrow,.askmore .btn__arrow{width:16px;height:16px;transition:transform .2s var(--ease)}
.asklist a:hover .btn__arrow,.askmore:hover .btn__arrow{transform:translateX(3px)}
.asklist--plain li{color:var(--charcoal)}
@media (max-width:900px){.askgrid{grid-template-columns:1fr}}

/* ── 1.3.0: paragraphs in page body copy breathe ───────────────── */
.page-body .prose p+p,.page-body .prose ul,.page-body .prose ol{margin-top:20px}
.page-body .prose li+li{margin-top:8px}
.page-body .prose ul{padding-left:1.2em;list-style:disc}
.page-body .prose ol{padding-left:1.2em;list-style:decimal}
.page-body .prose h2,.page-body .prose h3{margin-top:32px;margin-bottom:12px;color:var(--navy)}

/* ── 1.3.0: the opportunity board, the FAQ filter, the hero questions link ── */
.herobtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.faqfind{margin-top:28px;max-width:520px}
.faqfind input{width:100%;border:1px solid rgba(247,246,242,.3);border-radius:var(--r);padding:13px 15px;background:rgba(247,246,242,.06);color:var(--cream)}
.faqfind input::placeholder{color:rgba(247,246,242,.55)}
.faqfind input:focus{outline:3px solid var(--sky);outline-offset:2px}
.faqfind__none{margin-top:10px}
.faqfind__none a{color:var(--lime);display:inline-flex;align-items:center;gap:6px}
.faqfind__none .btn__arrow{width:14px;height:14px}
.oppkinds{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.oppkinds .chip{display:inline-flex;align-items:center;gap:8px;min-height:var(--tap);padding:8px 14px;border:1px solid var(--line-d);border-radius:999px;background:var(--paper);color:var(--navy);font-size:var(--t-sm);font-weight:500}
.oppkinds .chip span{font-size:var(--t-xs);font-weight:700;color:var(--limeink)}
.oppkinds .chip:hover{border-color:var(--navy)}
.oppkinds .chip.is-on{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.oppkinds .chip.is-on span{color:var(--lime)}
.oppfilter{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}
.oppfilter input,.oppfilter select{border:1px solid var(--line-d);border-radius:var(--r);padding:12px 14px;background:var(--paper);min-height:var(--tap)}
.oppfilter input{flex:1 1 220px}
.oppgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.oppcard{background:var(--paper);border:1px solid var(--line-d);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:10px;color:var(--navy)}
.oppcard__meta{display:flex;flex-wrap:wrap;gap:8px;font-size:var(--t-xs);color:var(--charcoal)}
.oppcard__kind{font-weight:700;color:var(--limeink);text-transform:uppercase;letter-spacing:.08em}
.oppcard__org{font-size:var(--t-sm);font-weight:700;color:var(--navy)}
.oppcard__closes{font-size:var(--t-xs);color:var(--charcoal)}
.oppcard__act{margin-top:auto;padding-top:8px;display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.oppcard__ask{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-sm);font-weight:700;color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.oppcard__ask .btn__arrow{width:15px;height:15px}
.oppempty{background:var(--paper);border:1px solid var(--line-d);border-radius:var(--r);padding:clamp(24px,4vw,40px);max-width:60ch;color:var(--navy)}
.oppempty .t-3{margin-bottom:10px}
.oppempty p+p{margin-top:16px}
@media (max-width:900px){.oppgrid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.oppgrid{grid-template-columns:1fr}}
/* A ghost button over a photograph needs a border that reads without hover. */
.herobtns .btn-ghost{border-color:rgba(247,246,242,.75)}
.herobtns .btn-ghost:hover{border-color:var(--cream);background:rgba(247,246,242,.12)}
/* Footer social circles: a later tap-target rule made these 42 x 44 flex
   boxes with the icon at the left edge. Centred, and a true circle. */
.foot-social a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:0;line-height:0}
.foot-social .soc-ico{display:block}

/* 1.4.0: service area icons from the brand guidelines. The artwork is the
   supplied PNG, never recoloured; on navy or a photograph it sits in a white
   disc so all four hold contrast. Doubled class beats Elementor's .elementor img reset. */
.area-ico.area-ico{display:inline-block;flex:none;width:44px;height:44px;border-radius:50%;object-fit:contain;vertical-align:middle;background:transparent}
.area-ico.area-ico--chip{background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.t-area{display:flex;align-items:center;gap:14px}
.t-area>span{min-width:0}
.hpath{flex-direction:row;align-items:center;gap:12px;padding-right:40px}
.hpath .area-ico{width:40px;height:40px}
.hpath__t{display:flex;flex-direction:column;gap:4px;min-width:0}
.fn h3{display:flex;align-items:center;gap:14px}
.fn h3::before{display:none}
.fn h3 .area-ico{width:48px;height:48px}
.pcard .pcard__area{width:52px;height:52px;margin-bottom:16px}
.dtab .area-ico{width:36px;height:36px}
.dpane .t-area .area-ico{width:44px;height:44px}
.asklist a .area-ico{width:30px;height:30px}
.foot-area{display:inline-flex;align-items:center;gap:10px}
.foot-area .area-ico{width:26px;height:26px}
.finder__opt .finder__area{width:28px;height:28px;margin-right:2px}
.finder__result .t-area .area-ico{width:44px;height:44px}
.subhero .t-area .area-ico{width:56px;height:56px}
@media (max-width:480px){.subhero .t-area .area-ico{width:44px;height:44px}.fn h3 .area-ico{width:40px;height:40px}}
.heropaths__list li{display:flex}.heropaths__list .hpath{flex:1}
.oppcard__meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.oppcard__meta .oppcard__area{width:26px;height:26px}