/* ==========================================================================
   Al Hadi Foundation — built from Figma "Al Hadi Website UI Design" (1440 desktop frame)
   ========================================================================== */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/inter-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/inter-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/inter-latin-700-normal.woff2") format("woff2"); }

:root {
	--gold: #ceb946;
	--gold-hero: #d3c049;
	--green: #30b34b;
	--green-2: #0fa958;
	--green-brand: #007e1b;
	--green-dark: #2a4737;
	--green-bar: #345744;
	--ink: #0e0f14;
	--slate: #444651;
	--nav: #2e2f3f;
	--text: #000;
	--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--fs-hero: clamp(36px, 4.45vw, 64px);
	--fs-h2: clamp(30px, 3.34vw, 48px);
	--fs-h3: clamp(26px, 2.5vw, 36px);
	--fs-32: clamp(22px, 2.23vw, 32px);
	--fs-24: clamp(18px, 1.67vw, 24px);
	--fs-20: clamp(16px, 1.39vw, 20px);
	--canvas: 1440px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--font); color: var(--text); background: #fff; line-height: normal; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
button { font: inherit; cursor: pointer; }
h1, h2, h3, p, figure, ul, ol, blockquote { margin: 0; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.screen-reader-text:focus { clip: auto; width: auto; height: auto; z-index: 1000; background: #fff; padding: 10px 16px; top: 8px; left: 8px; }
:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }

.ahf-site { position: relative; overflow: hidden; }
.ahf-main > * { position: relative; }

/* decorative blurs */
.ahf-glow { position: absolute; pointer-events: none; border-radius: 100px; z-index: 0; }
.ahf-glow--top { width: 420px; height: 467px; right: -150px; top: -234px; background: var(--green-2); filter: blur(250px); opacity: .77; }
.ahf-glow--right { width: 150px; height: 150px; right: -10px; bottom: 820px; background: var(--green); filter: blur(100px); }
.ahf-glow--left { width: 200px; height: 200px; left: 45px; bottom: -200px; background: var(--green); filter: blur(125px); opacity: .8; }

/* dashed squares (VECTOR DESIGN) */
.ahf-dashed { position: absolute; width: 449px; height: 447px; pointer-events: none; z-index: 0; }
.ahf-dashed span { position: absolute; left: 50%; top: 50%; width: var(--w); height: calc(var(--w) * .932); border: 10px dashed #7e7e7e; opacity: .3; transform: translate(-50%, -50%) rotate(40.82deg); }
.ahf-dashed span:nth-child(n+2) { left: calc(50% - (329px - var(--w)) * .2); }
.ahf-dashed--home { left: -182px; top: -343px; }
.ahf-dashed--phero { left: -198px; top: 501px; }

/* ---------- Header (MENU BAR) ---------- */
.ahf-header { position: relative; z-index: 50; padding: 16px 16px 0; }
.ahf-header--home { padding-top: 16px; }
.ahf-menubar { max-width: 1198px; height: 79px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 52px; padding: 0 40px 0 10px; background: #fff; border: 2px solid #000; border-radius: 200px; }
.ahf-menubar__logo img { width: 144px; height: auto; }
.ahf-nav__list { display: flex; align-items: center; gap: 52px; list-style: none; padding: 0; }
.ahf-nav__list > li { position: relative; }
.ahf-nav__link, .ahf-nav__list > li > a { font-size: 24px; color: var(--nav); text-decoration: none; white-space: nowrap; }
.ahf-nav__link:hover, .ahf-nav__link.is-current { color: var(--green-brand); }
.ahf-sub { position: absolute; top: calc(100% + 18px); left: 50%; transform: translate(-50%, 8px); width: 206px; padding: 54px 0 55px; display: flex; flex-direction: column; gap: 27px; background: var(--gold); border: 1px solid #000; border-radius: 20px; overflow: hidden; opacity: 0; visibility: hidden; transition: .2s; }
.ahf-sub::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; }
.ahf-sub a { display: block; padding: 10px 22px; border-block: 2px solid #fffafa; color: #fff; font-weight: 600; font-size: 20px; text-decoration: none; }
.ahf-sub a:hover { background: rgba(255,255,255,.15); }
.ahf-nav__has-sub:hover .ahf-sub, .ahf-nav__has-sub:focus-within .ahf-sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
/* WordPress menu (optional) – same gold dropdown as the design */
.ahf-nav__list .menu-item { position: relative; }
.ahf-nav__list .sub-menu { position: absolute; top: calc(100% + 18px); left: 50%; transform: translate(-50%, 8px); min-width: 220px; padding: 20px 0; margin: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; background: var(--gold); border: 1px solid #000; border-radius: 20px; opacity: 0; visibility: hidden; transition: .2s; z-index: 60; }
.ahf-nav__list .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; }
.ahf-nav__list .sub-menu a { display: block; padding: 10px 22px; border-block: 2px solid #fffafa; color: #fff; font-weight: 600; font-size: 18px; text-decoration: none; white-space: nowrap; }
.ahf-nav__list .sub-menu .sub-menu { display: none; }
.ahf-nav__list .menu-item-has-children:hover > .sub-menu, .ahf-nav__list .menu-item-has-children:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.ahf-menubar__toggle { display: none; margin-left: auto; background: none; border: 0; font-size: 34px; color: var(--ink); padding: 6px; }
.ahf-menubar__toggle .i-close { display: none; }

/* DONATE pill */
.ahf-btn-donate { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-width: 197px; height: 49px; padding: 10px 20px; border: 0; border-radius: 30px; background: var(--gold); color: #fff; font-weight: 600; font-size: 24px; white-space: nowrap; transition: transform .15s, box-shadow .15s; }
.ahf-btn-donate span { flex: 1; text-align: left; }
.ahf-btn-donate__icon { width: 29px; height: 29px; flex: none; }
.ahf-btn-donate:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(206,185,70,.45); }
.ahf-btn-donate--hero { background: var(--gold-hero); }
.ahf-row__text .ahf-btn-donate { margin-top: 10px; }

/* ---------- Home: program circles ---------- */
.ahf-circles { max-width: 1100px; margin: 40px auto 0; padding: 0 16px; display: flex; justify-content: center; gap: clamp(10px, 2vw, 28px); flex-wrap: nowrap; z-index: 2; }
.ahf-circle { flex: 0 1 120px; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 8px; background: none; border: 0; padding: 0; text-decoration: none; color: #000; font-size: clamp(11px, 1vw, 14px); line-height: 1.2; text-align: center; }
.ahf-circle img { width: 100%; height: auto; aspect-ratio: 1; border-radius: 50%; transition: transform .25s; }
.ahf-circle:hover img { transform: scale(1.05); }

/* ---------- Home hero ---------- */
.ahf-hero { max-width: var(--canvas); margin: 30px auto 0; padding: 0 85px; display: flex; align-items: flex-start; justify-content: space-between; z-index: 2; }
.ahf-hero__text { padding-top: 42px; max-width: 690px; }
.ahf-hero h1 { font-size: var(--fs-hero); font-weight: 500; max-width: 600px; }
.ahf-hero__text p { margin-top: 30px; font-size: var(--fs-32); font-weight: 500; color: var(--green); }
.ahf-hero .ahf-btn-donate { margin-top: 125px; }
.ahf-hero__img { width: 587px; flex: none; aspect-ratio: 587/584; object-fit: cover; border-radius: 111px; }

/* ---------- Stats bar (INFO) ---------- */
.ahf-stats { margin: 107px 0 0 auto; width: min(1108px, 100%); height: 138px; background: var(--green-bar); border-radius: 50px 0 0 50px; box-shadow: 0 4px 4px rgba(0,0,0,.25); backdrop-filter: blur(6px); color: #fff; z-index: 3; display: flex; align-items: center; }
.ahf-stats--home { margin-top: 107px; margin-right: 4px; }
.ahf-main > .ahf-phero + .ahf-stats { margin-top: -33px; }
.ahf-stats__viewport { overflow: hidden; width: calc(100% - 58px); margin-left: 58px; -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
.ahf-stats__track { display: flex; width: max-content; animation: ahf-marquee 36s linear infinite; }
.ahf-stats:hover .ahf-stats__track { animation-play-state: paused; }
.ahf-stats__list { display: flex; align-items: center; gap: 42px; list-style: none; padding: 0 42px 0 0; }
.ahf-stat { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; min-width: 122px; max-width: 193px; }
.ahf-stat strong { font-size: 32px; font-weight: 500; letter-spacing: 1.28px; }
.ahf-stat span { font-size: 20px; max-width: 160px; }
.ahf-stats__star { width: 24px; height: 24px; font-size: 24px; color: #fff; display: flex; }
@keyframes ahf-marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ahf-stats__track { animation: none; } .ahf-stats__viewport { overflow-x: auto; } }

/* ---------- What we do ---------- */
.ahf-whatwedo { max-width: var(--canvas); margin: 62px auto 0; padding: 0 16px 0 188px; display: flex; align-items: center; gap: 68px; }
.ahf-whatwedo__text { width: 524px; display: flex; flex-direction: column; align-items: center; gap: 22px; z-index: 1; }
.ahf-whatwedo h2 { width: 384px; font-size: var(--fs-h2); font-weight: 500; color: #fff; text-align: center; } /* white on white, as in the design */
.ahf-whatwedo p { font-size: var(--fs-32); color: #010000; }
.ahf-whatwedo p span { color: var(--green-brand); }
.ahf-whatwedo > img { width: 500px; flex: none; }
.ahf-waves { max-width: var(--canvas); margin: 36px auto 0; padding-left: 21px; }
.ahf-waves img { width: 1419px; max-width: 100%; }

/* ---------- Mission / Vision / Values ---------- */
.ahf-mvv { max-width: var(--canvas); margin: 82px auto 0; padding: 0 16px 0 129px; display: flex; align-items: flex-start; }
.ahf-mvv__list { list-style: none; padding: 0; width: 690px; display: flex; flex-direction: column; gap: 52px; flex: none; }
.ahf-mvv__list li { display: flex; gap: 26px; align-items: flex-start; }
.ahf-mvv__num { flex: none; width: 46px; height: 50px; border-radius: 30px; background: var(--green-2); display: grid; place-items: center; font-size: 24px; color: #000; }
.ahf-mvv__list p { font-size: var(--fs-20); max-width: 620px; padding-top: 2px; }
.ahf-mvv__lines { width: 287px; flex: none; margin: 84px 0 0 34px; display: flex; flex-direction: column; gap: 86px; }
.ahf-mvv__lines i { position: relative; height: 15px; display: block; }
.ahf-mvv__lines i::before { content: ""; position: absolute; left: 6px; right: 6px; top: 7px; border-top: 1px solid #000; }
.ahf-mvv__lines i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 11px; height: 14px; border-radius: 50%; background: #000; box-shadow: 272px 0 0 #000; }
.ahf-mvv__rings { flex: none; margin: 19px 0 0 -112px; position: relative; z-index: 1; }
.ahf-ring { display: flex; flex-direction: column; align-items: center; gap: 8px; padding-top: 10px; border-radius: 200px; color: #fff; }
.ahf-ring > svg { width: 50px; height: 50px; font-size: 50px; }
.ahf-ring b { font-weight: 400; font-size: 24px; }
.ahf-ring--1 { width: 321px; height: 355px; background: var(--slate); border: 1px solid #000; }
.ahf-ring--2 { width: 250px; height: 250px; background: var(--ink); }
.ahf-ring--3 { width: 150px; height: 145px; background: var(--slate); }
.ahf-dotline { max-width: var(--canvas); margin: 51px auto 0; padding: 0 12px 0 8px; }
.ahf-dotline svg { width: 100%; height: 62px; display: block; }

/* ---------- Our strengths ---------- */
.ahf-strengths { max-width: 1029px; margin: 96px auto 0; padding: 0 16px; box-sizing: content-box; text-align: center; }
.ahf-strengths h2 { font-size: var(--fs-h2); font-weight: 500; color: #030000; }
.ahf-strengths__grid { list-style: none; padding: 0; margin-top: 40px; display: grid; grid-template-columns: repeat(3, 238px); justify-content: space-between; row-gap: 50px; }
.ahf-strength { position: relative; height: 235px; display: flex; justify-content: center; }
.ahf-strength__card { position: absolute; left: 0; right: 0; bottom: 0; height: 169px; padding: 30px 12px 20px; display: grid; place-items: center; border-radius: 20px; background: rgba(126,126,126,.1); backdrop-filter: blur(100px); box-shadow: 0 4px 4px rgba(0,0,0,.25); font-size: 24px; font-weight: 600; color: #030000; }
.ahf-strength__icon { position: relative; z-index: 1; width: 80px; height: 80px; border-radius: 100px; background: var(--ink); color: #fff; display: grid; place-items: center; font-size: 36px; }
.ahf-strength__icon::after { content: ""; position: absolute; left: 21px; top: 50px; width: 40px; height: 40px; border-radius: 100px; background: var(--green); filter: blur(25px); z-index: -1; }
.ahf-strength--grey .ahf-strength__icon::after { background: #6f8173; }
.ahf-strength__icon svg { width: 36px; height: 36px; }

/* ---------- Alternating rows (Projects / Health / Future / Home marriage / About) ---------- */
.ahf-row { max-width: 1260px; margin: 0 auto; padding: 70px 16px; display: flex; align-items: center; justify-content: space-between; gap: 64px; }
.ahf-row--image { flex-direction: row-reverse; }
.ahf-row__text { flex: 0 1 650px; display: flex; flex-direction: column; align-items: flex-start; gap: 34px; z-index: 1; }
.ahf-row h2 { font-size: var(--fs-h3); font-weight: 500; }
.ahf-row__body { font-size: var(--fs-24); text-align: justify; }
.ahf-row__body p + p, .ahf-row__body p + ul, .ahf-row__body ul + p, .ahf-row__body p + ol { margin-top: 0; }
.ahf-row__body ul, .ahf-row__body ol { padding-left: 1.5em; }
.ahf-row__body ul ul { padding-left: 1.5em; list-style: circle; }
.ahf-row__body a { text-decoration: underline; }
.ahf-row--small .ahf-row__body { font-size: var(--fs-20); }
.ahf-row__media { flex: 0 0 562px; }
.ahf-row__media img { width: 562px; aspect-ratio: 562/412; object-fit: cover; border-radius: 20px; }
.ahf-row--marriage { margin-top: 134px; padding: 0 16px; align-items: flex-start; }
.ahf-row--marriage .ahf-row__text { flex-basis: 699px; }
.ahf-row--marriage .ahf-row__body { max-width: 621px; }
.ahf-row--marriage .ahf-row__media { margin-top: 105px; }

/* ---------- Inner page hero ---------- */
.ahf-phero { max-width: var(--canvas); margin: 0 auto; height: 660px; padding: 68px 0 0 110px; display: flex; align-items: flex-start; gap: 58px; }
.ahf-phero__media { flex: none; width: 711px; z-index: 1; }
.ahf-phero__media img { width: 711px; height: 517px; object-fit: cover; border-radius: 12px; }
.ahf-phero__title { margin-top: 62px; max-width: 595px; font-size: var(--fs-hero); font-weight: 500; color: #040000; z-index: 1; }
.ahf-phero__title em { font-style: normal; color: var(--green-2); }

.ahf-h-center { text-align: center; font-size: var(--fs-h2); font-weight: 500; }
.ahf-h-center--page { margin: 80px auto 0; }
.ahf-gallery-wrap { max-width: var(--canvas); margin: 46px auto 0; padding: 0 16px; }
.ahf-gallery { margin: 17px auto 0; max-width: 1342px; height: 350px; display: flex; gap: 23px; }
.ahf-gallery__item { flex: 200 1 0; min-width: 0; border-radius: 30px; overflow: hidden; transition: flex-grow .45s ease; outline-offset: 4px; }
.ahf-gallery__item img { width: 100%; height: 100%; object-fit: cover; }
.ahf-gallery:hover .ahf-gallery__item, .ahf-gallery:focus-within .ahf-gallery__item { flex-grow: 200; }
.ahf-gallery__item.is-open, .ahf-gallery .ahf-gallery__item:hover, .ahf-gallery .ahf-gallery__item:focus { flex-grow: 458; }
.ahf-h-center--sub { margin-top: 128px; }

/* ---------- About ---------- */
.ahf-who { max-width: var(--canvas); margin: 53px auto 0; padding: 0 16px 0 117px; display: flex; align-items: center; gap: 67px; }
.ahf-who > img { width: 500px; flex: none; object-fit: contain; }
.ahf-who__text { width: 695px; color: #020000; display: flex; flex-direction: column; gap: 0; }
.ahf-who h2 { text-align: center; font-size: var(--fs-h2); font-weight: 500; margin-bottom: 22px; }
.ahf-who p { max-width: 643px; font-size: var(--fs-32); }
.ahf-who p span { color: #008017; }
.ahf-why { max-width: var(--canvas); margin: 60px auto 0; padding: 0 0 0 100px; display: flex; align-items: center; gap: 144px; }
.ahf-why__cards { list-style: none; padding: 0; width: 805px; flex: none; display: flex; flex-direction: column; gap: 22px; }
.ahf-why__cards li { display: flex; align-items: center; gap: 42px; padding: 20px; min-height: 235px; border-radius: 20px; background: var(--ink); color: #fff; }
.ahf-why__cards svg { flex: none; width: 80px; height: 85px; color: var(--green); }
.ahf-why__cards p { font-size: var(--fs-32); font-weight: 500; text-align: justify; }
.ahf-why__badge { flex: none; width: 387px; height: 643px; margin-left: -144px; position: relative; display: grid; place-items: center; }
.ahf-why__badge::before, .ahf-why__badge::after { content: ""; position: absolute; right: 0; border-radius: 100% 0 0 100% / 50% 0 0 50%; }
.ahf-why__badge::before { top: 0; width: 387px; height: 643px; background: var(--green-dark); }
.ahf-why__badge::after { top: 50px; width: 332px; height: 543px; background: var(--ink); }
.ahf-why__badge h2 { position: relative; z-index: 1; margin-left: 40px; font-size: var(--fs-hero); font-weight: 700; color: #fff; }
.ahf-founder { max-width: var(--canvas); margin: 120px auto 0; padding: 0 16px 0 114px; display: flex; align-items: center; gap: 82px; }
.ahf-founder__media { position: relative; width: 529px; height: 509px; flex: none; }
.ahf-founder__plate { position: absolute; left: 0; bottom: 0; width: 524px; height: 326px; border-radius: 72px; background: var(--gold); }
.ahf-founder__media img { position: absolute; left: 41px; top: 0; width: 488px; height: 488px; object-fit: cover; border-radius: 100px; }
.ahf-founder__text { width: 624px; font-size: var(--fs-24); text-align: justify; }
.ahf-founder__text footer { margin-top: 1.2em; color: var(--gold); font-weight: 600; text-align: left; }

/* ---------- Footer ---------- */
.ahf-footer { position: relative; max-width: var(--canvas); margin: 200px auto 0; }
.ahf-newsletter { position: relative; z-index: 2; margin-left: 512px; width: 706px; height: 75px; display: flex; align-items: center; background: #fff; border: 1px solid #000; border-radius: 30px; }
.ahf-newsletter input { flex: 1; min-width: 0; height: 100%; border: 0; background: transparent; padding: 0 20px 0 40px; font: inherit; font-size: 24px; color: var(--ink); border-radius: 30px 0 0 30px; }
.ahf-newsletter input::placeholder { color: var(--ink); opacity: 1; }
.ahf-newsletter input:focus { outline: none; }
.ahf-newsletter button { width: 150px; height: 75px; margin: -1px -1px -1px 0; border: 0; border-radius: 30px; background: var(--gold); color: #fff; font-size: 42px; display: grid; place-items: center; }
.ahf-newsletter__msg { position: absolute; left: 40px; top: calc(100% + 8px); font-size: 16px; color: #fff; }
.ahf-footer__panel { margin-top: -38px; min-height: 712px; padding: 154px 36px 80px 101px; background: var(--green-dark); border-top-left-radius: 400px; color: #fff; }
.ahf-footer__cols { display: flex; align-items: center; gap: 108px; }
.ahf-footer__brand { width: 340px; flex: none; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.ahf-footer__brand img { width: 220px; height: 160px; object-fit: contain; background: #fff; }
.ahf-footer__brand p { font-size: var(--fs-20); font-weight: 500; }
.ahf-footer__contact { width: 362px; flex: none; min-height: 477px; display: flex; flex-direction: column; gap: 20px; }
.ahf-footer h2 { font-size: var(--fs-h3); font-weight: 600; }
.ahf-footer__row { display: flex; align-items: center; gap: 12px; font-size: var(--fs-24); font-weight: 500; text-decoration: none; }
.ahf-footer__row + .ahf-footer__row { margin-top: 30px; }
.ahf-footer__row--mail span:last-child { text-decoration: underline; white-space: nowrap; }
.ahf-footer__ico { width: 42.5px; height: 42.5px; flex: none; display: grid; place-items: center; font-size: 26px; }
.ahf-footer__social { display: flex; align-items: center; gap: 72px; margin-top: 96px; }
.ahf-footer__social a { font-size: 40px; display: flex; color: #fff; transition: color .15s; }
.ahf-footer__social a:hover, .ahf-footer__row:hover { color: var(--gold); }
.ahf-footer__loc { width: 385px; flex: none; display: flex; flex-direction: column; gap: 24px; }
.ahf-footer__loc p { font-size: var(--fs-24); font-weight: 500; }
.ahf-footer__map img { width: 385px; height: 225px; object-fit: cover; border-radius: 40px; }
.ahf-copy { padding: 23px 16px 7px; text-align: center; font-size: 24px; font-weight: 500; color: #040000; }

/* ---------- Donation modal ---------- */
.ahf-modal { position: fixed; inset: 0; z-index: 1000; display: flex; justify-content: center; align-items: flex-start; padding: 24px; overflow-y: auto; overscroll-behavior: contain; }
.ahf-modal[hidden] { display: none; }
.ahf-modal__backdrop { position: fixed; inset: 0; background: rgba(14,15,20,.55); backdrop-filter: blur(3px); }
.ahf-modal__wrap { position: relative; display: flex; align-items: stretch; gap: 46px; width: min(1266px, 100%); margin: auto 0; animation: ahf-pop .25s ease; }
@keyframes ahf-pop { from { opacity: 0; transform: translateY(14px) scale(.98); } }
.ahf-modal__close { position: absolute; right: 14px; top: 14px; z-index: 3; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.15); font-size: 24px; display: grid; place-items: center; }
.ahf-pop-info { flex: 0 1 744px; min-width: 0; background: #fff; border-radius: 50px; padding: 31px 24px 60px; }
.ahf-pop-info__photo { width: 100%; aspect-ratio: 696/434; object-fit: cover; border-radius: 50px; }
.ahf-pop-info__text { padding: 48px 40px 0; max-width: 620px; }
.ahf-pop-info__mark { width: 92px; height: 80px; object-fit: contain; }
.ahf-pop-info__title { margin-top: 0; font-size: 20px; font-weight: 600; letter-spacing: 4px; }
.ahf-pop-info__body { margin-top: 10px; font-size: var(--fs-20); letter-spacing: 1px; }
.ahf-pop-info__body p + p { margin-top: 1.2em; }
.ahf-tags { list-style: none; padding: 0; margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.ahf-tags li { padding: 4px 12px; border: 1px solid #000; border-radius: 50px; font-size: 15px; letter-spacing: .5px; }
.ahf-pop-info__contact { display: inline-block; margin-top: 34px; font-size: 20px; font-weight: 500; letter-spacing: 4px; text-decoration: none; }
.ahf-pop-info__contact:hover { color: var(--green-brand); }
.ahf-pop-form { flex: 0 0 476px; background: #fff; border-radius: 50px; padding: 58px 29px 60px; display: flex; flex-direction: column; align-items: center; }
.ahf-pop-form__title { font-size: 24px; font-weight: 500; letter-spacing: 1.44px; padding: 15px; }
.ahf-freq { margin-top: 13px; display: flex; }
.ahf-freq label, .ahf-amounts label { position: relative; cursor: pointer; }
.ahf-freq input, .ahf-amounts input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.ahf-freq span { display: grid; place-items: center; height: 51px; padding: 10px; border: 1px solid #000; font-size: 24px; letter-spacing: .48px; }
.ahf-freq label:first-child span { width: 203px; }
.ahf-freq label:last-child span { width: 188px; margin-left: 1px; }
.ahf-amounts { margin-top: 55px; display: grid; grid-template-columns: repeat(2, 203px); column-gap: 8px; row-gap: 38px; }
.ahf-amounts span { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 73px; border: 1px solid #000; border-radius: 20px; font-size: 24px; letter-spacing: .48px; }
.ahf-amounts small { font-size: 16px; }
.ahf-freq input:checked + span, .ahf-amounts input:checked + span { background: var(--green-dark); border-color: var(--green-dark); color: #fff; }
.ahf-freq input:focus-visible + span, .ahf-amounts input:focus-visible + span { outline: 3px solid var(--green); outline-offset: 2px; }
.ahf-custom-amt, .ahf-details input { width: 418px; max-width: 100%; height: 51px; margin-top: 54px; padding: 10px 24px; border: 1px solid #000; border-radius: 50px; font: inherit; font-size: 24px; letter-spacing: .48px; text-align: center; color: #000; -moz-appearance: textfield; }
.ahf-custom-amt::placeholder, .ahf-details input::placeholder { color: #000; opacity: 1; }
.ahf-details { width: 418px; max-width: 100%; }
.ahf-details input { margin-top: 14px; font-size: 18px; }
.ahf-details input::placeholder { opacity: .55; }
.ahf-pop-form__msg { min-height: 24px; margin-top: 18px; font-size: 16px; text-align: center; }
.ahf-pop-form__msg.is-error { color: #c0392b; }
.ahf-pop-form__msg.is-ok { color: var(--green-brand); }
.ahf-pop-form__submit { margin-top: 70px; width: 368px; max-width: 100%; padding: 15px; border: 0; border-radius: 50px; background: var(--gold); color: #000; font-size: 24px; font-weight: 500; letter-spacing: 1.44px; transition: filter .15s; }
.ahf-pop-form__msg + .ahf-pop-form__submit { margin-top: 30px; }
.ahf-pop-form__submit:hover { filter: brightness(.95); }
.ahf-pop-form__submit[disabled] { opacity: .6; cursor: progress; }
.ahf-cards { margin-top: 28px; display: flex; gap: 29px; align-self: flex-start; padding-left: 48px; }
.ahf-cards img { width: 112px; height: 80px; object-fit: contain; }
body.ahf-modal-open { overflow: hidden; }

/* ---------- Generic content ---------- */
.ahf-content { max-width: 900px; margin: 80px auto 0; padding: 0 20px; font-size: 18px; line-height: 1.6; }
.ahf-content__title { font-size: var(--fs-h2); font-weight: 500; margin-bottom: 30px; line-height: 1.2; }
.ahf-entry + .ahf-entry { margin-top: 40px; }
.ahf-entry__body > * + * { margin-top: 1em; }

/* ==========================================================================
   Responsive (design is 1440; below that the layout flows)
   ========================================================================== */
@media (max-width: 1400px) {
	.ahf-menubar { gap: 32px; }
	.ahf-nav__list { gap: 32px; }
	.ahf-nav__list > li > a, .ahf-nav__link { font-size: 20px; }
	.ahf-hero { padding: 0 40px; gap: 40px; }
	.ahf-hero__img { width: min(587px, 44vw); }
	.ahf-whatwedo { padding-left: 80px; }
	.ahf-whatwedo > img { width: min(500px, 38vw); }
	.ahf-mvv { padding-left: 40px; }
	.ahf-mvv__list { width: 600px; }
	.ahf-phero { padding-left: 40px; gap: 40px; }
	.ahf-phero__media { width: min(711px, 50vw); }
	.ahf-phero__media img { width: 100%; height: auto; aspect-ratio: 711/517; }
	.ahf-who { padding-left: 40px; }
	.ahf-who > img { width: min(500px, 36vw); }
	.ahf-why { padding-left: 40px; gap: 80px; }
	.ahf-why__cards { width: auto; flex: 1; }
	.ahf-why__badge { margin-left: 0; }
	.ahf-founder { padding-left: 40px; gap: 50px; }
	.ahf-footer__panel { padding-left: 60px; }
	.ahf-footer__cols { gap: 50px; }
	.ahf-newsletter { margin-left: auto; margin-right: 80px; }
}

@media (max-width: 1180px) {
	.ahf-menubar { height: 70px; padding: 0 20px 0 10px; justify-content: space-between; border-radius: 40px; }
	.ahf-menubar__logo img { width: 120px; }
	.ahf-menubar__toggle { display: block; }
	.ahf-menubar__donate { margin-left: auto; min-width: 0; height: 44px; font-size: 18px; }
	.ahf-nav { position: absolute; left: 16px; right: 16px; top: calc(100% + 10px); background: #fff; border: 2px solid #000; border-radius: 30px; padding: 16px 24px; display: none; }
	.ahf-header.is-open .ahf-nav { display: block; }
	.ahf-header.is-open .i-open { display: none; }
	.ahf-header.is-open .i-close { display: block; }
	.ahf-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
	.ahf-nav__list > li > a, .ahf-nav__link { display: block; padding: 14px 4px; font-size: 20px; border-bottom: 1px solid #eee; }
	.ahf-nav__list .sub-menu { position: static; transform: none; opacity: 1; visibility: visible; min-width: 0; padding: 4px 0; margin: 4px 0 8px; border: 0; gap: 0; }
	.ahf-nav__list .sub-menu a { border: 0; font-size: 17px; }
	.ahf-sub { position: static; transform: none; opacity: 1; visibility: visible; width: auto; padding: 8px 0; gap: 0; margin: 4px 0 8px; border: 0; }
	.ahf-sub a { border: 0; font-size: 17px; }
	.ahf-header { padding-top: 12px; }

	.ahf-hero, .ahf-whatwedo, .ahf-who, .ahf-founder { flex-direction: column; align-items: center; padding: 0 24px; text-align: center; }
	.ahf-hero__text { padding-top: 10px; max-width: none; }
	.ahf-hero h1 { max-width: none; }
	.ahf-hero .ahf-btn-donate { margin-top: 32px; }
	.ahf-hero__img { width: min(587px, 100%); border-radius: 60px; }
	.ahf-whatwedo__text, .ahf-who__text { width: auto; max-width: 700px; }
	.ahf-whatwedo h2 { display: none; }
	.ahf-whatwedo > img, .ahf-who > img { width: min(420px, 90%); }
	.ahf-who p { text-align: left; }
	.ahf-mvv { flex-direction: column; align-items: center; padding: 0 24px; gap: 40px; }
	.ahf-mvv__list { width: auto; max-width: 720px; }
	.ahf-mvv__lines { display: none; }
	.ahf-mvv__rings { margin: 0; }
	.ahf-strengths__grid { grid-template-columns: repeat(2, minmax(0, 238px)); justify-content: center; column-gap: 40px; }
	.ahf-row, .ahf-row--image { flex-direction: column; align-items: stretch; padding: 60px 24px; gap: 32px; }
	.ahf-row__text { flex-basis: auto; }
	.ahf-row__media { flex-basis: auto; }
	.ahf-row__media img { width: 100%; }
	.ahf-row__body { text-align: left; }
	.ahf-row--marriage .ahf-row__media { margin-top: 0; }
	.ahf-phero { flex-direction: column; height: auto; padding: 30px 24px 70px; gap: 28px; }
	.ahf-phero__media { width: 100%; }
	.ahf-phero__title { margin: 0; max-width: none; }
	.ahf-dashed { display: none; }
	.ahf-gallery { height: 260px; gap: 12px; }
	.ahf-why { flex-direction: column-reverse; padding: 0 24px; gap: 30px; }
	.ahf-why__badge { width: auto; height: auto; }
	.ahf-why__badge::before, .ahf-why__badge::after { display: none; }
	.ahf-why__badge h2 { margin: 0; color: var(--ink); }
	.ahf-why__cards li { min-height: 0; }
	.ahf-founder__text { width: auto; max-width: 700px; text-align: left; }
	.ahf-footer__panel { border-top-left-radius: 160px; padding: 120px 24px 60px; }
	.ahf-footer__cols { flex-direction: column; align-items: flex-start; gap: 48px; max-width: 520px; margin: 0 auto; }
	.ahf-footer__brand, .ahf-footer__contact, .ahf-footer__loc { width: 100%; min-height: 0; }
	.ahf-footer__row--mail span:last-child { white-space: normal; word-break: break-all; }
	.ahf-footer__social { margin-top: 20px; }
	.ahf-footer__map img { width: 100%; height: auto; aspect-ratio: 385/225; }
	.ahf-newsletter { width: auto; margin: 0 24px; }
	.ahf-modal { padding: 12px; align-items: start; }
	.ahf-modal__wrap { flex-direction: column; gap: 14px; }
	.ahf-pop-info, .ahf-pop-form { flex: none; border-radius: 30px; }
	.ahf-pop-form { padding: 32px 18px 36px; }
	.ahf-pop-info { padding: 14px 14px 30px; }
	.ahf-pop-info__photo { border-radius: 24px; }
	.ahf-pop-info__text { padding: 24px 12px 0; }
}

@media (max-width: 600px) {
	.ahf-menubar__donate { display: none; }
	.ahf-circles { justify-content: flex-start; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: none; }
	.ahf-circles::-webkit-scrollbar { display: none; }
	.ahf-circle { flex: 0 0 84px; font-size: 11px; scroll-snap-align: start; }
	.ahf-stats { height: 112px; border-radius: 34px 0 0 34px; margin-left: 16px; width: auto; }
	.ahf-stats__viewport { margin-left: 26px; width: calc(100% - 26px); }
	.ahf-stat strong { font-size: 26px; }
	.ahf-stat span { font-size: 15px; }
	.ahf-ring--1 { transform: scale(.85); }
	.ahf-strengths__grid { grid-template-columns: 1fr 1fr; column-gap: 14px; row-gap: 26px; }
	.ahf-strength { height: 200px; }
	.ahf-strength__card { height: 150px; font-size: 17px; }
	.ahf-gallery { flex-direction: column; height: auto; }
	.ahf-gallery__item { flex: none !important; height: 200px; }
	.ahf-why__cards li { flex-direction: column; text-align: center; gap: 16px; }
	.ahf-why__cards p { text-align: center; }
	.ahf-founder__media { width: 100%; height: auto; aspect-ratio: 529/509; }
	.ahf-founder__plate { width: 99%; height: 64%; border-radius: 40px; }
	.ahf-founder__media img { left: 8%; width: 92%; height: 96%; border-radius: 60px; }
	.ahf-newsletter { height: 60px; }
	.ahf-newsletter input { font-size: 18px; padding-left: 22px; }
	.ahf-newsletter button { width: 84px; height: 60px; font-size: 30px; }
	.ahf-footer { margin-top: 120px; }
	.ahf-footer__social { gap: 40px; }
	.ahf-copy { font-size: 18px; }
	.ahf-freq label:first-child span, .ahf-freq label:last-child span { width: 46vw; max-width: 203px; font-size: 18px; }
	.ahf-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; row-gap: 14px; margin-top: 30px; }
	.ahf-amounts span { font-size: 20px; height: 64px; }
	.ahf-custom-amt { margin-top: 26px; font-size: 18px; }
	.ahf-pop-form__submit { margin-top: 30px; font-size: 20px; }
	.ahf-cards { padding-left: 0; align-self: center; }
}
