/* ===========================
   Radical Scholar – Global CSS
   =========================== */

/* ---------- Root & Palette ---------- */
:root{
  --burgundy:#611B1D;               /* RS primary */
  --blue:#1E3A5F;                   /* Sibling anchor */
  --blue-deep:#0F1E2D;              /* Ink / deep tone */
  --gold:#D4AF37;                   /* Accent (hover, focus) */
  --off:#F9F7F2;                    /* Alt background */
  --ink:#0F1E2D;                    /* Heading/body ink */
  --muted:#425466;                  /* Secondary text */
  --border:#E9E9E9;                 /* Hairlines */
  --white:#FFFFFF;

  --radius:14px;
  --shadow:0 6px 24px rgba(0,0,0,.08);

  /* Type scale */
  --fs-hero: clamp(2rem, 4vw + 1rem, 3.2rem);
  --fs-h1: clamp(2rem, 2.5vw + 1rem, 3.4rem);
  --fs-h2: clamp(1.5rem, 1.6vw + .9rem, 2.2rem);
  --fs-h3: clamp(1.1rem, .9vw + .9rem, 1.4rem);

  --maxw:1120px;
}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,
               "Apple Color Emoji","Segoe UI Emoji";
  line-height:1.6;
  color:var(--ink);
  background:var(--off);
}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--maxw);margin:0 auto;padding:0 1.25rem}

/* ---------- Typography ---------- */
h1,h2,h3,h4{
  font-family:"Playfair Display",Georgia,serif;
  color:var(--ink);
  margin:0 0 .5rem;
}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
p{margin:.5rem 0 1rem}

/* ---------- Header (shared include) ---------- */
header{
  position:sticky; top:0; z-index:1000;
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid var(--border);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:.75rem}
.brand img{height:38px;width:auto}
.brand .wordmark{
  font-family:"Playfair Display",Georgia,serif;
  font-size:1.25rem; color:var(--ink); letter-spacing:.02em;
}

.menu{display:flex;gap:1rem;align-items:center}
.menu a{
  padding:.4rem .6rem;
  border-radius:8px;
  color:var(--burgundy);
}
/* Highlight current page, but never override the Donate CTA look */
.menu a[aria-current="page"]:not(.donate-btn){
  background:var(--burgundy);
  color:#fff;
}

/* Donate button in header */
.menu a.donate-btn{
  background:var(--burgundy);
  color:#fff !important;
  padding:.5rem 1rem;
  border-radius:8px;
  font-weight:600;
  transition:background .25s ease,color .25s ease;
}
.menu a.donate-btn:hover{
  background:var(--gold);
  color:var(--ink) !important;
  text-decoration:none;
}
/* When NOT on donate.html, show outlined style instead of filled */
body:not(.donate) .menu a.donate-btn:not([aria-current="page"]){
  background:transparent;
  color:var(--burgundy) !important;
  border:2px solid var(--burgundy);
}

/* Keyboard focus */
.menu a:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:2px;
}

/* Mobile nav */
.hamburger{display:none;background:none;border:0;padding:.5rem;margin-left:.5rem}
.hamburger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}
@media (max-width:900px){
  .menu{display:none}
  .hamburger{display:block}
  .menu.open{
    display:flex;flex-direction:column;gap:.5rem;
    position:absolute; top:68px; left:0; right:0;
    background:#fff; border-bottom:1px solid var(--border); padding:1rem;
  }
}

/* ---------- Hero (one-pager) ---------- */
.hero{position:relative; isolation:isolate}
.hero .inner{
  display:grid; grid-template-columns:1.2fr .8fr; gap:2rem; align-items:center;
  padding:min(7vw,5rem) 0;
}
.hero .copy h1{font-size:var(--fs-hero)}
.tag{
  display:inline-block; background:var(--burgundy); color:#fff;
  border-radius:999px; padding:.25rem .65rem; font-size:.8rem; margin-bottom:.75rem;
}
.hero .art{justify-self:end}
.hero .mark{
  width:min(280px,40vw); height:auto;
  filter:drop-shadow(0 10px 24px rgba(97,27,29,.22));
}

/* ---------- Buttons (general) ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.1rem; border-radius:10px; font-weight:600; border:2px solid transparent;
  transition:all .25s ease;
}
.btn-primary{background:var(--burgundy); color:#fff; border-color:var(--burgundy)}
.btn-primary:hover,.btn-primary:focus{background:var(--gold); border-color:var(--gold); color:#fff; transform:translateY(-2px)}
.btn-outline{border-color:var(--burgundy); color:var(--burgundy); background:transparent}
.btn-outline:hover,.btn-outline:focus{background:var(--gold); color:#fff; border-color:var(--gold)}

/* ---------- Sections & Cards ---------- */
section{padding:64px 0}
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:1.2rem}
.card{
  background:#fff; border:1px solid var(--border);
  border-radius:var(--radius); padding:1.15rem; box-shadow:var(--shadow);
}

/* Card motion + polish */
.cards .card{
  transition: transform .18s ease, box-shadow .18s ease;
  will-change: transform;
}
.cards .card:hover,
.cards .card:focus-within{
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}

/* Amount styling (donate tiers) */
.amount{
  font-size:1.25rem;
  font-weight:700;
  color: var(--blue);
  margin:.25rem 0 .5rem;
}

/* Make the Donate button sit nicely in cards */
.cards .card .btn{ margin-top:.5rem; }

/* ---------- Band CTA ---------- */
.band{background:linear-gradient(135deg,var(--burgundy),var(--blue)); color:#fff}
.band h2,.band p{color:#fff}

/* ---------- Forms ---------- */
form{
  background:#fff; border:1px solid var(--border);
  border-radius:var(--radius); padding:1rem; box-shadow:var(--shadow);
}
input,textarea,select{
  width:100%; padding:.6rem; border:1px solid var(--border); border-radius:10px;
  font:inherit; color:inherit; background:#fff;
}

/* ---------- Donate page hero band ---------- */
.donate-hero{
  background:var(--burgundy); color:#fff; padding:56px 0; text-align:center;
}
.donate-hero h1,.donate-hero p{color:#fff}
.donate-hero p{max-width:720px; margin:0 auto; font-size:1.1rem}

/* ---------- Section Divider (burgundy line) ---------- */
.section-divider{
  width:80px; height:3px; background-color:var(--burgundy);
  border:none; border-radius:2px; margin:2rem auto 3rem;
}

/* ---------- Strategic Plan section ---------- */
.plan { padding: 64px 0; }
.plan .eyebrow { text-transform: uppercase; letter-spacing:.06em; font-size:.8rem; }
.plan .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 18px;
  align-items: start;
}
.plan .card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  padding: 20px 22px;
}
.plan .card.full { grid-column: 1 / -1; }
.eyebrow {
  display:block; text-transform:uppercase; letter-spacing:.1em;
  font-size:1rem; font-weight:600; color:var(--burgundy); text-align:center; margin-bottom:.6rem;
}

/* ---------- Footer ---------- */
.footer{background:var(--burgundy); color:#fff}
.footer a{color:#fff;opacity:.95;text-decoration:none}
.footer a:hover{opacity:1;text-decoration:underline}
.footer .fine{font-size:.9rem;opacity:.9;margin:.25rem 0 .75rem}
.footer .container{max-width:1080px; margin:0 auto; padding-inline:1.25rem}
.footer-grid-3{
  display:grid; grid-template-columns:1.1fr .9fr 1.1fr;
  gap:1rem; align-items:start; padding:2rem 0;
}
.footer-left{text-align:left}
.footer-center{text-align:center}
.footer-right{text-align:right; justify-self:end}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.2);
  text-align:center; padding:1rem 0 1.25rem; font-size:.9rem; opacity:.95;
}

/* ---------- Responsive tweaks ---------- */
@media (max-width:900px){
  .hero .inner{grid-template-columns:1fr; text-align:center}
  .hero .art{justify-self:center}
  .cards{grid-template-columns:1fr}
  .footer-grid-3{grid-template-columns:1fr; text-align:center; justify-items:center; gap:1rem}
  .footer-left,.footer-center,.footer-right{ text-align:center; justify-self:center }
}

/* ---------- Donate > Ways to Give (scoped grid override) ---------- */
#giving-levels .cards{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap:18px;
  max-width:980px;
  margin:0 auto;           /* centers grid */
}
#giving-levels .card{
  display:flex; flex-direction:column;
}
#giving-levels .card .btn{
  margin-top:auto; align-self:flex-start;
}

/* ---------- Donate page button + spacing ---------- */
body.donate #donate{ padding:2rem 0; text-align:center }
body.donate #donate .btn,
body.donate #donate .btn-donate{
  background-color:var(--burgundy); color:#fff; border:none;
  border-radius:6px; padding:.75rem 1.5rem; font-weight:600; display:inline-block;
  text-decoration:none; transition:all .25s ease; margin-top:1rem;
}
body.donate #donate .btn:hover,
body.donate #donate .btn-donate:hover{
  background-color:var(--gold); color:var(--ink);
}
/* Donate > Ways to Give: force 2-by-2 on larger screens */
#giving-levels .cards{
  display:grid;
  gap:18px;
  grid-template-columns: 1fr;        /* phones: 1 column */
  max-width: 900px;                  /* keeps the 2×2 tight and centered */
  margin: 0 auto;
}

#giving-levels .card{
  display:flex; flex-direction:column;
}

#giving-levels .card .btn{ margin-top:auto; }

/* from tablets up: 2 columns */
@media (min-width: 700px){
  #giving-levels .cards{
    grid-template-columns: repeat(2, minmax(300px, 1fr));
  }
}
/* Contact form grid */
#contact .form-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap:16px;
}
#contact .form-grid .full{ grid-column:1 / -1; }

/* Labels & inputs */
#contact label{ display:block; font-weight:600; margin:0 0 .35rem; }
#contact input[type="text"],
#contact input[type="email"]{ height:48px; }

/* Consent row (checkbox + long text) */
#contact .consent{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-weight:400;           /* normal weight for body text */
  margin:0;
}
#contact .consent input[type="checkbox"]{
  width:18px; height:18px; margin-top:.35rem;
}

/* Button row */
#contact .actions{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
}

/* Mobile: stack to 1 column */
@media (max-width: 760px){
  #contact .form-grid{ grid-template-columns:1fr; }
}
/* Add breathing room around checkbox + consent text */
#contact .consent {
  display: flex;
  align-items: flex-start;
  gap: 14px;                /* increases horizontal space */
  line-height: 1.6;         /* relaxes vertical rhythm */
  padding: 0.75rem 0;       /* adds vertical breathing room */
}

#contact .consent input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin-top: 0.35rem;
  flex-shrink: 0;
}
.footer-left .candid-badge img {
  display: block;
  height: 42px;
  width: auto;
  margin: 0.4rem 0 0.6rem;
  filter: drop-shadow(0 0 1px rgba(0,0,0,0.15));
}
/* --- Responsive alignment for the Candid seal --- */
.footer-left {
  text-align: left;
}

.footer-left .candid-badge {
  display: inline-block;
}

.footer-left .candid-badge img {
  display: block;
  height: 46px;
  width: auto;
  margin-top: 0.35rem;
}

/* Center seal on smaller screens */
@media (max-width: 768px) {
  .footer-left {
    text-align: center;
  }
  .footer-left .candid-badge {
    margin: 0.5rem auto;
  }
}
/* Responsive centering for Candid Seal inside grid footer */
@media (max-width: 768px) {
  .footer-grid-3 {
    display: block; /* stack columns vertically */
    text-align: center; /* center all text by default */
  }

  .footer-left,
  .footer-center,
  .footer-right {
    text-align: center;
    margin-bottom: 1.2rem;
  }

  .footer-left .candid-badge {
    display: inline-block;
    margin: 0.5rem auto 0.6rem;
  }

  .footer-left .candid-badge img {
    display: block;
    margin: 0 auto;
    height: 44px;
    width: auto;
  }
}
/* Default: sit naturally in the left column on larger screens */
.footer-left .candid-badge { display: inline-block; }

/* Force reliable centring on phones and tablets */
@media (max-width: 900px) {
  .footer-left { text-align: center; }             /* center inline elements in the column */
  .footer-left .mobile-center {
    display: block;                                /* become a block so margins work */
    width: max-content;                            /* shrink-to-fit the image width */
    margin: 0.5rem auto 0.6rem;                    /* center horizontally */
    float: none !important;                        /* neutralize any inherited floats */
  }
  .footer-left .mobile-center img {
    display: block;                                /* remove inline whitespace quirks */
    height: 44px;
    width: auto;
  }
/* === Candid Seal (Footer) — single source of truth === */

/* Default (desktop/tablet ≥900px): sit naturally in left column */
.footer-left .candid-badge { display: inline-block; vertical-align: top; }
.footer-left .candid-badge img {
  display: block;
  height: 46px;
  width: auto;
  transition: transform .25s ease, opacity .25s ease;
}

/* Vertical rhythm with EIN and Legal link */
.footer-left p.fine { margin-bottom: .35rem; }
.footer-left a[href*="legal"] { display: inline-block; margin-top: .45rem; }

/* Subtle hover (desktop only) */
@media (hover: hover) and (pointer: fine) {
  .footer-left .candid-badge:hover img { transform: scale(1.03); opacity: .96; }
}

/* Mobile / iPad (≤900px): center the badge under EIN */
@media (max-width: 900px) {
  .footer-left { text-align: center; }
  .footer-left .candid-badge {
    display: block;           /* allow auto margins to center */
    width: max-content;       /* shrink-to-fit around image */
    margin: .5rem auto .6rem; /* centered */
    float: none;
  }
  .footer-left .candid-badge img { height: 44px; }
}

/* Very narrow screens (≤400px): gentle downscale */
@media (max-width: 400px) {
  .footer-left .candid-badge img { height: 40px; }
}