/* ============================================================
   NFMSS SCHOOL DISTRICTS PAGE STYLES - v1.0
   Scoped under .nfsd. Matches NFMSS brand: Barlow / Barlow
   Condensed, navy #0e3a66, deep navy #06182f, red #c8102e.
   ASCII-only.
   ============================================================ */
.nfsd {
  --blue: #0e3a66;
  --blue-deep: #06182f;
  --red: #c8102e;
  --red-dark: #9e0c24;
  --red-bright: #e81c34;
  --off: #f6f7f9;
  --border: #e4e7eb;
  --ink: #1c2430;
  font-family: 'Barlow', -apple-system, BlinkMacSystemFont, sans-serif;
  color: #1c2430;
  line-height: 1.6;
  font-size: 17px;
  background: #ffffff;
  margin: 0;
}
.nfsd *, .nfsd *::before, .nfsd *::after { box-sizing: border-box; }
.nfsd img { max-width: 100%; height: auto; display: block; }
.nfsd h1, .nfsd h2, .nfsd h3 { margin: 0; line-height: 1.05; }
.nfsd p { margin: 0 0 1em; }
.nfsd a:focus-visible, .nfsd button:focus-visible, .nfsd summary:focus-visible {
  outline: 3px solid #c8102e;
  outline-offset: 3px;
}
.nfsd .wrap { max-width: 1160px; margin: 0 auto; padding: 0 20px; }

/* ---- Shared building blocks ---- */
.nfsd .sd-eyebrow {
  display: inline-block;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #e81c34;
  border-bottom: 2px solid #e81c34;
  padding-bottom: 6px;
  margin-bottom: 18px;
}
.nfsd .sd-eyebrow-dark {
  display: inline-block;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #c8102e;
  border-bottom: 2px solid #c8102e;
  padding-bottom: 6px;
  margin-bottom: 18px;
}
.nfsd .sd-headline {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .01em;
  font-size: clamp(34px, 5vw, 52px);
  color: #ffffff;
}
.nfsd .sd-headline em { font-style: italic; color: #e81c34; }
.nfsd .sd-headline-dark { color: #0e3a66; }
.nfsd .sd-headline-dark em { color: #c8102e; }

.nfsd .sd-btn {
  display: inline-block;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 15px 30px;
  border: 2px solid transparent;
  transition: transform .15s ease, background .15s ease, color .15s ease;
}
.nfsd .sd-btn:hover { transform: translateY(-2px); }
.nfsd .sd-btn-red { background: #c8102e; color: #fff; }
.nfsd .sd-btn-red:hover { background: #9e0c24; }
.nfsd .sd-btn-ghost { border-color: #ffffff; color: #ffffff; }
.nfsd .sd-btn-ghost:hover { border-color: #e81c34; background: #e81c34; color: #fff; }

/* ---- HERO ---- */
.nfsd .sd-hero {
  padding: 96px 0 84px;
  background: #06182f;
  background-image: linear-gradient(160deg, #0e3a66 0%, #06182f 100%);
  color: #ffffff;
  text-align: center;
}
.nfsd .sd-hero-inner { display: flex; flex-direction: column; align-items: center; }
.nfsd .sd-hero .sd-headline { max-width: 20ch; margin-bottom: 18px; }
.nfsd .sd-hero-sub {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: 15px;
  color: #e81c34;
  margin-bottom: 22px;
}
.nfsd .sd-hero-body { max-width: 68ch; color: rgba(255,255,255,.85); font-size: 18px; margin-bottom: 34px; }
.nfsd .sd-hero-btns { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }

/* ---- WHY DISTRICTS ---- */
.nfsd .sd-why { padding: 84px 0; }
.nfsd .sd-why .sd-headline { margin-bottom: 40px; }
.nfsd .sd-why-grid { display: grid; gap: 18px; }
.nfsd .sd-why-card {
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.14);
  border-top: 3px solid #e81c34;
  padding: 26px 24px;
}
.nfsd .sd-why-card h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 22px;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #fff;
  margin-bottom: 10px;
}
.nfsd .sd-why-card p { color: rgba(255,255,255,.78); font-size: 15px; margin-bottom: 0; }

/* ---- COMPARISON TABLE ---- */
.nfsd .sd-compare { padding: 84px 0; background: #f6f7f9; border-top: 1px solid #e4e7eb; border-bottom: 1px solid #e4e7eb; }
.nfsd .sd-compare .sd-headline { margin-bottom: 36px; max-width: 22ch; }
.nfsd .sd-compare-table { background: #fff; border: 1px solid #e4e7eb; overflow: hidden; }
.nfsd .sd-compare-head, .nfsd .sd-compare-row {
  display: grid;
  grid-template-columns: 32px 1fr 1fr;
}
.nfsd .sd-compare-head { background: #0e3a66; }
.nfsd .sd-compare-without-head, .nfsd .sd-compare-with-head {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: 14px;
  padding: 14px 18px;
  color: #fff;
}
.nfsd .sd-compare-with-head { background: #c8102e; }
.nfsd .sd-compare-row { border-top: 1px solid #e4e7eb; }
.nfsd .sd-compare-num {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800;
  color: #c8102e;
  background: #f6f7f9;
  font-size: 14px;
}
.nfsd .sd-compare-without { padding: 16px 18px; background: #fbfbfc; color: #4a5262; font-size: 15px; }
.nfsd .sd-compare-with { padding: 16px 18px; background: #fff5f2; color: #1c2430; font-weight: 600; font-size: 15px; }

/* ---- EDUCATION + ATHLETICS ---- */
.nfsd .sd-edu { padding: 84px 0; background: #fff; }
.nfsd .sd-edu-inner { display: grid; gap: 40px; align-items: center; }
.nfsd .sd-edu-img {
  width: 100%;
  max-width: 440px;
  justify-self: center;
  border: 1px solid #e4e7eb;
  box-shadow: 10px 10px 0 #0e3a66;
}
.nfsd .sd-edu-copy .sd-headline { margin-bottom: 20px; }
.nfsd .sd-edu-copy p { color: #1c2430; }

/* ---- WHO WE WORK WITH ---- */
.nfsd .sd-who { padding: 84px 0; background: #f6f7f9; border-top: 1px solid #e4e7eb; }
.nfsd .sd-who .sd-headline { margin-bottom: 12px; }
.nfsd .sd-who-sub { max-width: 62ch; margin-bottom: 36px; }
.nfsd .sd-who-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.nfsd .sd-who-card {
  background: #fff;
  border: 1px solid #e4e7eb;
  border-left: 4px solid #c8102e;
  padding: 18px 20px;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: #0e3a66;
}

/* ---- HOW THE PARTNERSHIP WORKS ---- */
.nfsd .sd-how { padding: 84px 0; }
.nfsd .sd-how .sd-headline { margin-bottom: 44px; }
.nfsd .sd-how-grid { display: grid; gap: 20px; }
.nfsd .sd-how-step {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.14);
  border-left: 4px solid #c8102e;
  padding: 30px 26px;
}
.nfsd .sd-how-num {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: .14em;
  color: #e81c34;
  text-transform: uppercase;
}
.nfsd .sd-how-step h3 {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 24px;
  text-transform: uppercase;
  color: #fff;
  margin: 10px 0 12px;
}
.nfsd .sd-how-step p { font-size: 15px; color: rgba(255,255,255,.78); margin-bottom: 0; }

/* ---- FAQ ---- */
.nfsd .sd-faq { padding: 84px 0; background: #fff; }
.nfsd .sd-faq .sd-headline { margin-bottom: 40px; }
.nfsd .sd-faq-list { max-width: 860px; }
.nfsd .sd-faq details {
  background: #f6f7f9;
  border: 1px solid #e4e7eb;
  margin-bottom: 12px;
}
.nfsd .sd-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 20px 54px 20px 24px;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: #0e3a66;
  position: relative;
}
.nfsd .sd-faq summary::-webkit-details-marker { display: none; }
.nfsd .sd-faq summary::after {
  content: "+";
  position: absolute;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 26px;
  color: #c8102e;
  font-family: 'Barlow', sans-serif;
  font-weight: 400;
}
.nfsd .sd-faq details[open] summary::after { content: "\2013"; }
.nfsd .sd-faq-a { padding: 0 24px 22px; font-size: 16px; }
.nfsd .sd-faq-a p:last-child { margin-bottom: 0; }

/* ---- FINAL CTA ---- */
.nfsd .sd-cta {
  position: relative;
  overflow: hidden;
  background: #06182f;
  background-image: linear-gradient(160deg, #0e3a66 0%, #06182f 100%);
  color: #fff;
  padding: 96px 0;
  text-align: center;
}
.nfsd .sd-cta .sd-headline { margin: 0 auto 18px; max-width: 22ch; }
.nfsd .sd-cta p { color: rgba(255,255,255,.82); max-width: 56ch; margin: 0 auto 34px; }

/* ---- DESKTOP (768px and up) ---- */
@media (min-width: 768px) {
  .nfsd .sd-why-grid { grid-template-columns: repeat(3, 1fr); }
  .nfsd .sd-compare-head, .nfsd .sd-compare-row { grid-template-columns: 48px 1fr 1fr; }
  .nfsd .sd-edu-inner { grid-template-columns: .9fr 1.1fr; gap: 64px; }
  .nfsd .sd-who-grid { grid-template-columns: repeat(3, 1fr); }
  .nfsd .sd-how-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .nfsd .sd-how-grid { grid-template-columns: repeat(4, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .nfsd * { transition: none !important; }
}