/* Editorial campaign layout, scoped away from shared navigation and policies. */
.reference-campaign { background:#fffdfa; }
.reference-campaign .campaign-section { padding:88px 0; }
.reference-campaign .human-hero { padding:68px 0 58px; }
.reference-campaign .hero-photo-story { padding-bottom:110px; }
.reference-campaign .hero-main-photo { border:5px solid #ffffff24; border-radius:24px; }
.reference-campaign .hero-photo-note { border-radius:12px; }
.reference-campaign .campaign-date-strip { background:#fff; padding:30px 0; box-shadow:0 12px 35px #32261d06; }
.reference-campaign .campaign-section-intro { text-align:left; max-width:none; display:grid; grid-template-columns:1.1fr 1fr; gap:0 70px; align-items:center; margin-bottom:38px; }
.reference-campaign .campaign-section-intro .campaign-kicker { grid-column:1/-1; }
.reference-campaign .campaign-section-intro h2 { margin-bottom:0; }
.reference-campaign .campaign-section-intro p { margin:18px 0 0; }
.reference-campaign .initiative-grid { gap:30px; }
.reference-campaign .campaign-initiative { border:1px solid #e9e0d7; border-radius:20px; box-shadow:0 12px 40px #36201a08; }
.reference-campaign .initiative-copy { padding:30px 32px; }
.reference-campaign .initiative-tags li { border-radius:30px; padding:6px 12px; }
.reference-campaign .campaign-text-link { border-bottom:1px solid #eac6bf; padding-bottom:5px; }
.reference-campaign .campaign-purpose { background:#241c19; padding:34px 0; }
.reference-campaign .campaign-purpose .container>div { border:1px solid #ffffff20; border-radius:12px; padding:20px; min-height:92px; background:#ffffff05; }
.reference-campaign .feature-grid { gap:76px; }
.reference-campaign #manav .feature-photo { padding:12px; background:#f3e8db; border-radius:24px; transform:rotate(-2deg); }
.reference-campaign #manav .feature-photo>img { aspect-ratio:4/3; border-radius:16px; }
.reference-campaign .feature-photo figcaption { right:0; bottom:-22px; padding:20px 24px; border-radius:12px; }
.reference-campaign .feature-copy blockquote { padding:18px 22px; border-radius:0 12px 12px 0; background:#fff0e8; }
.reference-campaign .feature-sabala { background:linear-gradient(135deg,#f8eee2,#fffaf3); }
.reference-campaign #sabla .feature-photo { background:#fff; padding:12px; border-radius:22px; box-shadow:0 20px 55px #38221815; transform:rotate(2deg); }
.reference-campaign .feature-checks { gap:16px; }
.reference-campaign .campaign-button { border-radius:8px; }
.reference-campaign .campaign-gallery-heading { margin-bottom:30px; }
.reference-campaign .action-controls button { border-radius:50%; width:44px; height:44px; }
.reference-campaign .action-slider .action-photo { aspect-ratio:4/3; border-radius:16px; }
.reference-campaign .campaign-red-banner { margin:0 24px; border-radius:24px; padding:72px 0; box-shadow:0 18px 40px #bd171418; }
.reference-campaign .campaign-donate { background:linear-gradient(#fffdfa,#f9eee4); }
.reference-campaign .campaign-donate-grid { gap:65px; }
.reference-campaign .giving-guide-links>a { border-radius:12px; padding:22px 18px; box-shadow:0 5px 20px #30221b04; }
.reference-campaign .giving-guide-links>a>i:first-child { border-radius:10px; background:#fff4ed; }
.reference-campaign .refined-donation { border-radius:20px; border-top:4px solid #c81822; box-shadow:0 24px 65px #472c1b10; padding:32px; }
.reference-campaign .donation-fieldset legend>span { background:#fce6df; color:#b52225; }
.reference-campaign .refined-donation .donation-submit { border-radius:8px; }
@media(min-width:992px) { .reference-campaign .giving-guide { position:sticky; top:150px; } }
@media(max-width:991px) { .reference-campaign .feature-grid { gap:44px; }.reference-campaign .campaign-section-intro { gap:0 30px; }.reference-campaign .campaign-donate-grid { gap:35px; } }
@media(max-width:767px) {
 .reference-campaign .campaign-section { padding:58px 0; }
 .reference-campaign .campaign-section-intro { display:block; }
 .reference-campaign .initiative-copy { padding:25px; }
 .reference-campaign .feature-grid { gap:60px; }
 .reference-campaign .feature-photo { transform:none!important; }
 .reference-campaign .campaign-red-banner { margin:0 12px; padding:45px 12px; border-radius:18px; }
 .reference-campaign .refined-donation { padding:25px 20px; }
 .reference-campaign .campaign-purpose .container>div { min-height:70px; }
 .reference-campaign .human-hero { padding:35px 0 40px; }
}
@media(max-width:575px) { .reference-campaign .hero-photo-story { padding-bottom:0; }.reference-campaign .hero-care-card { bottom:65px; }.reference-campaign .feature-photo figcaption { right:-4px; } }

/* Wider desktop hero aligns the copy with the requested left guide. */
@media(min-width:768px) {
 .reference-campaign #manav .feature-grid { align-items:stretch; }
 .reference-campaign #manav .feature-photo { transform:none; min-height:620px; margin:0; padding:0; overflow:hidden; }
 .reference-campaign #manav .feature-photo>img { position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; border-radius:24px; object-fit:cover; object-position:48% center; }
 .reference-campaign #manav .feature-photo figcaption { right:18px; bottom:18px; }
}
.reference-campaign .campaign-red-banner .giving-banner-grid { display:grid; grid-template-columns:1.35fr .85fr; gap:48px; align-items:center; max-width:1200px; }
.reference-campaign .giving-banner-art { margin:0; width:100%; }
.reference-campaign .giving-banner-art img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; border-radius:24px; }
.reference-campaign .giving-banner-copy h2 { font-size:clamp(32px,3vw,46px); }
.reference-campaign .giving-banner-copy h2 br { display:none; }
@media(max-width:767px) {
 .reference-campaign .campaign-red-banner .giving-banner-grid { grid-template-columns:1fr; gap:28px; }
 .reference-campaign .giving-banner-art { max-width:360px; margin:0 auto; }
}
@media(min-width:1200px) {
 .reference-campaign .human-hero-grid { max-width:1360px; grid-template-columns:1fr 1fr; gap:80px; padding-inline:24px; }
 .reference-campaign .human-hero .giving-hero-copy { max-width:560px; }
}
.reference-campaign .hero-main-photo>img { aspect-ratio:16/10; object-position:center; }
.reference-campaign .hero-main-photo figcaption { left:16px; right:16px; bottom:12px; font-size:12px; }
.reference-campaign .hero-photo-note { top:-12px; right:0; }
@media(max-width:575px) {
 .reference-campaign .hero-main-photo>img { aspect-ratio:16/10; }
 .reference-campaign .hero-photo-note { top:-14px; padding:8px 10px; }
 .reference-campaign .human-hero-grid { gap:46px; }
}
/* Full-bleed photographic campaign visuals with soft background transitions. */
.reference-campaign .human-hero { background:#171511; min-height:700px; }
.reference-campaign .human-hero-grid { display:block; }
.reference-campaign .human-hero .giving-hero-copy { position:relative; z-index:2; max-width:560px; }
.reference-campaign .human-hero .integrated-hero-visual { position:absolute; inset:0; margin:0; padding:0; z-index:-2; pointer-events:none; }
.reference-campaign .integrated-hero-visual>img { display:block; width:100%; height:100%; object-fit:contain; object-position:right center; }
.reference-campaign .human-hero::before { display:block; content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(12,12,11,.84),rgba(12,12,11,.68) 35%,rgba(12,12,11,.08) 68%,transparent); }
.reference-campaign .campaign-red-banner { min-height:490px; }
.reference-campaign .campaign-red-banner::after { display:none; }
.reference-campaign .campaign-red-banner .giving-banner-grid { display:block; }
.reference-campaign .giving-banner-copy { position:relative; z-index:2; max-width:650px; width:57%; }
.reference-campaign .giving-banner-art { position:absolute; inset:0 0 0 auto; width:57%; height:100%; max-width:none; margin:0; z-index:0; pointer-events:none; -webkit-mask-image:linear-gradient(90deg,transparent,#000 36%); mask-image:linear-gradient(90deg,transparent,#000 36%); }
.reference-campaign .giving-banner-art img { width:100%; height:100%; aspect-ratio:auto; object-fit:contain; object-position:right center; border-radius:0; }
/* Scale complete scenes with wide screens so subjects sit beside the copy. */
@media(min-width:1200px) {
 .reference-campaign .human-hero { min-height:clamp(714px,47vw,960px); }
 .reference-campaign .campaign-red-banner { min-height:clamp(520px,38vw,760px); display:flex; align-items:center; }
 .reference-campaign .human-hero::before { background:linear-gradient(90deg,rgba(12,12,11,.88),rgba(12,12,11,.68) 33%,rgba(12,12,11,.12) 54%,transparent 70%); }
}
/* Fade the photograph itself, not the empty space in its contain box. */
@media(min-width:768px) {
 .reference-campaign .human-hero .integrated-hero-visual { display:flex; align-items:center; justify-content:flex-end; padding-right:0; }
 .reference-campaign .integrated-hero-visual>img { flex:none; width:auto; height:auto; max-height:100%; max-width:100%; -webkit-mask-image:linear-gradient(90deg,transparent,#000 23%,#000 100%); mask-image:linear-gradient(90deg,transparent,#000 23%,#000 100%); }
 .reference-campaign .giving-banner-art { display:flex; align-items:center; justify-content:flex-end; width:65%; padding-right:0; -webkit-mask-image:none; mask-image:none; }
 .reference-campaign .giving-banner-art img { flex:none; width:auto; height:auto; max-height:100%; max-width:100%; -webkit-mask-image:linear-gradient(90deg,transparent,#000 25%,#000 100%); mask-image:linear-gradient(90deg,transparent,#000 25%,#000 100%); }
}
@media(max-width:991px) {
 .reference-campaign .human-hero::before { background:linear-gradient(90deg,#111e,#1119 55%,#1114); }
 .reference-campaign .giving-banner-copy { width:60%; }
}
@media(max-width:767px) {
 .reference-campaign .human-hero { padding-bottom:0; min-height:0; }
 .reference-campaign .human-hero .integrated-hero-visual { position:relative; inset:auto; height:auto; aspect-ratio:1672/941; z-index:0; margin-top:22px; -webkit-mask-image:linear-gradient(180deg,transparent,#000 15%); mask-image:linear-gradient(180deg,transparent,#000 15%); }
 .reference-campaign .integrated-hero-visual>img { height:auto; object-position:center; }
 .reference-campaign .human-hero::before { background:none; }
 .reference-campaign .campaign-red-banner { padding-bottom:0; }
 .reference-campaign .giving-banner-copy { width:100%; }
 .reference-campaign .giving-banner-art { position:relative; inset:auto; width:100%; height:auto; aspect-ratio:3/2; margin-top:24px; -webkit-mask-image:linear-gradient(180deg,transparent,#000 12%); mask-image:linear-gradient(180deg,transparent,#000 12%); }
 .reference-campaign .giving-banner-art img { height:auto; object-position:center; }
}
