/* =========================================================
   MEGAN GRAHAM CAMPAIGN DESIGN SYSTEM
   ========================================================= */
:root {
  --mg-blue-950:#0c1a2a; --mg-blue-900:#10263f; --mg-blue-800:#173554; --mg-blue-700:#23486d;
  --mg-blue-600:#2f5f8d; --mg-blue-500:#3d79a8;
  --mg-red-700:#b22f2a; --mg-red-600:#c73a34; --mg-red-500:#d84a43;
  --mg-gold-500:#e0b34c; --mg-gold-400:#f0c96a;
  --mg-ink-900:#14202b; --mg-ink-800:#1f2f3d; --mg-ink-700:#304252; --mg-ink-600:#4a5c6c;
  --mg-bg-50:#f7f9fc; --mg-bg-100:#eef3f8; --mg-bg-200:#e1e8f0; --mg-white:#fff;
  --mg-border:#dbe3ec; --mg-border-strong:#c8d4e2;
  --mg-shadow-sm:0 8px 20px rgba(16,38,63,.06); --mg-shadow-md:0 14px 34px rgba(16,38,63,.1); --mg-shadow-lg:0 22px 48px rgba(16,38,63,.14);
  --mg-radius-sm:10px; --mg-radius-md:16px; --mg-radius-lg:24px; --mg-radius-xl:32px;
  --mg-max:1180px; --mg-transition:180ms ease;
}
html { scroll-behavior:smooth; }
body { font-family:"Inter","Segoe UI",Arial,sans-serif; color:var(--mg-ink-800); background:var(--mg-white); line-height:1.65; text-rendering:optimizeLegibility; }
img { max-width:100%; height:auto; display:block; }
a { color:var(--mg-blue-700); text-decoration:none; transition:color var(--mg-transition),opacity var(--mg-transition),transform var(--mg-transition); }
a:hover { color:var(--mg-blue-900); }
.container { width:min(calc(100% - 32px), var(--mg-max)); margin-inline:auto; }
.section { position:relative; padding:72px 0; }
.section-light { background:linear-gradient(180deg, var(--mg-bg-50) 0%, var(--mg-white) 100%); }
.section-soft-blue { background:linear-gradient(180deg, #f7fbff 0%, #edf4fb 100%); }
.section-navy { background:linear-gradient(180deg, var(--mg-blue-900) 0%, #0b1c2e 100%); color:var(--mg-white); }
.section-gray { background:linear-gradient(180deg, #f8fafc 0%, #eef3f7 100%); }
.section-red-band { background:linear-gradient(180deg, #243f5d 0%, #15304d 100%); color:var(--mg-white); }
.section-cta { background:linear-gradient(180deg, var(--mg-blue-900) 0%, #0f2236 100%); color:var(--mg-white); }
.narrow { max-width:820px; }
.center-text { text-align:center; }

h1,h2,h3,h4 { margin:0 0 16px; color:var(--mg-blue-900); line-height:1.12; }
h2 { font-family:"Merriweather",Georgia,serif; font-size:clamp(2rem,3vw,3rem); letter-spacing:-.02em; }
h3 { font-size:clamp(1.1rem,1.8vw,1.35rem); font-weight:800; }
p { margin:0 0 16px; font-size:1.04rem; color:var(--mg-ink-700); }
.section-label { display:inline-flex; align-items:center; gap:10px; margin-bottom:18px; font-size:.84rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--mg-blue-700); }
.section-label::before { content:""; width:34px; height:2px; background:var(--mg-red-500); border-radius:999px; }
.section-label-light, .section-title-light, .section-text-light, .section-red-band h2, .section-red-band p, .section-cta h2, .section-cta p { color:var(--mg-white); }
.section-label-light::before, .section-label-red::before { background:var(--mg-gold-500); }
.section-title { margin-bottom:14px; }
.section-text { font-size:1.08rem; }

.cards-2, .cards-3, .cards-4, .split-section, .footer-grid, .page-links-grid, .resource-grid { display:grid; gap:28px; }
.cards-top-gap { margin-top:36px; }
.cards-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.cards-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.cards-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.split-section { grid-template-columns:1fr 1fr; align-items:center; }
.reverse-mobile .split-image { order:2; }
.reverse-mobile .split-copy { order:1; }

.info-card, .feature-card, .priority-card, .vote-card, .quote-card, .resource-card, .content-card, .support-card {
  background:var(--mg-white); border:1px solid var(--mg-border); border-radius:var(--mg-radius-md); box-shadow:var(--mg-shadow-sm); padding:28px;
  transition:transform var(--mg-transition), box-shadow var(--mg-transition), border-color var(--mg-transition);
}
.info-card:hover, .feature-card:hover, .priority-card:hover, .vote-card:hover, .quote-card:hover, .resource-card:hover, .content-card:hover, .support-card:hover {
  transform:translateY(-3px); box-shadow:var(--mg-shadow-md); border-color:var(--mg-border-strong);
}
.feature-card, .priority-card, .content-card { position:relative; overflow:hidden; }
.feature-card::before, .priority-card::before, .content-card::before {
  content:""; position:absolute; inset:0 0 auto 0; height:5px; background:linear-gradient(90deg, var(--mg-blue-700), var(--mg-red-500), var(--mg-gold-500));
}
.card-icon, .vote-icon { width:52px; height:52px; border-radius:14px; display:grid; place-items:center; background:#f1f6fb; font-size:1.5rem; margin-bottom:14px; }
.quote-card p { font-size:1.1rem; font-style:italic; }
.quote-card footer { margin-top:14px; font-weight:800; color:var(--mg-blue-800); }

.btn, a.btn, .buttons a {
  display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:12px 20px; border-radius:999px;
  border:1px solid transparent; font-weight:800; font-size:.96rem; letter-spacing:.02em; text-align:center; cursor:pointer;
  box-shadow:var(--mg-shadow-sm); transition:transform var(--mg-transition),box-shadow var(--mg-transition),background-color var(--mg-transition),border-color var(--mg-transition),color var(--mg-transition);
}
.btn:hover, a.btn:hover, .buttons a:hover { transform:translateY(-2px); box-shadow:var(--mg-shadow-md); }
.btn-primary { background:var(--mg-red-600); color:#fff; }
.btn-primary:hover { background:var(--mg-red-700); color:#fff; }
.btn-secondary, .btn-outline { background:#fff; color:var(--mg-blue-900); border-color:var(--mg-border-strong); }
.btn-secondary:hover, .btn-outline:hover { background:var(--mg-bg-50); color:var(--mg-blue-900); }
.btn-light-outline { background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.25); }
.btn-light-outline:hover { background:rgba(255,255,255,.14); color:#fff; }
.btn-gold { background:linear-gradient(180deg, var(--mg-gold-400), var(--mg-gold-500)); color:var(--mg-blue-900); }
.buttons { display:flex; flex-wrap:wrap; gap:14px; margin-top:20px; }

.trust-bar { background:linear-gradient(180deg, #f9fbfd 0%, #f1f5f9 100%); border-top:1px solid var(--mg-border); border-bottom:1px solid var(--mg-border); box-shadow:inset 0 1px 0 rgba(255,255,255,.9); }
.trust-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.trust-pill {
  min-height:72px; display:flex; align-items:center; justify-content:center; gap:10px; padding:14px 16px; text-align:center; font-size:.96rem; font-weight:800; color:var(--mg-blue-900);
}
.trust-pill + .trust-pill { border-left:1px solid var(--mg-border); }
.trust-pill::before, .trust-pill::after { content:"★"; color:var(--mg-gold-500); font-size:.9rem; line-height:1; }

.site-header {
  position:sticky; top:0; z-index:900; background:rgba(255,255,255,.96); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(16,38,63,.08); box-shadow:0 10px 24px rgba(16,38,63,.05);
}
.nav { min-height:78px !important; height:auto !important; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.brand { display:flex; flex-direction:column; gap:2px; }
.brand-name { font-family:"Oswald",sans-serif; font-size:1.45rem; letter-spacing:.04em; color:var(--mg-blue-900); line-height:1; }
.brand-office { font-size:.86rem; font-weight:700; color:var(--mg-blue-700); }
.desktop-nav { display:flex; flex-wrap:wrap; gap:16px; align-items:center; }
.desktop-nav a { font-weight:700; color:var(--mg-blue-900); }
.nav-donate { background:var(--mg-red-600); color:#fff !important; padding:10px 16px; border-radius:999px; box-shadow:var(--mg-shadow-sm); }

.hero-copy .eyebrow { display:none !important; }
.hero-copy .hero-lead { max-width:540px; text-shadow:0 2px 8px rgba(0,0,0,.18); }
.hero-actions .btn-primary { background:var(--mg-red-600); }
.hero-actions .btn-secondary { background:rgba(255,255,255,.92); color:var(--mg-blue-900); border-color:rgba(255,255,255,.6); }

.plan-graphic {
  min-height:360px; border-radius:var(--mg-radius-lg); border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at top left, rgba(240,201,106,.22), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.02) 100%),
    linear-gradient(180deg, #173554 0%, #10263f 100%);
  box-shadow:var(--mg-shadow-md);
  position:relative; overflow:hidden;
}
.plan-graphic::before {
  content:"30 Days\AReview workflows\A\A60 Days\AStrengthen systems\A\A100 Days\ADeliver better service";
  white-space:pre-line; position:absolute; inset:28px; color:#fff; font-weight:800; font-size:1.05rem; line-height:1.55;
}
.split-image img { border-radius:var(--mg-radius-lg); box-shadow:var(--mg-shadow-md); }

.page-hero {
  padding:84px 0 60px;
  background:radial-gradient(circle at top right, rgba(216,74,67,.1), transparent 30%), radial-gradient(circle at top left, rgba(61,121,168,.1), transparent 34%), linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
  border-bottom:1px solid var(--mg-border);
}
.page-hero h1 { font-family:"Merriweather",Georgia,serif; font-size:clamp(2.4rem,4vw,4.1rem); letter-spacing:-.025em; color:var(--mg-blue-900); }
.page-hero p { max-width:780px; font-size:1.12rem; }

.content-stack { display:grid; gap:26px; }
.checklist { list-style:none; padding:0; margin:22px 0 0; display:grid; gap:14px; }
.checklist li {
  position:relative; padding:18px 18px 18px 64px; background:#fff; border:1px solid #eadfca; border-radius:var(--mg-radius-md); box-shadow:var(--mg-shadow-sm); font-weight:700; color:var(--mg-ink-800);
}
.checklist li::before {
  content:"✓"; position:absolute; left:18px; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:999px; display:grid; place-items:center;
  background:linear-gradient(180deg, var(--mg-gold-400), var(--mg-gold-500)); color:var(--mg-blue-900); font-weight:900;
}
.resource-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.page-links-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.resource-card h3, .content-card h3 { margin-top:8px; }

.link-list { list-style:none; padding:0; margin:12px 0 0; display:grid; gap:12px; }
.link-list a { font-weight:800; }

.site-footer { background:#0f2032; color:rgba(255,255,255,.86); padding:52px 0 86px; }
.site-footer h3, .site-footer h4 { color:#fff; }
.site-footer p, .site-footer a, .site-footer li { color:rgba(255,255,255,.84); }
.site-footer a:hover { color:#fff; }
.footer-grid { grid-template-columns:1.4fr 1fr 1fr 1fr; }
.footer-list { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.footer-disclaimer { margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); font-size:.92rem; }

.sticky-bar {
  position:fixed; left:50%; bottom:14px; transform:translateX(-50%); width:min(calc(100% - 20px), 760px); display:grid; grid-template-columns:repeat(3,1fr);
  gap:10px; padding:10px; border-radius:999px; background:rgba(15,32,50,.92); backdrop-filter:blur(14px); box-shadow:var(--mg-shadow-lg);
  border:1px solid rgba(255,255,255,.08); z-index:9999;
}
.sticky-bar a {
  display:inline-flex; align-items:center; justify-content:center; min-height:46px; border-radius:999px; font-weight:900; font-size:.92rem; letter-spacing:.04em; text-transform:uppercase; color:#fff;
  background:transparent; border:1px solid rgba(255,255,255,.12);
}
.sticky-bar a:hover { color:#fff; transform:translateY(-1px); }
.sticky-bar a:nth-child(1) { background:var(--mg-blue-700); border-color:transparent; }
.sticky-bar a:nth-child(2) { background:rgba(255,255,255,.08); }
.sticky-bar a:nth-child(3) { background:var(--mg-red-600); border-color:transparent; }

form { display:grid; gap:16px; }
label { font-weight:800; color:var(--mg-blue-900); font-size:.95rem; }
input, select, textarea { width:100%; border:1px solid var(--mg-border-strong); border-radius:14px; padding:13px 14px; font:inherit; color:var(--mg-ink-800); background:#fff; }
textarea { min-height:140px; resize:vertical; }
.form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }

@media (max-width:1080px) {
  .cards-4, .resource-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:860px) {
  .cards-2, .cards-3, .cards-4, .split-section, .footer-grid, .resource-grid, .page-links-grid, .trust-grid, .form-row { grid-template-columns:1fr; }
  .section { padding:56px 0; }
  .trust-pill + .trust-pill { border-left:0; border-top:1px solid var(--mg-border); }
  .sticky-bar { width:min(calc(100% - 16px), 620px); }
}
@media (max-width:640px) {
  .buttons { flex-direction:column; align-items:stretch; }
  .btn, a.btn, .buttons a { width:100%; }
  .sticky-bar { grid-template-columns:1fr; border-radius:24px; bottom:10px; }
}