.utility-bar { color: rgba(255,255,255,.84); background: var(--forest-950); font-size: .72rem; letter-spacing: .04em; }
.utility-inner { display: flex; justify-content: space-between; align-items: center; min-height: 35px; }
.site-header { position: relative; z-index: 50; background: rgba(255,255,255,.98); border-bottom: 1px solid rgba(3,42,34,.08); }
.site-header.is-sticky { position: sticky; top: 0; box-shadow: 0 10px 35px rgba(3,42,34,.08); }
.nav-shell { display: flex; align-items: center; justify-content: space-between; min-height: 92px; gap: 30px; }
.brand { display: inline-flex; width: auto; min-width: 270px; align-items: center; gap: 13px; color: var(--forest-950); text-decoration: none; }
.brand img { width: 76px; height: 76px; flex: 0 0 76px; object-fit: contain; }
.brand > span { display: flex; align-items: center; gap: 13px; }
.brand strong { font: 750 2.25rem/.9 var(--font-display); letter-spacing: .025em; }
.brand small { padding-left: 13px; border-left: 1px solid rgba(3,42,34,.24); font-size: .72rem; font-weight: 700; line-height: 1.08; }
.main-nav { display: flex; align-items: center; gap: clamp(18px,2.2vw,34px); font-size: .86rem; font-weight: 700; }
.main-nav > a { position: relative; padding: 35px 0; }
.main-nav > a:not(.nav-donate)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 24px; height: 2px; background: var(--gold-500); transition: right .25s; }
.main-nav > a:hover::after, .main-nav > a.is-active::after { right: 0; }
.main-nav .nav-donate { padding: 13px 20px; color: white; background: var(--gold-600); border-radius: 3px; }
.menu-toggle { display: none; border: 0; background: none; }
.home-hero { position: relative; min-height: min(720px,calc(100vh - 127px)); display: grid; align-items: center; overflow: hidden; background: var(--forest-950); color: white; }
.hero-media, .hero-shade { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; }
.hero-shade { background: linear-gradient(90deg, rgba(2,30,24,.98) 0%,rgba(2,30,24,.9) 30%,rgba(2,30,24,.32) 63%,rgba(2,30,24,.12) 100%), linear-gradient(0deg,rgba(2,30,24,.25),transparent 50%); }
.hero-content { position: relative; z-index: 2; padding-block: 100px; }
.hero-copy { width: min(690px,60vw); }
.hero-copy h1 { margin: 18px 0 24px; font: 700 clamp(3.8rem,6.3vw,6.7rem)/.95 var(--font-display); letter-spacing: -.045em; }
.hero-copy > p { max-width: 600px; margin-bottom: 34px; color: rgba(255,255,255,.84); font-size: clamp(1.05rem,1.6vw,1.28rem); }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-proof { display: flex; align-items: center; gap: 13px; margin-top: 46px; color: rgba(255,255,255,.73); font-size: .8rem; font-weight: 650; }
.hero-proof i { width: 5px; height: 5px; border-radius: 50%; background: var(--gold-500); }
.pillar-ribbon { border-bottom: 1px solid var(--line); background: var(--cream-100); }
.pillar-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.pillar-grid article { min-height: 150px; display: flex; align-items: center; gap: 18px; padding: 30px; border-right: 1px solid var(--cream-300); }
.pillar-grid article:first-child { border-left: 1px solid var(--cream-300); }
.pillar-number { align-self: flex-start; margin-top: 3px; color: var(--gold-600); font: italic 1rem var(--font-display); }
.pillar-grid h2 { margin: 0 0 4px; color: var(--forest-900); font: 700 1.16rem/1.25 var(--font-display); }
.pillar-grid p { margin: 0; color: var(--ink-500); font-size: .78rem; line-height: 1.5; }
.legacy-section { background: white; }
.editorial-split { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: clamp(52px,8vw,120px); }
.editorial-copy h2 { margin: 16px 0 30px; color: var(--forest-900); font: 700 clamp(3rem,5vw,5.4rem)/.98 var(--font-display); letter-spacing: -.04em; }
.editorial-copy .lead { margin-bottom: 34px; }
.editorial-image { position: relative; margin: 0; }
.editorial-image > img { width: 100%; aspect-ratio: 1.28; }
.editorial-image figcaption { position: absolute; left: -38px; bottom: -32px; display: grid; width: 240px; padding: 26px; color: white; background: var(--forest-900); }
.editorial-image figcaption b { color: var(--gold-300); font: 700 1.65rem var(--font-display); }
.editorial-image figcaption span { color: rgba(255,255,255,.75); font-size: .82rem; }
.project-section { background: var(--cream-100); }
.project-mosaic { display: grid; grid-template-columns: 1.35fr 1fr 1fr; grid-template-rows: repeat(2,minmax(280px,1fr)); gap: 14px; }
.project-panel { position: relative; min-height: 290px; overflow: hidden; background: var(--forest-900); }
.project-panel-large { grid-row: 1/3; min-height: 620px; }
.project-panel > img { width: 100%; height: 100%; transition: transform .7s var(--ease); }
.project-panel:hover > img { transform: scale(1.04); }
.project-overlay { position: absolute; inset: auto 0 0; padding: 70px 28px 28px; color: white; background: linear-gradient(transparent,rgba(2,30,24,.92)); }
.project-panel-large .project-overlay { padding: 120px 40px 42px; }
.project-overlay > span { color: var(--gold-300); font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.project-overlay h3 { margin: 7px 0 8px; font: 700 clamp(1.55rem,2.5vw,2.8rem)/1.05 var(--font-display); }
.project-overlay p { display: none; max-width: 460px; color: rgba(255,255,255,.76); font-size: .88rem; }
.project-panel-large .project-overlay p { display: block; }
.project-overlay a { display: inline-flex; align-items: center; gap: 18px; margin-top: 10px; font-weight: 800; font-size: .82rem; }
.project-overlay a b { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; }
.events-section { overflow: hidden; background: white; }
.carousel-heading-actions { display: flex; align-items: center; gap: 9px; }
.carousel-heading-actions .button { margin-left: 12px; }
.rail-wrap { overflow: hidden; }
.carousel-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(360px,42%); gap: 22px; overflow-x: auto; padding-bottom: 22px; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--gold-500) var(--cream-200); }
.carousel-rail > * { scroll-snap-align: start; }
.event-card { min-width: 0; border-bottom: 1px solid var(--cream-300); background: white; }
.event-image { position: relative; display: block; overflow: hidden; aspect-ratio: 1.45; }
.event-image > img { width: 100%; height: 100%; transition: transform .6s var(--ease); }
.event-card:hover .event-image > img { transform: scale(1.035); }
.event-image time { position: absolute; top: 18px; left: 18px; display: grid; place-items: center; width: 67px; height: 72px; color: var(--forest-900); background: white; box-shadow: 0 8px 24px rgba(3,42,34,.16); }
.event-image time strong { font: 700 1.75rem/1 var(--font-display); }
.event-image time span { color: var(--gold-700); font-size: .67rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.event-body { padding: 26px 2px; }
.event-body h3 { margin: 9px 0 11px; color: var(--forest-900); font: 700 clamp(1.65rem,2.4vw,2.4rem)/1.08 var(--font-display); }
.event-body > p { color: var(--ink-700); }
.event-place { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--ink-500); font-size: .82rem; }
.impact-band { padding: 86px 0; color: white; background: var(--forest-900); }
.impact-grid { display: grid; grid-template-columns: 1.4fr repeat(4,1fr); align-items: center; }
.impact-intro { padding-right: 55px; }
.impact-intro h2 { margin: 12px 0 0; font: 700 clamp(2.3rem,4vw,4rem)/1.02 var(--font-display); }
.impact-stat { display: grid; min-height: 132px; align-content: center; padding: 0 28px; border-left: 1px solid rgba(255,255,255,.18); }
.impact-stat strong { color: var(--gold-300); font: 700 clamp(2.6rem,4vw,4.5rem)/1 var(--font-display); }
.impact-stat span { color: rgba(255,255,255,.7); font-size: .78rem; }
.stories-section { background: white; }
.story-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.story-grid-two { grid-template-columns: repeat(2,1fr); }
.story-card { min-width: 0; }
.story-image { display: block; aspect-ratio: 1.45; overflow: hidden; background: var(--cream-200); }
.story-image img { width: 100%; height: 100%; transition: transform .6s var(--ease); }
.story-card:hover .story-image img { transform: scale(1.04); }
.story-meta { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; color: var(--ink-500); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.story-meta a { color: var(--gold-700); }
.story-card h3 { margin: 9px 0 8px; color: var(--forest-900); font: 700 clamp(1.45rem,2.1vw,2rem)/1.16 var(--font-display); }
.story-card > p { color: var(--ink-700); font-size: .9rem; }
.story-card .text-link { font-size: .78rem; }
.donation-story { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 630px; color: white; background: var(--forest-950); }
.donation-photo { position: relative; }
.donation-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,transparent 65%,var(--forest-950)); }
.donation-photo img { width: 100%; height: 100%; }
.donation-copy { display: grid; align-content: center; padding: clamp(50px,7vw,110px); padding-left: clamp(30px,5vw,80px); }
.donation-copy h2 { margin: 16px 0 22px; font: 700 clamp(3rem,5.3vw,5.7rem)/.98 var(--font-display); letter-spacing: -.04em; }
.donation-copy > p { color: rgba(255,255,255,.72); font-size: 1.05rem; }
.amount-links { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin: 20px 0 13px; }
.amount-links a { padding: 12px; border: 1px solid rgba(255,255,255,.3); text-align: center; font-weight: 800; }
.amount-links a:hover { border-color: var(--gold-300); color: var(--gold-300); }
.visit-strip { background: var(--cream-100); }
.visit-inner { display: flex; align-items: end; justify-content: space-between; gap: 50px; }
.visit-inner > div:first-child { max-width: 750px; }
.visit-inner h2 { margin: 12px 0 15px; color: var(--forest-900); font: 700 clamp(2.6rem,5vw,5rem)/1 var(--font-display); }
.visit-inner p { color: var(--ink-700); font-size: 1.08rem; }
.visit-actions { display: flex; align-items: center; gap: 25px; padding-bottom: 10px; white-space: nowrap; }
.newsletter-band { padding: 46px 0; background: var(--cream-200); border-top: 1px solid var(--cream-300); }
.newsletter-inner { display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: 60px; }
.newsletter-inner h2 { margin: 4px 0 0; color: var(--forest-900); font: 700 clamp(2rem,3.5vw,3.4rem)/1 var(--font-display); }
.newsletter-form { display: flex; }
.newsletter-form input { min-height: 55px; border-radius: 3px 0 0 3px; border-right: 0; }
.newsletter-form .button { border-radius: 0 3px 3px 0; }
.site-footer { padding: 70px 0 24px; color: rgba(255,255,255,.72); background: var(--forest-950); }
.footer-grid { display: grid; grid-template-columns: 1.8fr repeat(3,1fr); gap: 65px; }
.footer-logo-wrap { display: inline-grid; width: 154px; height: 154px; margin-bottom: 20px; place-items: center; border-radius: 50%; background: #fffdf7; box-shadow: 0 14px 45px rgba(0,0,0,.2); }
.footer-brand img { width: 136px; height: 136px; object-fit: contain; opacity: .98; }
.footer-brand p { max-width: 360px; margin: 24px 0; }
.emergency-link { color: var(--gold-300); font-weight: 750; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer-grid h3 { color: white; font: 700 1.25rem var(--font-display); margin-bottom: 8px; }
.footer-grid a:hover { color: var(--gold-300); }
.footer-base { display: flex; justify-content: space-between; gap: 30px; margin-top: 60px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); font-size: .72rem; }
.footer-base div { display: flex; gap: 22px; }
.footer-base button { padding: 0; border: 0; color: inherit; background: none; font-size: inherit; }
.footer-base button:hover { color: var(--gold-300); }
.cookie-banner { position: fixed; z-index: 90; left: 22px; right: 22px; bottom: 20px; display: flex; align-items: center; justify-content: space-between; gap: 30px; width: min(920px,calc(100% - 44px)); margin-inline: auto; padding: 20px 22px; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; color: white; background: rgba(2,30,24,.97); box-shadow: 0 20px 70px rgba(0,0,0,.3); }
.cookie-banner[hidden] { display: none; }
.cookie-banner strong { color: var(--gold-300); }
.cookie-banner p { margin: 3px 0 0; color: rgba(255,255,255,.7); font-size: .77rem; }
.cookie-banner > div:last-child { display: flex; gap: 8px; flex: 0 0 auto; }
.cookie-banner .button-outline { color: white; border-color: rgba(255,255,255,.5); }

/* v1.1 editorial homepage */
.shell-wide.hero-content { width: var(--shell-wide); }
.home-hero .hero-media img { transform: scale(1.035); animation: hero-drift 18s ease-in-out infinite alternate; }
@keyframes hero-drift { from { transform: scale(1.035) translate3d(0,0,0); } to { transform: scale(1.09) translate3d(-1.2%,.7%,0); } }
.hero-scroll-cue { position: absolute; z-index: 3; right: clamp(22px,4vw,70px); bottom: 35px; display: grid; justify-items: center; gap: 9px; color: rgba(255,255,255,.7); font-size: .62rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.hero-scroll-cue i { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; font-style: normal; }
.section-index { display: block; margin-bottom: 17px; color: var(--ink-500); font-size: .68rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.motion-ready [data-reveal] { opacity: 0; transform: translateY(32px); transition: opacity .8s var(--ease),transform .8s var(--ease); }
.motion-ready [data-reveal].is-revealed { opacity: 1; transform: none; }
.motion-frame { overflow: visible; }
.motion-frame > img { transition: transform 1s var(--ease); }
.motion-frame:hover > img { transform: scale(1.018) translateY(-6px); }
.home-fundraiser { padding-top: 0; background: white; }
.fundraiser-banner { display: grid; grid-template-columns: minmax(300px,.72fr) minmax(0,1.28fr); min-height: 480px; color: white; background: var(--forest-950); box-shadow: 0 28px 80px rgba(3,42,34,.16); }
.fundraiser-banner-image { position: relative; overflow: hidden; }
.fundraiser-banner-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,transparent 60%,var(--forest-950)); }
.fundraiser-banner-image img { width: 100%; height: 100%; transition: transform 1s var(--ease); }
.fundraiser-banner:hover .fundraiser-banner-image img { transform: scale(1.035); }
.fundraiser-banner-content { display: grid; align-content: center; padding: clamp(36px,5vw,76px); }
.fundraiser-banner-heading { display: flex; align-items: start; justify-content: space-between; gap: 30px; }
.fundraiser-banner h2 { max-width: 780px; margin: 12px 0 16px; font: 700 clamp(2.5rem,4vw,4.6rem)/.98 var(--font-display); letter-spacing: -.035em; }
.fundraiser-banner-content > p { max-width: 760px; color: rgba(255,255,255,.72); }
.campaign-live { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; color: var(--gold-300); font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.campaign-live i { width: 8px; height: 8px; border-radius: 50%; background: #59c479; box-shadow: 0 0 0 6px rgba(89,196,121,.12); }
.fundraiser-banner-actions { display: flex; align-items: center; gap: 28px; margin-top: 26px; }
.fundraiser-banner .text-link { color: white; border-color: rgba(255,255,255,.4); }
.fundraiser-progress { margin: 25px 0 0; }
.progress-numbers { display: flex; justify-content: space-between; gap: 30px; }
.progress-numbers > div { display: grid; }
.progress-numbers span { color: inherit; opacity: .66; font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.progress-numbers strong { font: 700 clamp(1.55rem,2.5vw,2.5rem) var(--font-display); }
.progress-track { height: 12px; margin: 14px 0 9px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.16); }
.progress-track > span { display: block; width: var(--progress); height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--gold-500),var(--gold-300)); transition: width .8s var(--ease); }
.progress-caption { display: flex; justify-content: space-between; color: inherit; font-size: .72rem; }
.progress-caption span { opacity: .66; }
.home-event-grid { grid-template-columns: repeat(4,minmax(0,1fr)); grid-auto-flow: row; grid-auto-columns: auto; gap: 24px; overflow: visible; scroll-snap-type: none; }
.home-event-grid > :nth-child(n+5) { display: none; }
.home-event-grid .event-body h3 { font-size: clamp(1.35rem,1.7vw,1.9rem); }
.event-mobile-control { display: none; }
.home-story-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(18px,2vw,30px); }
.home-story-grid .story-card h3 { font-size: clamp(1.25rem,1.7vw,1.8rem); }
.action-duet { display: grid; grid-template-columns: 1fr 1fr; min-height: 690px; }
.action-journey { position: relative; display: grid; min-width: 0; overflow: hidden; }
.action-donate { grid-template-columns: 1fr 1fr; color: white; background: var(--forest-950); }
.action-photo { position: relative; overflow: hidden; }
.action-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,transparent,var(--forest-950)); }
.action-photo img { width: 100%; height: 100%; transition: transform 1s var(--ease); }
.action-journey:hover .action-photo img { transform: scale(1.04); }
.action-copy { display: grid; align-content: center; padding: clamp(42px,5vw,88px); }
.action-copy h2 { margin: 13px 0 20px; font: 700 clamp(2.5rem,4vw,4.8rem)/.98 var(--font-display); letter-spacing: -.035em; }
.action-copy p { margin-bottom: 28px; color: inherit; opacity: .72; }
.action-copy .button { justify-self: start; }
.action-partner { grid-template-columns: minmax(0,1.2fr) minmax(170px,.8fr); color: var(--forest-950); background: var(--cream-200); }
.partnership-mark { display: grid; align-content: center; justify-items: center; border-left: 1px solid var(--cream-300); color: var(--forest-900); }
.partnership-mark span { font: 700 clamp(4rem,7vw,8rem)/1 var(--font-display); letter-spacing: -.08em; }
.partnership-mark small { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--gold-500); text-align: center; text-transform: uppercase; letter-spacing: .13em; }

/* v1.2 participation atlas */
.action-atlas { color: var(--forest-950); background: var(--cream-100); }
.action-atlas-grid { display: grid; grid-template-columns: minmax(360px,.9fr) minmax(0,1.1fr); overflow: hidden; border: 1px solid var(--cream-300); background: white; box-shadow: 0 28px 80px rgba(3,42,34,.09); }
.action-atlas-lead { position: relative; min-height: 690px; overflow: hidden; color: white; background: var(--forest-950); }
.action-atlas-lead::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(2,30,24,.98),rgba(2,30,24,.08) 75%); }
.action-atlas-lead > img { width: 100%; height: 100%; transition: transform 1.2s var(--ease); }
.action-atlas-lead:hover > img { transform: scale(1.045); }
.action-atlas-lead > div { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; padding: clamp(32px,4vw,65px); }
.action-atlas-lead h3 { margin: 10px 0 16px; font: 700 clamp(2.8rem,4.7vw,5.1rem)/.94 var(--font-display); letter-spacing: -.04em; }
.action-atlas-lead p { max-width: 580px; margin-bottom: 27px; color: rgba(255,255,255,.72); }
.action-atlas-links { display: grid; align-content: stretch; }
.action-atlas-links > a { display: grid; grid-template-columns: 52px minmax(0,1fr) 44px; align-items: center; gap: clamp(16px,2vw,32px); min-height: 172px; padding: clamp(22px,3vw,42px); border-bottom: 1px solid var(--cream-300); transition: color .25s,background .25s,padding .35s var(--ease); }
.action-atlas-links > a:last-child { border-bottom: 0; }
.action-atlas-links > a:hover { padding-left: clamp(30px,4vw,58px); color: white; background: var(--forest-900); }
.action-atlas-links > a > span { color: var(--gold-700); font: 700 1rem var(--font-display); }
.action-atlas-links small { color: var(--gold-700); font-size: .62rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.action-atlas-links h3 { margin: 5px 0 8px; font: 700 clamp(1.7rem,2.5vw,2.7rem)/1 var(--font-display); }
.action-atlas-links p { max-width: 590px; margin: 0; color: var(--ink-500); font-size: .82rem; }
.action-atlas-links > a:hover p { color: rgba(255,255,255,.68); }
.action-atlas-links > a > b { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid currentColor; border-radius: 50%; }
