/* ============================================================
   Amir Institute — css/site.css
   Shared stylesheet: loaded by all seven pages, first.
   Design tokens live in :root at the top — change a colour
   there and the whole site follows. Each page then loads its
   own css/<page>.css for the sections only it uses.
   ============================================================ */
/* ═══════════════ TOKENS ═══════════════ */
:root{
  --green-900:#07382D; --green-850:#0A4432; --green-800:#0F5132;
  --green-700:#15663E; --green-600:#2E7D4F; --green-100:#E7EFE8;
  --gold:#C9972E; --gold-light:#E0B45F; --gold-soft:#F6E3B6; --gold-dark:#7E5E17;
  --tan:#EADFCB; --cream:#FAF8F0; --sand:#EADFCB; --white:#FFF;
  --ink:#2E3A2F; --body:#4C5A4D; --muted:#6B7A66;
  --line:rgba(7,56,45,.12);
  --shadow-sm:0 2px 8px rgba(7,56,45,.06);
  --shadow:0 12px 32px rgba(7,56,45,.10);
  --shadow-lg:0 28px 64px rgba(7,56,45,.16);
  --r-sm:10px; --r:16px; --r-lg:24px; --r-xl:32px;
  --maxw:1200px; --pad:clamp(16px,4vw,32px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--body);
  font-family:'Montserrat',system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:1.0625rem;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:'Montserrat',system-ui,sans-serif;color:var(--ink);margin:0;line-height:1.14;letter-spacing:-.015em;font-weight:600}
h1{font-size:clamp(2.3rem,5.2vw,3.95rem);font-weight:700}
h2{font-size:clamp(1.9rem,3.8vw,2.9rem)}
h3{font-size:clamp(1.2rem,2vw,1.55rem)}
h4{font-size:1.05rem;font-family:'Montserrat',sans-serif;font-weight:700;letter-spacing:0}
p{margin:0 0 1em} p:last-child{margin-bottom:0}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.sec{padding:clamp(60px,7.5vw,108px) 0}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:.73rem;font-weight:800;
  letter-spacing:.17em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:15px}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--gold);border-radius:2px}
.eyebrow.on-dark{color:var(--gold-light)}
.center{text-align:center}
.center .eyebrow::before{display:none}.center .eyebrow{gap:0}
.lede{font-size:clamp(1.04rem,1.5vw,1.18rem);line-height:1.66}
.sec-head{max-width:720px;margin:0 auto 46px}
/* ═══════════════ BUTTONS ═══════════════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-weight:700;font-size:.93rem;padding:15px 30px;border-radius:999px;
  border:2px solid transparent;cursor:pointer;transition:.22s cubic-bezier(.4,0,.2,1);
  white-space:nowrap;line-height:1;font-family:inherit}
.btn svg{width:17px;height:17px;flex:none}
.btn-gold{background:var(--gold);color:#241705;box-shadow:0 8px 22px rgba(201,151,46,.34)}
.btn-gold:hover{background:var(--gold-light);transform:translateY(-2px)}
.btn-green{background:var(--green-800);color:#fff}
.btn-green:hover{background:var(--green-700);transform:translateY(-2px)}
.btn-ghost{border-color:rgba(255,255,255,.45);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
.btn-outline{border-color:var(--green-800);color:var(--green-800)}
.btn-outline:hover{background:var(--green-800);color:#fff}
.btn-sm{padding:11px 22px;font-size:.85rem}
/* ═══════════════ EMBLEM ═══════════════ */
.emblem{width:64px;height:64px;margin:0 auto 18px;color:var(--gold);display:block}
.emblem.lg{width:92px;height:92px}
/* ═══════════════ TOP BAR ═══════════════ */
.topbar{background:var(--green-900);color:#CFDCCB;font-size:.83rem}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;flex-wrap:wrap}
.topbar a:hover{color:var(--gold-light)}
.tb-left{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
.tb-item{display:inline-flex;align-items:center;gap:7px}
.tb-item svg{width:14px;height:14px;opacity:.75;flex:none}
.tb-social{display:flex;gap:6px}
.tb-social a{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.09);transition:.2s}
.tb-social a:hover{background:var(--gold);color:var(--green-900)}
.tb-social svg{width:13px;height:13px}
/* ═══════════════ HEADER ═══════════════ */
.hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;gap:20px;min-height:80px}
.brand{display:flex;align-items:center;gap:13px;margin-right:auto}
.brand img{width:52px;height:52px;border-radius:50%;object-fit:cover}
.brand-name{font-family:'Montserrat',system-ui,sans-serif;font-weight:700;font-size:1.17rem;color:var(--green-800);display:block;line-height:1.1}
.brand-tag{font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:var(--gold-dark);font-weight:700;white-space:nowrap}
.nav{display:flex;gap:2px;align-items:center}
.nav a{padding:9px 11px;font-size:.88rem;font-weight:600;color:var(--ink);border-radius:8px;transition:.2s;position:relative;white-space:nowrap}
.nav a:hover{color:var(--green-700);background:var(--green-100)}
.nav a.active::after{content:"";position:absolute;left:11px;right:11px;bottom:3px;height:2px;background:var(--gold);border-radius:2px}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);background:#fff;border-radius:11px;cursor:pointer;place-items:center}
.burger span,.burger span::before,.burger span::after{display:block;width:19px;height:2px;background:var(--green-800);border-radius:2px}
.burger span{position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0}
.burger span::before{top:-6px}.burger span::after{top:6px}
.mnav{display:none;border-top:1px solid var(--line);background:#fff;padding:12px var(--pad) 22px}
.mnav.open{display:block}
.mnav a{display:block;padding:12px 4px;font-weight:600;border-bottom:1px solid var(--line);color:var(--ink)}
.mnav .btn{width:100%;margin-top:16px}
/* ═══════════════ HERO ═══════════════ */
.hero{position:relative;background:linear-gradient(140deg,#0A4432,#07382D 58%,#0A4432);color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(880px 520px at 84% 12%,rgba(201,151,46,.22),transparent 62%),
             radial-gradient(700px 480px at 4% 96%,rgba(46,125,79,.42),transparent 60%)}
.hero::after{content:"";position:absolute;inset:0;opacity:.055;
  background-image:radial-gradient(#E0B45F 1px,transparent 1px);background-size:26px 26px}
.hero-inner{position:relative;padding:clamp(56px,7vw,96px) 0 clamp(112px,12vw,156px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:58px;align-items:center}
.hero h1{color:#fff;max-width:15ch}
.hero h1 em{font-style:normal;color:var(--gold-light)}
.hero-kicker{display:inline-flex;align-items:center;gap:9px;background:rgba(201,151,46,.17);
  border:1px solid rgba(224,180,95,.4);color:var(--gold-light);padding:8px 18px 8px 13px;
  border-radius:999px;font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:24px}
.hero-kicker svg{width:15px;height:15px}
.hero p.lede{color:#CFDCCB;max-width:52ch;margin:22px 0 32px}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.hero-trust{display:flex;gap:26px;flex-wrap:wrap;margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.13)}
.ht{display:flex;gap:10px;align-items:center;font-size:.86rem;color:#BCCDB8}
.ht svg{width:18px;height:18px;color:var(--gold-light);flex:none}

/* hero photo collage */
.collage{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:14px;position:relative}
.cim{position:relative;border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(140deg,#15663E,#0A4432);
  box-shadow:0 20px 48px rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.09)}
.cim img{width:100%;height:100%;object-fit:cover}
.cim.a{grid-column:1;aspect-ratio:3/4}
.cim.b{grid-column:2;aspect-ratio:1/1;margin-top:26px}
.cim.c{grid-column:1/-1;aspect-ratio:16/7}
.collage-tag{position:absolute;right:-10px;top:-16px;z-index:4;background:var(--gold);color:#241705;
  border-radius:var(--r);padding:13px 17px;box-shadow:0 14px 30px rgba(0,0,0,.3);text-align:center;line-height:1.1}
.collage-tag b{font-family:'Montserrat',system-ui,sans-serif;font-size:1.5rem;display:block}
.collage-tag span{font-size:.64rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
/* ═══════════════ STAT BAND ═══════════════ */
.statband{position:relative;margin-top:-72px;z-index:5}
.statband .inner{background:#fff;border-radius:var(--r-xl);box-shadow:var(--shadow-lg);
  display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;border:1px solid var(--line)}
.stat{padding:32px 24px;text-align:center;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat-ic{width:44px;height:44px;margin:0 auto 13px;display:grid;place-items:center;border-radius:13px;background:var(--sand);color:var(--gold-dark)}
.stat-ic svg{width:23px;height:23px}
.stat-n{font-family:'Montserrat',system-ui,sans-serif;font-size:clamp(1.85rem,3vw,2.4rem);font-weight:700;color:var(--green-800);line-height:1}
.stat-l{font-size:.84rem;color:var(--muted);margin-top:6px;font-weight:600;line-height:1.4}
/* ═══════════════ REALITY ═══════════════ */
.reality{background:var(--cream)}
.real-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1000px;margin:0 auto 42px}
.real-item{background:#fff;border-radius:var(--r-lg);padding:28px 26px;box-shadow:var(--shadow-sm);border-top:4px solid var(--gold)}
.real-item .n{font-family:'Montserrat',system-ui,sans-serif;font-size:1.35rem;font-weight:700;color:var(--gold);opacity:.55;display:block;margin-bottom:10px}
.real-item p{font-size:1.02rem;color:var(--ink);font-weight:500;line-height:1.55;margin:0}
.punch{max-width:840px;margin:0 auto;text-align:center;background:var(--green-800);color:#C3D4C4;
  border-radius:var(--r-lg);padding:clamp(30px,4vw,46px);position:relative;overflow:hidden}
.punch::after{content:"";position:absolute;inset:0;background:radial-gradient(540px 300px at 50% -20%,rgba(201,151,46,.3),transparent 70%)}
.punch>*{position:relative}
.punch h3{color:#fff;margin-bottom:14px}
.punch strong{color:var(--gold-light)}
/* ═══════════════ DOTS ═══════════════ */
.diff-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:46px;align-items:end;margin-bottom:46px}
.dots{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.dot-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 24px;transition:.28s;position:relative;overflow:hidden}
.dot-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:.3s}
.dot-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:transparent}
.dot-card:hover::before{transform:scaleY(1)}
.dc-ic{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:var(--green-100);color:var(--green-700);margin-bottom:17px}
.dc-ic svg{width:25px;height:25px}
.dot-card .tag{display:block;margin-bottom:9px;font-size:.68rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--gold-dark)}
.dot-card h3{font-size:1.04rem;margin-bottom:8px}
.dot-card p{font-size:.92rem;line-height:1.62;margin:0}
/* ═══════════════ PHOTO MOSAIC ═══════════════ */
.mosaic-sec{background:var(--white);padding-bottom:clamp(60px,7.5vw,108px)}
.mosaic{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:150px;gap:14px}
.mz{border-radius:var(--r-lg);overflow:hidden;position:relative;background:linear-gradient(140deg,var(--green-100),var(--sand));box-shadow:var(--shadow-sm)}
.mz img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.mz:hover img{transform:scale(1.07)}
.mz::after{content:attr(data-cap);position:absolute;left:0;right:0;bottom:0;padding:26px 18px 14px;
  font-size:.79rem;font-weight:700;color:#fff;letter-spacing:.04em;
  background:linear-gradient(transparent,rgba(7,56,45,.82));opacity:0;transition:.3s}
.mz:hover::after{opacity:1}
.mz.s1{grid-area:1/1/3/3}
.mz.s2{grid-area:1/3/2/5}
.mz.s3{grid-area:1/5/3/7}
.mz.s4{grid-area:2/3/3/5}
.mz.s5{grid-area:3/1/4/3}
.mz.s6{grid-area:3/3/4/5}
.mz.s7{grid-area:3/5/4/7}
/* ═══════════════ PREVENTION ═══════════════ */
.prev{background:var(--green-900);color:#C3D4C4;position:relative;overflow:hidden}
.prev::before{content:"";position:absolute;inset:0;opacity:.55;
  background:radial-gradient(740px 460px at 12% 0%,rgba(46,125,79,.42),transparent 62%),
             radial-gradient(620px 400px at 92% 92%,rgba(201,151,46,.2),transparent 62%)}
.prev .wrap{position:relative}
.prev h2{color:#fff}
.prev-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:56px;align-items:center}
.pill{display:flex;gap:16px;align-items:flex-start;padding:19px 21px;border-radius:var(--r);
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);transition:.25s;margin-bottom:13px}
.pill:hover{background:rgba(255,255,255,.1);border-color:rgba(224,180,95,.4);transform:translateX(5px)}
.pill-ic{width:40px;height:40px;border-radius:12px;background:rgba(201,151,46,.2);color:var(--gold-light);display:grid;place-items:center;flex:none}
.pill-ic svg{width:20px;height:20px}
.pill strong{display:block;color:#fff;font-size:.99rem;margin-bottom:2px}
.pill span{font-size:.9rem;line-height:1.55;display:block}
.prev-note{margin-top:28px;padding:18px 24px;border-left:3px solid var(--gold);
  font-family:'Montserrat',system-ui,sans-serif;font-size:clamp(1.1rem,1.8vw,1.4rem);color:var(--gold-light);line-height:1.38}
/* ═══════════════ SCHOOL ═══════════════ */
.school-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:58px;align-items:center}
.photo-stack{position:relative;padding-bottom:48px;padding-right:40px}
.photo-stack .p1{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/3.2;background:linear-gradient(140deg,var(--green-100),var(--sand))}
.photo-stack .p1 img,.photo-stack .p2 img{width:100%;height:100%;object-fit:cover}
.photo-stack .p2{position:absolute;right:0;bottom:0;width:50%;border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-lg);border:6px solid #fff;aspect-ratio:1/1;background:linear-gradient(140deg,var(--sand),var(--gold-soft))}
.photo-badge{position:absolute;left:-12px;top:26px;background:var(--gold);color:#241705;border-radius:var(--r);
  padding:15px 19px;box-shadow:var(--shadow);text-align:center;z-index:3}
.photo-badge b{display:block;font-family:'Montserrat',system-ui,sans-serif;font-size:1.65rem;line-height:1}
.photo-badge span{font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;display:block;margin-top:3px}
.quote-card{margin-top:30px;background:var(--sand);border-radius:var(--r-lg);padding:28px 30px;position:relative}
.quote-card svg.q{position:absolute;top:20px;left:24px;width:34px;height:34px;color:var(--gold);opacity:.3}
.quote-card p{font-family:'Montserrat',system-ui,sans-serif;font-size:1.1rem;line-height:1.52;color:var(--ink);font-style:italic;padding-left:46px;margin:0}
/* ═══════════════ WEEK TIMELINE ═══════════════ */
.week{background:var(--sand);position:relative;overflow:hidden}
.week::before{content:"";position:absolute;top:-140px;left:-100px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,151,46,.13),transparent 70%)}
.week .wrap{position:relative}
.week-rail{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:8px}
.week-rail::before{content:"";position:absolute;left:8%;right:8%;top:30px;height:3px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold),var(--green-600));border-radius:3px;z-index:0}
.day{position:relative;z-index:1;text-align:center}
.day-node{width:62px;height:62px;margin:0 auto 18px;border-radius:50%;background:#fff;border:3px solid var(--gold);
  display:grid;place-items:center;color:var(--green-800);box-shadow:0 8px 22px rgba(7,56,45,.12);transition:.3s}
.day:hover .day-node{background:var(--green-800);color:var(--gold-light);border-color:var(--green-800);transform:translateY(-4px)}
.day-node svg{width:28px;height:28px}
.day-name{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:8px}
.day-card{background:#fff;border-radius:var(--r);padding:18px 16px;box-shadow:var(--shadow-sm);
  border:1px solid var(--line);min-height:128px;transition:.28s}
.day:hover .day-card{box-shadow:var(--shadow);transform:translateY(-3px)}
.day-card b{display:block;font-size:.96rem;color:var(--ink);margin-bottom:6px;font-family:'Montserrat',system-ui,sans-serif;font-weight:600}
.day-card p{font-size:.86rem;line-height:1.55;margin:0;color:var(--body)}
.week-foot{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:26px}
.wf{display:flex;gap:15px;align-items:flex-start;background:var(--green-800);color:#C3D4C4;border-radius:var(--r);padding:20px 22px}
.wf-ic{width:42px;height:42px;border-radius:12px;background:rgba(201,151,46,.22);color:var(--gold-light);display:grid;place-items:center;flex:none}
.wf-ic svg{width:21px;height:21px}
.wf b{display:block;color:#fff;font-size:.99rem;margin-bottom:3px}
.wf span{font-size:.89rem;line-height:1.55}
/* ═══════════════ MONTHLY EVENTS ═══════════════ */
.events{background:#fff}
.ev-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ev{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:.28s;display:flex;flex-direction:column;background:#fff}
.ev:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.ev-img{aspect-ratio:16/10;position:relative;overflow:hidden;background:linear-gradient(140deg,var(--green-100),var(--sand))}
.ev-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.ev:hover .ev-img img{transform:scale(1.06)}
.ev-date{position:absolute;left:14px;top:14px;background:var(--gold);color:#241705;border-radius:13px;
  padding:9px 13px;text-align:center;line-height:1.05;box-shadow:0 8px 20px rgba(7,56,45,.24)}
.ev-date b{display:block;font-family:'Montserrat',system-ui,sans-serif;font-size:1.25rem;font-weight:700}
.ev-date span{font-size:.6rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.ev-body{padding:22px 22px 24px;flex:1;display:flex;flex-direction:column}
.ev-body h3{font-family:'Montserrat',system-ui,sans-serif;font-size:1.08rem;font-weight:600;margin-bottom:8px}
.ev-body p{font-size:.9rem;line-height:1.6;flex:1;margin-bottom:14px}
.ev-when{display:inline-flex;align-items:center;gap:7px;font-size:.79rem;font-weight:700;color:var(--gold-dark)}
.ev-when svg{width:14px;height:14px}
/* ═══════════════ PROGRAMS ═══════════════ */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svc{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:.28s;display:flex;flex-direction:column}
.svc:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.svc-top{height:6px;background:linear-gradient(90deg,var(--green-700),var(--gold))}
.svc-body{padding:28px;flex:1;display:flex;flex-direction:column}
.svc-ic{width:50px;height:50px;border-radius:15px;background:var(--sand);color:var(--gold-dark);display:grid;place-items:center;margin-bottom:16px}
.svc-ic svg{width:25px;height:25px}
.svc h3{font-size:1.06rem;margin-bottom:9px}
.svc p{font-size:.92rem;line-height:1.63;margin:0}
.svc .who{margin-top:15px;padding-top:13px;border-top:1px dashed var(--line);font-size:.81rem;color:var(--gold-dark);font-weight:700}
/* ═══════════════ CLINICAL ═══════════════ */
.clinic{background:var(--cream)}
.clinic-card{background:#fff;border-radius:var(--r-xl);padding:clamp(30px,4vw,54px);box-shadow:var(--shadow);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);gap:48px;align-items:center;border:1px solid var(--line)}
.soon-badge{display:inline-flex;align-items:center;gap:8px;background:var(--green-100);color:var(--green-700);
  padding:7px 16px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;margin-bottom:16px}
.soon-badge i{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(201,151,46,.6);animation:pulse 2.2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(201,151,46,0)}100%{box-shadow:0 0 0 0 rgba(201,151,46,0)}}
.lead{display:flex;gap:14px;align-items:center;background:var(--cream);border-radius:var(--r);padding:14px 18px;margin-bottom:11px}
.lead-av{width:44px;height:44px;border-radius:50%;background:var(--green-800);color:var(--gold-light);
  display:grid;place-items:center;font-family:'Montserrat',system-ui,sans-serif;font-weight:700;font-size:.93rem;flex:none}
.lead b{display:block;font-size:.94rem;color:var(--ink)}
.lead span{font-size:.81rem;color:var(--muted)}
.disclaimer{margin-top:22px;font-size:.87rem;color:var(--muted);background:var(--cream);
  border-radius:var(--r-sm);padding:14px 18px;border-left:3px solid var(--tan);line-height:1.6}
/* ═══════════════ SUPPORT ═══════════════ */
.support{background:var(--green-900);color:#C3D4C4;position:relative;overflow:hidden}
.support::before{content:"";position:absolute;inset:0;background:radial-gradient(780px 480px at 80% 10%,rgba(201,151,46,.19),transparent 65%)}
.support .wrap{position:relative}
.support h2,.support h3{color:#fff}
.sup-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:52px;align-items:start}
.need{display:flex;gap:15px;align-items:flex-start;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);border-radius:var(--r);padding:17px 19px;margin-bottom:13px}
.need-ic{width:38px;height:38px;border-radius:11px;background:rgba(201,151,46,.19);color:var(--gold-light);display:grid;place-items:center;flex:none}
.need-ic svg{width:19px;height:19px}
.need b{display:block;color:#fff;font-size:.96rem;margin-bottom:2px}
.need span{font-size:.89rem;line-height:1.55}
.invest{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);padding:32px}
.invest ul{list-style:none;padding:0;margin:18px 0 0}
.invest li{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;line-height:1.55;margin-bottom:13px}
.invest li svg{width:19px;height:19px;color:var(--gold-light);flex:none;margin-top:3px}
.invest li b{color:#fff}
.invest-punch{margin-top:24px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);
  font-family:'Montserrat',system-ui,sans-serif;font-size:clamp(1.28rem,1.9vw,1.52rem);color:#fff;line-height:1.35;font-weight:600}
.invest-punch em{font-style:normal;color:var(--gold-light)}
/* ═══════════════ GIVE ═══════════════ */
.give-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.give{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 24px;transition:.28s;display:flex;flex-direction:column}
.give:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.give-ic{width:58px;height:58px;border-radius:18px;margin-bottom:18px;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--green-800),var(--green-600));color:var(--gold-light)}
.give-ic svg{width:27px;height:27px}
.give h3{font-size:1.02rem;margin-bottom:9px}
.give p{font-size:.9rem;line-height:1.6;flex:1;margin-bottom:20px}
.give .btn{width:100%}
/* ═══════════════ NEWSLETTER ═══════════════ */
.news{background:var(--gold);color:#241705;position:relative;overflow:hidden}
.news::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 400px at 10% 100%,rgba(255,255,255,.3),transparent 60%)}
.news .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:42px;align-items:center;padding-top:clamp(44px,5.5vw,64px);padding-bottom:clamp(44px,5.5vw,64px)}
.news h2{color:#241705;font-size:clamp(1.55rem,2.8vw,2.2rem)}
.news p{color:#4A3107;margin:11px 0 0}
.nform{display:flex;gap:11px;flex-wrap:wrap}
.nform input{flex:1;min-width:200px;padding:15px 20px;border-radius:999px;border:2px solid rgba(36,23,5,.16);
  font-family:inherit;font-size:.94rem;background:rgba(255,255,255,.92);color:#241705}
.nform input:focus{outline:none;border-color:#241705;background:#fff}
.nform input::placeholder{color:#8A7047}
/* ═══════════════ FOOTER ═══════════════ */
.ftr{background:var(--green-900);color:#AFC2AB;padding:clamp(52px,6.5vw,78px) 0 0;font-size:.93rem}
.ftr-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.25fr;gap:42px;padding-bottom:44px}
/* This was ".ftr h3-legacy" — a dead selector left behind when card titles
   were moved from h4 to h3. The working rule only survived in the seven
   per-page stylesheets, so pages added later had no footer heading colour
   at all and the headings came out near-invisible on the dark green. */
.ftr h3{color:#fff;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:18px;font-weight:700}
.ftr a:hover{color:var(--gold-light)}
.ftr ul{list-style:none;padding:0;margin:0}
.ftr ul li{margin-bottom:10px}
.ftr-brand{display:flex;align-items:center;gap:13px;margin-bottom:16px}
.ftr-brand img{width:54px;height:54px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(201,151,46,.45)}
.ftr-brand .n{font-family:'Montserrat',system-ui,sans-serif;font-size:1.18rem;color:#fff;font-weight:700}
.ftr-brand .t{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-light);font-weight:700}
.loc{margin-bottom:16px}
.loc b{display:block;color:#fff;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.loc p{margin:0;line-height:1.55;font-size:.91rem}
.ftr-soc{display:flex;gap:9px;margin-top:18px}
.ftr-soc a{width:38px;height:38px;border-radius:11px;background:rgba(255,255,255,.07);display:grid;place-items:center;transition:.2s}
.ftr-soc a:hover{background:var(--gold);color:var(--green-900)}
.ftr-soc svg{width:17px;height:17px}
.ftr-bot{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.85rem}
.hrs div{display:flex;justify-content:space-between;gap:14px;margin-bottom:6px;font-size:.89rem}
.hrs span:last-child{color:#fff}
.float-donate{position:fixed;right:18px;bottom:18px;z-index:90;display:none}

/* reveal */
/* Scroll reveal is scoped to .js-anim, which the inline snippet in <head>
   puts on <html> before the first paint. If scripting is off or the script
   fails, the class is never added and every block is simply visible — the
   page must never depend on JavaScript to show its own content. */
html.js-anim .rv{opacity:0;transform:translateY(22px);
  transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.3,1)}
html.js-anim .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html.js-anim .rv{opacity:1;transform:none;transition:none}
}

/* The newsletter input had outline:none and only a border colour change,
   which is not a visible focus indicator. */
.nform input:focus-visible,.nform input:focus{outline:3px solid var(--gold-dark);
  outline-offset:2px}
/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width:1100px){
  .dots{grid-template-columns:repeat(2,1fr)}
  .ev-grid{grid-template-columns:repeat(2,1fr)}
  .give-grid{grid-template-columns:repeat(2,1fr)}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1040px){
  .nav{display:none}
  .burger{display:grid}
  .hdr .btn{display:none}
  .mnav .btn{display:inline-flex}
  /* HERO: text first, collage AFTER the buttons on phone/tablet */
  .hero-grid{grid-template-columns:1fr;gap:38px}
  .hero-copy{order:1}
  .collage{order:2}
  .collage{grid-template-columns:1fr 1fr}
  .cim.b{margin-top:0}
  .diff-head,.prev-grid,.school-grid,.clinic-card,.sup-grid,.news .wrap{grid-template-columns:1fr;gap:36px}
  .statband .inner{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line)}
  .real-list{grid-template-columns:1fr}
  .week-rail{grid-template-columns:repeat(2,1fr)}
  .week-rail::before{display:none}
  .mosaic{grid-auto-rows:130px}
  .ftr-grid{grid-template-columns:1fr 1fr;gap:34px}
  .float-donate{display:block}
}
@media (max-width:720px){
  body{font-size:1rem}
  .tb-item.hide-sm{display:none}
  .tb-left{gap:14px;font-size:.78rem}
  .dots,.svc-grid,.give-grid,.ev-grid,.week-rail,.week-foot{grid-template-columns:1fr}
  .statband{margin-top:-52px}
  .statband .inner{grid-template-columns:repeat(2,1fr)}
  .stat{padding:24px 14px}
  .photo-stack{padding:0}
  .photo-stack .p2{display:none}
  .photo-badge{left:12px}
  .ftr-grid{grid-template-columns:1fr}
  .hero-btns .btn{width:100%}
  .mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:120px}
  .mz{grid-area:auto!important}
  .mz.s1{grid-column:span 2!important;grid-row:span 2!important}
  .day-card{min-height:0}
  .collage{grid-template-columns:1fr 1fr;gap:10px}
  .collage-tag{right:-4px;top:-12px;padding:10px 13px}
  .collage-tag b{font-size:1.2rem}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
/* ═══ PAGE HERO ═══ */
.phero{position:relative;background:linear-gradient(135deg,#0A4432,#07382D 60%,#0A4432);color:#fff;overflow:hidden}
.phero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(760px 420px at 86% 10%,rgba(201,151,46,.22),transparent 62%),
             radial-gradient(620px 420px at 2% 100%,rgba(46,125,79,.4),transparent 60%)}
.phero::after{content:"";position:absolute;inset:0;opacity:.05;
  background-image:radial-gradient(#E0B45F 1px,transparent 1px);background-size:26px 26px}
.phero .wrap{position:relative;padding:clamp(48px,6vw,80px) var(--pad) clamp(54px,7vw,88px)}
.crumb{display:flex;gap:9px;align-items:center;font-size:.82rem;color:#A6B9A3;margin-bottom:20px;flex-wrap:wrap}
.crumb a:hover{color:var(--gold-light)}
.crumb svg{width:13px;height:13px;opacity:.6}
.crumb span[aria-current]{color:var(--gold-light);font-weight:600}
.phero h1{color:#fff;font-size:clamp(2.1rem,4.4vw,3.4rem);max-width:17ch}
.phero p{color:#C3D4C4;max-width:58ch;margin-top:18px;font-size:clamp(1.02rem,1.45vw,1.15rem);line-height:1.66}
.phero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center}
.phero-fig{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;
  background:linear-gradient(140deg,#15663E,#0A4432);box-shadow:0 24px 56px rgba(0,0,0,.36);border:1px solid rgba(255,255,255,.1)}
.phero-fig img{width:100%;height:100%;object-fit:cover}
/* ═══ SUB NAV ═══ */
.subnav{position:sticky;top:80px;z-index:60;background:rgba(251,247,239,.96);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line)}
.subnav .wrap{display:flex;gap:6px;overflow-x:auto;padding-top:11px;padding-bottom:11px;scrollbar-width:none}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{flex:none;padding:9px 16px;border-radius:999px;font-size:.84rem;font-weight:700;
  color:var(--body);white-space:nowrap;transition:.2s;border:1px solid transparent}
.subnav a:hover{background:#fff;border-color:var(--line);color:var(--green-800)}
.subnav a.on{background:var(--green-800);color:#fff}
/* ═══ MISSION / VISION / BELIEF ═══ */
.mvc{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.mv{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:32px 28px;position:relative;overflow:hidden;transition:.28s}
.mv:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:transparent}
.mv::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--green-700),var(--gold))}
.mv-ic{width:54px;height:54px;border-radius:16px;background:var(--green-100);color:var(--green-700);display:grid;place-items:center;margin-bottom:18px}
.mv-ic svg{width:27px;height:27px}
.mv h3{font-size:1.2rem;margin-bottom:10px}
.mv p{font-size:.96rem;line-height:1.65;margin:0}
/* ═══ TRUST REASONS ═══ */
.trust{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.tr{display:flex;gap:20px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-lg);padding:28px;transition:.26s}
.tr:hover{box-shadow:var(--shadow);border-color:transparent;transform:translateY(-4px)}
.tr-n{font-family:'Montserrat',system-ui,sans-serif;font-size:2rem;font-weight:700;color:var(--gold);opacity:.32;line-height:1;flex:none;width:46px}
.tr h3{font-size:1.06rem;margin-bottom:7px}
.tr p{font-size:.94rem;line-height:1.64;margin:0}
/* ═══ APPROACH LIST ═══ */
.appr{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.ap{display:flex;gap:16px;align-items:flex-start;background:var(--cream);border-radius:var(--r);padding:22px 24px;border-left:3px solid var(--gold)}
.ap-ic{width:40px;height:40px;border-radius:12px;background:#fff;color:var(--gold-dark);display:grid;place-items:center;flex:none;box-shadow:var(--shadow-sm)}
.ap-ic svg{width:20px;height:20px}
.ap b{display:block;color:var(--ink);font-size:1rem;margin-bottom:4px}
.ap span{font-size:.92rem;line-height:1.6;display:block}
/* ═══ PEOPLE ═══ */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.person{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 26px;transition:.28s;text-align:center}
.person:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.pav{width:84px;height:84px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--green-800),var(--green-600));color:var(--gold-light);
  font-family:'Montserrat',system-ui,sans-serif;font-weight:700;font-size:1.65rem;box-shadow:0 0 0 5px var(--green-100)}
.person h3{font-size:1.04rem;margin-bottom:4px;line-height:1.3}
.prole{font-size:.78rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:12px}
.person p{font-size:.91rem;line-height:1.62;margin:0;text-align:left}
.board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bm{display:flex;gap:15px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;transition:.22s}
.bm:hover{border-color:var(--gold);box-shadow:var(--shadow-sm)}
.bav{width:42px;height:42px;border-radius:50%;background:var(--sand);color:var(--gold-dark);display:grid;place-items:center;
  font-family:'Montserrat',system-ui,sans-serif;font-weight:700;font-size:.9rem;flex:none}
.bm b{display:block;font-size:.95rem;color:var(--ink);line-height:1.3}
.bm span{font-size:.8rem;color:var(--muted);font-weight:600}
/* ═══ FEATURE SPLIT ═══ */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:58px;align-items:center}
.split.rev .split-fig{order:2}
.split-fig{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3.2;box-shadow:var(--shadow);
  background:linear-gradient(140deg,var(--green-100),var(--sand))}
.split-fig img{width:100%;height:100%;object-fit:cover}
.feat{list-style:none;padding:0;margin:20px 0 0}
.feat li{display:flex;gap:13px;align-items:flex-start;margin-bottom:14px;font-size:.96rem;line-height:1.6}
.feat li svg{width:20px;height:20px;color:var(--gold);flex:none;margin-top:3px}
.feat li b{color:var(--ink)}
/* ═══ NEEDS LIST ═══ */
.needs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.ncat{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.ncat-h{display:flex;gap:14px;align-items:center;padding:20px 24px;background:var(--green-800);color:#fff}
.ncat-h .i{width:40px;height:40px;border-radius:12px;background:rgba(201,151,46,.24);color:var(--gold-light);display:grid;place-items:center;flex:none}
.ncat-h .i svg{width:20px;height:20px}
.ncat-h b{font-family:'Montserrat',system-ui,sans-serif;font-size:1.06rem;font-weight:600}
.ncat ul{list-style:none;margin:0;padding:20px 24px 24px}
.ncat li{display:flex;gap:11px;align-items:flex-start;font-size:.93rem;line-height:1.55;margin-bottom:11px}
.ncat li:last-child{margin-bottom:0}
.ncat li svg{width:16px;height:16px;color:var(--gold);flex:none;margin-top:4px}
/* ═══ GIVE BLOCKS ═══ */
.gblock{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr);gap:44px;align-items:start;
  padding:clamp(30px,4vw,48px);background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);margin-bottom:24px}
.gblock:last-child{margin-bottom:0}
.gb-side .n{font-family:'Montserrat',system-ui,sans-serif;font-size:2.6rem;font-weight:700;color:var(--gold);opacity:.3;line-height:1;display:block;margin-bottom:12px}
.gb-side h3{margin-bottom:12px}
.gb-side p{font-size:.95rem;margin-bottom:20px}
.vol-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.vl{display:flex;gap:11px;align-items:flex-start;background:var(--cream);border-radius:var(--r-sm);padding:14px 16px;font-size:.92rem;line-height:1.5}
.vl svg{width:17px;height:17px;color:var(--gold);flex:none;margin-top:3px}
.ptier{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pt{background:var(--cream);border-radius:var(--r);padding:24px 22px;border-top:4px solid var(--gold)}
.pt h3{font-size:1rem;margin-bottom:8px}
.pt p{font-size:.91rem;line-height:1.6;margin:0}
/* ═══ CONTACT ═══ */
.cgrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:52px;align-items:start}
.ccard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;margin-bottom:18px;transition:.26s}
.ccard:hover{box-shadow:var(--shadow);border-color:transparent}
.cc-h{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.cc-ic{width:46px;height:46px;border-radius:14px;background:var(--green-100);color:var(--green-700);display:grid;place-items:center;flex:none}
.cc-ic svg{width:23px;height:23px}
.cc-h>span{display:block;min-width:0}
.cc-h>span>span{display:block;font-size:.76rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:2px}
.cc-h b{display:block;font-family:'Montserrat',system-ui,sans-serif;font-size:1.06rem;color:var(--ink);text-transform:none;letter-spacing:0;font-weight:600;overflow-wrap:anywhere}
.ccard p{font-size:.95rem;line-height:1.62;margin:0 0 12px}
.ccard a.lnk{display:inline-flex;align-items:center;gap:7px;font-size:.88rem;font-weight:700;color:var(--green-700)}
.ccard a.lnk:hover{color:var(--gold-dark)}
.ccard a.lnk svg{width:15px;height:15px}
.cform{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(26px,3.5vw,42px);box-shadow:var(--shadow)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fld{margin-bottom:18px}
.fld label{display:block;font-size:.83rem;font-weight:700;color:var(--ink);margin-bottom:7px}
.fld label .req{color:var(--gold-dark)}
.fld input,.fld select,.fld textarea{width:100%;padding:13px 16px;border:1.5px solid var(--line);border-radius:var(--r-sm);
  font-family:inherit;font-size:.95rem;color:var(--ink);background:var(--cream);transition:.2s}
.fld textarea{min-height:140px;resize:vertical}
.fld input,.fld select,.fld textarea{max-width:100%;min-width:0}
.cform,.ccard,.hours-card,.gblock>*,.split>*,.cgrid>*,.phero-grid>*{min-width:0}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(201,151,46,.13)}
.fnote{font-size:.84rem;color:var(--muted);margin-top:14px;line-height:1.55}
.hours-card{background:var(--green-800);color:#C3D4C4;border-radius:var(--r-lg);padding:26px}
.hours-card h3-legacy{color:#fff;margin-bottom:16px}
.hours-card .row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px dashed rgba(255,255,255,.14);font-size:.93rem}
.hours-card .row:last-child{border-bottom:0}
.hours-card .row b{color:#fff;font-weight:600}
.hours-card .note{font-size:.85rem;margin-top:14px;color:#A6B9A3;line-height:1.55}
/* ═══ NAV DROPDOWN ═══ */
.nav .has-sub{position:relative}
.nav .has-sub>a::after{content:"";display:inline-block;width:6px;height:6px;margin-left:7px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.55}
.nav .sub{position:absolute;left:0;top:100%;min-width:254px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--shadow-lg);padding:8px;opacity:0;visibility:hidden;
  transform:translateY(8px);transition:.2s;z-index:50}
.nav .has-sub:hover .sub,.nav .has-sub:focus-within .sub{opacity:1;visibility:visible;transform:translateY(0)}
.nav .sub a{display:block;padding:11px 14px;font-size:.89rem;border-radius:9px;white-space:nowrap}
.nav .sub a:hover{background:var(--green-100);color:var(--green-800)}
.mnav .sub-m{display:block;padding-left:16px;border-left:2px solid var(--gold-soft);margin:2px 0 8px}
.mnav .sub-m a{font-size:.9rem;font-weight:600;color:var(--body);border-bottom:0;padding:9px 4px}
/* ═══ SUB-BRAND ═══ */
.seal{display:block;margin:0 auto;filter:drop-shadow(0 14px 32px rgba(0,0,0,.26))}
.seal-hero{width:min(300px,62vw);height:auto}
.brandlock{display:flex;gap:22px;align-items:center;margin-bottom:22px}
.brandlock img{width:92px;height:auto;flex:none;filter:drop-shadow(0 8px 18px rgba(7,56,45,.18))}
.brandlock .bt{font-family:'Montserrat',system-ui,sans-serif;font-size:1.3rem;font-weight:700;color:var(--ink);line-height:1.2;display:block}
.brandlock .bs{font-size:.74rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dark);display:block;margin-top:4px}
.subbrand-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:30px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(26px,3.4vw,40px);transition:.28s}
.subbrand-card:hover{box-shadow:var(--shadow-lg);border-color:transparent;transform:translateY(-4px)}
.subbrand-card img{width:clamp(110px,13vw,158px);height:auto}
.subbrand-card h3{margin-bottom:10px}
.subbrand-card p{font-size:.96rem;margin-bottom:18px}
.sb-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.chiprow{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0 0}
.chip{display:inline-flex;align-items:center;gap:7px;background:var(--green-100);color:var(--green-700);
  border-radius:999px;padding:8px 15px;font-size:.82rem;font-weight:700}
.chip svg{width:14px;height:14px}
.chip.on-dark{background:rgba(255,255,255,.1);color:#C3D4C4;border:1px solid rgba(255,255,255,.16)}
.chip.gold{background:var(--gold-soft);color:var(--gold-dark)}
.collage-seal{position:absolute;right:-14px;top:-22px;z-index:4;width:104px;height:auto;
  filter:drop-shadow(0 10px 26px rgba(0,0,0,.4))}

/* logo marks carry their own ring - don't clip them */
.brand img{width:54px;height:auto;border-radius:0;object-fit:contain}
.ftr-brand img{width:62px;height:auto;border-radius:0;object-fit:contain;box-shadow:none}
/* ═══ CTA BAND ═══ */
.ctaband{background:var(--green-900);color:#C3D4C4;position:relative;overflow:hidden}
.ctaband::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 420px at 50% 0,rgba(201,151,46,.2),transparent 65%)}
.ctaband .wrap{position:relative;text-align:center;padding-top:clamp(52px,6.5vw,78px);padding-bottom:clamp(52px,6.5vw,78px)}
.ctaband h2{color:#fff;max-width:20ch;margin:0 auto}
.ctaband p{max-width:56ch;margin:16px auto 28px}
.cta-btns{display:flex;gap:13px;justify-content:center;flex-wrap:wrap}
/* ═══ ACCORDION ═══ */
.acc{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-bottom:12px;background:#fff}
.acc summary{cursor:pointer;padding:20px 24px;font-weight:700;color:var(--ink);font-size:1rem;
  display:flex;justify-content:space-between;align-items:center;gap:16px;list-style:none;transition:.2s}
.acc summary::-webkit-details-marker{display:none}
.acc summary:hover{background:var(--cream)}
.acc summary::after{content:"";width:10px;height:10px;border-right:2px solid var(--gold-dark);border-bottom:2px solid var(--gold-dark);
  transform:rotate(45deg);flex:none;margin-top:-5px;transition:.25s}
.acc[open] summary::after{transform:rotate(225deg);margin-top:3px}
.acc .acc-b{padding:0 24px 22px;font-size:.95rem;line-height:1.68}

@media (max-width:1040px){
  .subnav{top:70px}
  .phero-grid,.split,.cgrid{grid-template-columns:minmax(0,1fr);gap:34px}
  .split.rev .split-fig{order:0}
  .team{grid-template-columns:repeat(2,1fr)}
  .board{grid-template-columns:repeat(2,1fr)}
  .sb-grid{grid-template-columns:minmax(0,1fr)}
  .gblock{grid-template-columns:minmax(0,1fr);gap:28px}
  .ptier{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:720px){
  .mvc,.trust,.appr,.team,.board,.needs-grid,.vol-list,.frow{grid-template-columns:minmax(0,1fr)}
  .tr{flex-direction:column;gap:10px}
  .tr-n{width:auto}
  .subbrand-card{grid-template-columns:minmax(0,1fr);gap:20px;text-align:center}
  .subbrand-card img{margin:0 auto}
  .brandlock{flex-direction:column;text-align:center;gap:14px}
  .collage-seal{width:78px;right:-6px;top:-16px}
}
/* ════════ OFFICIAL AMIR INSTITUTE PALETTE ════════
   #07382D Forest Green   #0F5132 Evergreen   #8DAA93 Sage       #C9972E Amir Gold
   #F6E3B6 Soft Gold      #FAF8F0 Ivory       #EADFCB Sand       #2E3A2F Deep Green
   Gold is decorative on light backgrounds (2.5:1); gold TEXT uses the darkened
   tint --gold-dark #7E5E17 (5.6:1 on Ivory) to hold WCAG AA.                    */
:root{
  --forest:#07382D; --evergreen:#0F5132; --sage:#8DAA93; --amir-gold:#C9972E;
  --soft-gold:#F6E3B6; --ivory:#FAF8F0; --sand-brand:#EADFCB; --deep-green:#2E3A2F;

  --green-900:#07382D; --green-850:#0A4432; --green-800:#0F5132;
  --green-700:#15663E; --green-600:#2E7D4F; --green-100:#E7EFE8;
  --gold:#C9972E; --gold-light:#E0B45F; --gold-soft:#F6E3B6; --gold-dark:#7E5E17;
  --tan:#EADFCB; --cream:#FAF8F0; --sand:#EADFCB; --white:#FFF;
  --ink:#2E3A2F; --body:#4C5A4D; --muted:#6B7A66;
  --line:rgba(7,56,45,.13);
  --shadow-sm:0 2px 8px rgba(7,56,45,.07);
  --shadow:0 12px 32px rgba(7,56,45,.11);
  --shadow-lg:0 28px 64px rgba(7,56,45,.17);
}
/* ════════ TYPOGRAPHY — Montserrat (subhead face) + Allura (tagline) ════════ */
h1,h2,h3{font-weight:800;letter-spacing:-.022em}
h1{line-height:1.08}
h2{line-height:1.14}
h4{font-weight:700;letter-spacing:-.005em}
.brand-name{font-weight:800;letter-spacing:-.012em}
.stat-n,.tr-n,.gb-side .n,.photo-badge b,.collage-tag b,.ev-date b,.pav,.lead-av,.bav{
  font-weight:800;letter-spacing:-.02em}
.day-card b{font-weight:700}

/* Allura — short taglines only, never body copy (min 1.4rem for legibility) */
.script{font-family:'Allura',cursive;font-weight:400;letter-spacing:.01em}
.prev-note{font-family:'Allura',cursive;font-size:clamp(1.55rem,2.5vw,2.1rem);line-height:1.3;font-weight:400}
.brand-tagline{font-family:'Allura',cursive;font-size:clamp(1.5rem,2.4vw,2rem);color:var(--gold-dark);line-height:1.2}
.quote-card p{font-family:'Montserrat',sans-serif;font-style:italic;font-weight:500}
/* ════════ BRAND DIVIDER — gold rule + diamond (unity / structure / balance) ═══ */
.divider,.sec-head.center h2::after{
  content:"";display:block;height:12px;margin:22px auto 0;width:178px;
  background-image:
    linear-gradient(#C9972E,#C9972E),
    linear-gradient(#C9972E,#C9972E),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='2.2' y='2.2' width='7.6' height='7.6' transform='rotate(45 6 6)' fill='%23C9972E'/></svg>");
  background-size:66px 2px,66px 2px,12px 12px;
  background-position:left center,right center,center center;
  background-repeat:no-repeat;
}
.ctaband h2::after,.news h2::after{display:none}
.prev h2::after,.support h2::after,.divider.on-dark{
  background-image:
    linear-gradient(#E0B45F,#E0B45F),
    linear-gradient(#E0B45F,#E0B45F),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12'><rect x='2.2' y='2.2' width='7.6' height='7.6' transform='rotate(45 6 6)' fill='%23E0B45F'/></svg>");
}

/* ═══════════════ QUICK EXIT ═══════════════
   A survivor may need to leave the site instantly. The button replaces
   the current page rather than navigating to it, so the back button does
   not return here, and it opens a neutral page in a new tab first in case
   the browser blocks the replace. Fixed bottom-right on every page and
   every screen size, above all other content, and reachable by keyboard
   (it is the first focusable control in the document). */
.quickexit{position:fixed;right:clamp(12px,2vw,24px);bottom:clamp(12px,2vw,24px);
  z-index:9999;display:inline-flex;align-items:center;gap:9px;
  font:inherit;font-size:.86rem;font-weight:800;letter-spacing:.01em;
  min-height:46px;padding:12px 18px;border-radius:999px;cursor:pointer;
  background:var(--green-900);color:#fff;border:2px solid #fff;
  box-shadow:0 10px 28px rgba(7,56,45,.34);transition:background .18s,transform .18s}
.quickexit svg{width:17px;height:17px;flex:none}
.quickexit:hover{background:var(--green-700);transform:translateY(-2px)}
.quickexit:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.quickexit{transition:none}
  .quickexit:hover{transform:none}}
@media print{.quickexit{display:none}}

/* the Zeffy fee line that sits under every Donate button */
.zeffy-note{font-size:.84rem;line-height:1.5;color:var(--muted);
  margin:10px 0 0;max-width:42ch}
.zeffy-note.center{margin-left:auto;margin-right:auto;text-align:center}
.on-dark .zeffy-note,.ctaband .zeffy-note,.ftr .zeffy-note{color:rgba(255,255,255,.82)}

/* second top-bar note, hidden earlier than the first on narrow screens */
.hide-md{display:inline-flex}
@media (max-width:980px){.hide-md{display:none}}
.loc-note{color:var(--muted);font-size:.86rem}
.ftr .loc-note{color:rgba(255,255,255,.66)}


/* ═══════════════ AUDIT FIXES ═══════════════
   Every value below was measured against the pixels actually painted
   behind the text, not against the token, and raised until it clears
   the WCAG AA minimum with a margin rather than sitting on it. */

/* small buttons were under the 44px minimum touch target */
.btn-sm{min-height:44px;display:inline-flex;align-items:center;justify-content:center}

/* the Programs item sits inside .has-sub, which missed the nav padding */
.nav .has-sub>a{display:inline-flex;align-items:center;min-height:44px}
.nav>a{display:inline-flex;align-items:center;min-height:44px}

/* muted body text: #6B7A66 measured 4.29:1 on cream, just under AA */
:root{--muted:#5F6E5B}

/* Initials avatars. The colour has to be set at this specificity because
   ".bm span" and ".person span" rules in the page stylesheets otherwise win
   and repaint the letters in muted body grey. */
.bm .bav,.person .pav,.bav,.pav{color:#07382D}
.pav,.bav{background:var(--gold-soft)}

/* the 01/02/03 markers were gold at 55% opacity — 2.64:1 on white */
.real-item .n{color:#6B4F12;opacity:1}

/* role lines under a name */
.prole{color:#6B4F12;font-weight:800}

/* note text under a donate button, and small print generally */
.zeffy-note,.fineprint{color:#5A6856}

/* a section head placed on one of the dark bands */
.sec-head.on-dark h2,.sec-head.on-dark h3{color:#fff}
.sec-head.on-dark .lede,.sec-head.on-dark p{color:rgba(255,255,255,.88)}
.support .zeffy-note,.ctaband .zeffy-note,.curric .zeffy-note{color:rgba(255,255,255,.8)}

/* .lead-av is a dark green disc, so its initials must be light — a page
   rule was repainting them in body grey, which is unreadable on that disc */
.lead .lead-av,.lead-av{color:var(--gold-soft)}
/* the hours footnote sits on dark green inside its card */
.hours-card .note,.note{color:#C7D6C3}

/* the fee line drops onto its own row under a button group */
.cta-btns,.hero-btns{flex-wrap:wrap}
.cta-btns .zeffy-note,.hero-btns .zeffy-note{flex-basis:100%;margin-top:4px}

/* On narrow screens a floating Donate button appears bottom-right, which is
   exactly where the quick-exit button lives. Quick exit is the one somebody
   may need in a hurry, so it keeps the corner and Donate stacks above it. */
@media (max-width:1040px){
  .float-donate{bottom:calc(18px + 46px + 12px)}
}
@media (max-width:420px){
  .quickexit{font-size:.8rem;padding:11px 15px}
  .float-donate{bottom:calc(12px + 44px + 10px)}
}
/* the fee line also appears over the photographic heroes */
.hero .zeffy-note,.phero .zeffy-note,.hero-btns .zeffy-note{color:rgba(255,255,255,.88);
  text-shadow:0 1px 10px rgba(7,56,45,.6)}


/* ═══════════════ PHOTOGRAPHIC HEROES ═══════════════
   These rules used to live only in the seven original page stylesheets.
   Any page added afterwards therefore had no hero styling: .heroimg was
   a plain block, so the photograph rendered at full size and shoved the
   headline underneath it instead of sitting behind it. They belong here,
   where every page gets them. */
.hero,.phero{position:relative;isolation:isolate}
.heroimg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.heroimg img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero::before,.phero::before{z-index:-1}
.hero::before{background:
  linear-gradient(100deg,rgba(7,56,45,.95) 0%,rgba(7,56,45,.90) 34%,rgba(7,56,45,.62) 64%,rgba(7,56,45,.48) 100%),
  radial-gradient(900px 520px at 88% 6%,rgba(201,151,46,.26),transparent 62%)}
.phero::before{background:
  linear-gradient(100deg,rgba(7,56,45,.95) 0%,rgba(7,56,45,.90) 38%,rgba(7,56,45,.66) 70%,rgba(7,56,45,.52) 100%),
  radial-gradient(760px 420px at 86% 8%,rgba(201,151,46,.2),transparent 64%)}
.hero::after,.phero::after{z-index:-1}
.phero-grid{grid-template-columns:minmax(0,1fr)}
.phero-copy{max-width:min(760px,62%)}
.phero .wrap{padding-top:clamp(70px,7.4vw,108px);padding-bottom:clamp(80px,8.4vw,120px);
  min-height:clamp(380px,34vw,520px);display:flex;flex-direction:column;justify-content:center}
.phero h1{max-width:20ch}
.phero-grid.has-seal{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.phero-grid.has-seal .phero-copy{max-width:none}
@media (min-width:1500px){.phero-copy{max-width:min(860px,60%)}}
@media (max-width:1040px){
  /* on phones the copy spans the full width, so the scrim must too */
  .hero::before,.phero::before{background:
    linear-gradient(180deg,rgba(7,56,45,.93) 0%,rgba(7,56,45,.88) 55%,rgba(7,56,45,.95) 100%)}
  .phero-copy{max-width:none}
  .phero-grid.has-seal{grid-template-columns:minmax(0,1fr)}
}


/* ═══════════════ REVIEW FIXES ═══════════════ */

/* The headline was capped at 13 characters a line, which broke a six-word
   title across four lines while two thirds of the hero sat empty. */
.hero .hero-copy{max-width:min(880px,66%)}
.hero .hero-copy h1{max-width:19ch}
@media (min-width:1500px){.hero .hero-copy{max-width:min(980px,62%)}}
@media (max-width:1040px){.hero .hero-copy{max-width:none}}

/* The Zeffy line was landing BETWEEN the two buttons. flex-basis:100% is
   not enough on its own — the item could still shrink back onto the row.
   flex:0 0 100% plus order pushes it onto its own line, after both. */
.hero .hero-btns,.ctaband .cta-btns,.sec .cta-btns{flex-wrap:wrap;align-items:center}
.hero .hero-btns .zeffy-note,
.ctaband .cta-btns .zeffy-note,
.sec .cta-btns .zeffy-note{flex:0 0 100%;width:100%;max-width:none;order:99;margin:10px 0 0}
.ctaband .cta-btns{justify-content:center}
.ctaband .cta-btns .zeffy-note{text-align:center;margin-left:auto;margin-right:auto}

/* The closing band before the footer is gold, not a third green wall. */
.ctaband{background:var(--gold);color:#3A2606}
.ctaband::before{background:radial-gradient(760px 420px at 50% 0,
  rgba(255,255,255,.34),transparent 66%)}
.ctaband h2{color:#241705}
.ctaband p,.ctaband .lede{color:#3A2606}
.ctaband .cta-sub{color:#4A3107}
.ctaband .cta-sub a{color:#241705}
.ctaband .zeffy-note{color:#4A3107}
.ctaband .btn-gold{background:var(--green-800);color:#fff;
  box-shadow:0 8px 22px rgba(7,56,45,.26)}
.ctaband .btn-gold:hover{background:var(--green-700)}
.ctaband .btn-ghost,.ctaband .btn-outline{border-color:rgba(36,23,5,.45);color:#241705;
  background:transparent}
.ctaband .btn-ghost:hover,.ctaband .btn-outline:hover{background:rgba(36,23,5,.1);
  border-color:#241705}
.ctaband .signup input{border-color:rgba(36,23,5,.4);background:rgba(255,255,255,.55);
  color:#241705}
.ctaband .signup input::placeholder{color:#6B5423}
.ctaband .divider span{background:#241705}

/* Cards in a row match height, and the two longest were leaving the rest
   of their row as empty boxes — the copy is trimmed rather than the grid
   left ragged. */
.cgrid,.stgrid,.alc-grid,.hl-grid{align-items:stretch}
.ccard,.st,.alc,.hl{display:flex;flex-direction:column}
.ccard p,.st p,.alc p{flex:1}

/* Six STEEAM letters read better as 3x2 than 4 plus 2 stragglers, and the
   four highlight figures should be four tracks — auto-fit was giving five
   and leaving an empty one on the end. Both selectors carry their section
   so they beat the page stylesheet, which loads after this file. */
@media (min-width:1041px){
  .steeam .stgrid{grid-template-columns:repeat(3,1fr)}
  #highlights .hl-grid{grid-template-columns:repeat(4,1fr)}
  .curric .cgrid{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:681px) and (max-width:1040px){
  .steeam .stgrid,#highlights .hl-grid,.curric .cgrid{grid-template-columns:repeat(2,1fr)}
}


/* The quick-exit button has to stay reachable, but it was sitting on top
   of page content at full strength. Slightly smaller, and it fades back
   until pointed at or focused. */
.quickexit{font-size:.8rem;padding:10px 16px;min-height:42px;opacity:.9}
.quickexit:hover,.quickexit:focus-visible{opacity:1}
.quickexit svg{width:15px;height:15px}


/* ============================================================
   SHARED LAYOUT — moved here from the page stylesheets.
   These three blocks used to be copied into every page's own
   stylesheet, so any page added later silently missed them.
   They live here, once, and every page gets them.
   ============================================================ */
/* ════════ LAYOUT — wide container, capped reading measure ════════
   The shell goes near-full-width so the page fills large screens, but prose
   inside single-column blocks is capped around 64-72 characters, because a
   paragraph running the full 1760px is unreadable. Grids take the extra room;
   text does not.                                                              */
:root{ --maxw:1760px; --pad:clamp(20px,4.2vw,72px); --measure:66ch; }
.wrap{max-width:var(--maxw);padding-left:var(--pad);padding-right:var(--pad)}

/* centred section intros */
.sec-head{max-width:860px}
.sec-head p,.sec-head .lede{max-width:70ch;margin-left:auto;margin-right:auto}

/* prose inside two-column splits must not run the full column */
.split>div p,.split>div .feat li,
.prev-grid>div>p,.sup-grid>div>p,
.diff-head>p,.diff-head>.lede,
.gb-side p,.gblock>div>p,
.subbrand-card p,.dot-card p,.person p{max-width:var(--measure)}
.diff-head>.lede,.diff-head>p{max-width:62ch;justify-self:end}

/* wide blocks scale with the container instead of staying pinned narrow */
.real-list{max-width:1280px}
.punch{max-width:1040px}
.statband .inner{max-width:none}
.week-rail{max-width:1560px;margin-left:auto;margin-right:auto}
.week-foot{max-width:1560px;margin-left:auto;margin-right:auto}
.ev-grid,.svc-grid,.give-grid,.dots{max-width:none}

/* the contact form is shorter than the card column beside it - let it track
   the scroll instead of leaving a tall empty well on the right */
@media (min-width:1041px){
  .cform{position:sticky;top:112px}
}

/* mosaic rows must grow with the viewport or tiles go letterbox-thin */
.mosaic{grid-auto-rows:clamp(150px,10.5vw,236px)}
.mosaic-sec{padding-top:clamp(60px,7.5vw,108px)}

/* a touch more air between columns once there is room for it */
@media (min-width:1500px){
  .hero-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:76px}
  .split,.prev-grid,.school-grid{gap:78px}
  .cgrid,.sup-grid{gap:70px}
  .clinic-card{gap:66px}
  .phero-grid{gap:66px}
  .hero h1{max-width:15ch}
  .hero p.lede{max-width:56ch}
}
/* the type scale was tuned for a 1200px shell - lift it for the wider one */
@media (min-width:1500px){
  body{font-size:17.5px}
  h1{font-size:clamp(3.4rem,3.6vw,4.7rem)}
  h2{font-size:clamp(2.5rem,2.5vw,3.3rem)}
  h3{font-size:clamp(1.5rem,1.5vw,1.85rem)}
  .lede{font-size:1.24rem}
  .stat-n{font-size:2.8rem}
  .stat-l{font-size:.9rem}
  .dot-card p,.svc p,.give p{font-size:.98rem}
  .pill span{font-size:.95rem}
  .pill strong{font-size:1.05rem}
  .need span{font-size:.94rem}
  .day-card p{font-size:.9rem}
}
@media (min-width:1900px){
  body{font-size:18px}
  .sec{padding-top:124px;padding-bottom:124px}
  .hero-inner{padding-top:120px}
}
/* ════════ PILLAR WORDS (FAITH | KNOWLEDGE | …) ════════ */
.pillars{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:0;
  margin:22px 0 0;font-size:.78rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.pillars span{padding:4px 18px;border-right:1px solid var(--line);color:var(--gold-dark)}
.pillars span:last-child{border-right:0}
.pillars.on-dark span{color:var(--gold-light);border-right-color:rgba(255,255,255,.22)}
.pillars.left{justify-content:flex-start}
.pillars.left span:first-child{padding-left:0}
@media (max-width:620px){.pillars span{padding:4px 11px;font-size:.7rem;letter-spacing:.12em}}
/* ═══ PHOTOGRAPHIC HEROES ═══
   Every hero now sits on a real photograph behind a deep forest scrim.
   The scrim is heavy enough on the text side to hold white at AA on any
   frame; the image is what tells you this is a school.                     */
.hero,.phero{position:relative;isolation:isolate}
.heroimg{position:absolute;inset:0;z-index:-2;overflow:hidden}
.heroimg img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero::before,.phero::before{z-index:-1}
.hero::before{background:
  linear-gradient(100deg,rgba(7,56,45,.95) 0%,rgba(7,56,45,.90) 34%,rgba(7,56,45,.62) 64%,rgba(7,56,45,.48) 100%),
  radial-gradient(900px 520px at 88% 6%,rgba(201,151,46,.26),transparent 62%)}
.phero::before{background:
  linear-gradient(100deg,rgba(7,56,45,.95) 0%,rgba(7,56,45,.90) 38%,rgba(7,56,45,.66) 70%,rgba(7,56,45,.52) 100%),
  radial-gradient(760px 420px at 86% 8%,rgba(201,151,46,.2),transparent 64%)}
.hero::after,.phero::after{z-index:-1}
@media (max-width:1040px){
  /* on phones the copy spans the full width, so the scrim must too */
  .hero::before,.phero::before{background:
    linear-gradient(180deg,rgba(7,56,45,.93) 0%,rgba(7,56,45,.88) 55%,rgba(7,56,45,.95) 100%)}
}

/* ═══════════════ FORMS ═══════════════ */
/* The honeypot. Off-screen rather than display:none, because some bots skip
   fields that are display:none — and hidden from assistive tech and the tab
   order so a real person can never reach it by accident. */
.hpot{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0;
  pointer-events:none}

/* The inline answer after a submission. Lives in the form, announced
   politely, and legible on a white card and on the dark and gold bands. */
.fstatus{margin:14px 0 0;padding:13px 16px;border-radius:var(--r-sm);
  font-size:.94rem;line-height:1.55;border-left:4px solid}
.fstatus.is-ok{background:var(--green-100);border-color:var(--green-700);color:#13331F}
.fstatus.is-bad{background:#FBE9E7;border-color:#B3261E;color:#5F1410}
.nform .fstatus,.signup .fstatus{flex-basis:100%;text-align:left}
button[disabled]{opacity:.65;cursor:progress}

/* ═══════════════ FOOTER LAYOUT ═══════════════
   On a phone the footer was a single 1,150px stack — four blocks, one under
   the other, and a lot of scrolling to reach the legal links. The two link
   lists are short enough to sit side by side, and so are the two addresses.
   Pairing them up is most of that height back without shrinking any text. */
.ftr-locs{display:grid;gap:clamp(18px,2.2vw,26px)}
.ftr-contact .loc p{margin:0}
.ftr-contact .loc a{text-decoration:underline;text-underline-offset:2px;
  word-break:break-word}

/* phone number and email on one line while there is room for it */
.ftr-reach{display:flex;flex-wrap:wrap;gap:6px 22px;margin:clamp(16px,2vw,22px) 0 0}
.ftr-reach a{white-space:nowrap}

/* The last column is narrow on a wide screen, so the two addresses stay
   stacked there. Everywhere narrower, the footer has fewer columns and the
   block is wide enough to take them side by side. */
@media (max-width:1040px){
  .ftr-contact{grid-column:1/-1}
  .ftr-locs{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  /* two columns, not one: the lists are short and the gain is large */
  .ftr-grid{grid-template-columns:repeat(2,1fr);gap:30px 22px}
  .ftr-grid>div:first-child{grid-column:1/-1}
  .ftr{padding-top:clamp(40px,8vw,52px)}
}
@media (max-width:380px){
  /* below this the address columns start breaking street names, so they
     go back to full width — the link lists stay paired */
  .ftr-locs{grid-template-columns:1fr}
}
@media (max-width:720px){
  /* the long email would otherwise force the column wider than its share */
  .ftr-contact .loc a{font-size:.86rem;word-break:break-all}
}

/* the credit sits with the legal links, quiet but present */
.ftr-bot{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;
  justify-content:space-between}
.ftr-credit{color:rgba(255,255,255,.52);font-size:.82rem}
.ftr-credit a{color:rgba(255,255,255,.78);text-decoration:underline;
  text-underline-offset:2px;font-weight:600}
.ftr-credit a:hover{color:var(--gold-light)}
@media (max-width:720px){
  .ftr-bot{flex-direction:column;align-items:flex-start;gap:12px}
}
/* The floating Donate and quick-exit buttons sit over the bottom-right of
   the viewport, which is exactly where the footer's last lines land. Give
   the footer room so the copyright and legal links are never underneath
   them on a small screen. */
.ftr-bot{padding-bottom:84px}
@media (max-width:1040px){
  /* two stacked floating buttons on a narrow screen, so more room needed */
  .ftr-bot{padding-bottom:120px}
}


/* ════════ THE TWO FLOATING BUTTONS ON A PHONE ════════
   As full pills they sat across the footer text on a 390px screen. Below
   720px they become circles: the icon alone at 48px, which clears the 44px
   touch-target floor. The words stay in the markup and are hidden visually
   only, so a screen reader still reads "Donate" and "Leave this site now".
   TO MAKE THEM ICONS ON EVERY SCREEN, not just phones: delete the line
   "@media (max-width:720px){" below and its closing "}" at the end. */
@media (max-width:720px){
  .fl-tx{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;
    overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
  .quickexit,.float-donate{display:inline-flex;align-items:center;justify-content:center;
    width:48px;height:48px;min-height:48px;padding:0;gap:0;border-radius:50%}
  .quickexit svg,.float-donate svg{width:20px;height:20px;margin:0}
  .float-donate{bottom:calc(clamp(12px,2vw,24px) + 48px + 10px)}
}

/* ════════ THE TOP BAR ON A PHONE ════════
   The green strip above the logo — phone number, email, hours and the two
   social icons — wrapped onto three lines on a 390px screen and pushed the
   logo and the headline below the fold before anyone had read a word. It is
   hidden on phones. Nothing is lost: the number and the email are on the
   Contact page and in the menu, and the social links are in the footer.
   TO BRING IT BACK ON PHONES, delete these four lines. */
@media (max-width:720px){
  .topbar{display:none}
}