/* Speaking Louder: concept site v2 (real content + images, multi-page)
   Night-and-gold theme, grounded in the farm-africa reference structure. */
:root{
  /* studio44 re-theme: near-black + charcoal darks, cool light greys, red accent */
  --ink:#141416; --ink-2:#1c1d20; --ink-3:#26282c;
  --cream:#ededed; --cream-2:#e3e3e6; --paper:#f7f7f8;
  /* brand red (SL favicon #EA3324, ~= studio44 #e73a2e). Kept under --gold names. */
  --gold:#ea3324; --gold-deep:#cc2418; --gold-soft:#ff6a5e;
  --clay:#bb5836;
  --text:#141416; --muted:#5a5c63; --muted-light:#b8babf;
  --line:#dcdce0; --line-ink:rgba(255,255,255,.13);
  --maxw:1200px; --r:2px; --r-lg:3px; --r-btn:999px;
  --shadow:0 20px 50px -24px rgba(16,24,38,.35);
  --shadow-soft:0 12px 34px -20px rgba(16,24,38,.28);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:"Jost",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--cream);color:var(--text);font-size:17px;line-height:1.65;-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:"Jost",system-ui,sans-serif;line-height:1.03;font-weight:700;letter-spacing:-.015em;text-wrap:balance}
h3,h4{font-weight:600;letter-spacing:-.005em}
/* poster-scale display headings: big, bold, uppercase */
.hero h1,.pagehero h1,.sec-head h2,.nations h2,.cta-band h2,.give-copy h2,.split-body h2,.bigstat h2{text-transform:uppercase;font-family:"Poppins","Jost",system-ui,sans-serif;font-weight:800;letter-spacing:-.02em}
p{text-wrap:pretty}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 24px}
.narrow{max-width:880px}
section{position:relative}
.eyebrow{font-family:"Jost";font-weight:600;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep);display:inline-flex;align-items:center}
.eyebrow.center{justify-content:center}
.eyebrow.on-dark{color:var(--gold-soft)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:"Jost";font-weight:600;font-size:16px;line-height:1;padding:15px 26px;border-radius:var(--r-btn);border:1.5px solid transparent;cursor:pointer;transition:transform .2s var(--ease),background .2s var(--ease),box-shadow .2s var(--ease),color .2s var(--ease);min-height:48px;white-space:nowrap}
.btn svg{width:17px;height:17px}
.btn-gold{background:var(--gold);color:#fff;box-shadow:0 10px 26px -12px rgba(234,51,36,.75)}
.btn-gold:hover{background:var(--gold-deep);transform:translateY(-2px)}
.btn-ghost{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;transform:translateY(-2px)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:var(--ink-3);transform:translateY(-2px)}
.btn-outline{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-outline:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.btn-lg{padding:17px 32px;font-size:17px}

/* Header */
.header{position:fixed;inset:0 0 auto 0;z-index:60;transition:background .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);border-bottom:1px solid transparent}
.header::before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,15,25,.55),rgba(10,15,25,0));opacity:1;transition:opacity .35s var(--ease);pointer-events:none}
.header.solid,.header.scrolled{background:var(--ink);box-shadow:0 8px 30px -18px rgba(0,0,0,.6);border-color:var(--line-ink)}
.header.solid::before,.header.scrolled::before{opacity:0}
.header>.wrap{max-width:100%;padding-left:clamp(20px,3.5vw,52px);padding-right:clamp(20px,3.5vw,52px)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px}
.brand{display:flex;align-items:center;gap:12px;color:#fff;font-family:"Jost";font-weight:700;font-size:19px;letter-spacing:.06em;text-transform:uppercase}
.brand .mark{width:36px;height:36px;flex:0 0 auto}
.nav-links{display:flex;align-items:center;gap:clamp(18px,2vw,30px);list-style:none}
.nav-links a{color:#fff;font-weight:500;font-size:16px;position:relative;padding:6px 0;opacity:.9;transition:opacity .2s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--gold);transition:width .25s var(--ease)}
.nav-links a:hover{opacity:1}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{width:100%}
.nav-links a[aria-current="page"]{opacity:1;color:var(--gold-soft)}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-cta{padding:12px 22px;min-height:44px}
.menu-toggle{display:none;align-items:center;gap:11px;background:none;border:0;cursor:pointer;padding:8px 0;margin-right:0;color:#fff;font-family:"Jost";font-weight:600;font-size:13px;letter-spacing:.2em;text-transform:uppercase}
.menu-toggle::before{content:"Menu"}
.menu-toggle span{position:relative;width:26px;height:9px;flex:0 0 auto}
.menu-toggle span::before,.menu-toggle span::after{content:"";position:absolute;left:0;width:26px;height:2px;background:currentColor;transition:transform .3s var(--ease)}
.menu-toggle span::before{top:1px}.menu-toggle span::after{top:6px}
.menu-toggle span:nth-child(2),.menu-toggle span:nth-child(3){display:none}

/* mobile overlay */
.overlay{position:fixed;inset:0;z-index:70;background:var(--ink);display:flex;flex-direction:column;padding:26px 24px calc(26px + env(safe-area-inset-bottom));transform:translateX(100%);transition:transform .4s var(--ease);visibility:hidden}
.overlay.open{transform:translateX(0);visibility:visible}
.overlay-top{display:flex;align-items:center;justify-content:space-between}
.overlay-close{background:none;border:0;color:#fff;cursor:pointer;padding:10px;margin-right:-10px}
.overlay-close svg{width:26px;height:26px}
.overlay-links{list-style:none;margin:auto 0;display:flex;flex-direction:column;gap:4px}
.overlay-links a{color:#fff;font-family:"Jost";font-weight:500;font-size:clamp(28px,8vw,40px);padding:8px 0;display:block;letter-spacing:-.02em}
.overlay-links a[aria-current="page"]{color:var(--gold)}
.overlay-foot{display:flex;flex-direction:column;gap:12px}

/* Hero (home) */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:-8% 0 0 0;z-index:0;will-change:transform}
.hero-bg img{width:100%;height:116%;object-fit:cover;object-position:center 45%}
.hero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(10,14,24,.6) 0%,rgba(10,14,24,.3) 34%,rgba(10,14,24,.5) 66%,rgba(10,14,24,.92) 100%),radial-gradient(120% 90% at 50% 22%,rgba(234,51,36,.16),transparent 60%)}
.hero-inner{position:relative;z-index:4;width:100%;max-width:1020px;margin:0 auto;padding:120px 24px 96px;text-align:center}
.hero h1{font-family:"Poppins","Jost",system-ui,sans-serif;font-weight:800;font-size:clamp(3.1rem,9.4vw,7rem);letter-spacing:-.03em;line-height:.9;margin:20px auto 0;max-width:14ch;text-shadow:0 2px 40px rgba(0,0,0,.35)}
.hero h1 em{font-style:normal;color:var(--gold);white-space:nowrap}
.hero p.lede{font-size:clamp(17px,2.1vw,20px);max-width:60ch;margin:26px auto 0;color:rgba(255,255,255,.9);line-height:1.6}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:38px}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(255,255,255,.65);font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.scroll-cue .dot{width:22px;height:34px;border:1.5px solid rgba(255,255,255,.5);border-radius:2px;position:relative}
.scroll-cue .dot::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;background:var(--gold-soft);border-radius:2px;transform:translateX(-50%);animation:cue 1.7s var(--ease) infinite}
@keyframes cue{0%{opacity:0;transform:translate(-50%,0)}40%{opacity:1}80%{opacity:0;transform:translate(-50%,10px)}100%{opacity:0}}
/* studio44-style hero foot: scroll label + ticker + social */
.hero-foot{position:absolute;left:0;right:0;bottom:0;z-index:5;display:flex;align-items:center;gap:clamp(16px,3vw,40px);padding:0 clamp(20px,3.5vw,52px) 22px}
.hero-scroll{display:inline-flex;align-items:center;gap:9px;color:rgba(255,255,255,.72);font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;white-space:nowrap}
.hero-scroll svg{width:13px;height:13px;animation:bob 1.8s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
.hero-ticker{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
.ticker-track{display:flex;align-items:center;width:max-content;animation:ticker 34s linear infinite;color:rgba(255,255,255,.5);font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:600}
.ticker-track span{display:inline-flex;align-items:center;white-space:nowrap;padding:0 22px}
.ticker-track span::before{content:"";width:6px;height:6px;background:var(--gold);margin-right:22px;flex:0 0 auto}
@keyframes ticker{to{transform:translateX(-50%)}}
.hero-social{display:flex;gap:14px;flex:0 0 auto}
.hero-social a{color:rgba(255,255,255,.72);transition:color .2s}
.hero-social a:hover{color:#fff}
.hero-social svg{width:17px;height:17px}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}.hero-scroll svg{animation:none}}
@media (max-width:700px){.hero-ticker,.hero-social{display:none}.hero-foot{justify-content:center;padding-bottom:16px}}

/* ===== studio44-style hero FX: light lines + equalizer columns ===== */
.hero-fx{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;mix-blend-mode:screen}
.fx-lines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.045) 0 1px,transparent 1px 5px);opacity:.6}
.fx-sweep{position:absolute;left:0;right:0;top:0;height:36%;background:linear-gradient(180deg,transparent,rgba(255,255,255,.09),transparent);animation:fxsweep 7.5s linear infinite}
@keyframes fxsweep{0%{transform:translateY(-110%)}100%{transform:translateY(340%)}}
.fx-eq{position:absolute;inset:0;display:flex;gap:2px;padding:0 2px}
.fx-eq i{flex:1;position:relative;align-self:stretch;overflow:hidden}
.fx-eq i::after{content:"";position:absolute;left:0;right:0;bottom:0;height:100%;background:linear-gradient(to top,rgba(255,255,255,.24) 0%,rgba(255,255,255,.08) 45%,transparent 100%);transform-origin:bottom;transform:scaleY(.12);animation:fxeq 1.8s ease-in-out infinite}
@keyframes fxeq{0%,100%{transform:scaleY(.1)}50%{transform:scaleY(.6)}}
@media (prefers-reduced-motion:reduce){.fx-sweep{animation:none;opacity:.4}.fx-eq i::after{animation:none;transform:scaleY(.28)}}
/* cinematic film grain over heroes */
.hero::after,.pagehero::after{content:"";position:absolute;inset:-24px;z-index:3;pointer-events:none;opacity:.34;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");background-size:180px 180px;animation:grain .42s steps(4) infinite}
@keyframes grain{0%{transform:translate(0,0)}33%{transform:translate(-6px,4px)}66%{transform:translate(5px,-5px)}100%{transform:translate(0,0)}}
@media (prefers-reduced-motion:reduce){.hero::after,.pagehero::after{animation:none}}
/* hero image sliced into animated vertical columns (studio44 signature) */
.hero-fx{display:none}      /* removes the old-TV scan lines + rolling sweep */
.hero-bg.sliced,.pagehero-bg.sliced{display:flex;gap:1px;overflow:hidden;background:#0a0a0b}
.sliced .slice{position:relative;flex:1;height:100%;overflow:hidden}
.sliced .slice img{position:absolute;top:0;left:calc(var(--i) * -100%);width:calc(var(--n) * 100%);max-width:none;height:100%;object-fit:cover;object-position:center}

/* Cinematic page hero (secondary pages): full-bleed image, same content position everywhere */
.pagehero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.pagehero-bg{position:absolute;inset:-8% 0 0 0;z-index:0;will-change:transform}
.pagehero-bg img{width:100%;height:116%;object-fit:cover;object-position:center 42%}
.pagehero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(10,14,24,.66) 0%,rgba(10,14,24,.28) 40%,rgba(10,14,24,.5) 72%,rgba(10,14,24,.94) 100%),radial-gradient(120% 80% at 15% 100%,rgba(234,51,36,.18),transparent 60%)}
.pagehero-inner{position:relative;z-index:4;width:100%;padding:0 24px clamp(46px,7vw,84px)}
.crumb{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);display:flex;gap:10px;align-items:center;margin-bottom:20px;font-weight:600}
.crumb a{color:#fff;opacity:.8}
.crumb a:hover{opacity:1}
.crumb .sep{opacity:.45}
.pagehero h1{font-family:"Poppins","Jost",system-ui,sans-serif;font-weight:800;font-size:clamp(2.8rem,7.4vw,5.4rem);letter-spacing:-.03em;line-height:.92;max-width:14ch;text-shadow:0 2px 40px rgba(0,0,0,.35)}
.pagehero p{color:rgba(255,255,255,.9);font-size:clamp(17px,2vw,20px);margin-top:22px;max-width:54ch;line-height:1.55}

/* generic section heads */
.sec{padding:clamp(64px,8vw,110px) 0}
.sec.cream{background:var(--cream)}
.sec.paper{background:var(--paper)}
.sec.ink{background:var(--ink);color:#fff}
.sec-head{max-width:64ch}
.sec-head.center{margin:0 auto;text-align:center}
.sec-head h2{font-size:clamp(2rem,4.4vw,3.2rem);margin-top:14px}
.sec-head.ink h2,.sec.ink h2{color:#fff}
.sec-head p{color:var(--muted);margin-top:16px;font-size:18px}
.sec.ink .sec-head p{color:var(--muted-light)}

/* Split feature */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.split.rev .split-media{order:2}
.split-media{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:5/4}
.split-media img{width:100%;height:100%;object-fit:cover}
.split-body h2{font-size:clamp(1.9rem,4vw,3rem);margin-top:12px}
.split-body h3{font-size:clamp(1.6rem,3vw,2.2rem)}
.split-body p{color:var(--muted);margin-top:16px;font-size:18px}
.sec.ink .split-body p{color:var(--muted-light)}
.split-body .btn{margin-top:26px}
.tagchip{position:absolute;left:18px;bottom:18px;background:rgba(16,24,38,.72);color:#fff;padding:9px 16px;border-radius:var(--r-btn);font-size:13px;font-weight:600;letter-spacing:.04em;backdrop-filter:blur(6px)}

/* scripture card */
.scripture{margin-top:28px;padding:20px 26px;border-left:3px solid var(--gold);background:var(--paper);border-radius:0 var(--r) var(--r) 0;box-shadow:var(--shadow-soft)}
.sec.ink .scripture{background:var(--ink-2)}
.scripture q{font-family:"Jost";font-size:19px;font-style:italic;color:var(--text);quotes:none;display:block;line-height:1.4}
.sec.ink .scripture q{color:#fff}
.scripture cite{display:block;margin-top:8px;font-size:14px;font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.sec.ink .scripture cite{color:var(--gold-soft)}

/* pillar image cards */
.pillar-cards{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:52px}
.pillar{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:430px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow)}
.pillar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.pillar:hover img{transform:scale(1.05)}
.pillar::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,16,27,.92) 8%,rgba(11,16,27,.35) 55%,rgba(11,16,27,.12) 100%)}
.pillar-body{position:relative;z-index:2;padding:34px 32px 32px}
.pillar-body .kicker{display:inline-block;font-weight:700;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:12px}
.pillar-body h3{font-size:1.9rem;font-weight:600}
.pillar-body p{color:rgba(255,255,255,.86);margin-top:12px;font-size:16.5px;max-width:44ch}

/* three service cards */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:48px}
.svc{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 28px;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.svc:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.svc .ic{width:50px;height:50px;border-radius:2px;background:var(--ink);color:var(--gold);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.svc .ic svg{width:25px;height:25px}
.svc h3{font-family:"Jost";font-weight:700;font-size:20px}
.svc p{color:var(--muted);margin-top:10px;font-size:16px}
.svc ul{list-style:none;margin-top:14px;display:flex;flex-direction:column;gap:8px}
.svc li{font-size:16px;color:var(--text);padding-left:22px;position:relative}
.svc li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:50%;background:var(--gold)}

/* stats */
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:8px auto 0;max-width:820px}
.stat{text-align:center}
.stat .num{font-family:"Jost";font-weight:600;font-size:clamp(2.6rem,6vw,3.8rem);letter-spacing:-.02em;line-height:1}
.sec.ink .stat .num{color:#fff}
.stat .num .plus{color:var(--gold)}
.stat .lbl{margin-top:10px;font-size:14.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.sec.ink .stat .lbl{color:var(--muted-light)}
.stat{display:flex;flex-direction:column;justify-content:flex-end}
.num-kicker{font-size:clamp(13px,1.5vw,16px);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:2px;line-height:1}
.sec.ink .num-kicker,.nations .num-kicker{color:var(--muted-light)}

/* animated equalizer graphic behind a stats band */
.sec>.wrap{position:relative;z-index:1}
.stat-wave{position:absolute;left:0;right:0;bottom:0;height:56%;z-index:0;display:flex;align-items:flex-end;gap:5px;padding:0 clamp(18px,5vw,80px);pointer-events:none;opacity:.26;-webkit-mask-image:linear-gradient(to top,#000,transparent);mask-image:linear-gradient(to top,#000,transparent)}
.stat-wave i{flex:1;background:var(--gold);transform-origin:bottom;transform:scaleY(.1);animation:fxeq 1.9s ease-in-out infinite;border-radius:2px 2px 0 0}
@media (prefers-reduced-motion:reduce){.stat-wave i{animation:none;transform:scaleY(.42)}}

/* magazine flush: split image edge-to-edge, full section height */
.sec.flush{padding:0;overflow:hidden}
.sec.flush .split{max-width:none;padding:0;gap:0;align-items:stretch}
.sec.flush .split-media{border-radius:0;box-shadow:none;aspect-ratio:auto;align-self:stretch;min-height:min(80vh,600px)}
.sec.flush .split.rev .split-media{order:2}
.sec.flush .split-body{padding:clamp(48px,7vw,92px) clamp(24px,6vw,80px);align-self:center;max-width:640px}
.sec.flush .split-media .tagchip{left:24px;bottom:24px}

/* magazine flush gallery: edge-to-edge, no gaps */
.gallery.flush{gap:0;margin-top:0}
.gallery.flush figure{border-radius:0}
.sec.flush-bottom{padding-bottom:0}

/* interactive world map (impact): full-bleed background + overlay UI */
.mapsec{background:var(--ink);color:#fff;overflow:hidden;position:relative}
.mapsec .sec-head h2{color:#fff}
.mapsec .sec-head p{color:var(--muted-light)}
.map-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.map-bg::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(20,20,22,.88) 0%,rgba(20,20,22,.25) 30%,rgba(20,20,22,.35) 70%,rgba(20,20,22,.9) 100%)}
.map-center{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%)}
.map-zoom{position:relative;transform-origin:0 0;--mz:1;transition:transform 1.4s cubic-bezier(.5,0,.15,1)}
.wmap{width:100%;height:auto;display:block;opacity:.85}
.wmap path,.wmap polygon{fill:#232529;stroke:#141416;stroke-width:.5}
.map-arcs{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.map-arcs path{fill:none;vector-effect:non-scaling-stroke;stroke:var(--gold);stroke-width:2.2px;opacity:0;transition:opacity .3s}
.map-arcs path.draw{opacity:1;transition:stroke-dashoffset 1.1s var(--ease),opacity .25s}
.map-arcs path.on{opacity:1;stroke-dasharray:5 4;animation:arcdash 1.1s linear infinite}
@keyframes arcdash{to{stroke-dashoffset:-9}}
.map-reset{position:absolute;top:20px;right:clamp(20px,3.5vw,52px);z-index:6;border:1px solid rgba(255,255,255,.4);background:rgba(20,20,22,.6);backdrop-filter:blur(4px);color:#fff;font-family:"Jost";font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;padding:9px 16px;border-radius:999px;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s}
.mapsec.zoomed .map-reset{opacity:1;visibility:visible}
.map-reset:hover{border-color:var(--gold);color:var(--gold-soft)}
.mpin{position:absolute;transform:translate(-50%,-50%) scale(calc(1/var(--mz,1)));transition:transform 1.4s cubic-bezier(.5,0,.15,1);width:34px;height:34px;background:none;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;pointer-events:auto}
.mpin i{width:9px;height:9px;border-radius:50%;background:var(--gold);display:block;position:relative;transition:transform .25s var(--ease)}
.mpin i::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1.5px solid rgba(234,51,36,.55);animation:pinpulse 2.2s ease-out infinite}
.mpin:hover i,.mpin.on i{transform:scale(1.5)}
.mpin.on i{box-shadow:0 0 18px rgba(234,51,36,.9)}
.mpin:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:50%}
@keyframes pinpulse{0%{transform:scale(.4);opacity:1}100%{transform:scale(1.8);opacity:0}}
/* overlay UI */
.map-ui{position:relative;z-index:2;display:flex;flex-direction:column;min-height:min(94vh,920px)}
.map-foot{margin-top:auto;display:grid;grid-template-columns:1fr minmax(300px,430px);gap:clamp(24px,4vw,56px);align-items:end;padding-top:clamp(220px,32vh,340px)}
.map-chips{display:flex;flex-wrap:wrap;gap:10px;align-content:end}
.map-chip{border:1px solid rgba(255,255,255,.28);background:rgba(20,20,22,.5);backdrop-filter:blur(4px);color:var(--muted-light);font-family:"Jost";font-weight:600;font-size:15px;padding:10px 18px;border-radius:999px;cursor:pointer;transition:all .25s var(--ease);min-height:42px}
.map-chip:hover{border-color:var(--gold);color:#fff}
.map-chip.on{background:var(--gold);border-color:var(--gold);color:#fff}
.map-panel{background:rgba(20,20,22,.74);backdrop-filter:blur(12px);border:1px solid var(--line-ink);border-left:2px solid var(--gold);border-radius:var(--r);padding:20px 22px 24px}
.map-panel h3{font-family:"Poppins","Jost",sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(1.3rem,2.2vw,1.8rem);margin-top:10px;color:#fff}
.map-panel p{color:var(--muted-light);margin-top:10px;font-size:16px}
.mp-photo{aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;margin-bottom:16px;background:var(--ink-3)}
.mp-photo img{width:100%;height:100%;object-fit:cover;transition:opacity .3s var(--ease)}
.mp-photo img.fade{opacity:0}
.mp-fact{color:var(--gold-soft);font-weight:600;font-size:15.5px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line-ink)}
.mp-link{display:none;margin-top:16px;padding:11px 22px}
.mp-link.show{display:inline-flex}
@media (prefers-reduced-motion:reduce){.map-zoom,.mpin{transition:none}.mpin i::after{animation:none;opacity:.4}.map-arcs path.on{animation:none}}
@media (max-width:960px){
  .map-foot{grid-template-columns:1fr;padding-top:clamp(180px,30vh,280px)}
  .map-center svg.wmap{width:190%;margin-left:-45%}
  .map-center .map-arcs{width:190%;left:-45%}
  .mpin{margin-left:0}
}

/* faint equalizer graphic behind CTA bands */
.cta-band{overflow:hidden}
.cta-band>.wrap{position:relative;z-index:1}
.cta-band .stat-wave{opacity:.16}

/* team magazine spreads */
.role-line{color:var(--gold-deep);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:13px;margin-top:10px}
.split-body .role-line + p{margin-top:14px}

/* edge-to-edge instagram strip */
.ig-grid.flush{width:100vw;margin-left:calc(50% - 50vw);gap:0;margin-top:36px;grid-template-columns:repeat(6,1fr)}
.ig-grid.flush .ig-tile{border-radius:0}
@media(max-width:700px){.ig-grid.flush{grid-template-columns:repeat(3,1fr)}}

/* nations signature band */
.nations{position:relative;color:#fff;padding:clamp(90px,13vw,150px) 0;overflow:hidden;background:var(--ink-2)}
.nations-bg{position:absolute;inset:-12% 0;z-index:0;will-change:transform}
.nations-bg img{width:100%;height:124%;object-fit:cover;object-position:center 45%}
.nations::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(16,24,38,.86),rgba(16,24,38,.8)),radial-gradient(90% 60% at 50% 0,rgba(234,51,36,.18),transparent 55%)}
.nations .wrap{position:relative;z-index:2;text-align:center}
.nations h2{font-size:clamp(2.2rem,5.5vw,3.8rem);font-weight:600}
.nations h2 .hl{color:var(--gold)}
.nations .sub{color:var(--muted-light);max-width:56ch;margin:18px auto 0;font-size:18px}
.nations .stat-row{margin-top:50px}
.country-strip{margin-top:50px;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.country-track{display:flex;gap:16px;width:max-content;animation:marquee 32s linear infinite}
.country-strip:hover .country-track{animation-play-state:paused}
.country-track .c{font-family:"Jost";font-weight:500;font-size:22px;color:rgba(255,255,255,.9);border:1px solid var(--line-ink);padding:11px 24px;border-radius:var(--r-btn);white-space:nowrap;display:flex;align-items:center;gap:12px}
.country-track .c::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* country cards (impact) */
.country-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-top:50px}
.country-card{background:var(--paper);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-soft);transition:transform .3s var(--ease),box-shadow .3s var(--ease);display:flex;flex-direction:column}
.country-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.country-card .cimg{aspect-ratio:16/10;overflow:hidden}
.country-card .cimg img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.country-card:hover .cimg img{transform:scale(1.06)}
.country-card .cbody{padding:24px 26px 28px;flex:1}
.country-card .cbody h3{font-family:"Jost";font-weight:600;font-size:1.5rem}
.country-card .cbody p{color:var(--muted);margin-top:9px;font-size:16px}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:180px;gap:14px;margin-top:48px}
.gallery figure{overflow:hidden;border-radius:var(--r);position:relative}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.gallery figure:hover img{transform:scale(1.07)}
.gallery .tall{grid-row:span 2}
.gallery .wide{grid-column:span 2}

/* team */
.team-lead{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center;margin-top:8px}
.team-lead-media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:1/1}
.team-lead-media img{width:100%;height:100%;object-fit:cover}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;margin-top:48px}
.member{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.member:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.member .mimg{aspect-ratio:1/1;overflow:hidden;background:var(--cream-2)}
.member .mimg img{width:100%;height:100%;object-fit:cover;filter:saturate(1.02)}
.member .mbody{padding:22px 24px 26px}
.member .role{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep)}
.member h3{font-family:"Jost";font-weight:600;font-size:1.35rem;margin-top:6px}
.member p{color:var(--muted);margin-top:10px;font-size:16px}

/* Give module */
.give-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center}
.give-copy h2{font-size:clamp(2rem,4.4vw,3.25rem);font-weight:600}
.give-copy h2 .hl{color:var(--gold)}
.give-copy p{color:var(--muted-light);margin-top:18px;font-size:18px;max-width:46ch}
.give-copy .proof{display:flex;gap:12px;margin-top:26px;align-items:flex-start;font-size:16px;color:var(--muted-light)}
.give-copy .proof svg{width:20px;height:20px;color:var(--gold-soft);flex:0 0 auto;margin-top:2px}
.give-card{background:var(--paper);color:var(--text);border-radius:var(--r-lg);padding:30px;box-shadow:var(--shadow)}
.give-card h3{font-family:"Jost";font-weight:700;font-size:18px}
.toggle{display:flex;background:var(--cream-2);border-radius:var(--r-btn);padding:5px;margin-top:16px}
.toggle button{flex:1;border:0;background:transparent;font-family:"Jost";font-weight:600;font-size:16px;padding:11px;border-radius:var(--r-btn);cursor:pointer;color:var(--muted);transition:all .25s var(--ease)}
.toggle button.active{background:var(--ink);color:#fff;box-shadow:var(--shadow-soft)}
.amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}
.amounts button{border:1.5px solid var(--line);background:var(--paper);border-radius:2px;padding:16px 8px;font-family:"Jost";font-weight:700;font-size:19px;cursor:pointer;transition:all .2s var(--ease);color:var(--text)}
.amounts button small{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:3px}
.amounts button:hover{border-color:var(--gold)}
.amounts button.active{border-color:var(--gold);background:#fdf6e8;box-shadow:0 0 0 3px rgba(234,51,36,.2)}
.give-note{font-size:14px;color:var(--muted);margin-top:14px;line-height:1.5}
.give-card .btn{width:100%;margin-top:18px}

/* ways to give */
.ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:44px}
.way{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 26px}
.way .ic{width:46px;height:46px;border-radius:2px;background:var(--ink);color:var(--gold);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.way .ic svg{width:22px;height:22px}
.way h3{font-family:"Jost";font-weight:700;font-size:18px}
.way p{color:var(--muted);margin-top:8px;font-size:16px}
.way address{font-style:normal;color:var(--text);font-size:16px;margin-top:8px;line-height:1.5}

/* pull quote */
.pull{text-align:center;max-width:820px;margin:0 auto}
.pull q{font-family:"Jost";quotes:none;font-style:italic;font-size:clamp(1.6rem,3.6vw,2.5rem);font-weight:500;line-height:1.3;display:block}
.sec.ink .pull q{color:#fff}
.pull cite{display:block;margin-top:18px;font-style:normal;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:14px;color:var(--gold-deep)}
.sec.ink .pull cite{color:var(--gold-soft)}

/* beliefs */
.belief-list{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:48px}
.belief-item{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 28px;display:flex;gap:18px}
.belief-item .n{font-family:"Jost";font-weight:600;font-size:1.5rem;color:var(--gold-deep);flex:0 0 auto;line-height:1.2}
.belief-item p{color:var(--text);font-size:16.5px;line-height:1.6}

/* instagram grid */
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:44px}
.ig-tile{position:relative;aspect-ratio:1/1;overflow:hidden;border-radius:var(--r);display:block}
.ig-tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.ig-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(16,24,38,.5),transparent 55%);opacity:0;transition:opacity .3s var(--ease)}
.ig-tile .ig-ic{position:absolute;right:12px;bottom:12px;z-index:2;color:#fff;opacity:0;transform:translateY(6px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.ig-tile .ig-ic svg{width:22px;height:22px}
.ig-tile:hover img{transform:scale(1.06)}
.ig-tile:hover::after,.ig-tile:hover .ig-ic{opacity:1;transform:none}
.ig-cta{text-align:center;margin-top:32px}
.ig-handle{color:var(--gold-deep);font-weight:600}

/* full-bleed image quote band */
.imgquote{position:relative;color:#fff;padding:clamp(96px,15vw,180px) 0;overflow:hidden;background:var(--ink)}
.imgquote-bg{position:absolute;inset:-12% 0;z-index:0;will-change:transform}
.imgquote-bg img{width:100%;height:124%;object-fit:cover;object-position:center 38%}
.imgquote::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to right,rgba(10,14,24,.9),rgba(10,14,24,.55) 60%,rgba(10,14,24,.75)),radial-gradient(80% 90% at 10% 50%,rgba(234,51,36,.16),transparent 60%)}
.imgquote .wrap{position:relative;z-index:2}
.imgquote .eyebrow{margin-bottom:22px}
.imgquote q{font-family:"Poppins","Jost",sans-serif;quotes:none;display:block;font-weight:800;text-transform:uppercase;font-size:clamp(2rem,5vw,3.8rem);line-height:1;letter-spacing:-.02em;max-width:16ch}
.imgquote q .hl{color:var(--gold)}
.imgquote cite{display:block;margin-top:22px;font-style:normal;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:14px;color:var(--gold-soft)}

/* CTA band */
.cta-band{background:var(--ink);color:#fff;text-align:center;padding:clamp(70px,9vw,120px) 0}
.cta-band h2{font-size:clamp(2rem,5vw,3.4rem);font-weight:600;max-width:20ch;margin:0 auto}
.cta-band h2 .hl{color:var(--gold)}
.cta-band p{color:var(--muted-light);max-width:52ch;margin:20px auto 0;font-size:18px}
.cta-band .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}

/* contact form */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:start}
.form-card{background:var(--paper);border-radius:var(--r-lg);padding:32px 30px;box-shadow:var(--shadow)}
.field{margin-top:16px}
.field label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px;letter-spacing:.02em}
.field input,.field textarea{width:100%;font-family:"Jost";font-size:16px;padding:14px 16px;border:1.5px solid var(--line);border-radius:2px;background:#fff;color:var(--text);transition:border-color .2s;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(234,51,36,.16)}
.form-card .btn{width:100%;margin-top:20px}
.fineprint{font-size:13px;color:var(--muted);margin-top:12px;text-align:center}
.contact-info .block{padding:22px 0;border-bottom:1px solid var(--line)}
.contact-info .block:first-child{padding-top:0}
.contact-info h3{font-family:"Jost";font-weight:700;font-size:16px;letter-spacing:.02em}
.contact-info p,.contact-info address{color:var(--muted);font-size:16px;font-style:normal;margin-top:6px;line-height:1.55}
.contact-info a{color:var(--gold-deep);font-weight:600}
.socials{display:flex;gap:12px;margin-top:12px}
.socials a{width:44px;height:44px;border-radius:2px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:background .2s,border-color .2s,color .2s}
.socials a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.socials svg{width:19px;height:19px}

/* Footer */
.footer{background:var(--ink);color:#fff;padding:clamp(56px,7vw,84px) 0 32px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px}
.foot-brand .brand{margin-bottom:16px}
.foot-brand p{color:var(--muted-light);font-size:16px;max-width:32ch;line-height:1.6}
.foot-brand .socials a{border-color:var(--line-ink);color:#fff}
.foot-brand .socials a:hover{background:var(--ink-3);border-color:var(--gold)}
.foot-col h4{font-family:"Jost";font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:16px}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.foot-col a,.foot-col address{color:var(--muted-light);font-size:16px;font-style:normal;line-height:1.55;transition:color .2s}
.foot-col a:hover{color:#fff}
.foot-bottom{border-top:1px solid var(--line-ink);margin-top:44px;padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;color:var(--muted-light);font-size:13.5px}
.foot-bottom .credit a{color:var(--gold-soft);font-weight:600}

/* mobile give bar */
.give-bar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:none;background:var(--ink);border-top:1px solid var(--line-ink);padding:12px 16px calc(12px + env(safe-area-inset-bottom));gap:12px;align-items:center;justify-content:space-between;box-shadow:0 -10px 30px -18px rgba(0,0,0,.6)}
.give-bar span{color:#fff;font-family:"Jost";font-weight:600;font-size:16px}
.give-bar .btn{padding:12px 22px}

/* reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}
body.static .reveal{opacity:1 !important;transform:none !important}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important;transform:none !important;transition:none}
  .country-track{animation:none}.scroll-cue .dot::after{animation:none}
  .hero-bg,.nations-bg{transform:none !important}
}

/* ===== Lively effects & animations ===== */
/* scroll progress bar */
.progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--gold);z-index:80;transition:width .12s linear;box-shadow:0 0 12px rgba(234,51,36,.6)}
/* button sheen sweep */
.btn-gold{position:relative;overflow:hidden}
.btn-gold::before{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);transition:left .6s var(--ease);pointer-events:none}
.btn-gold:hover::before{left:140%}
/* The real mark's equalizer is a dot matrix, not solid bars, so it must never be
   scaled: stretching a column turns its squares into rectangles and the logo stops
   being their logo. The columns hold still in the chrome and only breathe on the
   loading screen, where opacity reads as a level meter and the shape is untouched. */
.mark .bar{animation:none}
.loader .mark .bar{animation:eqdot 1.3s ease-in-out infinite}
.loader .mark .b1{animation-delay:0s}.loader .mark .b2{animation-delay:.16s}
.loader .mark .b3{animation-delay:.32s}.loader .mark .b4{animation-delay:.12s}
.loader .mark .b5{animation-delay:.24s}

/* loading screen */
.loader{position:fixed;inset:0;z-index:200;background:var(--ink);display:flex;align-items:center;justify-content:center;transition:opacity .6s var(--ease),visibility .6s var(--ease)}
.loader.done{opacity:0;visibility:hidden;pointer-events:none}
.loader-inner{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.loader .mark{width:74px;height:74px}
.loader-word{font-family:"Jost";font-weight:700;font-size:16px;letter-spacing:.24em;text-transform:uppercase;color:#fff}
.loader-tag{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-soft);margin-top:-6px}
.loader-bar{width:128px;height:2px;background:rgba(255,255,255,.14);border-radius:2px;overflow:hidden;margin-top:8px}
.loader-bar::after{content:"";display:block;height:100%;width:40%;background:var(--gold);animation:loaderSlide 1.15s var(--ease) infinite}
@keyframes loaderSlide{0%{transform:translateX(-120%)}100%{transform:translateX(340%)}}
@media (prefers-reduced-motion:reduce){.loader-bar::after{animation:none;width:100%}}
@keyframes eqdot{0%,100%{opacity:.5}50%{opacity:1}}
/* ken burns drift on full-bleed imagery */
@media (prefers-reduced-motion:no-preference){
  .imgquote-bg img,.nations-bg img{animation:kenburns 32s ease-in-out infinite alternate;transform-origin:center}
  /* hero entrance stagger */
  .hero-inner>*{opacity:0;animation:heroUp .95s var(--ease) forwards}
  .hero-inner>*:nth-child(1){animation-delay:.12s}
  .hero-inner>*:nth-child(2){animation-delay:.26s}
  .hero-inner>*:nth-child(3){animation-delay:.42s}
  .hero-inner>*:nth-child(4){animation-delay:.58s}
}
@keyframes kenburns{from{transform:scale(1.01)}to{transform:scale(1.09)}}
@keyframes heroUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
body.static .hero-inner>*{opacity:1 !important;animation:none !important}
@media (prefers-reduced-motion:reduce){
  .loader .mark .bar{animation:none;opacity:1}
  .hero-bg img,.pagehero-bg img,.imgquote-bg img,.nations-bg img{animation:none}
  .btn-gold::before{display:none}
  .progress{display:none}
}

/* ===== awwwards layer: rock / indie / magazine ===== */
::selection{background:var(--gold);color:#fff}

/* outlined-text marquee bands (rock poster dividers) */
.mq{padding:clamp(20px,3vw,34px) 0;overflow:hidden;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mq.dark{background:var(--ink);border-color:var(--line-ink)}
.mq-track{display:flex;align-items:baseline;gap:clamp(28px,4vw,56px);width:max-content;animation:marquee 30s linear infinite;font-family:"Poppins","Jost",sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(2.4rem,6vw,4.6rem);line-height:1;letter-spacing:-.02em;will-change:transform}
.mq:hover .mq-track{animation-play-state:paused}
.mq-track span{white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.mq-track span.solid{color:var(--ink);-webkit-text-stroke:0}
.mq.dark .mq-track span{-webkit-text-stroke:1.5px rgba(255,255,255,.75)}
.mq.dark .mq-track span.solid{color:var(--gold);-webkit-text-stroke:0}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none}}

/* cursor follower (fine pointers only) */
.cur{position:fixed;left:0;top:0;z-index:300;width:34px;height:34px;border:1.5px solid var(--gold);border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);opacity:0;transition:width .25s var(--ease),height .25s var(--ease),opacity .3s,background .25s}
.cur.show{opacity:.9}
.cur.big{width:56px;height:56px;background:rgba(234,51,36,.12)}
@media (pointer:coarse){.cur{display:none}}

/* word-rise headings */
.lw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em}
.lw i{display:inline-block;font-style:normal;transform:translateY(115%);transition:transform .75s var(--ease)}
.lines-in .lw i{transform:none}
body.static .lw i{transform:none !important;transition:none}
@media (prefers-reduced-motion:reduce){.lw i{transform:none !important;transition:none}}

/* magazine image wipes on flush splits */
.sec.flush .split-media img{clip-path:inset(0 100% 0 0);transition:clip-path 1.1s var(--ease) .15s}
.sec.flush .split-media.in img,body.static .sec.flush .split-media img{clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion:reduce){.sec.flush .split-media img{clip-path:none;transition:none}}

/* grain on cinematic quote bands */
.imgquote::after{content:"";position:absolute;inset:-24px;z-index:2;pointer-events:none;opacity:.3;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");background-size:180px 180px;animation:grain .42s steps(4) infinite}
@media (prefers-reduced-motion:reduce){.imgquote::after{animation:none}}

/* footer mega wordmark (magazine end sheet) */
/* The clamp floor used to be 2.6rem, which is wider than a 390px phone can hold:
   the wordmark is nowrap, so the red beat was cut off at the screen edge and the
   page scrolled 4px sideways. Below ~438px the vw term now governs and it fits. */
.foot-mega{font-family:"Poppins","Jost",sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(2rem,9.5vw,8.6rem);line-height:.95;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.16);white-space:nowrap;margin-bottom:clamp(36px,5vw,64px);user-select:none}
.foot-mega .beat{color:var(--gold);-webkit-text-stroke:0}

/* ===== the real logo =====
   Their Illustrator lockup, so the wordmark is their own letterforms rather than
   the site's Jost. Sized so the wordmark's cap height matches the 19px text it
   replaced, and it steps down on phones so it never crowds the Menu button. */
.brand .logo{display:block;height:clamp(25px,2.3vw,32px);width:auto}
.foot-brand .brand .logo{height:34px}
.overlay-top .brand .logo{height:28px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* ===== film band (Vimeo, click to play) =====
   Nothing loads from Vimeo until the poster is clicked, so this band is one of
   their own photographs until then. */
.film-band{background:var(--ink);color:#fff;padding:clamp(64px,8vw,110px) 0}
.film-band.ink-2{background:var(--ink-2)}
.film-head{max-width:56ch}
.film-head h2{font-family:"Poppins","Jost",system-ui,sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.02em;font-size:clamp(2rem,4.4vw,3.2rem);margin-top:14px;color:#fff}
.film-head p{color:var(--muted-light);margin-top:16px;font-size:18px;max-width:60ch}
.film{position:relative;margin:clamp(32px,4vw,52px) 0 0;aspect-ratio:16/9;background:var(--ink-3);border-radius:var(--r-lg);overflow:hidden}
.film::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,.16),rgba(255,255,255,.02) 42%,transparent);mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);mask-composite:exclude;padding:1px}
.film iframe{width:100%;height:100%;border:0;display:block}
.film-play{position:absolute;inset:0;width:100%;padding:0;border:0;background:none;cursor:pointer;display:block;overflow:hidden}
.film-play img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.film-play:hover img,.film-play:focus-visible img{transform:scale(1.035)}
.film-blank{position:absolute;inset:0;background:var(--ink-3)}
/* The vignette is the load-bearing part: on a bright poster like the Chennai
   handover, a plain bottom-up gradient is thin at the midpoint and the white
   label drops under AA contrast right where the button sits. */
.film-scrim{position:absolute;inset:0;background:radial-gradient(ellipse 48% 42% at 50% 50%,rgba(8,10,14,.62),rgba(8,10,14,0) 72%),linear-gradient(to top,rgba(10,12,16,.72),rgba(10,12,16,.2) 55%,rgba(10,12,16,.44))}
/* Spans the full frame rather than sitting at left:50%. Anchored at the midpoint
   the button only had half the width to work with, so on a phone the label broke
   into "PLAY THE / FILM . 2 / MIN". */
.film-btn{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:14px;color:#fff;padding:0 16px}
.film-btn svg{width:30px;height:30px;padding:21px 19px 21px 23px;box-sizing:content-box;border-radius:50%;background:var(--gold);box-shadow:0 16px 40px -14px rgba(232,54,36,.9);transition:transform .25s var(--ease),background .25s var(--ease)}
.film-play:hover .film-btn svg,.film-play:focus-visible .film-btn svg{transform:scale(1.08);background:var(--gold-deep)}
.film-btn-label{font-family:"Jost";font-weight:600;font-size:13px;letter-spacing:.2em;text-transform:uppercase;display:flex;align-items:center;gap:10px;white-space:nowrap;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.film-btn-label em{font-style:normal;color:var(--muted-light);letter-spacing:.14em}
.film-btn-label em::before{content:"";display:inline-block;width:4px;height:4px;background:var(--gold);margin-right:10px;vertical-align:middle}
.film-play:focus-visible{outline:2px solid var(--gold-soft);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.film-play img{transition:none}.film-play:hover img{transform:none}}
@media (max-width:560px){
  .film{margin-top:26px;border-radius:var(--r)}
  .film-btn svg{width:24px;height:24px;padding:17px 15px 17px 19px}
  .film-btn-label{font-size:12px;letter-spacing:.16em}
}

/* ===== finances & policies =====
   A document index, built after directrelief.org/about/finance. Deliberately
   quiet: no cards, no icon tiles, just one panel of hairline-divided rows, so a
   donor scanning for the 990 finds it in a second. */
.narrow-body{max-width:68ch;margin-top:26px}
.narrow-body p{color:var(--muted);font-size:18px}
.narrow-body p+p{margin-top:18px}

/* one panel split by hairlines, not a row of separately bordered boxes */
.panel-rows{margin-top:clamp(36px,4.5vw,56px);border-top:1px solid var(--line)}
.panel-row{padding:26px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,22ch) minmax(0,1fr);gap:clamp(18px,3vw,48px);align-items:start}
.panel-row h3{font-size:19px;font-weight:600;letter-spacing:-.005em}
.panel-row p{color:var(--muted);font-size:17px;max-width:62ch}

.doclist{list-style:none;margin-top:clamp(32px,4vw,48px);border-top:1px solid var(--line-ink)}
.docrow{display:flex;align-items:center;justify-content:space-between;gap:clamp(18px,3vw,40px);padding:24px 0;border-bottom:1px solid var(--line-ink)}
.docrow-text{min-width:0}
.docrow h3{font-size:19px;font-weight:600;color:#fff;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.docrow-year{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-soft)}
.docrow p{color:var(--muted-light);font-size:16.5px;margin-top:7px;max-width:62ch}
.docrow-action{flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:11px 20px;border:1.5px solid rgba(255,255,255,.28);border-radius:var(--r-btn);color:#fff;font-family:"Jost";font-weight:600;font-size:15px;white-space:nowrap;transition:background .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}
.docrow-action svg{width:17px;height:17px}
.docrow-action:hover{background:rgba(255,255,255,.1);border-color:#fff;transform:translateY(-1px)}
.docrow-action.is-file{background:var(--gold);border-color:var(--gold)}
.docrow-action.is-file:hover{background:var(--gold-deep);border-color:var(--gold-deep)}

.reglist{margin-top:clamp(40px,5vw,64px)}
.reglist-head{font-size:19px;font-weight:600;color:#fff;margin-bottom:20px}
.reglist dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px 32px}
.reglist dt{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-light)}
.reglist dd{margin-top:7px;color:#fff;font-size:17px}
.reglist address{font-style:normal;line-height:1.6}

.askblock{max-width:60ch}
.askblock h2{font-family:"Poppins","Jost",system-ui,sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.02em;font-size:clamp(1.9rem,4vw,2.8rem);margin-top:14px}
.askblock p{color:var(--muted);font-size:18px;margin-top:16px}
.askblock .btn{margin-top:26px}
.askblock .btn svg{width:18px;height:18px}

@media (max-width:700px){
  .panel-row{grid-template-columns:1fr;gap:8px}
  .docrow{flex-direction:column;align-items:flex-start;gap:16px}
  .docrow-action{width:100%;justify-content:center}
}

/* Responsive */
@media (max-width:960px){
  .split,.split.rev .split-media{grid-template-columns:1fr}
  .split.rev .split-media{order:0}
  .give-grid,.give-copy,.team-lead,.contact-grid{grid-template-columns:1fr}
  .pillar-cards{grid-template-columns:1fr}
  .belief-list{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .foot-brand{grid-column:1/-1}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .nav-links,.nav-right .btn{display:none}
  .menu-toggle{display:flex}
  .give-bar{display:flex}
  body{padding-bottom:74px}
}
@media (max-width:560px){
  .wrap{padding:0 20px}
  .stat-row{grid-template-columns:1fr;gap:28px;max-width:320px}
  .svc-grid,.country-grid,.team-grid,.ways,.contact-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .foot-bottom{flex-direction:column;align-items:flex-start}
  .hero-inner{padding:110px 20px 90px}
  .hero-cta{flex-direction:column}
  .hero-cta .btn{width:100%}
  .amounts{grid-template-columns:1fr 1fr}
  .pagehero{min-height:100svh}
  .pagehero-inner{padding-bottom:clamp(56px,15vw,72px)}
  .pagehero h1{font-size:clamp(2.5rem,10vw,3.2rem)}
  .gallery{grid-auto-rows:150px}
}
