/* State Programs (plan C4). Scoped to body.fe-sp; colours from fundedu-v2.css tokens where they exist. */
body.fe-sp { --sp-state: var(--fe-navy); --sp-federal: #B78A00; --sp-none: #B5524C; --sp-unknown: #7E8794; --sp-stroke: var(--fe-white); }
body.fe-sp .sp-page, body.fe-sp .sp-map, body.fe-sp .sp-list { max-width: 1080px; margin: 0 auto; padding: 0 16px; }
body.fe-sp .sp-page { max-width: 760px; }
/* Body ink, size and measure (G2 slop fix 2). .sp-standard keeps its own smaller, muted type below (fix 3). */
body.fe-sp .sp-page, body.fe-sp .sp-standard { color: var(--fe-charcoal); font-size: 1.0625rem; font-weight: 400; line-height: 1.6; }
body.fe-sp .sp-page p, body.fe-sp .sp-page li { max-width: 66ch; }
/* Links (fix 1) with hover and active states (fix 11). The pills stay un-underlined; they carry a border. */
body.fe-sp .sp-page a, body.fe-sp .sp-list a, body.fe-sp .sp-standard a, body.fe-sp .sp-btn { color: var(--fe-navy); text-decoration: underline; text-underline-offset: .15em; }
body.fe-sp .sp-nav a { color: var(--fe-navy); }
body.fe-sp .sp-page a:hover, body.fe-sp .sp-list a:hover, body.fe-sp .sp-standard a:hover { color: var(--fe-navy-dark); text-decoration-thickness: 2px; }
body.fe-sp .sp-page a:active, body.fe-sp .sp-list a:active, body.fe-sp .sp-standard a:active { color: var(--fe-charcoal); text-decoration-thickness: 2px; }
/* Headings take the token navy, not the customizer heading colour (fix 12). */
body.fe-sp .sp-page h1, body.fe-sp .sp-page h2, body.fe-sp .sp-page h3, body.fe-sp .sp-list h3 { color: var(--fe-navy); }
/* Divi paddings reset onto the 4px ramp (fix 13). Divi's list rule carries #left-area, so the list rules do too. */
body.fe-sp .sp-page p, body.fe-sp .sp-page h1, body.fe-sp .sp-page h2, body.fe-sp .sp-page h3 { padding-bottom: 0; }
/* Lists: Divi's 1em indent, 26px lines and inside markers replaced (G2 round 2, item 5); id-carrying to beat Divi (1,0,1). */
body.fe-sp #left-area .sp-page ul, body.fe-sp #left-area .sp-page ol { padding: 0 0 0 16px; margin: 0 0 16px; line-height: inherit; list-style-position: outside; }
body.fe-sp .sp-page p { margin: 0 0 16px; }
body.fe-sp .sp-page h2 { margin: 32px 0 8px; }
/* Heading steps the padding reset took away (round 2, items 2 to 4). The h1 margin reaches the Ohio pages, whose h1 sits
   directly in .sp-page; .sp-head h1 below (equal specificity, later) keeps the state pages' h1 at 0 inside the grid.
   The :not() is load-bearing: without it this (0,2,2) rule beats .sp-card__name (0,2,1) and moves the card names. */
body.fe-sp .sp-page h1, body.fe-sp .sp-page h2 { line-height: 1.1; }
body.fe-sp .sp-page h1 { margin: 0 0 16px; }
body.fe-sp .sp-page h3:not(.sp-card__name) { margin: 24px 0 8px; }
body.fe-sp .sp-page td, body.fe-sp .sp-page th { padding: 8px; }
/* Table ink and margin over Divi's #555 header and 15px margin (round 2, item 10). */
body.fe-sp .sp-page th { color: var(--fe-charcoal); }
body.fe-sp .sp-page table { margin: 0 0 16px; }
body.fe-sp #left-area .sp-legend, body.fe-sp #left-area .sp-list ul { list-style: none; padding: 0; line-height: inherit; }
body.fe-sp #left-area .sp-legend li, body.fe-sp #left-area .sp-list li { list-style: none; }
/* Quotation marks restored over Divi's q reset: the quoted words are a source's, not FundEDU's (fix 15). */
body.fe-sp .sp-page q { quotes: "\201C" "\201D" "\2018" "\2019"; }
body.fe-sp .sp-page q::before { content: open-quote; }
body.fe-sp .sp-page q::after { content: close-quote; }
body.fe-sp .sp-head { display: grid; grid-template-columns: 72px 1fr; gap: 8px 16px; align-items: center; }
body.fe-sp .sp-head h1 { margin: 0; }
body.fe-sp .sp-summary, body.fe-sp .sp-checked { grid-column: 1 / -1; }
body.fe-sp .sp-checked { font-size: .875rem; color: var(--fe-ink-muted); }
/* The source-list date stays on one line rather than breaking at its hyphen (round 2, item 15). */
body.fe-sp .sp-page li .sp-checked, body.fe-sp .sp-page .sp-card__attr, body.fe-sp .sp-page .sp-notice__date { white-space: nowrap; }
body.fe-sp .sp-badge { display: inline-block; padding: 4px 12px; border-radius: 8px; font-size: .875rem; border: 1px solid currentColor; }
body.fe-sp .sp-badge--state_programs { color: var(--fe-navy); }
body.fe-sp .sp-badge--federal_only { color: var(--fe-navy); }
body.fe-sp .sp-badge--none { color: var(--fe-navy); }
body.fe-sp .sp-badge--federal { color: var(--fe-navy); }
body.fe-sp .sp-card { border: 1px solid var(--fe-hairline); border-radius: 8px; padding: 16px; margin: 0 0 16px; }
body.fe-sp #left-area .sp-page .sp-card > :last-child { margin-bottom: 0; }
body.fe-sp .sp-page .sp-card__type { font-size: .875rem; font-weight: 600; margin: 0; }
body.fe-sp .sp-card__name { margin: 4px 0 8px; font-style: normal; }
body.fe-sp .sp-page cite { font-style: normal; }
/* No stripe, no fill (fix 6); the renderer's bold "Status:" lead carries the emphasis. */
body.fe-sp .sp-page .sp-notice, body.fe-sp .sp-notice { border-left: 0; background: none; padding: 0; margin: 8px 0; }
body.fe-sp .sp-section { margin: 40px 0 0; }
/* The contact link stands apart from the list above it; the list's 16px collapses into this (round 2, item 6). */
body.fe-sp .sp-page .sp-contact { margin-top: 32px; }
body.fe-sp .sp-section--sources, body.fe-sp .sp-section--rules { border-top: 1px solid var(--fe-hairline); padding-top: 24px; }
/* Position-based hairline, so the hand-authored Ohio bodies' bare .sp-section blocks get it too (round 2, item 8). */
body.fe-sp .sp-page .sp-section + .sp-section { border-top: 1px solid var(--fe-hairline); padding-top: 24px; }
/* The divider is the section device (Chris, SP-28): the heading under it starts at the padding, 24px below the line. */
body.fe-sp .sp-page .sp-section + .sp-section > h2:first-child { margin-top: 0; }
body.fe-sp .sp-standard { font-size: .875rem; color: var(--fe-ink-muted); margin: 32px auto; max-width: 760px; padding: 0 16px; }
/* Measure cap on the disclaimer, its left edge kept on the 760px page column rather than re-centred (fix 2). */
body.fe-sp .sp-standard { box-sizing: border-box; max-width: calc(66ch + 32px); margin-left: max(0px, calc((100% - 760px) / 2)); margin-right: auto; }
body.fe-sp .sp-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
body.fe-sp .sp-nav a { padding: 8px 12px; border-radius: 8px; border: 1px solid var(--fe-hairline); text-decoration: none; }
body.fe-sp .sp-nav a:not([aria-current]):hover { border-color: var(--fe-navy); color: var(--fe-navy-dark); }
body.fe-sp .sp-nav a:not([aria-current]):active { background: var(--fe-navy); color: var(--fe-white); border-color: var(--fe-navy); }
body.fe-sp .sp-nav a[aria-current="page"] { background: var(--sp-state); color: var(--fe-white); border-color: var(--sp-state); }
body.fe-sp [hidden] { display: none !important; }
body.fe-sp .sp-map { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; position: relative; }
body.fe-sp .sp-map:has(.sp-map__dock[hidden]) { grid-template-columns: minmax(0, 1fr); }
body.fe-sp .sp-map { margin-block: 2rem 1.5rem; }
body.fe-sp .sp-list { margin-top: 2rem; }
body.fe-sp .sp-map__svg { width: 100%; height: auto; }
body.fe-sp .sp-map__shape { stroke: var(--sp-stroke); stroke-width: 1; cursor: pointer; }
body.fe-sp .sp-map__link--state_programs .sp-map__shape { fill: var(--sp-state); }
body.fe-sp .sp-map__link--federal_only .sp-map__shape { fill: var(--sp-federal); }
body.fe-sp .sp-map__link--none .sp-map__shape { fill: var(--sp-none); }
body.fe-sp .sp-map__link--unknown .sp-map__shape { fill: var(--sp-unknown); }
body.fe-sp .sp-map__link:hover .sp-map__shape { stroke: var(--fe-charcoal); stroke-width: 3; }
/* Keyboard focus only (fix 7). The v2 !important outline still draws; the white stroke is what clears 3:1 on the fills. */
body.fe-sp .sp-map__link:focus-visible { outline: none; }
body.fe-sp .sp-map__link:focus-visible .sp-map__shape { stroke: var(--fe-white); stroke-width: 3; }
/* Pressed state (round 2, item 12). No stroke transition: the stroke is the focus indicator. */
body.fe-sp .sp-map__link:active .sp-map__shape { stroke: var(--fe-charcoal); stroke-width: 3; }
body.fe-sp .sp-map__leader { stroke: var(--fe-ink-muted); stroke-width: 1; }
body.fe-sp .sp-map__dc-label { font-family: var(--fe-font-body); font-size: 14px; fill: var(--fe-charcoal); }
body.fe-sp .sp-map__card { position: absolute; left: 16px; top: 8px; background: var(--fe-white); border: 1px solid var(--fe-hairline); border-radius: 8px; padding: 8px 12px; pointer-events: none; }
body.fe-sp .sp-map__dock { border: 1px solid var(--fe-hairline); border-radius: 8px; padding: 16px; }
/* The docked panel (fix 8), after the link rule so .sp-btn is a button, not an underlined link. */
body.fe-sp .sp-map__close { font-family: var(--fe-font-body); font-size: 1rem; color: var(--fe-navy); background: none; border: 1px solid var(--fe-hairline); border-radius: 8px; padding: 4px 12px; cursor: pointer; }
body.fe-sp .sp-map__close:hover { border-color: var(--fe-navy); color: var(--fe-navy-dark); }
body.fe-sp .sp-map__close:active { background: var(--fe-navy); color: var(--fe-white); border-color: var(--fe-navy); }
body.fe-sp .sp-panel__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
/* A long name (Pennsylvania) never breaks mid-word in the narrow panel; the badge wraps under it instead. */
body.fe-sp .sp-panel__head h3 { overflow-wrap: normal; word-break: normal; hyphens: manual; margin: 0; }
body.fe-sp .sp-btn { display: inline-block; background: var(--fe-gold); color: var(--fe-charcoal); font-weight: 700; padding: 12px 24px; border-radius: 8px; text-decoration: none; }
body.fe-sp .sp-btn:hover, body.fe-sp .sp-btn:active { background: var(--fe-gold-hover); color: var(--fe-charcoal); }
body.fe-sp .sp-legend { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 16px; list-style: none; padding: 0; }
/* One muted grey for the legend, not Divi's #666 body (round 2, item 11). */
body.fe-sp .sp-legend li { font-size: .875rem; color: var(--fe-ink-muted); }
body.fe-sp .sp-legend__swatch { display: inline-block; width: 16px; height: 16px; border-radius: 8px; margin-right: 8px; vertical-align: -2px; }
body.fe-sp .sp-legend__swatch.sp-map__link--state_programs { background: var(--sp-state); }
body.fe-sp .sp-legend__swatch.sp-map__link--federal_only { background: var(--sp-federal); }
body.fe-sp .sp-legend__swatch.sp-map__link--none { background: var(--sp-none); }
body.fe-sp .sp-list ul { columns: 3 220px; list-style: none; padding: 0; }
/* Group headings step off the list above; the first one is the section's first child (round 2, item 7). */
body.fe-sp .sp-list h3 { padding-bottom: 0; margin: 24px 0 8px; }
body.fe-sp .sp-list h3:first-child { margin-top: 0; }
body.fe-sp .sp-list li { font-size: 1rem; color: var(--fe-charcoal); }
body.fe-sp .sp-list small { font-size: .875rem; color: var(--fe-ink-muted); }
/* The booking CTA, copied from the PA pages (implementation/pa-programs/pages/parent.html), rescoped (plan D1). */
body.fe-sp .pa-cta { margin: 32px 0 16px; text-align: center; }
body.fe-sp .eftc-btn--primary, body.fe-sp .sp-page a.eftc-btn--primary { display: inline-block; background: var(--fe-gold); color: var(--fe-charcoal); font-weight: 800; font-size: 18px; padding: 16px 32px; border-radius: 8px; text-decoration: none; }
body.fe-sp .eftc-btn--primary:hover, body.fe-sp .eftc-btn--primary:active, body.fe-sp .sp-page a.eftc-btn--primary:hover, body.fe-sp .sp-page a.eftc-btn--primary:active { background: var(--fe-gold-hover); color: var(--fe-charcoal); }
/* Named-property transitions only; v2 sets transition: none on :focus-visible. */
@media (prefers-reduced-motion: no-preference) {
  body.fe-sp .sp-page a, body.fe-sp .sp-list a, body.fe-sp .sp-standard a { transition: color .15s ease, text-decoration-color .15s ease; }
  body.fe-sp .sp-nav a, body.fe-sp .sp-map__close { transition: color .15s ease, background-color .15s ease, border-color .15s ease; }
  body.fe-sp .eftc-btn--primary, body.fe-sp .sp-page a.eftc-btn--primary, body.fe-sp .sp-btn { transition: background-color .15s ease; }
}
@media (max-width: 980px) {
  /* Divi's .container is 80% wide; the page gutter is 16px on the container and none on the blocks inside (fix 19). */
  body.fe-sp #main-content .container { width: 100%; box-sizing: border-box; padding-left: 16px; padding-right: 16px; }
  body.fe-sp .sp-page, body.fe-sp .sp-map, body.fe-sp .sp-list, body.fe-sp .sp-standard { padding-left: 0; padding-right: 0; }
}
@media (max-width: 899px) {
  body.fe-sp .sp-map { grid-template-columns: 1fr; }
  body.fe-sp .sp-map__art, body.fe-sp .sp-map__card { display: none; }
}
@media (max-width: 599px) {
  /* The page head stacks: flag above the h1 (fix 10). */
  body.fe-sp .sp-head { grid-template-columns: 1fr; gap: 8px 16px; }
  body.fe-sp .sp-head .sp-flag { width: 48px; height: 32px; }
  /* Tables stack, one labelled cell per line (fix 4; labels from data-label). */
  body.fe-sp .sp-page table, body.fe-sp .sp-page tbody { display: block; }
  body.fe-sp .sp-page table thead { position: absolute; left: -9999px; }
  body.fe-sp .sp-page table td { display: block; padding: 4px 0; }
  body.fe-sp .sp-page table td::before { content: attr(data-label) ": "; font-weight: 700; }
  body.fe-sp .sp-page table tr { display: block; border-top: 1px solid var(--fe-hairline); padding: 8px 0; }
  /* The tr hairline is the only rule; Divi's cell and table frames come off (round 2, item 10). */
  body.fe-sp .sp-page table td { border-top: 0; }
  body.fe-sp .sp-page table { border: 0; }
}
/* SP-42: the solicitor and counsel registry search, set apart in the fundraising section. */
body.fe-sp .sp-registry { margin: 24px 0; padding: 16px 20px; border: 1px solid var(--fe-hairline); border-left: 5px solid var(--fe-gold); border-radius: 8px; background: var(--fe-white); }
body.fe-sp .sp-registry__label { margin: 0 0 8px; font-weight: 700; color: var(--fe-navy); }
body.fe-sp .sp-registry__link { margin: 0; }
body.fe-sp .sp-registry__link a { font-weight: 700; color: var(--fe-navy); }
body.fe-sp .sp-registry__link + .sp-registry__link { margin-top: 6px; }
