.page-shell.donate-page { width: 100vw; max-width: none; margin: 0; padding: 0; }
.donate-hero { position: relative; isolation: isolate; display: flex; width: 100%; min-height: clamp(650px, 80vh, 860px); align-items: center; overflow: hidden; background: var(--green-950) var(--donate-hero-image) center 42% / cover no-repeat; color: #fff; }
.donate-hero__shade { position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgb(3 24 18 / 94%) 0%, rgb(5 38 28 / 82%) 42%, rgb(4 32 24 / 27%) 75%, rgb(0 0 0 / 12%) 100%); }
.donate-hero__dots { position: absolute; z-index: -1; top: 35px; left: 30px; width: 180px; height: 125px; opacity: .55; background-image: radial-gradient(circle, var(--gold-light) 2px, transparent 2.4px); background-size: 21px 21px; mask-image: linear-gradient(135deg, #000, transparent 80%); }
.donate-hero__inner { width: min(100% - 40px, 1280px); margin: 0 auto; padding: 90px 0 125px; }
.donate-hero__inner::before { content: ''; position: absolute; z-index: -1; width: min(720px, calc(100% - 40px)); height: min(620px, calc(100% - 120px)); top: 50%; left: max(20px, calc((100% - 1280px) / 2)); transform: translateY(-50%); background: rgb(4 29 22 / 90%); box-shadow: 0 24px 65px rgb(0 0 0 / 20%); }
.donate-hero__inner > * { position: relative; max-width: 610px; margin-left: clamp(20px, 4vw, 58px); }
.donate-hero__eyebrow { display: flex; align-items: center; gap: 13px; margin: 0 0 24px; color: var(--gold-light); font-size: .78rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.donate-hero__eyebrow span { width: 42px; height: 2px; background: var(--gold); }
.donate-hero h1 { max-width: 890px; margin: 0; color: #fff !important; font-family: 'Sora', system-ui, sans-serif; font-size: clamp(4rem, 7.4vw, 7.8rem); letter-spacing: -.055em; line-height: .91; text-wrap: balance; }
.donate-hero h1 em { display: block; color: var(--gold-light); font-weight: inherit; }
.donate-hero__summary { max-width: 680px; margin: 31px 0 0; color: rgb(255 255 255 / 85%); font-size: clamp(1rem, 1.35vw, 1.2rem); line-height: 1.72; }
.donate-hero__actions { display: flex; align-items: center; gap: 28px; margin-top: 38px; }
.donate-hero__actions .button { min-height: 56px; padding-inline: 29px; }
.donate-hero__actions > p { max-width: 245px; margin: 0; color: rgb(255 255 255 / 68%); font-size: .76rem; line-height: 1.45; }
.donate-hero__actions strong { display: block; color: #fff; font-family: 'Sora', system-ui, sans-serif; font-size: 1.45rem; }
.donate-hero__caption { position: absolute; right: clamp(20px, 4vw, 75px); bottom: 0; display: grid; min-width: 310px; padding: 24px 31px; background: var(--gold); color: var(--green-950); }
.donate-hero__caption span { font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.donate-hero__caption strong { margin-top: 4px; font-family: 'Sora', system-ui, sans-serif; font-size: 1.35rem; }
.donate-intro { width: 100%; padding: clamp(85px, 9vw, 140px) 0; background: #fbf7ee; }
.donate-intro__inner { max-width: 900px; text-align: center; }
.donate-intro__kicker { color: #9b762b; font-size: .74rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.donate-intro h2 { margin: 14px 0 0; color: var(--green-950); font-family: 'Sora', system-ui, sans-serif; font-size: clamp(2.6rem, 5vw, 4.8rem); line-height: 1.04; }
.donate-intro__text { margin-top: 24px; color: #61706b; font-size: 1.05rem; line-height: 1.75; }
.donation-details { width: 100%; padding: 0 clamp(16px, 4vw, 72px) clamp(90px, 10vw, 150px); background: #fbf7ee; }
.donation-details__inner { position: relative; z-index: 3; display: grid; width: min(100%, 1280px); max-width: none; margin: 0 auto; grid-template-columns: minmax(320px, .85fr) minmax(520px, 1.15fr); gap: clamp(45px, 7vw, 100px); }
.donation-story { padding-top: clamp(75px, 9vw, 130px); }
.donation-story__kicker { margin: 0 0 13px; color: #9b762b; font-size: .73rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.donation-story h2 { margin: 0; color: var(--green-950); font-family: 'Sora', system-ui, sans-serif; font-size: clamp(2.7rem, 4.4vw, 4.6rem); line-height: 1.04; }
.donation-story > div { margin-top: 25px; color: #60716a; line-height: 1.75; }
.donation-story ul { display: grid; margin: 40px 0 0; padding: 0; list-style: none; border-top: 1px solid rgb(13 53 43 / 16%); }
.donation-story li { display: grid; padding: 19px 0; border-bottom: 1px solid rgb(13 53 43 / 16%); }
.donation-story strong { color: var(--green-950); font-size: .86rem; text-transform: uppercase; letter-spacing: .06em; }
.donation-story span { margin-top: 4px; color: #6b7974; font-size: .88rem; line-height: 1.5; }
.donation-panel { margin-top: clamp(-115px, -9vw, -75px); padding: clamp(30px, 5vw, 68px); align-self: start; border-radius: 0; background: var(--green-950); color: #fff; box-shadow: 0 28px 70px rgb(13 53 43 / 24%); }
.donation-panel__header { margin-bottom: 39px; }
.donation-panel__header p, .giving-reasons__heading > p { margin: 0 0 9px; color: #9b762b; font-size: .72rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.donation-panel h2 { display: inline-block; margin: 0; border-bottom: 4px solid var(--gold); color: #fff; font-family: 'Sora', system-ui, sans-serif; font-size: clamp(2rem, 3.5vw, 3.5rem); }
.donation-form fieldset { margin: 0; padding: 0; border: 0; }
.donation-form legend, .donation-form label > span { display: block; margin-bottom: 9px; color: rgb(255 255 255 / 84%); font-size: .78rem; font-weight: 700; }
.donation-amounts { display: flex; flex-wrap: wrap; gap: 10px; }
.donation-amounts label { cursor: pointer; }
.donation-amounts label > input[type='radio'] { position: absolute; opacity: 0; }
.donation-amounts label > span { display: block; margin: 0; padding: 11px 17px; border: 1px solid rgb(255 255 255 / 35%); border-radius: 30px; color: #fff; transition: .2s ease; }
.donation-amounts label > input:checked + span { border-color: var(--gold); background: var(--gold); color: var(--green-950); }
.donation-amounts__custom { display: flex; min-height: 47px; align-items: center; overflow: hidden; border: 1px solid #c9d3cf; border-radius: 30px; background: #fbfcfb; }
.donation-amounts label.donation-amounts__custom > span { flex: 0 0 auto; margin: 0; padding: 0 7px 0 17px; border: 0; border-radius: 0; background: transparent; color: #243d35; line-height: 1.2; }
.donation-amounts__custom input[type='number'] { width: 150px; min-height: 45px; padding: 8px 16px 8px 8px; border: 0 !important; outline: 0; background: transparent; }
.donation-recurring { display: inline-flex; width: auto; align-items: center; gap: 11px; margin: 25px 0 31px; cursor: pointer; }
.donation-recurring input[type='checkbox'] { width: 20px; height: 20px; min-width: 20px; margin: 0; border: 1px solid #8da098; border-radius: 3px; accent-color: var(--green-800); cursor: pointer; }
.donation-recurring span { margin: 0 !important; }
.donation-payment-note { display: flex; align-items: center; gap: 14px; margin: 25px 0 31px; color: rgb(255 255 255 / 68%); font-size: .82rem; }
.donation-payment-note strong { padding: 8px 13px; border-radius: 20px; background: rgb(255 255 255 / 10%); color: var(--gold-light); font-size: .76rem; white-space: nowrap; }
.donation-payment-note span { line-height: 1.45; }
.donation-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 27px 30px; }
.donation-form__grid label { display: block; min-width: 0; }
.donation-form__grid input, .donation-form__grid textarea { display: block; width: 100%; border: 1px solid #cfd9d5; border-radius: 5px; background: #fbfcfb; color: var(--green-950); font: inherit; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.donation-form__grid input { min-height: 56px; padding: 13px 16px; }
.donation-form__grid textarea { min-height: 122px; padding: 14px 16px; }
.donation-form textarea { resize: vertical; }
.donation-form__grid input:hover, .donation-form__grid textarea:hover { border-color: #aebdb7; background: #fff; }
.donation-form__grid input:focus, .donation-form__grid textarea:focus { border-color: var(--green-700); outline: 0; background: #fff; box-shadow: 0 0 0 3px rgb(21 123 93 / 12%); }
.donation-form__footer { display: flex; align-items: center; gap: 25px; margin-top: 33px; }
.donation-form__footer p { max-width: 430px; margin: 0; color: rgb(255 255 255 / 64%); font-size: .76rem; line-height: 1.5; }
.giving-reasons { width: 100%; padding: clamp(85px, 9vw, 145px) clamp(18px, 4vw, 72px); background: #fbf7ee; }
.giving-reasons__inner { width: 100%; max-width: none; }
.giving-reasons__heading { max-width: 800px; margin: 0 auto 52px; text-align: center; }
.giving-reasons__heading h2 { margin: 0; color: var(--green-950); font-family: 'Sora', system-ui, sans-serif; font-size: clamp(2.5rem, 4.6vw, 4.6rem); line-height: 1.04; }
.giving-reasons__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2.5vw, 38px); }
.giving-reason { overflow: hidden; background: #fff; box-shadow: 0 16px 45px rgb(15 52 42 / 9%); }
.giving-reason img { display: block; width: 100%; height: clamp(260px, 27vw, 430px); object-fit: cover; }
.giving-reason > div { position: relative; padding: 29px 28px 34px; }
.giving-reason span { position: absolute; top: 28px; right: 27px; color: rgb(13 53 43 / 20%); font-size: .78rem; font-weight: 800; }
.giving-reason h3 { margin: 0; color: var(--green-950); font-family: 'Sora', system-ui, sans-serif; font-size: 1.55rem; }
.giving-reason p { color: #68756f; line-height: 1.65; }
.giving-impact { position: relative; isolation: isolate; display: grid; min-height: 650px; place-items: center; overflow: hidden; padding: 90px 20px; background: url('/site/assets/files/pictures/unnamed%20%2815%29.webp') center / cover no-repeat; color: #fff; text-align: center; }
.giving-impact__shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(rgb(4 31 23 / 80%), rgb(4 31 23 / 93%)); }
.giving-impact__inner { max-width: 920px; }
.giving-impact__inner > p:first-child { margin: 0; color: var(--gold-light); font-size: .75rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.giving-impact strong { display: block; margin: 4px 0 12px; color: var(--gold); font-family: 'Sora', system-ui, sans-serif; font-size: clamp(5rem, 11vw, 10rem); line-height: .9; }
.giving-impact h2 { margin: 0; color: #fff; font-family: 'Sora', system-ui, sans-serif; font-size: clamp(2.4rem, 5vw, 4.8rem); line-height: 1.03; }
.giving-impact h2 + p { max-width: 720px; margin: 24px auto 31px; color: rgb(255 255 255 / 76%); font-size: 1.03rem; line-height: 1.72; }
@media (max-width: 760px) {
	.donate-hero { min-height: 720px; background-position: 58% center; }
	.donate-hero__shade { background: linear-gradient(90deg, rgb(3 24 18 / 94%), rgb(4 35 26 / 74%)); }
	.donate-hero__inner { width: calc(100% - 30px); padding: 70px 0 145px; }
	.donate-hero h1 { font-size: clamp(3.3rem, 15vw, 5.2rem); }
	.donate-hero__actions { align-items: flex-start; flex-direction: column; gap: 19px; }
	.donate-hero__caption { right: 14px; left: 14px; min-width: 0; }
	.donation-details { padding-inline: 10px; }
	.donation-details__inner { grid-template-columns: 1fr; }
	.donation-story { padding: 65px 12px 0; }
	.donation-panel { order: -1; margin-top: -65px; padding-inline: 22px; }
	.donation-form__grid, .giving-reasons__grid { grid-template-columns: 1fr; }
	.donation-form__footer { align-items: flex-start; flex-direction: column; }
	.donation-payment-note { align-items: flex-start; flex-direction: column; }
	.donation-amounts__custom { width: 100%; }
	.donation-amounts__custom input { flex: 1; }
}
