/* Hallmark macrostructure: Long Document on the hub frame (navy hero band, a tagged brief, numbered
   step cards, typed link lists) - nav: hub section nav - footer: Divi - tokens: hub --eftc-* plus
   --rg-ink-muted - contrast: pass (40, 41) for the rules in this file.
   Readiness guides: /fstc/readiness/ and /fstc/public-schools/readiness/, rendered by
   fundedu-readiness-guides.php, which adds body class fundedu-readiness-guide. Only what the hub
   stylesheet (handle fstc-hub-frontend) lacks, plus two scoped overrides Chris ruled on 2026-10-06
   (reduced motion; grid tracks that cannot push the page sideways).
   Spec: docs/superpowers/specs/2026-10-06-readiness-guides-design.md, 3.1. */

:root {
    /* Muted ink: 4.65:1 on white. */
    --rg-ink-muted: #767474;
    /* Running text measure, about 70 characters of 16px Glacial Indifference. */
    --rg-measure: 40rem;
}

/* Status tags. Each carries its word as visible text and its own border style (solid, double,
   dashed), so colour is never the only signal. Text on white: Set navy 11.7:1, the other two
   charcoal. Outer height is the same for all three (20px line plus 2px border, or 16px plus 6px). */
.fstc-tag {
    display: inline-block;
    margin-right: var(--eftc-space-sm);
    padding: 0 var(--eftc-space-sm);
    border: 1px solid var(--eftc-navy);
    border-radius: var(--eftc-radius-sm);
    background: var(--eftc-white);
    color: var(--eftc-charcoal);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.25rem;
    white-space: nowrap;
}
.fstc-tag--set {
    color: var(--eftc-navy);
}
.fstc-tag--proposed {
    border: 3px double var(--eftc-gold);
    line-height: 1rem;
}
.fstc-tag--waiting {
    border-style: dashed;
    border-color: var(--rg-ink-muted);
}

/* The program in brief */
.fstc-brief {
    max-width: var(--rg-measure);
    color: var(--eftc-charcoal);
}
.fstc-brief h2 {
    margin-bottom: var(--eftc-space-md);
}
.fstc-brief h3 {
    margin: var(--eftc-space-xl) 0 var(--eftc-space-sm);
    font-size: 1.125rem;
}
.fstc-brief-intro {
    margin-bottom: var(--eftc-space-sm);
}
.fstc-brief-legend,
.fstc-brief-list {
    list-style: none;
    margin: 0 0 var(--eftc-space-md);
    padding: 0;
}
.fstc-brief-legend li,
.fstc-brief-list li {
    padding: var(--eftc-space-sm) 0;
    line-height: 1.6;
}
.fstc-brief-list li + li {
    border-top: 1px solid var(--eftc-gray-200);
}

/* The dates line carries no tag; it reads as a plain bold note. */
.fstc-brief-list li.fstc-brief-dates {
    font-weight: 700;
}

/* How the income limit works */
.fstc-brief-table {
    width: 100%;
    max-width: 28rem;
    margin: var(--eftc-space-sm) 0 var(--eftc-space-md);
    border-collapse: collapse;
    background: var(--eftc-white);
}
.fstc-brief-table caption {
    text-align: left;
    font-weight: 700;
    padding-bottom: var(--eftc-space-xs);
}
.fstc-brief-table th,
.fstc-brief-table td {
    padding: var(--eftc-space-xs) var(--eftc-space-sm);
    border: 1px solid var(--eftc-gray-300);
    text-align: left;
}
.fstc-brief-table td {
    font-variant-numeric: tabular-nums;
}
.fstc-brief-estimate {
    margin: var(--eftc-space-md) 0;
}
.fstc-brief-cta a {
    font-weight: 700;
    color: var(--eftc-navy);
}
.fstc-brief-cta a:hover,
.fstc-brief-cta a:focus {
    color: var(--eftc-navy-hover);
}

/* Steps: the number is part of each heading's text, so no counter is added here. */
.fstc-rg-step .eftc-card__title {
    color: var(--eftc-navy);
}
.fstc-rg-step .eftc-card__title,
.fstc-rg-step ul,
.fstc-rg-lede {
    max-width: var(--rg-measure);
}
.fstc-rg-step li + li {
    margin-top: var(--eftc-space-xs);
}

/* Link lists (What's Next, the other guide, resources): a heading-weight title over one line, no
   cards, icons or buttons. The advocacy link is shown by eftc-newsletter.js with display:flex. */
.fstc-rg-links {
    display: grid;
    max-width: var(--rg-measure);
}
.fstc-rg-link {
    display: flex;
    flex-direction: column;
    gap: var(--eftc-space-xs);
    padding: var(--eftc-space-md) 0;
    border-top: 1px solid var(--eftc-gray-300);
    color: var(--eftc-charcoal);
    text-decoration: none;
}
.fstc-rg-link:last-child {
    border-bottom: 1px solid var(--eftc-gray-300);
}
.fstc-rg-link__title {
    font-family: var(--eftc-font-heading);
    font-weight: 700;
    color: var(--eftc-navy);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.fstc-rg-link__desc {
    color: var(--rg-ink-muted);
}
.fstc-rg-link:hover .fstc-rg-link__title,
.fstc-rg-link:focus .fstc-rg-link__title {
    color: var(--eftc-navy-hover);
}

/* The assessment button sits in a narrow column at phone widths; trimmed side padding keeps its
   label on one line at 320. */
.fundedu-readiness-guide .eftc-path-choice .eftc-btn {
    padding-left: var(--eftc-space-md);
    padding-right: var(--eftc-space-md);
}

/* White grounds throughout; a hairline marks where one section ends and the next begins. */
.fundedu-readiness-guide .eftc-page > .eftc-section--white + .eftc-section--white {
    border-top: 1px solid var(--eftc-gray-200);
}

/* Grid tracks that can shrink below their content, so nothing pushes the page sideways (ruling 2b;
   the hub's plain 1fr tracks overflowed at 320 and 1024 after submit). */
.fundedu-readiness-guide .eftc-grid--2col,
.fundedu-readiness-guide .eftc-grid--3col {
    grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 768px) {
    .fundedu-readiness-guide .eftc-grid--2col,
    .fundedu-readiness-guide .eftc-grid--3col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (min-width: 1024px) {
    .fundedu-readiness-guide .eftc-grid--3col {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Motion. The link colour shift runs only for visitors who have not asked for less motion. */
@media (prefers-reduced-motion: no-preference) {
    .fstc-brief-cta a,
    .fstc-rg-link__title {
        transition: color var(--eftc-transition-fast);
    }
}
/* Ruling 2a: for visitors who asked for less motion, the hub's fade-in, transitions and hover lift
   are switched off on these two pages. */
@media (prefers-reduced-motion: reduce) {
    .fundedu-readiness-guide .eftc-fade-in {
        animation: none;
        opacity: 1;
        transform: none;
    }
    .fundedu-readiness-guide .eftc-card,
    .fundedu-readiness-guide .eftc-btn {
        transition: none;
    }
    .fundedu-readiness-guide .eftc-card:hover,
    .fundedu-readiness-guide .eftc-btn:hover,
    .fundedu-readiness-guide .eftc-btn--navy:hover,
    .fundedu-readiness-guide .eftc-btn:active {
        transform: none;
    }
}

/* Theme frame on the plugin-rendered PUBLIC guide (page 4595 has no builder content, so Divi wraps it in its
   default page template: a second h1 with the page title, and a sidebar column with a divider that squeezes the
   guide into the left half). Measured live after run 3, 2026-10-06. The same block as private-schools.css (live
   on 4566), scoped to this page; !important only here, because it overrides the theme's own frame rules. The
   private guide (3171) is a builder page and needs none of it. */
body.fundedu-readiness-guide--public { overflow-x: clip; }
body.fundedu-readiness-guide--public .entry-title.main_title,
body.fundedu-readiness-guide--public .et_post_meta_wrapper > .entry-title { display: none !important; }
body.fundedu-readiness-guide--public #main-content .container { width: 100% !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
body.fundedu-readiness-guide--public #content-area,
body.fundedu-readiness-guide--public #left-area { width: 100% !important; max-width: none !important; padding: 0 !important; margin: 0 !important; float: none !important; }
body.fundedu-readiness-guide--public #sidebar { display: none !important; }
body.fundedu-readiness-guide--public #main-content .container:before { display: none !important; }
body.fundedu-readiness-guide--public article.page,
body.fundedu-readiness-guide--public .entry-content { margin: 0 !important; padding: 0 !important; }
