/* =====================================================================
   Dr. Kesha O'Reilly — Official Trustee Website
   Design system: navy + kelly green + lavender, condensed headlines,
   and the slanted "7" (District 7) as the one signature shape.
   ===================================================================== */

/* ---------- Fonts (self-hosted, SIL OFL 1.1 — see assets/fonts/LICENSE-*) ---------- */
@font-face{
  font-family:"Fjalla One"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/fjalla-one-latin-400-normal.woff2") format("woff2");
}
@font-face{
  font-family:"Figtree"; font-style:normal; font-weight:300 900; font-display:swap;
  src:url("../fonts/figtree-latin-wght-normal.woff2") format("woff2-variations");
}
/* Monospace is used ONLY to flag [[PLACEHOLDER]] tokens; it disappears at launch. */
@font-face{
  font-family:"IBM Plex Mono"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");
}

/* ---------- Tokens ---------- */
:root{
  --navy:#08136b;
  --navy-deep:#050c47;
  --navy-mid:#1a2aa6;
  --ink:#141a4a;          /* body text */
  --muted:#464c80;
  --green:#22d86a;        /* bright: fills and rules on dark/green surfaces */
  --green-deep:#12b552;   /* decorative rules on light surfaces */
  --green-ink:#0a7a37;    /* green TEXT / icons on light surfaces (AA on white + lavender) */
  --charcoal:#26262b;
  --lav:#efecff;
  --lav-deep:#d9d3ff;
  --line:#d6d1f3;
  --danger:#b3261e;
  --white:#fff;

  --display:"Fjalla One","Arial Narrow","Franklin Gothic Medium",Impact,sans-serif;
  --body:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;

  --max:1240px;
  --header-h:80px;
  --slant:-14deg;
  --ease:cubic-bezier(.2,.8,.2,1);
  --focus:var(--navy);
}

/* ---------- Base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{
  scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 28px);
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
}
body{
  margin:0; font-family:var(--body); font-size:1.0625rem; line-height:1.65;
  color:var(--ink); background:#fff; overflow-x:hidden; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ margin:0 0 .5em; color:var(--navy); }
h1,h2{ font-family:var(--display); font-weight:400; line-height:1.04; letter-spacing:.004em; }
h3{ font-family:var(--body); font-weight:800; line-height:1.2; font-size:1.25rem; }
p{ margin:0 0 1.1em; max-width:66ch; }
a{ color:var(--navy); text-underline-offset:.18em; }
img{ max-width:100%; display:block; }
ul,ol{ margin:0 0 1.1em; }
address{ font-style:normal; }
[hidden]{ display:none !important; }

:focus-visible{ outline:3px solid var(--focus); outline-offset:3px; }
.on-dark{ --focus:var(--green); }
.on-green{ --focus:var(--navy-deep); }

.wrap{ width:100%; max-width:var(--max); margin:0 auto; padding:0 clamp(20px,4vw,40px); }
.visually-hidden{
  position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip-link{
  position:absolute; top:-64px; left:12px; z-index:500; background:var(--navy-deep); color:#fff;
  padding:12px 20px; font-weight:800; text-decoration:none; transition:top .15s;
}
.skip-link:focus{ top:12px; outline:3px solid var(--green); }

/* ---------- Placeholders (clearly flagged; removed at launch) ---------- */
.ph, .ph-block{
  font-family:var(--mono); font-size:.8rem; line-height:1.5; color:#6b4a0c;
  background:repeating-linear-gradient(135deg,#fff4d4,#fff4d4 7px,#ffeaa8 7px,#ffeaa8 14px);
  border:1px dashed #b98a2f; border-radius:2px;
}
.ph{ display:inline-block; padding:.1em .55em; font-size:.82em; }
.ph-block{ display:block; padding:14px 16px; margin:0 0 1em; }

/* =====================================================================
   THE SLANTED 7  — built from four clipped shapes, animated on load
   ===================================================================== */
.seven{ position:absolute; pointer-events:none; aspect-ratio:.92; }
.seven i{ position:absolute; inset:0; display:block; }
.seven .s-bar  { background:var(--green); clip-path:polygon(0 0,100% 0,91% 15%,0 15%); }
.seven .s-stem { background:var(--navy-mid); clip-path:polygon(62% 0,100% 0,46% 100%,14% 100%); }
.seven .s-line { background:var(--green); clip-path:polygon(63.8% 15%,68.8% 15%,28% 100%,23% 100%); }
.seven .s-shade{ background:var(--charcoal); clip-path:polygon(100% 0,100% 100%,46% 100%); }
.seven--light .s-stem{ background:var(--navy); }
.seven--ghost{ opacity:.14; }
.seven--ghost i{ background:#fff !important; }

/* =====================================================================
   BUTTONS — slanted fill, sweep on hover
   ===================================================================== */
.btn{
  position:relative; isolation:isolate; display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding:.8em 2em; font:800 1rem/1.1 var(--body); text-decoration:none; text-align:center;
  color:var(--navy-deep); background:none; border:0; cursor:pointer;
  transition:color .25s var(--ease);
}
.btn::before,.btn::after{
  content:""; position:absolute; inset:0; z-index:-1; transform:skewX(var(--slant));
}
.btn::before{ background:var(--green); }
.btn::after{
  background:var(--navy); transform:skewX(var(--slant)) scaleX(0); transform-origin:left;
  transition:transform .38s var(--ease);
}
.btn:hover::after,.btn:focus-visible::after{ transform:skewX(var(--slant)) scaleX(1); }
.btn:hover,.btn:focus-visible{ color:#fff; }

.btn-secondary{ color:#fff; }                       /* ghost on dark */
.btn-secondary::before{ background:transparent; box-shadow:inset 0 0 0 2px rgba(255,255,255,.85); }
.btn-secondary::after{ background:#fff; }
.btn-secondary:hover,.btn-secondary:focus-visible{ color:var(--navy-deep); }

.btn-tertiary{ color:var(--navy); }                 /* outline on light */
.btn-tertiary::before{ background:transparent; box-shadow:inset 0 0 0 2px var(--navy); }
.btn-tertiary::after{ background:var(--navy); }
.btn-tertiary:hover,.btn-tertiary:focus-visible{ color:#fff; }

.btn-dark{ color:#fff; }                            /* navy on green bands */
.btn-dark::before{ background:var(--navy-deep); }
.btn-dark::after{ background:#fff; }
.btn-dark:hover,.btn-dark:focus-visible{ color:var(--navy-deep); }

.btn-row{ display:flex; flex-wrap:wrap; gap:16px 22px; margin-top:8px; }
.btn-secondary[aria-current="page"]{ color:var(--navy-deep); }
.btn-secondary[aria-current="page"]::before{ background:#fff; }

/* =====================================================================
   TOP BAR + HEADER
   ===================================================================== */
.topbar{ background:var(--navy-deep); color:#d9dcff; font-size:.9rem; --focus:var(--green); }
.topbar-row{ display:flex; justify-content:space-between; align-items:center; min-height:42px; gap:20px; }
.topbar ul{ display:flex; gap:26px; list-style:none; margin:0; padding:0; }
.topbar a{ color:#d9dcff; text-decoration:none; font-weight:600; position:relative; padding:4px 0; }
.topbar a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--green);
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.topbar a:hover,.topbar a[aria-current="page"]{ color:#fff; }
.topbar a:hover::after,.topbar a[aria-current="page"]::after,.topbar a:focus-visible::after{ transform:scaleX(1); }

.site-header{
  position:sticky; top:0; z-index:200; background:var(--navy); --focus:var(--green);
  transition:box-shadow .3s var(--ease);
}
.site-header.is-scrolled{ box-shadow:0 8px 28px rgba(5,12,71,.16); }
.header-row{ display:flex; align-items:center; gap:28px; min-height:var(--header-h); }
.brand{ display:flex; align-items:center; text-decoration:none; color:#fff; flex:none; padding:8px 0; }
.brand-logo{ display:block; height:52px; width:auto; max-width:100%; }
.brand-mark{ width:38px; height:38px; flex:none; }
.brand-mark .m-bar{ fill:var(--green-deep); }
.brand-mark .m-stem{ fill:var(--navy); }
.brand-mark .m-shade{ fill:var(--charcoal); }
.brand-text{ display:flex; flex-direction:column; line-height:1.1; }
.brand-text strong{ font-family:var(--display); font-weight:400; font-size:1.55rem; letter-spacing:.01em; }
.brand-text small{ font-size:.8rem; font-weight:600; color:var(--muted); margin-top:3px; }

.primary-nav{ display:flex; align-items:center; gap:22px; margin-left:auto; }
.nav-main{ display:flex; gap:2px; list-style:none; margin:0; padding:0; }
.nav-main a{
  position:relative; display:block; padding:.6em .62em; font-weight:700; font-size:.93rem; white-space:nowrap;
  color:#fff; text-decoration:none;
}
.nav-main a::after{
  content:""; position:absolute; left:.62em; right:.62em; bottom:.2em; height:4px; background:var(--green);
  transform:skewX(-24deg) scaleX(0); transform-origin:left; transition:transform .35s var(--ease);
}
.nav-main a:hover::after,.nav-main a:focus-visible::after,.nav-main a[aria-current="page"]::after{
  transform:skewX(-24deg) scaleX(1);
}
.nav-extra{ display:none; }
.nav-toggle{ display:none; }
.progress{ position:absolute; left:0; right:0; bottom:0; height:4px; background:transparent; overflow:hidden; }
.progress span{
  display:block; height:100%; background:var(--green); transform:scaleX(0); transform-origin:left;
}

@media (max-width:1360px){
  .topbar{ display:none; }
  .header-row{ gap:12px; }
  .nav-toggle{
    display:inline-flex; align-items:center; gap:12px; margin-left:auto; min-height:48px; padding:0 16px;
    font:800 1rem var(--body); color:#fff; background:transparent; border:2px solid #fff; cursor:pointer;
    transition:background-color .2s, color .2s;
  }
  .nav-toggle:hover{ background:#fff; color:var(--navy); }
  .brand-logo{ height:44px; }
  .nav-toggle .bars, .nav-toggle .bars::before, .nav-toggle .bars::after{
    display:block; width:20px; height:2.5px; background:currentColor; position:relative;
    transition:transform .3s var(--ease), background-color .2s;
  }
  .nav-toggle .bars::before,.nav-toggle .bars::after{ content:""; position:absolute; left:0; }
  .nav-toggle .bars::before{ top:-6.5px; }
  .nav-toggle .bars::after{ top:6.5px; }
  .nav-toggle[aria-expanded="true"] .bars{ background:transparent; }
  .nav-toggle[aria-expanded="true"] .bars::before{ transform:translateY(6.5px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] .bars::after{ transform:translateY(-6.5px) rotate(-45deg); }

  .primary-nav{
    position:absolute; left:0; right:0; top:100%; margin:0; flex-direction:column; align-items:stretch; gap:0;
    background:var(--navy-deep); --focus:var(--green); max-height:0; overflow:hidden; visibility:hidden;
    transition:max-height .45s var(--ease), visibility 0s .45s;
  }
  .primary-nav.open{ max-height:calc(100vh - var(--header-h)); overflow-y:auto; visibility:visible; transition:max-height .45s var(--ease); }
  .nav-main, .nav-extra{ flex-direction:column; gap:0; padding:12px clamp(20px,4vw,40px) 0; }
  .nav-extra{ display:flex; list-style:none; margin:0; border-top:1px solid rgba(255,255,255,.18); margin-top:8px; padding-top:8px; }
  .nav-main a, .nav-extra a{
    color:#fff; font-family:var(--display); font-weight:400; font-size:1.55rem; padding:.45em 0; text-decoration:none; display:block;
  }
  .nav-extra a{ font-family:var(--body); font-weight:700; font-size:1.05rem; color:#d9dcff; padding:.55em 0; }
  .nav-main a::after{ left:0; right:auto; width:64px; bottom:.15em; }
  .nav-main a[aria-current="page"]{ color:var(--green); }
  .nav-cta{ margin:20px clamp(20px,4vw,40px) 28px; align-self:flex-start; }
}

/* =====================================================================
   PAGE-LEVEL SECTIONS
   ===================================================================== */
.sec{ position:relative; padding:clamp(60px,8vw,116px) 0; }
.sec--lav{ background:var(--lav); }
.sec--navy{ background:var(--navy); color:#e4e6ff; --focus:var(--green); }
.sec--navy h2,.sec--navy h3{ color:#fff; }
.sec--navy a:not(.btn){ color:#fff; }
.sec--green{ background:var(--green); color:var(--navy-deep); --focus:var(--navy-deep); }
.sec--clip{ overflow:hidden; isolation:isolate; }

.title{
  position:relative; font-family:var(--display); font-weight:400;
  font-size:clamp(2.1rem,4.4vw,3.5rem); line-height:1.04; margin:0 0 .85em; padding-bottom:.55em;
}
.title::after{
  content:""; position:absolute; left:0; bottom:0; width:92px; height:8px; background:var(--green-deep);
  transform:skewX(-24deg); transform-origin:left; transition:transform .8s .15s var(--ease);
}
.title--center{ text-align:center; }
.title--center::after{ left:50%; margin-left:-46px; transform-origin:center; }
.sec--navy .title{ color:#fff; }
.sec--navy .title::after,.sec--green .title::after{ background:var(--green); }
.sec--green .title::after{ background:var(--navy-deep); }
.sub-title{ font-family:var(--body); font-weight:800; font-size:1.3rem; margin:2rem 0 .6rem; }
.lede{ font-size:1.3rem; line-height:1.5; }
.lead-lg{ font-size:clamp(1.2rem,1.6vw,1.4rem); line-height:1.55; }

/* ---------- Page header (interior pages) ---------- */
.page-head{
  position:relative; isolation:isolate; overflow:hidden; color:#fff; --focus:var(--green);
  background:linear-gradient(118deg,var(--navy-deep) 0%,var(--navy) 58%,#0e1c9a 100%);
  padding:clamp(40px,5vw,72px) 0 clamp(88px,10vw,148px);
}
.page-head::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:clamp(34px,5vw,70px);
  background:var(--next,#fff); clip-path:polygon(0 100%,100% 0,100% 100%);
}
.page-head .seven{ right:-5%; top:-14%; width:min(48vw,600px); z-index:-1; }
.page-head h1{ color:#fff; font-size:clamp(2.7rem,6.4vw,5.4rem); max-width:14ch; margin-bottom:.3em; }
.page-head--wide h1{ max-width:21ch; font-size:clamp(2.4rem,5.4vw,4.6rem); }
.page-head .lede{ color:#d9dcff; max-width:40ch; margin-bottom:0; }
.crumbs ol{ list-style:none; display:flex; flex-wrap:wrap; gap:.35em; margin:0 0 clamp(22px,3vw,40px); padding:0; font-size:.95rem; font-weight:600; }
.crumbs li{ color:#fff; }
.crumbs li+li::before{ content:"/"; margin-right:.35em; color:var(--green); }
.crumbs a{ color:#c9ceff; text-decoration:none; }
.crumbs a:hover{ color:#fff; text-decoration:underline; }

/* ---------- Layout helpers ---------- */
.split{ display:grid; gap:clamp(36px,5vw,84px); align-items:center; grid-template-columns:minmax(0,1fr); }
.split--top{ align-items:start; }
@media (min-width:900px){
  .split{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); }
  .split--rev > :first-child{ order:2; }
  .split--even{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
}

/* ---------- Photo frame: offset slanted block behind any image ---------- */
.frame{ position:relative; isolation:isolate; margin:0 20px 20px 0; }
.frame::before{
  content:""; position:absolute; z-index:-1; inset:20px -20px -20px 20px; background:var(--green-deep);
  transition:transform .7s .25s var(--ease);
}
.frame--navy::before{ background:var(--navy); }
.frame--green::before{ background:var(--green); }
.frame > .ph-block, .frame > img{
  width:100%; aspect-ratio:4/3; margin:0; object-fit:cover; background:#fff;
  display:flex; align-items:center; justify-content:center; text-align:center;
}
.frame > img{ display:block; }
.frame--tall > .ph-block, .frame--tall > img{ aspect-ratio:4/5; }
.frame--wide > .ph-block{ aspect-ratio:16/10; }
.sec--navy .frame > .ph-block{ background:#fff4d4; }

/* =====================================================================
   HOME HERO
   ===================================================================== */
.hero{
  position:relative; isolation:isolate; overflow:hidden; color:#fff; --focus:var(--green);
  background:
    radial-gradient(900px 560px at 74% 46%, #1b2cc0 0%, rgba(27,44,192,0) 62%),
    linear-gradient(115deg,var(--navy-deep) 0%,var(--navy) 62%,#0c1a96 100%);
}
.hero-grid{
  display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr); align-items:end;
  min-height:clamp(600px,calc(100vh - var(--header-h) - 42px),780px);
}
.hero-copy{ align-self:center; padding:clamp(48px,6vw,88px) 0; position:relative; z-index:3; }
.hero h1{
  color:#fff; font-size:clamp(3.2rem,8vw,7rem); line-height:1; margin:0 0 .28em; max-width:none;
}
.hero h1 .line{ display:block; overflow:hidden; padding-bottom:.07em; }
.hero h1 .line > span{ display:block; }
.hero .lede{ color:#fff; font-weight:700; font-size:clamp(1.15rem,1.7vw,1.4rem); margin-bottom:.7em; max-width:30ch; }
.hero-text{ color:#d9dcff; font-size:1.12rem; max-width:50ch; margin-bottom:1.6em; }
.hero-art{ position:relative; align-self:stretch; display:flex; align-items:flex-end; justify-content:center; min-height:420px; }
.hero-art .seven{ right:-12%; bottom:0; width:128%; max-width:820px; z-index:1; }
.hero-art img{ position:relative; z-index:2; width:min(100%,560px); height:auto; }

@media (max-width:899px){
  .hero-grid{ grid-template-columns:1fr; min-height:0; }
  .hero-copy{ padding-bottom:12px; }
  .hero-art{ min-height:0; margin-top:8px; }
  .hero-art img{ width:min(86%,430px); }
  .hero-art .seven{ right:-26%; width:120%; }
}

.facts{ background:var(--green); color:var(--navy-deep); --focus:var(--navy-deep); }
.facts ul{ display:grid; grid-template-columns:repeat(4,1fr); list-style:none; margin:0; padding:0; }
.facts li{ position:relative; padding:24px clamp(16px,2.2vw,32px); display:flex; flex-direction:column; gap:2px; }
.facts li + li::before{
  content:""; position:absolute; left:0; top:20%; bottom:20%; width:3px; background:rgba(5,12,71,.4);
  transform:skewX(-14deg);
}
.fact-label{ font-weight:700; font-size:.92rem; }
.fact-value{ font-family:var(--display); font-size:clamp(1.35rem,2.2vw,1.8rem); line-height:1.15; }
.facts .ph{ font-size:.7rem; }
@media (max-width:820px){
  .facts ul{ grid-template-columns:1fr 1fr; }
  .facts li:nth-child(3)::before{ display:none; }
  .facts li:nth-child(n+3){ border-top:2px solid rgba(5,12,71,.25); }
}
@media (max-width:460px){
  .facts ul{ grid-template-columns:1fr; }
  .facts li + li::before{ display:none; }
  .facts li + li{ border-top:2px solid rgba(5,12,71,.25); }
}

/* Stat tiles — placeholders now; .stat-num / .stat-label are ready for real figures */
.stat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:22px; }
.stat{ position:relative; background:var(--lav); padding:34px 24px 22px; }
.stat::before{
  content:""; position:absolute; left:0; top:0; width:84px; height:8px; background:var(--green-deep);
  transform:skewX(-24deg); transform-origin:left; transition:width .5s var(--ease);
}
.stat:hover::before{ width:100%; }
.stat .ph-block{ margin:0; }
.stat-num{ display:block; font-family:var(--display); font-size:clamp(2.8rem,5vw,4.2rem); line-height:1; color:var(--navy); }
.stat-label{ display:block; font-weight:700; color:var(--muted); margin-top:6px; }

/* =====================================================================
   NEWS / PRESS LIST, EVENTS
   ===================================================================== */
.news-list{ list-style:none; margin:0 0 34px; padding:0; border-top:2px solid var(--navy); }
.news-item{
  position:relative; display:grid; grid-template-columns:minmax(150px,210px) 1fr; gap:10px 32px;
  padding:30px 0 30px 0; border-bottom:1px solid var(--line);
  transition:padding-left .4s var(--ease), background-color .3s;
}
.news-item::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:8px; background:var(--green-deep);
  transform:scaleY(0); transform-origin:top; transition:transform .4s var(--ease);
}
.news-item:hover{ padding-left:26px; background:linear-gradient(90deg,var(--lav),transparent 70%); }
.news-item:hover::before{ transform:scaleY(1); }
.news-date{ font-weight:800; color:var(--green-ink); }
.news-item h3{ font-size:1.35rem; margin-bottom:.4em; }
.news-item p{ margin:0; }
@media (max-width:640px){ .news-item{ grid-template-columns:1fr; } }

.segmented{ display:inline-flex; flex-wrap:wrap; gap:14px; margin-top:28px; }

.event-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:26px; }
.event{
  position:relative; display:grid; grid-template-columns:auto 1fr; gap:22px; background:#fff; padding:26px;
  border:1px solid var(--line); transition:box-shadow .3s var(--ease), transform .3s var(--ease);
}
.event:hover{ box-shadow:0 18px 40px rgba(8,19,107,.14); transform:translateY(-4px); }
.event-date-badge{
  align-self:start; min-width:104px; padding:16px 14px; background:var(--navy); color:#fff;
  font-family:var(--display); font-size:1.15rem; line-height:1.2; text-align:center;
  clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);
}
.event-date-badge.ph{ clip-path:none; color:#6b4a0c; font-family:var(--mono); font-size:.76rem; background:repeating-linear-gradient(135deg,#fff4d4,#fff4d4 7px,#ffeaa8 7px,#ffeaa8 14px); }
.event h3{ font-size:1.3rem; }
@media (max-width:520px){ .event{ grid-template-columns:1fr; } }

/* =====================================================================
   CARDS (programs) + PEOPLE
   ===================================================================== */
.card-grid{ display:grid; gap:28px; grid-template-columns:repeat(auto-fill,minmax(min(100%,310px),1fr)); }
.card{
  position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); overflow:hidden;
  transition:box-shadow .35s var(--ease);
}
.card:hover,.card:focus-within{ box-shadow:0 22px 46px rgba(8,19,107,.16); }
.card::before{
  content:""; position:absolute; z-index:2; top:0; left:0; height:8px; width:84px; background:var(--green-deep);
  transform:skewX(-24deg); transform-origin:left; transition:width .5s var(--ease);
}
.card:hover::before,.card:focus-within::before{ width:100%; }
.card-media{ overflow:hidden; border-bottom:1px solid var(--line); }
.card-media .ph-block{
  aspect-ratio:4/3; margin:0; display:flex; align-items:center; justify-content:center; text-align:center;
  border:0; border-radius:0; transition:transform .6s var(--ease);
}
.card:hover .card-media .ph-block{ transform:scale(1.05); }
.card-body{ display:flex; flex-direction:column; gap:8px; padding:26px 26px 30px; flex:1; }
.tag{ font-weight:800; color:var(--green-ink); font-size:.92rem; }
.card h3{ font-size:1.3rem; margin:0; }
.card-body p{ margin:0; }
.card-cta{
  margin-top:auto; padding:14px 0 4px; align-self:flex-start; font-weight:800; text-decoration:none; color:var(--navy);
  background:linear-gradient(var(--green-deep),var(--green-deep)) 0 100%/0 4px no-repeat; transition:background-size .4s var(--ease);
}
.card:hover .card-cta,.card-cta:focus-visible{ background-size:100% 4px; }

.people-grid{ display:grid; gap:26px; grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr)); }
.person{
  position:relative; background:#fff; padding:20px 20px 26px; border:1px solid var(--line);
  transition:box-shadow .35s var(--ease);
}
.person:hover{ box-shadow:0 20px 40px rgba(8,19,107,.14); }
.person::before{
  content:""; position:absolute; top:0; left:0; height:8px; width:64px; background:var(--green-deep);
  transform:skewX(-24deg); transform-origin:left; transition:width .5s var(--ease);
}
.person:hover::before{ width:100%; }
.person .ph-block{ aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; text-align:center; margin:14px 0 18px; }
.person h3{ font-size:1.15rem; margin-bottom:2px; }
.person-role{ display:block; font-weight:700; color:var(--green-ink); margin-bottom:10px; }

/* =====================================================================
   TIMELINE (scroll-driven progress spine)
   ===================================================================== */
.timeline{ --date-w:clamp(130px,17vw,200px); list-style:none; margin:0; padding:0; position:relative; }
.timeline::before,.timeline::after{
  content:""; position:absolute; left:var(--date-w); top:0; width:5px; margin-left:-2.5px;
}
.timeline::before{ bottom:0; background:var(--lav-deep); }
.timeline::after{ height:var(--tl,0px); max-height:100%; background:var(--green-deep); transition:height .12s linear; }
.tl-item{ position:relative; display:grid; grid-template-columns:var(--date-w) minmax(0,1fr); padding:0 0 34px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-date{ padding:20px 34px 0 0; text-align:right; font-family:var(--display); font-size:clamp(1.15rem,1.7vw,1.5rem); color:var(--navy); line-height:1.2; }
.tl-date .ph{ font-family:var(--mono); font-size:.72rem; }
.tl-marker{
  position:absolute; left:var(--date-w); top:26px; width:22px; height:22px; margin-left:-11px; z-index:2;
  background:#fff; border:5px solid var(--lav-deep); transform:skewX(-14deg);
  transition:background-color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
}
.tl-item.is-passed .tl-marker{ background:var(--green-deep); border-color:var(--navy); transform:skewX(-14deg) scale(1.15); }
.tl-card{
  margin-left:38px; background:#fff; border:1px solid var(--line); padding:26px 28px; position:relative;
  transition:box-shadow .35s var(--ease);
}
.tl-card::before{
  content:""; position:absolute; left:-38px; top:36px; width:38px; height:3px; background:var(--lav-deep); transition:background-color .35s;
}
.tl-item.is-passed .tl-card::before{ background:var(--green-deep); }
.tl-card:hover{ box-shadow:0 18px 40px rgba(8,19,107,.14); }
.tl-card h3{ font-size:1.35rem; }
.tl-card p:last-child{ margin-bottom:0; }
.tl-empty{ margin:0 0 0 calc(var(--date-w) + 38px); font-weight:700; color:var(--muted); }
@media (max-width:700px){
  .timeline{ --date-w:10px; }
  .tl-item{ grid-template-columns:1fr; }
  .tl-date{ text-align:left; padding:0 0 8px 40px; }
  .tl-marker{ top:2px; }
  .tl-card{ margin-left:40px; }
  .tl-card::before{ display:none; }
  .tl-empty{ margin-left:40px; }
}

/* ---------- Filter chips (timeline, gallery, press years) ---------- */
.filter-row{ display:flex; flex-wrap:wrap; gap:12px; margin:0 0 38px; }
.filter-btn{
  position:relative; isolation:isolate; min-height:44px; padding:.55em 1.4em; font:800 .95rem var(--body); color:var(--navy);
  background:none; border:0; cursor:pointer; transition:color .25s var(--ease);
}
.filter-btn::before{
  content:""; position:absolute; inset:0; z-index:-1; transform:skewX(var(--slant)); background:#fff;
  box-shadow:inset 0 0 0 2px var(--navy); transition:background-color .25s var(--ease);
}
.filter-btn:hover::before{ background:var(--lav-deep); }
.filter-btn[aria-pressed="true"]{ color:#fff; }
.filter-btn[aria-pressed="true"]::before{ background:var(--navy); box-shadow:none; }
.is-hidden{ display:none !important; }
.filter-empty{ margin:0; font-weight:700; color:var(--muted); }

/* =====================================================================
   TABS (About credentials + Thrive Plan pillars)
   ===================================================================== */
.tabs [role="tablist"]{ display:flex; flex-wrap:wrap; gap:12px; margin:0 0 32px; }
.tabs:not(.is-ready) [role="tablist"]{ display:none; }
.tab{
  position:relative; isolation:isolate; min-height:48px; padding:.6em 1.7em; font:800 1rem var(--body); color:var(--navy);
  background:none; border:0; cursor:pointer; transition:color .25s var(--ease);
}
.tab::before{
  content:""; position:absolute; inset:0; z-index:-1; transform:skewX(var(--slant)); background:#fff;
  box-shadow:inset 0 0 0 2px var(--navy); transition:background-color .25s var(--ease);
}
.tab:hover::before{ background:var(--lav-deep); }
.tab[aria-selected="true"]{ color:#fff; }
.tab[aria-selected="true"]::before{ background:var(--navy); box-shadow:none; }
.tab[aria-selected="true"]::after{
  content:""; position:absolute; left:14%; right:14%; bottom:-7px; height:5px; background:var(--green-deep); transform:skewX(var(--slant));
}
.tabs.is-ready .panel-title{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.tabs:not(.is-ready) .panel + .panel{ margin-top:36px; }
.panel{ animation:panelIn .5s var(--ease); }
@keyframes panelIn{ from{ opacity:0; transform:translateX(26px); } to{ opacity:1; transform:none; } }

.facts-list{ list-style:none; margin:0; padding:0; display:grid; gap:0; }
.facts-list li{
  position:relative; padding:18px 0 18px 30px; border-bottom:1px solid var(--line); font-size:1.08rem;
}
.facts-list li::before{
  content:""; position:absolute; left:2px; top:1.55em; width:12px; height:12px; background:var(--green-deep); transform:skewX(-14deg);
}
.facts-list strong{ color:var(--navy); }

/* Thrive Plan pillars */
.pillars [role="tablist"]{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-bottom:0; }
.pillar{
  position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:14px; text-align:left; cursor:pointer;
  padding:28px 24px 26px; min-height:178px; color:var(--navy); background:#fff; border:0;
  border-right:1px solid var(--line); border-bottom:6px solid var(--lav-deep);
  font:400 clamp(1.3rem,1.9vw,1.7rem)/1.08 var(--display);
  transition:background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.pillar:last-child{ border-right:0; }
.pillar svg{ width:44px; height:44px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; transition:transform .4s var(--ease); }
.pillar:hover{ background:var(--lav); }
.pillar:hover svg{ transform:translateY(-4px) rotate(-4deg); }
.pillar[aria-selected="true"]{ background:var(--navy); color:#fff; border-bottom-color:var(--green); }
.pillar[aria-selected="true"] svg{ stroke:var(--green); }
.pillars .panel-wrap{ background:var(--lav); padding:clamp(28px,5vw,64px); }
@media (max-width:900px){
  .pillars [role="tablist"]{ grid-template-columns:1fr 1fr; }
  .pillar{ min-height:140px; border-bottom:6px solid var(--lav-deep); }
  .pillar:nth-child(2n){ border-right:0; }
}
@media (max-width:480px){
  .pillars [role="tablist"]{ grid-template-columns:1fr; }
  .pillar{ flex-direction:row; align-items:center; min-height:0; border-right:0; }
}

.statement{
  position:relative; isolation:isolate; overflow:hidden; background:var(--navy); color:#e4e6ff;
  padding:clamp(30px,5vw,64px);
}
.statement p{ font-size:clamp(1.15rem,1.7vw,1.4rem); line-height:1.6; margin:0; max-width:58ch; position:relative; z-index:2; }
.statement .seven{ right:-6%; top:-20%; width:min(46%,380px); opacity:.55; z-index:1; }

.checks{ list-style:none; padding:0; margin:0 0 1.2em; }
.checks li{ position:relative; padding-left:2.3em; margin-bottom:.8em; }
.checks li::before{
  content:""; position:absolute; left:0; top:.32em; width:1.35em; height:1.35em; background:var(--green-deep);
  clip-path:polygon(12% 50%,0 64%,36% 100%,100% 24%,88% 10%,36% 72%);
}
.checks--dark li::before{ background:var(--green); }

/* CAB: big five */
.five{ display:grid; grid-template-columns:auto 1fr; gap:clamp(20px,4vw,56px); align-items:center; margin-bottom:clamp(36px,5vw,60px); }
.five-num{
  position:relative; isolation:isolate; font-family:var(--display); line-height:.8;
  font-size:clamp(8rem,19vw,15rem); color:var(--navy); padding:0 .12em 0 .02em;
}
.five-num::before{
  content:""; position:absolute; z-index:-1; left:-4%; right:-14%; top:14%; bottom:-6%; background:var(--green);
  clip-path:polygon(14% 0,100% 0,86% 100%,0 100%);
}
.five-text{ font-family:var(--display); font-size:clamp(1.8rem,3.4vw,2.8rem); line-height:1.1; color:var(--navy); margin:0; max-width:18ch; }
@media (max-width:620px){ .five{ grid-template-columns:1fr; } }
.apply-cards{ display:grid; gap:22px; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); list-style:none; margin:0 0 34px; padding:0; }
.apply-cards li{ position:relative; background:#fff; padding:26px 24px 24px 24px; border-top:6px solid var(--navy); font-weight:600; transition:transform .35s var(--ease), box-shadow .35s var(--ease); }
.apply-cards li:hover{ transform:translateY(-5px); box-shadow:0 18px 36px rgba(8,19,107,.14); border-top-color:var(--green-deep); }
.note-strip{ background:var(--navy); color:#fff; padding:22px 28px; font-weight:700; font-size:1.15rem; position:relative; clip-path:polygon(0 0,100% 0,calc(100% - 22px) 100%,0 100%); max-width:none; margin:0; }

.jump{
  position:sticky; top:var(--header-h); z-index:150; background:#fff; border-bottom:1px solid var(--line);
  box-shadow:0 6px 18px rgba(8,19,107,.06);
}
.jump ul{ display:flex; gap:6px; list-style:none; margin:0; padding:0; overflow-x:auto; scrollbar-width:thin; }
.jump a{
  position:relative; display:block; padding:16px 14px; white-space:nowrap; font-weight:700; font-size:.97rem;
  color:var(--navy); text-decoration:none;
}
.jump a::after{
  content:""; position:absolute; left:14px; right:14px; bottom:8px; height:4px; background:var(--green-deep);
  transform:skewX(-24deg) scaleX(0); transform-origin:left; transition:transform .35s var(--ease);
}
.jump a:hover::after,.jump a[aria-current="true"]::after{ transform:skewX(-24deg) scaleX(1); }

.pull-quote{
  margin:clamp(22px,3vw,34px) 0 0; padding:4px 0 4px 26px; max-width:34ch; position:relative;
  font-size:clamp(1.25rem,2vw,1.6rem); font-weight:700; font-style:italic; color:#fff; line-height:1.4;
}
.pull-quote::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:7px; background:var(--green); transform:skewX(-10deg); }

.quote-band{
  position:relative; isolation:isolate; overflow:hidden; background:var(--navy); color:#fff;
  padding:clamp(56px,8vw,112px) 0;
}
.quote-band .seven{ right:-4%; bottom:-30%; width:min(52vw,640px); z-index:-1; }
.quote-band .title{ color:#fff; }
.quote-band .title::after{ background:var(--green); }
.quote-band .ph-block{ max-width:640px; }

/* =====================================================================
   GALLERY
   ===================================================================== */
.gallery-grid{ columns:4 230px; column-gap:18px; }
.gallery-item{
  display:block; width:100%; margin:0 0 18px; padding:0; border:0; background:none; cursor:pointer;
  break-inside:avoid; position:relative; overflow:hidden;
}
.gallery-item:nth-child(3n+1){ aspect-ratio:3/4; }
.gallery-item:nth-child(3n+2){ aspect-ratio:1/1; }
.gallery-item:nth-child(3n){ aspect-ratio:4/3; }
.gallery-item .ph-block{
  height:100%; margin:0; display:flex; align-items:center; justify-content:center; text-align:center;
  transition:transform .6s var(--ease);
}
.gallery-item:hover .ph-block,.gallery-item:focus-visible .ph-block{ transform:scale(1.06); }
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.gallery-item:hover img{ transform:scale(1.06); }
.gallery-item::after{
  content:""; position:absolute; left:0; bottom:0; height:8px; width:0; background:var(--green); transform:skewX(-24deg); transform-origin:left;
  transition:width .45s var(--ease);
}
.gallery-item:hover::after,.gallery-item:focus-visible::after{ width:100%; }

.lightbox{
  position:fixed; inset:0; z-index:400; display:flex; align-items:center; justify-content:center; padding:24px;
  background:rgba(5,12,71,.92); opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s; --focus:var(--green);
}
.lightbox.open{ opacity:1; visibility:visible; }
.lightbox-inner{
  position:relative; width:100%; max-width:860px; background:#fff; padding:28px;
  transform:scale(.93) translateY(14px); transition:transform .4s var(--ease);
}
.lightbox.open .lightbox-inner{ transform:none; }
.lightbox-inner .ph-block{ margin:0; min-height:260px; display:flex; align-items:center; justify-content:center; text-align:center; }
.lightbox-inner img{ width:100%; max-height:70vh; object-fit:contain; }
.lb-btn{
  position:absolute; background:var(--navy); color:#fff; border:0; min-width:48px; min-height:48px; padding:0 18px; font:800 1rem var(--body); cursor:pointer;
  transition:background-color .2s;
}
.lb-btn:hover{ background:var(--green-ink); }
.lightbox-close{ top:-56px; right:0; }
.lightbox-prev,.lightbox-next{ top:50%; margin-top:-24px; }
.lightbox-prev{ left:-24px; }
.lightbox-next{ right:-24px; }
@media (max-width:700px){ .lightbox-prev{ left:0; } .lightbox-next{ right:0; } .lightbox-inner{ padding:56px 16px 16px; } }

/* =====================================================================
   RESOURCES, CONTACT, FORMS
   ===================================================================== */
.res-grid{ display:grid; gap:22px; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); }
.resource-card{
  position:relative; isolation:isolate; overflow:hidden; display:flex; gap:22px; align-items:center; padding:28px;
  background:#fff; border:2px solid var(--navy); text-decoration:none; color:var(--ink);
  transition:color .35s var(--ease);
}
.resource-card::before{
  content:""; position:absolute; inset:0; z-index:-1; background:var(--navy); transform:translateX(-102%) skewX(var(--slant));
  transform-origin:left; transition:transform .5s var(--ease);
}
.resource-card:hover,.resource-card:focus-visible{ color:#e4e6ff; --focus:var(--green); }
.resource-card:hover::before,.resource-card:focus-visible::before{ transform:translateX(0) skewX(var(--slant)); }
.resource-card:hover h3,.resource-card:focus-visible h3{ color:#fff; }
.resource-icon{
  flex:none; width:64px; height:64px; display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-size:1.9rem; color:var(--navy-deep); background:var(--green);
  clip-path:polygon(18% 0,100% 0,82% 100%,0 100%);
}
.resource-card h3{ margin:0 0 .15em; font-size:1.3rem; transition:color .35s; }
.resource-card p{ margin:0; }

.contact-layout{ display:grid; gap:0; grid-template-columns:minmax(0,1fr); box-shadow:0 30px 70px rgba(8,19,107,.18); }
@media (min-width:960px){ .contact-layout{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); } }
.contact-panel{ position:relative; isolation:isolate; overflow:hidden; background:var(--navy); color:#e4e6ff; padding:clamp(32px,5vw,64px); --focus:var(--green); }
.contact-panel h2,.contact-panel h3{ color:#fff; }
.contact-panel a{ color:#fff; }
.contact-panel .seven{ right:-20%; bottom:-24%; width:70%; opacity:.9; z-index:-1; }
.contact-panel .ph-block{ background:rgba(255,244,212,.96); }
.contact-line{ display:grid; grid-template-columns:auto 1fr; gap:18px; margin-bottom:24px; align-items:start; }
.contact-line svg{ width:28px; height:28px; stroke:var(--green); fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; margin-top:3px; }
.contact-line address, .contact-line div{ line-height:1.6; }
.form-card{ position:relative; background:#fff; padding:clamp(32px,5vw,64px); }
.form-card::before{ content:""; position:absolute; top:0; left:0; width:120px; height:10px; background:var(--green-deep); transform:skewX(-24deg); transform-origin:left; }
.form-card h2{ font-size:clamp(1.9rem,3vw,2.5rem); }

form{ max-width:640px; }
.form-row{ margin-bottom:22px; }
.form-row label{ display:block; font-weight:800; margin-bottom:7px; color:var(--navy); }
.required-mark{ color:var(--danger); }
.form-row input,.form-row select,.form-row textarea{
  width:100%; min-height:52px; padding:12px 14px; font:500 1rem var(--body); color:var(--ink);
  background:#fff; border:2px solid var(--navy); border-radius:0;
  transition:border-color .2s, box-shadow .25s var(--ease), background-color .2s;
}
.form-row textarea{ min-height:140px; resize:vertical; }
.form-row input:hover,.form-row select:hover,.form-row textarea:hover{ background:var(--lav); }
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
  outline:0; border-color:var(--green-ink); box-shadow:6px 6px 0 var(--green); background:#fff;
}
.form-row [aria-invalid="true"]{ border-color:var(--danger); }
.field-error{ margin:7px 0 0; color:var(--danger); font-weight:700; font-size:.95rem; }
.field-error::before{ content:"!"; display:inline-grid; place-items:center; width:1.25em; height:1.25em; margin-right:.5em; background:var(--danger); color:#fff; font-weight:800; border-radius:50%; font-size:.85em; }
.form-hint{ margin:6px 0 0; font-size:.92rem; color:var(--muted); }
.form-confirm{
  display:none; margin:0 0 24px; padding:16px 20px; background:#e3f8ec; color:#0b4a24; font-weight:800; border-left:8px solid var(--green-ink);
}
.form-confirm.show{ display:block; animation:panelIn .5s var(--ease); }
.form-confirm:focus{ outline:3px solid var(--green-ink); outline-offset:3px; }

/* Newsletter band (green) */
.newsletter-band{ text-align:center; }
.newsletter-band .title{ color:var(--navy-deep); }
.newsletter-band .ph-block{ max-width:640px; margin:0 auto 28px; }
.newsletter-form{ display:flex; flex-wrap:wrap; gap:16px; justify-content:center; max-width:none; }
.newsletter-form input{
  min-width:min(100%,320px); min-height:52px; padding:12px 16px; font:500 1rem var(--body); border:2px solid var(--navy-deep); background:#fff; color:var(--ink);
}
.newsletter-form input:focus{ outline:3px solid var(--navy-deep); outline-offset:2px; }
.newsletter-band .form-confirm{ max-width:640px; margin:20px auto 0; text-align:left; }
.newsletter-band .field-error{ color:#7a0f09; text-align:center; flex-basis:100%; }
.newsletter-band .field-error::before{ background:#7a0f09; }

.signup-wrap{ display:flex; justify-content:center; }
.signup-card{ position:relative; background:#fff; padding:clamp(28px,5vw,60px); width:100%; max-width:700px; box-shadow:0 30px 70px rgba(5,12,71,.35); }
.signup-card::before{ content:""; position:absolute; top:0; left:0; width:120px; height:10px; background:var(--green-deep); transform:skewX(-24deg); transform-origin:left; }

/* =====================================================================
   FOOTER
   ===================================================================== */
.site-footer{ position:relative; isolation:isolate; overflow:hidden; background:var(--navy-deep); color:#c9ceff; padding:clamp(56px,7vw,96px) 0 28px; --focus:var(--green); }
.site-footer .seven{ right:-6%; bottom:-30%; width:min(44vw,520px); z-index:-1; }
.footer-grid{ display:grid; gap:40px; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr); margin-bottom:48px; }
@media (max-width:980px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }
.site-footer h3{ color:#fff; font-family:var(--display); font-weight:400; font-size:1.35rem; margin-bottom:.8em; letter-spacing:.01em; }
.site-footer a{ color:#c9ceff; text-decoration:none; transition:color .2s; }
.site-footer a:hover{ color:var(--green); text-decoration:underline; }
.footer-list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.footer-seal{ border:2px dashed rgba(255,255,255,.35); padding:16px; background:rgba(255,255,255,.04); }
.footer-seal.ph{ display:block; background:repeating-linear-gradient(135deg,#fff4d4,#fff4d4 7px,#ffeaa8 7px,#ffeaa8 14px); border:1px dashed #b98a2f; }
.footer-bottom{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 24px; padding-top:22px;
  border-top:1px solid rgba(255,255,255,.18); font-size:.92rem; color:#aab1ee;
}

/* =====================================================================
   SITEMAP + SIMPLE CONTENT
   ===================================================================== */
.sitemap-grid{ display:grid; gap:34px; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); }
.sitemap-grid h2{ font-size:1.7rem; }
.sitemap-grid ul{ list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.sitemap-grid a{ display:block; padding:10px 0; font-weight:700; text-decoration:none; border-bottom:1px solid var(--line); transition:padding-left .3s var(--ease), color .2s; }
.sitemap-grid a:hover{ padding-left:14px; color:var(--green-ink); }
.prose-narrow{ max-width:760px; }
.prose-narrow p{ font-size:1.15rem; }

/* =====================================================================
   MOTION — only for people who haven't asked for reduced motion.
   Hidden "before" states live ONLY here, so with reduced motion or
   without JavaScript everything is simply visible.
   ===================================================================== */
@media (prefers-reduced-motion:no-preference){
  /* One orchestrated entrance: the hero (and a lighter version on page headers) */
  .hero h1 .line > span{ transform:translateY(112%); animation:lineUp .95s var(--ease) forwards; }
  .hero h1 .line:nth-child(1) > span{ animation-delay:.12s; }
  .hero h1 .line:nth-child(2) > span{ animation-delay:.24s; }
  .hero h1 .line:nth-child(3) > span{ animation-delay:.36s; }
  .hero .lede, .hero-text, .hero .btn-row{ opacity:0; animation:fadeUp .8s var(--ease) forwards; }
  .hero .lede{ animation-delay:.62s; }
  .hero-text{ animation-delay:.74s; }
  .hero .btn-row{ animation-delay:.86s; }
  .hero-art img{ opacity:0; transform:translateY(46px); animation:rise 1.1s .5s var(--ease) forwards; }

  .seven i{ animation:sevenIn 1.1s var(--ease) both; }
  .seven .s-bar{ --from:translateX(18%); animation-delay:.15s; }
  .seven .s-stem{ --from:translate(10%,-8%); animation-delay:.3s; }
  .seven .s-line{ --from:translate(10%,-8%); animation-delay:.42s; }
  .seven .s-shade{ --from:translateX(14%); animation-delay:.5s; }

  .page-head .crumbs, .page-head h1, .page-head .lede, .page-head .btn-row, .page-head .pull-quote{ opacity:0; animation:fadeUp .8s var(--ease) forwards; }
  .page-head h1{ animation-delay:.1s; }
  .page-head .lede, .page-head .pull-quote{ animation-delay:.22s; }
  .page-head .btn-row{ animation-delay:.34s; }

  /* Scroll-triggered (class .in added by main.js) — used sparingly */
  .js .title:not(.in)::after{ transform:skewX(-24deg) scaleX(0); }
  .js .frame:not(.in) > .ph-block, .js .frame:not(.in) > img{ clip-path:inset(0 100% 0 0); }
  .js .frame > .ph-block, .js .frame > img{ transition:clip-path 1s var(--ease); clip-path:inset(0 0 0 0); }
  .js .frame:not(.in)::before{ transform:translateX(30px); opacity:0; }
  .js .stagger:not(.in) > *{ opacity:0; transform:translateY(34px); }
  .js .stagger > *{ transition:opacity .7s var(--ease), transform .7s var(--ease), box-shadow .35s var(--ease); }
  .js .stagger > :nth-child(2){ transition-delay:.1s, .1s, 0s; }
  .js .stagger > :nth-child(3){ transition-delay:.2s, .2s, 0s; }
  .js .stagger > :nth-child(4){ transition-delay:.3s, .3s, 0s; }
  .js .stagger > :nth-child(n+5){ transition-delay:.4s, .4s, 0s; }
  .js .stagger.in > *:hover{ transition-delay:0s; }
}
@keyframes lineUp{ to{ transform:translateY(0); } }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:none; } }
@keyframes rise{ to{ opacity:1; transform:none; } }
@keyframes sevenIn{ from{ opacity:0; transform:var(--from,none); } to{ opacity:1; transform:none; } }

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

/* ---------- Additions ---------- */
.eyebrow{ font-weight:800; font-size:.95rem; letter-spacing:.08em; text-transform:uppercase; color:var(--green); margin:0 0 1em; }
.kicker{ font-weight:800; font-size:.92rem; letter-spacing:.1em; text-transform:uppercase; color:var(--green-ink); margin:0 0 .6em; }
.sec--navy .kicker,.quote-band .kicker{ color:var(--green); }
.sec--green .kicker{ color:var(--navy-deep); }
.nav-cta{ flex:none; }
.footer-grid .brand-logo{ height:48px; }
.page-head .pull-quote{ max-width:36ch; }
.stack{ display:grid; gap:34px; }

.sec--lav .stat{ background:#fff; }
.primary-nav{ gap:12px; }
.nav-cta{ min-height:44px; padding:.65em 1.6em; }
.header-row{ gap:20px; }
.sec{ overflow-x:clip; } html{ overflow-x:clip; }
.contact-panel .seven{ opacity:.3; }
