/*
Theme Name: Roots for Change UK
Theme URI: https://rootsforchangeuk.com
Author: Roots for Change UK
Description: Custom accessible WordPress theme for Roots for Change UK, with Wix Donations campaign handoffs.
Version: 2.1.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: roots-for-change
*/

:root {
  --forest: #071a2e;
  --forest-deep: #03111f;
  --moss: #607f9a;
  --sun: #df7038;
  --sun-dark: #b94f22;
  --cream: #fff8eb;
  --ivory: #fffdf8;
  --sage: #e8d2a8;
  --clay: #df7038;
  --blue: #7993aa;
  --ink: #152338;
  --muted: #5f6d7b;
  --line: #ddd3c3;
  --serif: Georgia, "Times New Roman", serif;
  --sans: "Aptos", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: var(--sans); line-height: 1.55; }
button, input { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
.button, .arrow-link, .back-link { display: inline-flex; align-items: center; text-decoration: none; }
.primary-nav > a { text-decoration: none; }
.about-tabs a { text-decoration: none; }
[hidden] { display: none !important; }
.clients-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; padding-top:20px; }
.clients-grid article { min-height:190px; padding:26px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; text-align:center; background:#fff; border:1px solid var(--line); border-radius:18px; }
.clients-grid img { width:100%; height:105px; object-fit:contain; }
.clients-grid h3 { margin:0; color:var(--forest); font-family:var(--serif); }
.seasonal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.seasonal-grid article { overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:18px; }
.seasonal-grid img { display:block; width:100%; height:250px; object-fit:cover; }
.seasonal-grid article > div { padding:24px; }
.seasonal-grid h3 { color:var(--forest); font-family:var(--serif); font-size:1.8rem; }
.footer-main a, .footer-bottom a { display:block; text-decoration:none; }
.site-shell { min-height: 100vh; overflow: hidden; background: var(--ivory); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; left: 16px; top: -100px; background: white; padding: 12px 18px; border-radius: 8px; }
.skip-link:focus { top: 16px; }
:focus-visible { outline: 3px solid var(--sun); outline-offset: 3px; }

.concept-bar { min-height: 34px; padding: 6px clamp(20px, 5vw, 72px); display: flex; justify-content: center; gap: 10px; align-items: center; color: white; background: var(--forest-deep); font-size: .78rem; letter-spacing: .02em; }
.concept-bar span { padding: 2px 8px; color: var(--forest-deep); background: var(--sun); border-radius: 99px; font-weight: 800; text-transform: uppercase; font-size: .65rem; letter-spacing: .09em; }
.site-header { height: 92px; padding: 0 clamp(20px, 5vw, 72px); display: flex; align-items: center; justify-content: space-between; background: rgba(255,253,248,.97); border-bottom: 1px solid rgba(7,26,46,.1); position: relative; z-index: 20; }
.brand { display: inline-flex; align-items: center; border: 0; background: transparent; color: var(--forest); padding: 0; text-align: left; }
.brand-logo { display: block; width: 184px; height: 76px; object-fit: contain; object-position: left center; }
.primary-nav { display: flex; align-items: center; gap: clamp(12px, 2.2vw, 34px); }
.nav-link { border: 0; background: transparent; padding: 12px 2px; color: var(--ink); font-weight: 650; position: relative; }
.nav-shop { text-decoration: none; }
.nav-link::after { content: ""; height: 2px; position: absolute; bottom: 5px; left: 50%; right: 50%; background: var(--sun); transition: .2s ease; }
.nav-link:hover::after, .nav-link.active::after { left: 0; right: 0; }
.menu-button { display: none; border: 1px solid var(--line); background: white; color: var(--forest); width: 44px; height: 44px; border-radius: 10px; font-size: 1.4rem; }

.button { min-height: 52px; padding: 13px 24px; border-radius: 6px; border: 1.5px solid transparent; font-weight: 750; letter-spacing: .005em; transition: transform .2s ease, background .2s ease, color .2s ease, border .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--forest); color: white; }
.button-primary:hover { background: var(--forest-deep); }
.button-sun { background: var(--sun); color: var(--forest-deep); }
.button-sun:hover { background: var(--sun-dark); color: white; }
.button-outline { color: var(--forest); border-color: var(--forest); background: transparent; }
.button-outline:hover { background: var(--sage); }
.button-cream { color: var(--forest); background: var(--cream); }
.button.compact { min-height: 44px; padding: 9px 16px; }
.button-row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.nav-donate { min-height: 48px; padding: 10px 24px; }
.eyebrow { margin: 0 0 14px; text-transform: uppercase; color: var(--moss); letter-spacing: .14em; font-size: .72rem; font-weight: 850; }
.eyebrow.light { color: #f4c46a; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--serif); color: var(--forest); font-weight: 600; letter-spacing: -.035em; line-height: 1.04; }
h1 { font-size: clamp(3rem, 6vw, 6.3rem); }
h2 { font-size: clamp(2.2rem, 4vw, 4.2rem); }
h3 { line-height: 1.2; }

.hero { min-height: calc(100vh - 126px); display: grid; grid-template-columns: 44% 56%; grid-template-rows: 1fr auto; background: var(--cream); position: relative; }
.hero-copy { padding: clamp(56px, 7vw, 108px) clamp(28px, 5vw, 78px) 70px; align-self: center; }
.hero h1 { margin-bottom: 22px; font-size: clamp(3.45rem, 4.65vw, 5.35rem); }
.brush { display: block; width: 92px; height: 5px; border-radius: 100%; background: var(--sun); margin-bottom: 26px; transform: rotate(-1deg); }
.hero-intro { max-width: 590px; margin-bottom: 30px; font-size: clamp(1.12rem, 1.7vw, 1.42rem); line-height: 1.55; }
.hero-image { min-height: 560px; background: linear-gradient(140deg, rgba(7,26,46,.08), rgba(7,26,46,.03)), url('/images/hero-community.png') center/cover no-repeat; border-top-left-radius: 100px; }
.trust-strip { grid-column: 1 / -1; min-height: 112px; display: grid; grid-template-columns: 1fr 1fr 1.2fr; align-items: stretch; background: rgba(255,253,248,.97); border-top: 1px solid var(--line); }
.trust-item, .next-event { display: flex; gap: 14px; align-items: center; padding: 24px clamp(24px, 4vw, 58px); border: 0; background: transparent; text-align: left; color: var(--ink); }
.trust-item + .trust-item, .next-event { border-left: 1px solid var(--line); }
.trust-item p, .next-event p { margin: 0; display: grid; }
.trust-item strong, .next-event strong { font-size: 1rem; }
.trust-item small, .next-event small { color: var(--muted); }
.trust-icon { width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--forest); color: var(--forest); border-radius: 14px; font-weight: 800; }
.next-event { background: #fbf7ef; }
.next-event b { margin-left: auto; color: var(--forest); font-size: 1.4rem; }

.section { padding: clamp(70px, 9vw, 130px) clamp(24px, 7vw, 110px); }
.impact-intro { display: grid; grid-template-columns: 1.15fr .85fr; gap: 54px 80px; background: var(--ivory); }
.impact-intro h2 { max-width: 760px; margin: 0; }
.impact-copy { padding-top: 34px; font-size: 1.08rem; }
.arrow-link { border: 0; background: transparent; color: var(--forest); padding: 4px 0; font-weight: 800; border-bottom: 1px solid rgba(7,26,46,.35); }
.arrow-link span, .arrow-link b { margin-left: 9px; transition: margin .2s ease; }
.arrow-link:hover span, .arrow-link:hover b { margin-left: 14px; }
.stats-grid { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.stats-grid article { padding: 38px 30px; display: grid; gap: 6px; }
.stats-grid article + article { border-left: 1px solid var(--line); }
.stats-grid strong { color: var(--forest); font-family: var(--serif); font-size: clamp(2.5rem, 5vw, 4.8rem); line-height: 1; }
.stats-grid span { color: var(--muted); }

.cause-section { background: var(--cream); }
.section-heading { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 50px; margin-bottom: 48px; }
.section-heading h2 { margin: 0; max-width: 740px; }
.section-heading > p { font-size: 1.05rem; }
.cause-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.cause-card { background: var(--ivory); border: 1px solid rgba(7,26,46,.14); border-radius: 22px; overflow: hidden; box-shadow: 0 14px 40px rgba(7,26,46,.06); }
.cause-image { height: 280px; background-position: center; background-size: cover; transition: transform .45s ease; }
.cause-card:hover .cause-image { transform: scale(1.015); }
.cause-card-body { padding: 30px; }
.wix-card-badge { display: inline-flex; float: right; margin: 0 0 10px 14px; padding: 5px 9px; border: 1px solid rgba(7,26,46,.17); border-radius: 99px; color: var(--forest); background: var(--cream); font-size: .63rem; font-weight: 800; letter-spacing: .035em; }
.cause-card-body h3 { color: var(--forest); font-family: var(--serif); font-size: 2rem; margin: 0 0 12px; }
.cause-card-body > p:not(.eyebrow) { min-height: 78px; color: #53615b; }
.cause-card.sun { border-top: 6px solid var(--sun); }
.cause-card.sage { border-top: 6px solid var(--sage); }
.cause-card.clay { border-top: 6px solid var(--clay); }
.cause-card.blue { border-top: 6px solid var(--blue); }

.events-teaser { display: grid; grid-template-columns: 1fr .9fr; gap: 80px; align-items: center; background: var(--forest); color: white; }
.events-teaser h2, .callout h2 { color: white; margin-bottom: 22px; }
.events-copy > p:not(.eyebrow) { color: #d9e1e8; max-width: 640px; margin-bottom: 30px; }
.event-feature-card { min-height: 240px; position: relative; border-radius: 22px; padding: 42px; display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; background: var(--cream); color: var(--ink); }
.event-feature-card h3 { font-family: var(--serif); color: var(--forest); font-size: 2.2rem; margin: 0 0 8px; }
.event-feature-card button { width: 50px; height: 50px; border: 1px solid var(--forest); border-radius: 50%; background: white; color: var(--forest); font-size: 1.3rem; }
.sample-label { position: absolute; top: 16px; right: 18px; color: var(--muted); text-transform: uppercase; font-size: .62rem; letter-spacing: .1em; }
.date-badge { width: 76px; height: 86px; border: 1px solid var(--forest); display: grid; place-items: center; align-content: center; border-radius: 12px; color: var(--forest); }
.date-badge strong { font-family: var(--serif); font-size: 2.1rem; line-height: 1; }

.shop-social-strip { display: grid; grid-template-columns: 1fr .82fr; gap: 80px; align-items: center; background: #fff8f1; }
.shop-social-strip h2 { max-width: 700px; }
.shop-social-strip > div:first-child > p:not(.eyebrow) { max-width: 680px; margin-bottom: 28px; font-size: 1.05rem; }
.shop-social-strip .button { display: inline-flex; align-items: center; text-decoration: none; }
.social-panel { padding: 42px; border-radius: 22px; color: white; background: var(--forest); box-shadow: 20px 20px 0 rgba(238,146,88,.22); }
.social-panel h3 { margin: 0 0 24px; color: white; font-family: var(--serif); font-size: clamp(1.8rem, 3vw, 2.8rem); }
.social-links { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.social-links a { display: flex; justify-content: space-between; gap: 14px; padding: 12px 0; color: #e7f0eb; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.24); font-weight: 750; }
.social-links a:hover { color: white; border-bottom-color: var(--sun); }

.page-hero { min-height: 470px; padding: clamp(70px, 9vw, 130px) clamp(24px, 8vw, 130px); display: flex; align-items: center; justify-content: space-between; gap: 50px; background: var(--forest); color: white; position: relative; overflow: hidden; }
.page-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 85% 20%, rgba(229,161,38,.18), transparent 28%), radial-gradient(circle at 10% 110%, rgba(111,160,126,.25), transparent 30%); }
.page-hero > div { max-width: 950px; position: relative; z-index: 1; }
.page-hero h1 { color: white; margin-bottom: 20px; font-size: clamp(3.2rem, 6.4vw, 6.5rem); }
.page-hero > div > p:last-child { max-width: 720px; color: #d9e1e8; font-size: 1.25rem; }
.page-hero-mark { font-family: var(--serif); font-size: 15rem; line-height: 1; color: rgba(255,255,255,.045); }

.story-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; }
.story-panel { background: var(--cream); min-height: 500px; padding: 50px; border-radius: 90px 20px 20px 20px; display: flex; flex-direction: column; justify-content: end; }
.story-panel span { color: var(--clay); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: .72rem; }
.story-panel h2 { font-size: clamp(2.3rem, 4vw, 4rem); margin: 16px 0 0; }
.prose { font-size: 1.08rem; }
.prose p { margin-bottom: 22px; }
.prose .button { margin-top: 12px; }
.team-section { background: var(--ivory); }
.team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.team-card { min-height: 330px; display: grid; grid-template-columns: minmax(180px, .7fr) 1.3fr; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: 0 14px 40px rgba(7,26,46,.05); }
.team-card img { width: 100%; height: 100%; min-height: 330px; object-fit: cover; object-position: center top; background: var(--cream); }
.team-card > div { padding: 30px; align-self: center; }
.team-card h3 { margin: 5px 0 14px; color: var(--forest); font-family: var(--serif); font-size: 2rem; }
.team-card > div > p:last-child { margin: 0; color: var(--muted); font-size: .93rem; }
.team-role { margin: 0; color: var(--clay); text-transform: uppercase; letter-spacing: .11em; font-size: .68rem; font-weight: 850; }
.values-section { background: var(--cream); }
.value-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.value-grid article { padding: 34px; border-top: 1px solid var(--forest); }
.value-grid article + article { border-left: 1px solid rgba(7,26,46,.18); }
.value-grid b { color: var(--clay); }
.value-grid h3 { font-family: var(--serif); font-size: 2rem; color: var(--forest); margin-bottom: 10px; }

.work-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); }
.work-grid article { min-height: 270px; padding: 38px; background: var(--ivory); }
.work-grid span, .involvement-grid > article > span { color: var(--clay); font-size: .75rem; letter-spacing: .13em; font-weight: 800; }
.work-grid h3 { font-family: var(--serif); color: var(--forest); font-size: 2rem; margin: 48px 0 12px; }
.city-presence { padding-bottom: 48px; display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: end; }
.city-presence h2 { margin-bottom: 0; }
.city-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.city-list span { padding: 16px 18px; border: 1px solid var(--line); border-radius: 99px; color: var(--forest); background: white; text-align: center; font-weight: 800; }
.work-grid-detailed { padding-top: 20px; padding-bottom: 90px; background: var(--ivory); gap: 20px; }
.work-grid-detailed article { min-height: 520px; border: 1px solid var(--line); border-radius: 18px; }
.work-grid-detailed .work-location { display: inline-flex; margin: 0 0 0 12px; padding: 5px 9px; border-radius: 99px; color: var(--moss); background: var(--sage); font-size: .68rem; font-weight: 800; }
.work-grid-detailed h3 { margin-top: 44px; }
.work-grid-detailed article > p:not(.work-location) { color: var(--muted); }
.work-grid-detailed ul { padding: 20px 0 0; margin: 24px 0 0; list-style: none; border-top: 1px solid var(--line); display: grid; gap: 9px; }
.work-grid-detailed li { position: relative; padding-left: 21px; font-size: .92rem; }
.work-grid-detailed li::before { content: "✓"; position: absolute; left: 0; color: var(--clay); font-weight: 900; }
.callout { margin: 0 clamp(24px, 7vw, 110px) 100px; padding: 62px; display: flex; justify-content: space-between; align-items: center; gap: 30px; background: var(--forest); border-radius: 26px; }
.callout h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.8rem); }

.events-page { padding-top: 70px; }
.notice, .draft-notice { padding: 18px 20px; border-left: 4px solid var(--sun); background: #fff7e7; display: flex; align-items: center; gap: 12px; margin-bottom: 34px; }
.notice span, .draft-notice span { color: #5d655f; }
.filter-row { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px; }
.filter-row button { padding: 10px 18px; border-radius: 99px; border: 1px solid var(--line); background: white; color: var(--ink); }
.filter-row button.active { background: var(--forest); color: white; border-color: var(--forest); }
.events-list { border-top: 1px solid var(--line); }
.event-row { display: grid; grid-template-columns: 100px 1fr auto; gap: 36px; align-items: center; padding: 42px 0; border-bottom: 1px solid var(--line); }
.large-date { width: 88px; height: 96px; display: grid; place-items: center; align-content: center; background: var(--cream); color: var(--forest); border-radius: 16px; }
.large-date strong { font-family: var(--serif); font-size: 2.7rem; line-height: .9; }
.large-date span, .tag { text-transform: uppercase; font-size: .67rem; letter-spacing: .13em; font-weight: 850; }
.tag { color: var(--clay); }
.event-row h2 { font-size: 2.1rem; margin: 4px 0 4px; }
.event-row p { margin-bottom: 4px; color: var(--muted); }
.event-meta { font-weight: 700; color: var(--forest) !important; }

.involvement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.involvement-grid.contact-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.contact-options article { min-height: 330px; }
.contact-options h2 { margin-top: 48px; }
.involvement-grid article { min-height: 390px; padding: 42px; border: 1px solid var(--line); border-radius: 20px; display: flex; flex-direction: column; }
.involvement-grid h2 { font-size: 2.6rem; margin: 72px 0 16px; }
.involvement-grid p { color: var(--muted); }
.involvement-grid .arrow-link { margin-top: auto; align-self: flex-start; }
.involvement-grid a.arrow-link { text-decoration: none; }
.volunteer-details { padding-top: 20px; display: grid; grid-template-columns: 1.35fr .65fr; gap: 70px; background: var(--cream); }
.volunteer-details h2 { max-width: 760px; }
.volunteer-details > div > p:not(.eyebrow) { max-width: 850px; font-size: 1.05rem; }
.volunteer-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 38px; }
.volunteer-columns > div { padding-top: 22px; border-top: 2px solid var(--sun); }
.volunteer-columns h3 { color: var(--forest); font-family: var(--serif); font-size: 1.55rem; }
.volunteer-columns ul { padding-left: 20px; color: var(--muted); }
.shop-locations { padding: 34px; align-self: start; border-radius: 20px; color: white; background: var(--forest); }
.shop-locations article { display: grid; gap: 6px; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.22); }
.shop-locations strong { color: white; font-family: var(--serif); font-size: 1.55rem; }
.shop-locations span { color: #e0ebe5; }
.shop-locations small { color: #aebbc7; }
.volunteer-form-section { scroll-margin-top: 30px; background: var(--ivory); }
.form-frame { overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: 0 22px 65px rgba(7,26,46,.09); }
.form-frame iframe { display: block; width: 100%; min-height: 820px; border: 0; }
.form-fallback { display: inline-flex; margin-top: 18px; text-decoration: none; }
.shop-callout { margin: 0 clamp(24px, 7vw, 110px) 100px; padding: 58px; display: flex; justify-content: space-between; align-items: center; gap: 40px; color: white; background: var(--forest); border-radius: 26px; }
.shop-callout h2 { max-width: 760px; margin-bottom: 12px; color: white; }
.shop-callout p:not(.eyebrow) { margin: 0; color: #d9e1e8; }
.shop-callout .button { flex: 0 0 auto; text-decoration: none; }

.donation-intro { display: grid; grid-template-columns: 1fr .8fr; gap: 70px; align-items: center; padding-bottom: 30px; }
.donation-intro h2 { font-size: clamp(2.2rem, 4vw, 4rem); }
.secure-note { padding: 28px; display: flex; gap: 18px; background: var(--sage); border-radius: 18px; }
.secure-note > span { width: 38px; height: 38px; display: grid; place-items: center; color: white; background: var(--forest); border-radius: 50%; flex: 0 0 auto; }
.secure-note p { display: grid; gap: 6px; margin: 0; }
.secure-note small { color: #53615b; }
.donation-grid { padding-top: 40px; }
.donation-trust { background: var(--forest); color: white; }
.donation-trust h2 { color: white; }
.donation-trust > div { display: grid; grid-template-columns: repeat(4, 1fr); }
.donation-trust p { padding: 30px; border-top: 1px solid rgba(255,255,255,.28); display: grid; }
.donation-trust p + p { border-left: 1px solid rgba(255,255,255,.22); }
.donation-trust span { color: var(--sun); font-weight: 800; }
.donation-trust strong { margin: 22px 0 6px; font-family: var(--serif); font-size: 1.4rem; }
.donation-trust small { color: #d9e1e8; }

.appeal-hero { min-height: 590px; position: relative; display: grid; align-items: end; background: var(--forest); }
.appeal-image { position: absolute; inset: 0; background-position: center; background-size: cover; opacity: .6; }
.appeal-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,17,31,.96) 0%, rgba(7,26,46,.78) 48%, rgba(7,26,46,.1) 100%); }
.appeal-copy { width: min(760px, 90vw); position: relative; z-index: 2; padding: 70px clamp(24px, 8vw, 130px); color: white; }
.appeal-copy h1 { color: white; font-size: clamp(3rem, 5vw, 5.6rem); }
.appeal-copy > p:last-child { font-size: 1.18rem; color: #e1eae6; }
.back-link { color: white; border: 0; background: transparent; padding: 0 0 40px; font-weight: 700; }
.appeal-layout { display: grid; grid-template-columns: 1fr minmax(390px, .72fr); gap: 90px; align-items: start; }
.appeal-detail h2 { font-size: clamp(2.3rem, 4vw, 4.2rem); }
.appeal-detail ul { list-style: none; padding: 0; margin: 34px 0; display: grid; gap: 16px; }
.appeal-detail li { display: flex; gap: 13px; align-items: center; font-weight: 750; }
.appeal-detail li span { width: 28px; height: 28px; display: grid; place-items: center; background: var(--sage); color: var(--forest); border-radius: 50%; }
.impact-examples { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 34px 0; }
.impact-examples article { padding: 22px; background: var(--cream); border-radius: 14px; }
.impact-examples strong { color: var(--forest); font-family: var(--serif); font-size: 2.1rem; }
.impact-examples p { font-size: .9rem; color: var(--muted); margin: 8px 0 0; }
.fund-note { border-left: 4px solid var(--sun); padding: 22px; background: #fff9ee; }
.fund-note p { margin: 7px 0 0; font-size: .93rem; color: var(--muted); }
.donation-form { padding: 36px; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: 0 24px 70px rgba(7,26,46,.11); position: sticky; top: 24px; }
.donation-form h2 { font-size: 2.25rem; margin: 14px 0 24px; }
.prototype-pill { display: inline-flex; padding: 5px 9px; background: #fff2d6; color: #865b0a; border-radius: 99px; text-transform: uppercase; letter-spacing: .1em; font-size: .62rem; font-weight: 850; }
fieldset { padding: 0; margin: 0 0 22px; border: 0; }
legend { margin-bottom: 10px; font-weight: 800; }
.segmented, .amount-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.segmented button, .amount-grid button { min-height: 48px; border: 1px solid var(--line); background: white; color: var(--forest); border-radius: 8px; font-weight: 750; }
.segmented button.active, .amount-grid button.active { border-color: var(--forest); background: var(--sage); box-shadow: inset 0 0 0 1px var(--forest); }
.amount-grid { grid-template-columns: repeat(4, 1fr); }
.custom-amount { display: flex; align-items: center; margin-top: 9px; border: 1px solid var(--line); border-radius: 8px; }
.custom-amount span { padding: 0 12px; font-weight: 800; color: var(--forest); }
.custom-amount input { width: 100%; height: 48px; border: 0; background: transparent; padding: 0 10px; }
.check-row { display: flex; align-items: flex-start; gap: 12px; margin: 12px 0 24px; }
.check-row input { width: 20px; height: 20px; accent-color: var(--forest); flex: 0 0 auto; }
.check-row span { display: grid; gap: 3px; }
.check-row small, .form-small { color: var(--muted); font-size: .8rem; }
.checkout-button { width: 100%; }
.form-small { text-align: center; margin: 12px 0 0; }

.policy-content { width: min(1020px, 100%); margin: 0 auto; }
.draft-notice { align-items: flex-start; flex-direction: column; margin-bottom: 60px; }
.policy-section { display: grid; grid-template-columns: minmax(210px, .55fr) 1fr; gap: 50px; padding: 38px 0; border-top: 1px solid var(--line); }
.policy-section h2 { font-family: var(--sans); font-size: 1.25rem; letter-spacing: 0; }
.policy-section p { margin: 0; color: var(--muted); }
.cookie-table { border-top: 1px solid var(--line); margin-bottom: 28px; }
.cookie-table > div { display: grid; grid-template-columns: .45fr 1fr; gap: 30px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.cookie-table span { color: var(--muted); }

.cookie-banner { position: fixed; z-index: 50; left: 24px; right: 24px; bottom: 22px; max-width: 1180px; margin: auto; padding: 24px 26px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 26px; background: white; border: 1px solid var(--line); box-shadow: 0 22px 80px rgba(0,0,0,.19); border-radius: 16px; }
.cookie-banner p { margin: 5px 0 0; color: var(--muted); font-size: .9rem; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.text-button { border: 0; background: transparent; color: var(--forest); text-decoration: underline; font-weight: 800; }
.modal-backdrop { position: fixed; z-index: 70; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(6,23,18,.66); }
.cookie-modal { width: min(620px, 100%); max-height: 90vh; overflow: auto; background: var(--ivory); border-radius: 20px; padding: 38px; position: relative; }
.cookie-modal h2 { font-size: 2.5rem; }
.modal-close { position: absolute; right: 18px; top: 14px; border: 0; background: transparent; color: var(--forest); font-size: 2rem; }
.toggle-list { margin: 24px 0; border-top: 1px solid var(--line); }
.toggle-list label { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.toggle-list label span { display: grid; }
.toggle-list small { color: var(--muted); }
.toggle-list input { width: 44px; height: 23px; accent-color: var(--forest); }
.toast { position: fixed; z-index: 90; left: 50%; bottom: 28px; transform: translateX(-50%); width: min(680px, calc(100% - 32px)); padding: 15px 20px; border-radius: 10px; background: var(--forest-deep); color: white; box-shadow: 0 14px 44px rgba(0,0,0,.22); text-align: center; }

.site-footer { color: #dce6e1; background: var(--forest-deep); }
.footer-main { padding: 72px clamp(24px, 6vw, 92px); display: grid; grid-template-columns: 1.4fr .6fr .85fr 1fr; gap: 50px; }
.footer-brand { color: white; margin-bottom: 20px; }
.footer-logo-wrap { display: inline-flex; padding: 5px 12px; border-radius: 12px; background: var(--ivory); }
.footer-brand .brand-logo { width: 170px; height: 70px; }
.footer-main > div:first-child > p { max-width: 390px; color: #aebbc7; }
.charity-line { font-size: .8rem; }
.footer-socials { display: flex; flex-wrap: wrap; gap: 7px; margin: 20px 0; }
.footer-socials a { padding: 6px 10px !important; border: 1px solid rgba(255,255,255,.22) !important; border-radius: 99px; font-size: .75rem; }
.footer-main h2 { color: #f2be5d; font-family: var(--sans); font-size: .72rem; text-transform: uppercase; letter-spacing: .13em; }
.footer-main > div:not(:first-child) { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.footer-main button:not(.brand), .footer-main a { padding: 0; border: 0; background: transparent; color: #dce6e1; text-decoration: none; }
.footer-main button:hover, .footer-main a:hover { color: white; text-decoration: underline; }
.footer-main p { margin: 0 0 8px; color: #aebbc7; }
.footer-bottom { min-height: 70px; padding: 20px clamp(24px, 6vw, 92px); border-top: 1px solid rgba(255,255,255,.15); display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: .8rem; color: #98aca3; }
.footer-bottom nav { display: flex; flex-wrap: wrap; gap: 18px; }
.footer-bottom button, .footer-bottom a { padding: 0; border: 0; background: transparent; color: #c7d5cf; text-decoration: none; }
.not-found { min-height: 65vh; padding: 100px 24px; display: grid; place-items: center; align-content: center; text-align: center; }
.not-found h1 { max-width: 800px; }

@media (max-width: 1040px) {
  .hero { grid-template-columns: 1fr 1fr; }
  .trust-strip { grid-template-columns: repeat(3, 1fr); }
  .work-grid { grid-template-columns: repeat(2, 1fr); }
  .team-grid { grid-template-columns: 1fr; }
  .value-grid { grid-template-columns: repeat(2, 1fr); }
  .involvement-grid, .involvement-grid.contact-options { grid-template-columns: 1fr; }
  .appeal-layout { grid-template-columns: 1fr; }
  .donation-form { position: static; }
  .footer-main { grid-template-columns: 1.3fr repeat(2, 1fr); }
  .footer-main > div:last-child { grid-column: 1 / -1; }
}

@media (max-width: 800px) {
  .concept-bar { text-align: center; }
  .site-header { height: 78px; }
  .menu-button { display: grid; place-items: center; }
  .primary-nav { display: none; position: absolute; top: 78px; left: 0; right: 0; padding: 20px; background: var(--ivory); border-top: 1px solid var(--line); box-shadow: 0 20px 35px rgba(0,0,0,.12); align-items: stretch; }
  .primary-nav.open { display: flex; flex-direction: column; }
  .nav-link { text-align: left; padding: 10px; }
  .hero { min-height: auto; grid-template-columns: 1fr; grid-template-rows: auto; }
  .hero-copy { padding: 70px 26px 60px; }
  .hero-image { min-height: 440px; border-radius: 70px 0 0; }
  .trust-strip { grid-template-columns: 1fr; }
  .trust-item + .trust-item, .next-event { border-left: 0; border-top: 1px solid var(--line); }
  .impact-intro, .section-heading, .events-teaser, .story-grid, .donation-intro, .shop-social-strip, .city-presence, .volunteer-details { grid-template-columns: 1fr; }
  .impact-copy { padding-top: 0; }
  .stats-grid { grid-template-columns: 1fr; }
  .stats-grid article + article { border-left: 0; border-top: 1px solid var(--line); }
  .cause-grid, .work-grid { grid-template-columns: 1fr; }
  .work-grid-detailed article { min-height: 0; }
  .volunteer-columns { grid-template-columns: 1fr; }
  .event-row { grid-template-columns: 80px 1fr; gap: 20px; }
  .event-row .button { grid-column: 2; justify-self: start; }
  .callout { flex-direction: column; align-items: flex-start; margin-bottom: 60px; padding: 36px; }
  .shop-callout { flex-direction: column; align-items: flex-start; margin-bottom: 60px; padding: 36px; }
  .appeal-copy { padding-left: 26px; padding-right: 26px; }
  .impact-examples { grid-template-columns: 1fr; }
  .donation-trust > div { grid-template-columns: 1fr 1fr; }
  .policy-section { grid-template-columns: 1fr; gap: 10px; }
  .cookie-banner { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-main > div:first-child, .footer-main > div:last-child { grid-column: 1 / -1; }
  .footer-bottom { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 520px) {
  .concept-bar strong { display: none; }
  .brand-logo { width: 140px; height: 64px; }
  .section { padding-left: 20px; padding-right: 20px; }
  .button-row .button { width: 100%; }
  .hero-image { min-height: 350px; }
  .cause-image { height: 225px; }
  .event-feature-card { grid-template-columns: auto 1fr; padding: 32px 22px; }
  .event-feature-card > button { grid-column: 2; }
  .event-row { grid-template-columns: 1fr; }
  .event-row .button { grid-column: 1; }
  .donation-trust > div, .footer-main { grid-template-columns: 1fr; }
  .donation-trust p + p { border-left: 0; }
  .amount-grid { grid-template-columns: repeat(2, 1fr); }
  .cookie-actions { align-items: stretch; flex-direction: column; }
  .cookie-actions .button, .cookie-actions .text-button { width: 100%; }
  .cookie-modal { padding: 34px 22px 24px; }
  .footer-main > div { grid-column: 1 / -1 !important; }
  .team-card { grid-template-columns: 1fr; }
  .team-card img { height: 330px; min-height: 0; }
  .social-links, .city-list { grid-template-columns: 1fr; }
  .form-frame iframe { min-height: 900px; }
}

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

/* Approved direction: Heritage Navy + Champagne with orange root details */
.site-header {
  background: rgba(7, 26, 46, .985);
  border-bottom-color: rgba(232, 210, 168, .24);
}
.brand-logo { filter: saturate(1.1) brightness(1.06); }
.nav-link { color: var(--cream); }
.nav-link::after { background: var(--sun); }
.menu-button { color: var(--cream); background: transparent; border-color: rgba(232, 210, 168, .55); }
.button { border-radius: 3px; }
.button-sun { color: #fff; }
.button-outline { border-color: var(--forest); }
.hero .button-outline { color: var(--cream); border-color: var(--sage); }
.hero .button-outline:hover { color: var(--forest); background: var(--sage); }

.hero {
  min-height: calc(100vh - 126px);
  grid-template-columns: 47% 53%;
  grid-template-rows: minmax(610px, 1fr) auto;
  color: var(--cream);
  background:
    radial-gradient(circle at 8% 88%, rgba(121, 147, 170, .16), transparent 29%),
    var(--forest);
}
.hero-copy { padding-bottom: 100px; position: relative; z-index: 2; }
.hero h1 { color: var(--cream); max-width: 760px; }
.hero-intro { color: #d9e0e7; max-width: 630px; }
.hero-visual { position: relative; min-width: 0; padding: 42px 0 82px 24px; }
.hero-image {
  min-height: 555px;
  height: 100%;
  border: 1px solid rgba(232, 210, 168, .9);
  border-right: 0;
  border-radius: 160px 0 0 12px;
  background-image: linear-gradient(140deg, rgba(7,26,46,.04), rgba(7,26,46,.22)), url('/images/hero-community.png');
  box-shadow: -18px 18px 0 rgba(232, 210, 168, .12);
}
.hero-impact {
  position: absolute;
  z-index: 4;
  left: -42px;
  bottom: 122px;
  width: 180px;
  min-height: 145px;
  padding: 24px;
  display: grid;
  align-content: center;
  border: 1px solid var(--sage);
  background: var(--forest-deep);
  box-shadow: 10px 10px 0 var(--sun);
}
.hero-impact span { color: var(--sage); font-family: var(--serif); font-size: 2.8rem; line-height: 1; }
.hero-impact p { margin: 9px 0 0; color: #d8e0e7; font-size: .8rem; line-height: 1.25; }
.hero-locations {
  grid-column: 1 / -1;
  min-height: 82px;
  padding: 18px clamp(24px, 5vw, 72px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 22px;
  color: #d7e0e8;
  background: var(--forest-deep);
  border-top: 1px solid rgba(232, 210, 168, .24);
}
.hero-locations strong { color: var(--sun); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; }
.hero-locations i { color: var(--sun); font-style: normal; }
.hero-locations button { margin-left: auto; padding: 8px 0; color: var(--sage); border: 0; border-bottom: 1px solid rgba(232,210,168,.5); background: transparent; font-weight: 800; }

.cause-card, .team-card, .form-frame, .donation-form { box-shadow: 0 18px 50px rgba(7, 26, 46, .08); }
.cause-card { border-color: rgba(7, 26, 46, .14); }
.cause-card.sage { border-top-color: var(--sage); }
.cause-card-body > p:not(.eyebrow), .secure-note small { color: var(--muted); }
.shop-social-strip { background: #fbf3e5; }
.social-panel { box-shadow: 20px 20px 0 rgba(223,112,56,.22); }
.events-copy > p:not(.eyebrow), .shop-callout p:not(.eyebrow), .donation-trust small { color: #d9e1e8; }

.page-hero { min-height: 440px; background: var(--forest); border-bottom: 1px solid rgba(232,210,168,.24); }
.page-hero::before { background: radial-gradient(circle at 85% 20%, rgba(223,112,56,.18), transparent 28%), radial-gradient(circle at 10% 110%, rgba(121,147,170,.22), transparent 30%); }
.page-hero > div > p:last-child { color: #d9e1e8; }
.about-tabs {
  min-height: 76px;
  padding: 0 clamp(24px, 7vw, 110px);
  display: flex;
  align-items: stretch;
  gap: 38px;
  background: var(--cream);
  border-bottom: 1px solid var(--line);
}
.about-tabs button { position: relative; padding: 0; border: 0; background: transparent; color: var(--muted); font-weight: 800; }
.about-tabs button::after { content: ""; height: 3px; position: absolute; left: 50%; right: 50%; bottom: 0; background: var(--sun); transition: .2s ease; }
.about-tabs button:hover, .about-tabs button.active { color: var(--forest); }
.about-tabs button.active::after { left: 0; right: 0; }
.about-overview { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; }
.about-overview h2 { max-width: 620px; }
.drives-us { padding-right: max(24px, 20vw); color: #e0e6ec; background: var(--forest); position: relative; overflow: hidden; }
.drives-us::after { content: "ROOTS"; position: absolute; right: -30px; bottom: -70px; color: rgba(255,255,255,.035); font-family: var(--serif); font-size: 16vw; line-height: 1; }
.drives-us h2 { color: var(--cream); max-width: 1000px; }
.drives-us > p:last-child { max-width: 760px; font-size: 1.12rem; }
.long-story { display: grid; grid-template-columns: minmax(280px,.62fr) 1.38fr; gap: 90px; align-items: start; }
.story-aside { position: sticky; top: 30px; padding: 44px; color: var(--cream); background: var(--forest); border-top: 6px solid var(--sun); }
.story-aside span, .vision-mission span { color: var(--sun); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 850; }
.story-aside h2 { margin: 22px 0 30px; color: var(--cream); font-size: clamp(2rem,3vw,3.2rem); }
.long-story blockquote { margin: 38px 0; padding: 30px 0 30px 30px; color: var(--forest); border-left: 4px solid var(--sun); font-family: var(--serif); font-size: 2rem; line-height: 1.25; }
.vision-mission { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; padding-top: 0; background: var(--forest); }
.vision-mission article { padding: clamp(42px,6vw,82px); background: var(--cream); }
.vision-mission article:nth-child(2) { background: var(--sage); }
.vision-mission h2 { margin-top: 20px; font-size: clamp(2rem,3.2vw,3.4rem); }
.staff-page .team-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 32px; }
.staff-page .team-card { min-height: 0; grid-template-columns: 1fr; overflow: visible; border-radius: 0; }
.team-photo-wrap { height: 390px; position: relative; margin-bottom: 45px; }
.staff-page .team-card img { height: 390px; min-height: 0; object-position: center 18%; }
.staff-page .team-card > div:last-child { padding: 8px 34px 38px; }
.staff-page .team-card h2 { margin: 7px 0 15px; font-size: 2.25rem; }
.staff-cta { display: flex; align-items: center; gap: 30px; color: white; background: var(--forest); }
.staff-cta h2 { margin: 0 auto 0 0; color: var(--cream); }

.project-media-placeholder { margin: 0 clamp(24px,7vw,110px) 100px; padding: clamp(46px,6vw,80px); position: relative; display: grid; grid-template-columns: .85fr 1.15fr; gap: 60px; color: #dbe2e8; background: var(--forest); overflow: visible; }
.project-media-placeholder h2 { color: var(--cream); font-size: clamp(2rem,3.5vw,3.8rem); }
.media-cells { min-height: 330px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.media-cells span { display: block; border: 1px solid rgba(232,210,168,.55); background: linear-gradient(145deg, rgba(232,210,168,.14), rgba(121,147,170,.14)); }
.media-cells span:first-child { grid-row: 1 / 3; border-top-left-radius: 80px; }
.media-cells span:nth-child(2) { background: linear-gradient(145deg, rgba(223,112,56,.22), rgba(121,147,170,.08)); }
.callout { margin-top: 0; }

.faq-section { display: grid; grid-template-columns: .72fr 1.28fr; gap: 90px; background: var(--cream); }
.faq-section > div:first-child { align-self: start; position: sticky; top: 30px; }
.faq-list { border-top: 1px solid var(--forest); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { padding: 25px 44px 25px 0; position: relative; color: var(--forest); font-family: var(--serif); font-size: 1.45rem; font-weight: 700; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 5px; color: var(--sun); font-family: var(--sans); font-size: 1.8rem; font-weight: 400; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 760px; padding: 0 44px 25px 0; color: var(--muted); }

.secure-note { background: var(--sage); }
.appeal-hero::after { background: linear-gradient(90deg, rgba(3,17,31,.96) 0%, rgba(7,26,46,.78) 48%, rgba(7,26,46,.1) 100%); }
.appeal-copy > p:last-child { color: #e0e6ec; }
.fund-note { background: var(--cream); }
.donation-form { box-shadow: 0 24px 70px rgba(7,26,46,.12); }
.modal-backdrop { background: rgba(3,17,31,.72); }
.site-footer { color: #dce3e9; }
.footer-main > div:first-child > p, .footer-main p { color: #aebbc7; }
.footer-main h2 { color: var(--sage); }
.footer-main button:not(.brand), .footer-main a { color: #dce3e9; }
.footer-bottom { color: #96a8b7; }
.footer-bottom button, .footer-bottom a { color: #c9d4dd; }

@media (max-width: 1040px) {
  .hero { grid-template-columns: 48% 52%; }
  .hero-impact { left: -18px; }
  .staff-page .team-grid { grid-template-columns: 1fr; }
}

@media (max-width: 800px) {
  .primary-nav { background: var(--forest-deep); border-top-color: rgba(232,210,168,.25); }
  .hero { grid-template-columns: 1fr; grid-template-rows: auto auto auto; }
  .hero-copy { padding-bottom: 60px; }
  .hero-visual { padding: 0 0 76px 24px; }
  .hero-impact { left: 22px; bottom: 100px; }
  .hero-locations { gap: 9px 14px; }
  .hero-locations button { width: 100%; margin: 8px 0 0; text-align: left; }
  .about-overview, .long-story, .vision-mission, .project-media-placeholder, .faq-section { grid-template-columns: 1fr; }
  .story-aside, .faq-section > div:first-child { position: static; }
  .project-media-placeholder { margin-bottom: 80px; }
  .staff-cta { align-items: flex-start; flex-direction: column; }
  .staff-cta h2 { margin: 0; }
}

@media (max-width: 520px) {
  .about-tabs { gap: 22px; overflow-x: auto; }
  .hero-image { min-height: 390px; border-radius: 82px 0 0 8px; }
  .hero-impact { width: 145px; min-height: 120px; padding: 17px; }
  .hero-impact span { font-size: 2.2rem; }
  .hero-locations i { display: none; }
  .hero-locations span { width: calc(50% - 8px); }
  .media-cells { min-height: 250px; }
  .team-photo-wrap, .staff-page .team-card img { height: 330px; }
}

/* Dark navy refinement — Option 7 brought through the full experience */
:root {
  --navy-black: #020d18;
  --navy-deep: #05182a;
  --navy-mid: #0b243d;
  --navy-raised: #102f4e;
  --navy-soft: #173b5c;
  --champagne: #e8d2a8;
  --mist: #d7e2eb;
  --steel: #86a2ba;
}

body,
.site-shell { color: var(--mist); background: var(--navy-deep); }
h1,
h2 { color: var(--champagne); }
.section {
  color: var(--mist);
  background-color: var(--navy-mid);
  background-image:
    linear-gradient(120deg, rgba(121,147,170,.045) 1px, transparent 1px),
    linear-gradient(30deg, rgba(121,147,170,.025) 1px, transparent 1px);
  background-size: 78px 78px, 118px 118px;
}
.section p { color: #c0ced9; }
.eyebrow { color: var(--sun); }
.arrow-link { color: var(--champagne); border-bottom-color: rgba(232,210,168,.48); }
.button-primary { color: var(--navy-black); background: var(--champagne); }
.button-primary:hover { color: white; background: var(--sun); }
.button-outline { color: var(--champagne); border-color: rgba(232,210,168,.7); }
.button-outline:hover { color: var(--navy-black); background: var(--champagne); }
.button-cream { color: var(--navy-black); background: var(--champagne); }

.hero {
  grid-template-rows: minmax(690px, 1fr) auto;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 14% 82%, rgba(121,147,170,.22), transparent 34%),
    linear-gradient(122deg, var(--navy-deep) 0 48%, #0b2b49 48% 100%);
}
.hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .88;
  background:
    radial-gradient(circle at 9% 20%, transparent 0 92px, rgba(232,210,168,.12) 93px 94px, transparent 95px 148px, rgba(223,112,56,.13) 149px 151px, transparent 152px),
    radial-gradient(circle at 40% 106%, transparent 0 210px, rgba(121,147,170,.14) 211px 213px, transparent 214px 292px, rgba(232,210,168,.09) 293px 294px, transparent 295px),
    linear-gradient(112deg, transparent 0 20%, rgba(232,210,168,.055) 20.1% 20.25%, transparent 20.4% 100%);
}
.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 420px;
  height: 420px;
  left: -230px;
  bottom: 90px;
  border: 1px solid rgba(232,210,168,.12);
  border-radius: 50%;
  box-shadow: 0 0 0 66px rgba(121,147,170,.035), 0 0 0 132px rgba(223,112,56,.025);
}
.hero-copy { padding-bottom: 100px; }
.hero-visual { padding: 42px 0 82px 24px; overflow: visible; }
.hero-image {
  min-height: 590px;
  border-width: 2px;
  box-shadow: -24px 24px 0 rgba(232,210,168,.12), -42px 42px 0 rgba(121,147,170,.06);
}

.hero-locations { min-height: 96px; background: var(--navy-black); }

.impact-intro,
.shop-social-strip,
.about-overview,
.team-section,
.events-page,
.involvement-grid,
.volunteer-form-section,
.donation-intro,
.donation-grid,
.appeal-layout,
.policy-content { background-color: var(--navy-mid); }
.cause-section,
.values-section,
.work-grid-detailed,
.volunteer-details,
.faq-section { background-color: var(--navy-deep); }
.impact-intro,
.cause-section,
.events-teaser,
.shop-social-strip,
.drives-us,
.staff-cta,
.project-media-placeholder,
.faq-section,
.donation-trust,
.page-hero {
  position: relative;
  overflow: hidden;
}
.impact-intro::before,
.cause-section::before,
.shop-social-strip::before,
.faq-section::before,
.page-hero::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -300px;
  top: -280px;
  border: 1px solid rgba(232,210,168,.08);
  border-radius: 50%;
  box-shadow: 0 0 0 72px rgba(121,147,170,.035), 0 0 0 144px rgba(223,112,56,.02);
  pointer-events: none;
}
.impact-intro > *,
.cause-section > *,
.shop-social-strip > *,
.faq-section > * { position: relative; z-index: 1; }

.stats-grid { border-color: rgba(232,210,168,.24); }
.stats-grid article + article { border-color: rgba(232,210,168,.18); }
.stats-grid strong { color: var(--champagne); }
.stats-grid span { color: var(--steel); }
.cause-card,
.team-card,
.work-grid article,
.involvement-grid article,
.donation-form,
.impact-examples article,
.event-feature-card,
.large-date,
.cookie-modal {
  color: var(--mist);
  border-color: rgba(232,210,168,.2);
  background: var(--navy-raised);
  box-shadow: 0 20px 55px rgba(2,13,24,.27);
}
.cause-card-body h3,
.cause-card-body > p:not(.eyebrow),
.team-card h2,
.team-card > div > p:last-child,
.work-grid h3,
.work-grid-detailed article > p:not(.work-location),
.work-grid-detailed li,
.involvement-grid p,
.event-feature-card h3,
.event-feature-card p,
.large-date,
.impact-examples strong,
.impact-examples p,
.donation-form h2,
.donation-form legend { color: var(--mist); }
.cause-card-body h3,
.team-card h2,
.work-grid h3,
.event-feature-card h3,
.impact-examples strong,
.donation-form h2 { color: var(--champagne); }
.cause-image { border-bottom: 1px solid rgba(232,210,168,.22); }
.cause-card.sage { border-top-color: var(--steel); }
.work-grid { background: rgba(232,210,168,.16); }
.work-grid-detailed { gap: 20px; background-image: none; }
.work-grid-detailed article { border-color: rgba(232,210,168,.18); background: var(--navy-raised); }
.work-grid-detailed .work-location { color: var(--champagne); background: rgba(232,210,168,.1); }
.city-list span { color: var(--champagne); border-color: rgba(232,210,168,.35); background: var(--navy-raised); }
.value-grid article { border-color: var(--champagne); }
.value-grid article + article { border-color: rgba(232,210,168,.18); }
.value-grid h3 { color: var(--champagne); }

.events-teaser,
.callout,
.shop-callout,
.staff-cta,
.drives-us,
.donation-trust { background: var(--navy-black); }
.event-feature-card button { color: var(--champagne); border-color: var(--champagne); background: transparent; }
.date-badge { color: var(--champagne); border-color: var(--champagne); }
.social-panel { background: var(--navy-raised); border: 1px solid rgba(232,210,168,.25); }
.social-links a { color: var(--mist); }

.page-hero {
  background:
    radial-gradient(circle at 84% 18%, rgba(223,112,56,.16), transparent 25%),
    linear-gradient(118deg, var(--navy-black), var(--navy-mid));
}
.page-hero::before {
  background:
    radial-gradient(circle at 92% 25%, transparent 0 118px, rgba(232,210,168,.12) 119px 120px, transparent 121px 184px, rgba(121,147,170,.13) 185px 187px, transparent 188px),
    linear-gradient(110deg, transparent 0 73%, rgba(232,210,168,.06) 73.1% 73.25%, transparent 73.4%);
}
.page-hero::after { right: -180px; top: -210px; }
.about-tabs { color: var(--mist); border-color: rgba(232,210,168,.2); background: var(--navy-black); }
.about-tabs button { color: var(--steel); }
.about-tabs button:hover,
.about-tabs button.active { color: var(--champagne); }
.about-overview .prose,
.long-story .prose { color: var(--mist); }
.long-story { background-color: var(--navy-mid); }
.long-story blockquote { color: var(--champagne); }
.story-aside { background: var(--navy-black); border: 1px solid rgba(232,210,168,.22); border-top: 6px solid var(--sun); }
.vision-mission { gap: 1px; background: rgba(232,210,168,.25); }
.vision-mission article,
.vision-mission article:nth-child(2) { color: var(--mist); background: var(--navy-raised); }
.vision-mission article:nth-child(2) { background: var(--navy-soft); }
.vision-mission h2 { color: var(--champagne); }

.staff-page .team-card { align-self: start; overflow: visible; background: var(--navy-raised); }
.staff-page .team-photo-wrap {
  width: 100%;
  height: auto;
  min-height: 0;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-bottom: 4px solid var(--sun);
  background: var(--navy-deep);
}
.staff-page .team-card > div:last-child {
  height: auto;
  padding-top: 30px;
  overflow: visible;
}
.staff-page .team-card img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  object-fit: contain;
  object-position: center;
  background: var(--navy-deep);
}
.staff-page .team-card > div:last-child > p:last-child {
  display: block;
  height: auto;
  max-height: none;
  overflow: visible;
  text-overflow: clip;
  -webkit-line-clamp: unset;
}

.project-media-placeholder {
  border: 1px solid rgba(232,210,168,.2);
  background:
    radial-gradient(circle at 85% 5%, rgba(223,112,56,.13), transparent 28%),
    linear-gradient(120deg, var(--navy-black), var(--navy-raised));
}
.media-cells span { background: linear-gradient(145deg, rgba(232,210,168,.12), rgba(121,147,170,.18)); }

.faq-list { border-color: var(--champagne); }
.faq-list details { border-color: rgba(232,210,168,.2); }
.faq-list summary { color: var(--champagne); }
.faq-list details p { color: #c0ced9; }
.shop-locations { border: 1px solid rgba(232,210,168,.22); background: var(--navy-raised); }
.shop-locations span,
.shop-locations small { color: var(--mist); }
.volunteer-columns h3 { color: var(--champagne); }
.volunteer-columns ul { color: #c0ced9; }
.form-frame { border-color: rgba(232,210,168,.28); background: var(--navy-raised); }

.secure-note { color: var(--mist); border: 1px solid rgba(232,210,168,.22); background: var(--navy-raised); }
.secure-note small { color: #c0ced9; }
.fund-note { border-color: var(--sun); background: var(--navy-raised); }
.fund-note p { color: #c0ced9; }
.segmented button,
.amount-grid button,
.custom-amount { color: var(--champagne); border-color: rgba(232,210,168,.25); background: var(--navy-deep); }
.segmented button.active,
.amount-grid button.active { color: var(--navy-black); border-color: var(--champagne); background: var(--champagne); box-shadow: none; }
.custom-amount span { color: var(--champagne); }
.custom-amount input { color: white; }
.check-row small,
.form-small { color: #aebfcd; }

.notice,
.draft-notice { color: var(--mist); background: var(--navy-raised); }
.notice span,
.draft-notice span { color: #c0ced9; }
.filter-row button { color: var(--mist); border-color: rgba(232,210,168,.24); background: var(--navy-raised); }
.filter-row button.active { color: var(--navy-black); border-color: var(--champagne); background: var(--champagne); }
.events-list,
.event-row { border-color: rgba(232,210,168,.2); }
.event-row h2 { color: var(--champagne); }
.event-row p { color: #b9c8d4; }
.event-meta { color: var(--mist) !important; }
.large-date { color: var(--champagne); }

.policy-section,
.cookie-table,
.cookie-table > div { border-color: rgba(232,210,168,.2); }
.policy-section h2 { color: var(--champagne); }
.policy-section p,
.cookie-table span { color: #c0ced9; }
.cookie-banner { color: var(--navy-black); border-color: var(--champagne); background: var(--champagne); }
.cookie-banner p { color: #344a5e; }
.cookie-banner .button-outline { color: var(--navy-black); border-color: var(--navy-black); }
.cookie-banner .text-button { color: var(--navy-black); }
.cookie-modal { color: var(--mist); }
.modal-close { color: var(--champagne); }
.toggle-list,
.toggle-list label { border-color: rgba(232,210,168,.2); }
.toggle-list small { color: #b9c8d4; }
.footer-logo-wrap { background: transparent; border: 1px solid rgba(232,210,168,.14); }

@media (max-width: 800px) {
  .hero { grid-template-rows: auto auto auto; }
  .hero-visual { padding-bottom: 76px; }
}

@media (max-width: 520px) {
  .hero-visual { padding-bottom: 60px; }
}

/* Project and real-event content */
.event-photo-card {
  min-height: 430px;
  padding: 0;
  display: block;
  overflow: hidden;
  border: 1px solid rgba(232,210,168,.28);
  background: var(--navy-black);
}
.event-photo-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 28%, rgba(2,13,24,.94) 100%);
}
.event-photo-card img { width: 100%; height: 430px; display: block; object-fit: cover; }
.event-photo-copy { position: absolute; z-index: 2; left: 34px; right: 80px; bottom: 28px; }
.event-photo-copy h3 { margin: 4px 0 5px; color: var(--champagne); font-size: clamp(1.8rem,3vw,2.6rem); }
.event-photo-copy p:last-child { margin: 0; color: #d6e0e8; }
.event-photo-card > button { position: absolute; z-index: 3; right: 28px; bottom: 30px; }

.staff-cta { justify-content: space-between; }
.staff-cta > div:first-child { max-width: 720px; }
.staff-cta > div:first-child p:last-child { max-width: 650px; margin: 12px 0 0; }
.staff-cta .button-row { justify-content: flex-end; }
.staff-cta a.button { display: inline-flex; align-items: center; text-decoration: none; }

.projects-intro { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: end; }
.projects-intro h2 { margin-bottom: 0; }
.projects-intro-copy { max-width: 790px; }
.projects-intro-copy > p { margin: 0; font-size: 1.08rem; }
.project-directory { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.project-directory a { padding: 8px 13px; color: var(--champagne); border: 1px solid rgba(232,210,168,.28); border-radius: 99px; text-decoration: none; font-size: .78rem; font-weight: 750; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.project-directory a:hover { color: var(--navy-black); border-color: var(--champagne); background: var(--champagne); }

.project-showcase {
  padding-top: 34px;
  display: grid;
  gap: clamp(34px,5vw,72px);
  background:
    radial-gradient(circle at 8% 17%, rgba(223,112,56,.1), transparent 19%),
    radial-gradient(circle at 95% 61%, rgba(121,147,170,.12), transparent 22%),
    linear-gradient(180deg,var(--navy-deep),var(--navy-black));
}
.project-feature { min-height: 590px; display: grid; grid-template-columns: minmax(0,1.04fr) minmax(0,.96fr); scroll-margin-top: 34px; overflow: hidden; border: 1px solid rgba(232,210,168,.21); background: linear-gradient(125deg,rgba(20,47,73,.94),rgba(8,29,49,.96)); box-shadow: 0 28px 80px rgba(1,10,18,.28); }
.project-feature.reverse { grid-template-columns: minmax(0,.96fr) minmax(0,1.04fr); }
.project-feature.reverse .project-feature-media { order: 2; }
.project-feature-media { min-height: 590px; margin: 0; position: relative; overflow: hidden; background: var(--navy-deep); }
.project-feature-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg,transparent 52%,rgba(2,13,24,.42)); }
.project-feature-media img { width: 100%; height: 100%; min-height: 590px; display: block; object-fit: cover; transition: transform .6s ease; }
.project-feature:hover .project-feature-media img { transform: scale(1.018); }
.project-feature-media figcaption { position: absolute; z-index: 2; left: 30px; bottom: 20px; color: rgba(255,255,255,.9); font-family: var(--serif); font-size: clamp(3rem,6vw,6.5rem); line-height: 1; }
.project-feature-copy { padding: clamp(42px,6vw,82px); display: flex; flex-direction: column; justify-content: center; }
.project-feature-label { margin: 0; color: var(--sun); text-transform: uppercase; letter-spacing: .15em; font-size: .7rem; font-weight: 850; }
.project-feature-copy h2 { margin: 15px 0 24px; color: var(--champagne); font-size: clamp(2.7rem,4.4vw,5.15rem); line-height: .98; }
.project-description { margin: 0; color: #d1dce5; font-size: 1.03rem; }
.project-feature-copy ul { margin: 30px 0; padding: 23px 0 0; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; list-style: none; border-top: 1px solid rgba(232,210,168,.2); }
.project-feature-copy li { min-height: 72px; padding-left: 16px; color: #ebf0f4; border-left: 2px solid var(--sun); font-size: .82rem; font-weight: 700; }
.project-enquiry-link { align-self: flex-start; padding: 0 0 5px; color: var(--champagne); border: 0; border-bottom: 1px solid rgba(232,210,168,.55); background: transparent; text-decoration: none; font-weight: 800; }
.project-enquiry-link span { display: inline-block; margin-left: 9px; color: var(--sun); transition: transform .2s ease; }
.project-enquiry-link:hover span { transform: translateX(5px); }

.uganda-project-feature { padding-top: clamp(60px,8vw,110px); padding-bottom: clamp(60px,8vw,110px); display: grid; grid-template-columns: 1fr 1fr; gap: clamp(48px,8vw,110px); align-items: center; background:
  radial-gradient(circle at 5% 15%, rgba(223,112,56,.12), transparent 28%),
  linear-gradient(120deg,var(--navy-black),var(--navy-mid));
}
.uganda-project-image { min-height: 610px; overflow: hidden; border: 1px solid rgba(232,210,168,.3); border-radius: 120px 8px 8px 8px; box-shadow: -22px 22px 0 rgba(232,210,168,.1); }
.uganda-project-image img { width: 100%; height: 610px; display: block; object-fit: cover; }
.uganda-project-feature h2 { margin-bottom: 24px; font-size: clamp(2.8rem,5vw,5rem); }
.uganda-project-feature p { max-width: 720px; }
.uganda-project-feature .button { margin-top: 18px; }

.seasonal-projects {
  background:
    radial-gradient(circle at 94% 8%, rgba(223,112,56,.12), transparent 21%),
    radial-gradient(circle at 3% 70%, rgba(121,147,170,.13), transparent 22%),
    var(--navy-deep);
}
.seasonal-heading { align-items: end; }
.seasonal-heading > p { max-width: 720px; }
.seasonal-story-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 20px; margin-top: 56px; }
.seasonal-story { grid-column: span 4; min-width: 0; overflow: hidden; border: 1px solid rgba(232,210,168,.22); background: linear-gradient(145deg,var(--navy-raised),var(--navy-mid)); box-shadow: 0 24px 65px rgba(1,10,18,.23); }
.seasonal-story-1 { grid-column: span 7; }
.seasonal-story-2 { grid-column: span 5; }
.seasonal-story figure { height: 350px; margin: 0; position: relative; overflow: hidden; background: var(--navy-black); }
.seasonal-story-1 figure,
.seasonal-story-2 figure { height: 430px; }
.seasonal-story figure::after { content: ""; position: absolute; inset: 45% 0 0; pointer-events: none; background: linear-gradient(180deg,transparent,rgba(2,13,24,.58)); }
.seasonal-story img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .55s ease; }
.seasonal-story:hover img { transform: scale(1.02); }
.seasonal-story figcaption { position: absolute; z-index: 2; right: 24px; bottom: 16px; color: rgba(255,255,255,.92); font-family: var(--serif); font-size: clamp(2.8rem,5vw,5.5rem); line-height: 1; }
.seasonal-story > div { padding: clamp(28px,3.2vw,44px); }
.seasonal-focus { margin: 0; color: var(--sun) !important; text-transform: uppercase; letter-spacing: .12em; font-size: .66rem !important; font-weight: 850; }
.seasonal-story h3 { margin: 12px 0 20px; color: var(--champagne); font-family: var(--serif); font-size: clamp(2rem,3.4vw,3.7rem); line-height: 1.04; }
.seasonal-story > div > p:last-child { margin: 0; color: #cbd7e0; font-size: .94rem; }
.seasonal-story-1 > div > p:last-child,
.seasonal-story-2 > div > p:last-child { font-size: 1rem; }
.seasonal-contact { margin-top: 58px; padding: 34px 38px; display: flex; align-items: center; justify-content: space-between; gap: 32px; border: 1px solid rgba(232,210,168,.22); background: var(--navy-black); }
.seasonal-contact span { color: var(--champagne); font-family: var(--serif); font-size: clamp(1.7rem,3vw,2.5rem); }
.seasonal-contact p { max-width: 760px; margin: 8px 0 0; color: #bdcbd6; }
.seasonal-contact a.button { flex: 0 0 auto; text-decoration: none; }

.events-gallery-intro { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: end; margin-bottom: 50px; }
.events-gallery-intro h2 { margin: 0; font-size: clamp(2.6rem,4vw,4.5rem); }
.events-gallery-intro > p { max-width: 760px; margin: 0; }
.event-gallery { display: grid; grid-template-columns: repeat(12,1fr); grid-auto-flow: dense; gap: 18px; }
.event-gallery-card { grid-column: span 4; min-height: 470px; margin: 0; position: relative; overflow: hidden; border: 1px solid rgba(232,210,168,.22); background: var(--navy-black); }
.event-gallery-card.featured { grid-column: span 8; }
.event-gallery-card::after { content: ""; position: absolute; inset: 30% 0 0; background: linear-gradient(180deg,transparent,rgba(2,13,24,.95)); pointer-events: none; }
.event-gallery-card img { width: 100%; height: 470px; display: block; object-fit: cover; transition: transform .45s ease; }
.event-gallery-card:hover img { transform: scale(1.025); }
.event-gallery-card figcaption { position: absolute; z-index: 2; left: 28px; right: 28px; bottom: 24px; }
.event-gallery-card figcaption span { color: var(--sun); text-transform: uppercase; letter-spacing: .13em; font-size: .66rem; font-weight: 850; }
.event-gallery-card h2 { margin: 7px 0 0; color: white; font-size: clamp(1.65rem,2.5vw,2.5rem); }
.events-future-note { margin-top: 70px; padding: clamp(38px,5vw,60px); display: grid; grid-template-columns: .7fr 1.1fr auto; gap: 30px; align-items: center; border: 1px solid rgba(232,210,168,.22); background: var(--navy-black); }
.events-future-note strong { color: var(--champagne); font-family: var(--serif); font-size: clamp(1.8rem,3vw,2.8rem); }
.events-future-note p { margin: 0; }
.events-future-note a.button { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }

@media (max-width: 1100px) {
  .project-feature,
  .project-feature.reverse { grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); }
  .project-feature-copy { padding: 44px; }
  .project-feature-copy ul { grid-template-columns: 1fr; }
  .project-feature-copy li { min-height: 0; }
  .seasonal-story,
  .seasonal-story-1,
  .seasonal-story-2 { grid-column: span 6; }
  .seasonal-story:last-child { grid-column: 1 / -1; }
  .seasonal-story figure,
  .seasonal-story-1 figure,
  .seasonal-story-2 figure { height: 390px; }
  .event-gallery-card,
  .event-gallery-card.featured { grid-column: span 6; }
  .events-future-note { grid-template-columns: 1fr 1fr; }
  .events-future-note .button-row { grid-column: 1 / -1; }
}

@media (max-width: 800px) {
  .projects-intro,
  .uganda-project-feature,
  .events-gallery-intro { grid-template-columns: 1fr; gap: 32px; }
  .project-feature,
  .project-feature.reverse { min-height: 0; grid-template-columns: 1fr; }
  .project-feature.reverse .project-feature-media { order: 0; }
  .project-feature-media,
  .project-feature-media img { min-height: 480px; height: 480px; }
  .project-feature-copy { padding: 38px 30px 44px; }
  .project-feature-copy ul { grid-template-columns: repeat(3,1fr); }
  .uganda-project-image,
  .uganda-project-image img { min-height: 440px; height: 440px; }
  .event-gallery-card,
  .event-gallery-card.featured { grid-column: 1 / -1; min-height: 420px; }
  .event-gallery-card img { height: 420px; }
  .events-future-note { grid-template-columns: 1fr; }
  .events-future-note .button-row { grid-column: auto; }
  .staff-cta .button-row { justify-content: flex-start; }
  .seasonal-story,
  .seasonal-story-1,
  .seasonal-story-2,
  .seasonal-story:last-child { grid-column: 1 / -1; }
  .seasonal-contact { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 560px) {
  .project-feature-media,
  .project-feature-media img { min-height: 390px; height: 390px; }
  .project-feature-copy ul { grid-template-columns: 1fr; }
  .project-feature-copy li { min-height: 0; }
  .seasonal-story figure,
  .seasonal-story-1 figure,
  .seasonal-story-2 figure { height: 330px; }
  .seasonal-story > div { padding: 28px 24px 32px; }
  .seasonal-contact { padding: 30px 24px; }
  .event-photo-card,
  .event-photo-card img { min-height: 390px; height: 390px; }
  .event-photo-copy { left: 24px; right: 70px; bottom: 22px; }
  .event-photo-copy p:last-child { display: none; }
}

/* Our clients */
.clients-intro { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(42px,7vw,100px); align-items: end; margin-bottom: 58px; }
.clients-intro h2 { max-width: 720px; margin: 0; font-size: clamp(2.7rem,4.8vw,5.2rem); }
.clients-intro > p { max-width: 720px; margin: 0; font-size: 1.08rem; }
.clients-gallery-section {
  padding-top: clamp(72px,9vw,120px);
  padding-bottom: clamp(72px,9vw,120px);
  background:
    radial-gradient(circle at 4% 12%, rgba(223,112,56,.13), transparent 22%),
    radial-gradient(circle at 96% 82%, rgba(121,147,170,.14), transparent 25%),
    linear-gradient(145deg,var(--navy-deep),var(--navy-black));
}
.client-logo-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.client-logo-card { min-height: 270px; padding: 18px; display: flex; flex-direction: column; border: 1px solid rgba(232,210,168,.21); background: linear-gradient(145deg,var(--navy-raised),var(--navy-mid)); transition: transform .2s ease, border-color .2s ease; }
.client-logo-card:hover { transform: translateY(-4px); border-color: rgba(232,210,168,.55); }
.client-logo-card > div { min-height: 170px; padding: 24px; display: grid; place-items: center; background: #fff; }
.client-logo-card img { width: 100%; height: 125px; display: block; object-fit: contain; }
.client-logo-card h3 { margin: 20px 6px 4px; color: var(--champagne); font-family: var(--serif); font-size: 1.28rem; }
.clients-cta { display: flex; align-items: center; justify-content: space-between; gap: 48px; background:
  radial-gradient(circle at 78% 40%,rgba(223,112,56,.12),transparent 25%),
  var(--navy-black); }
.clients-cta > div { max-width: 850px; }
.clients-cta h2 { margin: 0 0 14px; font-size: clamp(2.5rem,4.6vw,5rem); }
.clients-cta p:last-child { max-width: 720px; margin: 0; }
.clients-cta .button { flex: 0 0 auto; }

@media (max-width: 1150px) {
  .primary-nav { gap: 14px; }
  .nav-link { font-size: .9rem; }
  .client-logo-grid { grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 800px) {
  .clients-intro { grid-template-columns: 1fr; }
  .client-logo-grid { grid-template-columns: repeat(2,1fr); }
  .clients-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 520px) {
  .client-logo-grid { grid-template-columns: 1fr; }
  .client-logo-card { min-height: 240px; }
}

/* The extra Home link needs the compact menu slightly earlier on tablets. */
@media (min-width: 801px) and (max-width: 980px) {
  .site-header { height: 78px; }
  .menu-button { display: grid; place-items: center; }
  .primary-nav { display: none; position: absolute; top: 78px; left: 0; right: 0; padding: 20px; background: var(--forest-deep); border-top: 1px solid rgba(232,210,168,.25); box-shadow: 0 20px 35px rgba(0,0,0,.12); align-items: stretch; }
  .primary-nav.open { display: flex; flex-direction: column; }
  .nav-link { padding: 10px; color: white; text-align: left; }
  .nav-donate { justify-content: center; }
}

/* Wix-ready donation journey */
.donation-form {
  padding: clamp(26px,3vw,40px);
  border-color: rgba(232,210,168,.28);
  background:
    radial-gradient(circle at 100% 0,rgba(223,112,56,.09),transparent 23%),
    linear-gradient(145deg,var(--navy-raised),var(--navy-mid));
}
.donation-form-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.checkout-security { position: relative; padding-left: 19px; color: #b8c8d4; font-size: .74rem; font-weight: 750; }
.checkout-security::before { content: "✓"; position: absolute; left: 0; color: var(--sun); font-weight: 900; }
.donation-form fieldset { margin-bottom: 28px; }
.donation-form legend { display: flex; align-items: center; gap: 9px; }
.donation-form legend > span { width: 25px; height: 25px; display: inline-grid; place-items: center; border: 1px solid rgba(232,210,168,.42); border-radius: 50%; color: var(--champagne); font-size: .72rem; }
.donation-form .segmented button,
.donation-form .amount-grid button { color: var(--champagne); border-color: rgba(232,210,168,.28); background: rgba(2,13,24,.32); }
.donation-form .segmented button:hover,
.donation-form .amount-grid button:hover { border-color: var(--champagne); }
.donation-form .segmented button.active,
.donation-form .amount-grid button.active { color: var(--navy-black); border-color: var(--champagne); background: var(--champagne); box-shadow: none; }
.donation-form input { color: white; }
.custom-amount { border-color: rgba(232,210,168,.28); background: rgba(2,13,24,.32); }
.custom-amount span { color: var(--champagne); }
.custom-amount input:focus { outline: 0; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field-grid label { display: grid; gap: 7px; color: #dce6ed; font-size: .82rem; font-weight: 750; }
.field-grid input { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid rgba(232,210,168,.28); border-radius: 7px; background: rgba(2,13,24,.32); }
.field-grid input:focus { border-color: var(--champagne); outline: 2px solid rgba(232,210,168,.14); outline-offset: 1px; }
.full-field { grid-column: 1 / -1; }
.fee-cover-row,
.updates-row { padding: 18px; border: 1px solid rgba(232,210,168,.17); background: rgba(2,13,24,.23); }
.gift-aid-panel { padding: 20px; border: 1px solid rgba(232,210,168,.3); background: rgba(232,210,168,.055); }
.gift-aid-panel .check-row { margin-bottom: 0; }
.gift-aid-details { margin-top: 19px; padding-top: 18px; border-top: 1px solid rgba(232,210,168,.2); }
.gift-aid-details > p { margin: 0 0 18px; color: #c7d4de; font-size: .79rem; line-height: 1.55; }
.gift-aid-details > small { display: block; margin-top: 14px; color: #aebfcb; font-size: .75rem; }
.gift-summary { margin: 4px 0 18px; padding: 18px 0; display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; align-items: center; border-top: 1px solid rgba(232,210,168,.27); border-bottom: 1px solid rgba(232,210,168,.27); }
.gift-summary span { color: #c7d4de; font-weight: 750; }
.gift-summary strong { color: var(--champagne); font-family: var(--serif); font-size: 1.9rem; }
.gift-summary small { grid-column: 1 / -1; color: #9fb1bf; }
.checkout-button:disabled { cursor: not-allowed; opacity: .55; transform: none; }
.form-small a { color: var(--champagne); }
.wix-handoff-panel { position: sticky; top: 24px; }
.wix-handoff-panel > .eyebrow { margin-top: 34px; }
.wix-handoff-panel h2 { margin: 6px 0 16px; }
.handoff-copy { margin: 0 0 24px; color: #c7d4de; }
.handoff-amounts { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 28px; }
.handoff-amounts span { min-height: 48px; display: grid; place-items: center; border: 1px solid rgba(232,210,168,.3); border-radius: 8px; color: var(--champagne); background: rgba(2,13,24,.32); font-family: var(--serif); font-size: 1.18rem; font-weight: 800; }
.handoff-route { display: grid; grid-template-columns: 34px 1fr; gap: 13px; padding: 18px 0; border-top: 1px solid rgba(232,210,168,.2); }
.handoff-route > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--navy-black); background: var(--champagne); font-weight: 900; }
.handoff-route p { display: grid; gap: 4px; margin: 0; }
.handoff-route strong { color: white; }
.handoff-route small { color: #aebfcb; }
.wix-handoff-panel .checkout-button { display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 10px; text-align: center; text-decoration: none; }

@media (max-width: 560px) {
  .donation-form-heading { align-items: flex-start; flex-direction: column; }
  .field-grid { grid-template-columns: 1fr; }
  .full-field { grid-column: auto; }
  .checkout-button { padding-left: 14px; padding-right: 14px; font-size: .9rem; }
  .handoff-amounts { grid-template-columns: repeat(2,1fr); }
}