/* A clear campaign layout using navy, evergreen, warm gold and ivory. */
.site-header { position:relative; inset:auto; height:104px; min-height:104px; padding:8px clamp(20px,5vw,76px); gap:24px; }
.site-header .header-logo { width:210px; height:88px; flex:0 0 210px; object-fit:contain; }
.site-header .brand { background:transparent; border:0; padding:0; }
.site-header nav { gap:clamp(12px,1.8vw,28px); }
.header-donate { border-radius:10px; }
body[data-page="home"] .hero-reference,body[data-page="home"] .hero-shell {
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); gap:clamp(28px,5vw,70px);
  min-height:0; padding:50px clamp(20px,5vw,76px) 56px; background:#f3faf7; border:0; align-items:center;
}
body[data-page="home"] .hero-reference::before,body[data-page="home"] .hero-reference::after { display:none; }
body[data-page="home"] .hero-reference .hero-copy { width:auto; max-width:none; }
body[data-page="home"] .hero-reference .eyebrow { margin-bottom:18px; }
body[data-page="home"] .hero-reference h1.hero-message-title { max-width:760px; font-size:35px; line-height:1.23; letter-spacing:-.025em; }
body[data-page="home"] .hero-reference .hero-vision-line { font-size:16px; margin-top:18px; color:#86621d; }
body[data-page="home"] .hero-reference .hero-future-copy { font-size:15px; line-height:1.7; margin-top:14px; }
body[data-page="home"] .hero-reference .hero-actions { margin-top:22px; gap:12px; flex-wrap:wrap; }
body[data-page="home"] .hero-reference .hero-legacy-note { font-size:13px; line-height:1.6; margin-top:16px; }
.primary-cta,.hero-secondary-cta { border-radius:10px!important; }
.campaign-vision-card { min-width:0; overflow:hidden; border-radius:24px; background:white; border:1px solid #d5e6e3; box-shadow:0 22px 54px rgba(14,48,73,.1); }
.campaign-vision-card > img { display:block; width:100%; height:245px; object-fit:cover; }
.campaign-vision-caption { padding:17px 24px; background:#07383e; color:white; }
.campaign-vision-caption span { display:block; color:#efca6f; font-size:10px; font-weight:800; letter-spacing:.15em; }
.campaign-vision-caption strong { display:block; margin:7px 0; font:400 23px Georgia,serif; }
.campaign-vision-caption small { color:#d5e3e5; font-size:11px; }
.campaign-giving { padding:22px 24px 24px; }
.campaign-giving > div > span { color:#526e70; font-size:12px; }
.campaign-giving > div > strong { display:block; margin:5px 0; color:#093f42; font:400 35px Georgia,serif; }
.campaign-giving p { margin:9px 0 18px; color:#526e70; font-size:13px; line-height:1.6; }
.campaign-giving nav { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.campaign-giving nav a { padding:10px 4px; border:1px solid #cbded2; border-radius:8px; text-align:center; color:#006568; background:#f3f8f4; font-weight:800; font-size:13px; }
.campaign-giving nav a:hover { background:#006568; color:white; }
.campaign-give-button { width:100%; margin-top:13px; background:#006568; color:white; border-radius:10px; }
.campaign-give-button:hover { background:#004c50; }
.home-updates.section-pad { padding:28px clamp(20px,5vw,76px); }
.home-updates-grid { gap:18px; }
.home-update-card { border-radius:16px; padding:24px; box-shadow:none; border:1px solid #d2e3da; }
.home-update-card h2 { font:400 26px Georgia,serif; }
.home-verse-card { background:#f8eed6; }
.future-bridge.section-pad,.appeal-section.section-pad,.vision-section.section-pad,.plan-section.section-pad { padding:58px clamp(20px,5vw,76px); }
.section-heading h2,.future-bridge-heading h2,.vision-intro h2 { font-size:clamp(30px,3.2vw,44px); line-height:1.12; }
.future-bridge,.appeal-section { gap:clamp(25px,5vw,70px); }
.vision-carousel { border-radius:18px; }
.subpage { padding-top:0; }
.subpage-hero { padding-top:60px; min-height:310px; }
body[data-page="donate"] .compact-donation-page { padding:40px clamp(20px,5vw,76px) 56px; }
body[data-page="donate"] .compact-donate-shell { max-width:1200px; margin:auto; }
body[data-page="donate"] .compact-donate-intro { display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:center; }
body[data-page="donate"] .compact-donate-intro h1 { font-size:clamp(36px,4.5vw,54px); }
body[data-page="donate"] .donation-primary-grid { grid-template-columns:1.05fr .95fr; padding:0; gap:20px; background:transparent; }
body[data-page="donate"] .compact-paypal-panel,body[data-page="donate"] .donation-video-panel { padding:26px; border-radius:18px; min-height:0; box-shadow:0 12px 30px rgba(14,48,73,.08); }
body[data-page="donate"] .donation-legacy { border-radius:14px; gap:24px; }
.donation-insight-grid { gap:20px; }
.donation-slider-panel,.donation-progress-panel { border-radius:18px; }
.site-footer { padding:32px clamp(20px,5vw,76px); gap:24px; }
.site-footer .footer-identity { max-width:260px; }
.site-footer .footer-identity .footer-logo { width:160px; height:auto; max-height:none; }
@media(max-width:1050px) {
  .site-header { height:auto; min-height:96px; flex-wrap:wrap; }
  .site-header .header-logo { width:180px; height:76px; flex-basis:180px; }
  body[data-page="home"] .hero-reference { gap:28px; }
  .campaign-vision-card > img { height:210px; }
}
@media(max-width:800px) {
  body[data-page="home"] .hero-reference { grid-template-columns:1fr; padding-top:32px; }
  .campaign-vision-card { max-width:640px; width:100%; }
  .campaign-vision-card > img { height:240px; }
  .home-updates-grid { grid-template-columns:1fr; }
  body[data-page="donate"] .compact-donate-intro,body[data-page="donate"] .donation-primary-grid { grid-template-columns:1fr; }
  .subpage-hero { padding-top:45px; }
}
@media(max-width:520px) {
  .site-header .header-logo { width:165px; height:72px; flex-basis:165px; }
  body[data-page="home"] .hero-reference h1.hero-message-title { font-size:35px; }
  .campaign-giving,.campaign-vision-caption { padding:20px; }
  .campaign-vision-card > img { height:205px; }
}
/* Horizontal identity and image-led campaign composition. */
.site-header { height:104px; }
.site-header .header-logo { width:300px; height:88px; flex-basis:300px; }
body[data-page="home"] .hero-reference { grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:clamp(28px,5vw,76px); padding-block:42px; }
body[data-page="home"] .hero-reference .hero-copy { grid-column:2; grid-row:1; }
.campaign-vision-card { grid-column:1; grid-row:1; border-radius:18px; box-shadow:0 18px 48px rgba(7,56,62,.09); }
.campaign-vision-card > img { height:280px; }
.campaign-vision-caption { background:#07383e; }
.campaign-giving { background:#fffdfa; }
.home-updates { background:#e9f5f3; }
.home-update-card { border-radius:12px; border-top:3px solid #006568; }
.home-verse-card { border-top-color:#c5a14c; }
.future-bridge { background:#f8f0dc; }
body[data-page="donate"] .compact-donate-intro { border-bottom:1px solid #d5e6e3; padding-bottom:24px; margin-bottom:24px; }
body[data-page="donate"] .compact-paypal-panel { background:linear-gradient(145deg,#006568,#07383e); }
body[data-page="donate"] .donation-video-panel { background:#0c3c52; }
.site-footer .footer-identity .footer-logo { width:210px; max-height:80px; }
@media(max-width:1050px) { .site-header { height:auto; } .site-header .header-logo { width:250px; height:78px; flex-basis:250px; } }
@media(max-width:800px) {
  body[data-page="home"] .hero-reference { grid-template-columns:1fr; }
  body[data-page="home"] .hero-reference .hero-copy { grid-column:1; grid-row:1; }
  .campaign-vision-card { grid-column:1; grid-row:2; }
}
@media(max-width:520px) { .site-header .header-logo { width:225px; height:72px; flex-basis:225px; } .campaign-vision-card > img { height:210px; } }
/* Community emblem: clear wordmark, text-led hero and warm giving accents. */
.site-header .brand { display:flex; gap:12px; align-items:center; min-width:0; }
.site-header .header-logo { width:88px; height:88px; flex-basis:88px; }
.community-wordmark { display:flex; flex-direction:column; gap:5px; color:#0e3049; }
.community-wordmark strong { font:600 17px Georgia,serif; }
.community-wordmark small { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:#0b6870; }
body[data-page="home"] .hero-reference { grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); background:#fff8ed; }
body[data-page="home"] .hero-reference .hero-copy { grid-column:1; grid-row:1; }
.campaign-vision-card { grid-column:2; grid-row:1; }
.header-donate,.primary-cta,.campaign-give-button { background:#b94f38; color:#fff; border-color:#b94f38; }
.header-donate:hover,.primary-cta:hover,.campaign-give-button:hover { background:#973f2c; color:#fff; }
.home-updates { background:#edf6f4; }
.home-update-card { border-top-color:#0b6870; }
.home-verse-card { background:#f8edd8; border-top-color:#d5a74e; }
.future-bridge { background:#f4f8f4; }
body[data-page="home"] .appeal-section { background:#fff7ed; }
body[data-page="home"] .appeal-section + .appeal-section { background:#edf5f3; }
body[data-page="donate"] .compact-donation-page { background:#fff8ed; }
body[data-page="donate"] .compact-paypal-panel { background:linear-gradient(145deg,#0c6570,#123c50); }
body[data-page="donate"] .compact-paypal-panel .paypal-donate-button { background:#b94f38; color:#fff; border-color:#b94f38; }
body[data-page="donate"] .compact-paypal-panel .paypal-donate-button:hover { background:#973f2c; color:#fff; }
.site-footer .footer-identity .footer-logo { width:140px; max-height:145px; }
@media(max-width:1050px) { .site-header .header-logo { width:76px; height:76px; flex-basis:76px; } .community-wordmark strong { font-size:15px; } }
@media(max-width:800px) {
  body[data-page="home"] .hero-reference { grid-template-columns:1fr; }
  .campaign-vision-card { grid-column:1; grid-row:2; }
}
@media(max-width:520px) { .site-header .header-logo { width:64px; height:64px; flex-basis:64px; } .community-wordmark strong { font-size:13px; } .community-wordmark small { font-size:8px; letter-spacing:.04em; } }
/* New homepage: wide campaign banner and donation strip. */
body[data-page="home"] .hero-reference {
  display:block; position:relative; padding:52px clamp(20px,6vw,90px) 0;
  background:linear-gradient(90deg,rgba(8,43,58,.96),rgba(8,43,58,.86) 54%,rgba(8,43,58,.2)),url('mosque-hero.webp') center / cover no-repeat;
}
body[data-page="home"] .hero-reference .hero-copy { width:min(760px,100%); max-width:760px; padding-bottom:38px; }
body[data-page="home"] .hero-reference h1.hero-message-title { color:#fffdf4; }
body[data-page="home"] .hero-reference .eyebrow { color:#edcc81; }
body[data-page="home"] .hero-reference .hero-vision-line { color:#edcc81; }
body[data-page="home"] .hero-reference .hero-future-copy,body[data-page="home"] .hero-reference .hero-legacy-note { color:#e1ece8; }
body[data-page="home"] .hero-reference .hero-secondary-cta { background:transparent; border-color:#b9ceca; color:#fff; }
body[data-page="home"] .campaign-vision-card { display:block; max-width:none; border:0; border-radius:18px 18px 0 0; box-shadow:none; background:#fffdf6; }
body[data-page="home"] .campaign-vision-card > img,body[data-page="home"] .campaign-vision-caption { display:none; }
body[data-page="home"] .campaign-giving { display:grid; grid-template-columns:1.1fr 1fr auto; gap:24px; align-items:center; padding:24px 28px; background:#fffdf6; }
body[data-page="home"] .campaign-giving > div > strong { font-size:30px; }
body[data-page="home"] .campaign-giving p { margin:6px 0 0; max-width:370px; }
body[data-page="home"] .campaign-giving nav { gap:7px; }
body[data-page="home"] .campaign-give-button { width:auto; margin:0; white-space:nowrap; }
body[data-page="home"] .home-updates.section-pad { padding:30px clamp(20px,6vw,90px); background:#f0f6f3; }
body[data-page="home"] .home-updates-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:18px; }
body[data-page="home"] .home-update-card { border:1px solid #d5e3da; border-radius:14px; background:#fffdf8; }
body[data-page="home"] .home-verse-card { background:#f5e9cc; border-color:#e2cc94; }
body[data-page="home"] .future-bridge { background:#fffdf8; }
body[data-page="home"] .future-bridge-steps article { border-left:3px solid #c5a14c; padding-left:18px; }
body[data-page="home"] .vision-section { background:#edf5f2; }
@media(max-width:1000px) { body[data-page="home"] .campaign-giving { grid-template-columns:1fr 1fr; } body[data-page="home"] .campaign-give-button { grid-column:2; } }
@media(max-width:800px) {
 body[data-page="home"] .hero-reference { padding-top:35px; background:linear-gradient(90deg,rgba(8,43,58,.96),rgba(8,43,58,.78)),url('mosque-hero.webp') center / cover no-repeat; }
 body[data-page="home"] .home-updates-grid { grid-template-columns:1fr; }
 body[data-page="home"] .campaign-giving { grid-template-columns:1fr; padding:22px; gap:18px; }
 body[data-page="home"] .campaign-give-button { grid-column:1; width:100%; }
}
