/* ============================================================
   Public Editorial
   Design system for the public-facing marketing site.

   Layers:
     1. Tokens
     2. Shell (header + footer) — applies to every page on
        layouts/public, so the brand frame stays consistent.
     3. Marketing pages — scoped to body.public-site so the
        admissions wizard, document portal and credential
        verifier keep their own content styling.
   ============================================================ */

/* ----------------------------------------
   1. Tokens
   ---------------------------------------- */
:root {
    /* Brand triad */
    --ed-ink: #303CB5;
    --ed-paper: #F5F6FA;
    --ed-gold: #C79A3B;

    /* Derived surfaces. Each declares a flat sRGB fallback first,
       then the perceptual color-mix for browsers that support it. */
    --ed-ink-deep: #273194;
    --ed-ink-deep: color-mix(in oklab, var(--ed-ink) 82%, black);

    --ed-ink-hover: #29339A;
    --ed-ink-hover: color-mix(in oklab, var(--ed-ink) 85%, black);

    --ed-gold-hover: #CFA958;
    --ed-gold-hover: color-mix(in oklab, var(--ed-gold) 85%, white);

    --ed-header-bg: #F6F7FA;
    --ed-header-bg: color-mix(in oklab, var(--ed-paper) 92%, white);

    /* Text on light surfaces */
    --ed-muted: #7276CD;
    --ed-muted: color-mix(in oklab, var(--ed-ink) 68%, white);

    --ed-muted-soft: #8D94D6;
    --ed-muted-soft: color-mix(in oklab, var(--ed-ink) 55%, white);

    --ed-nav-muted: #6770C8;
    --ed-nav-muted: color-mix(in oklab, var(--ed-ink) 72%, var(--ed-paper));

    --ed-kicker-muted: #7F86D1;
    --ed-kicker-muted: color-mix(in oklab, var(--ed-ink) 60%, var(--ed-paper));

    /* Text on ink surfaces */
    --ed-on-ink: #CACDEB;
    --ed-on-ink: color-mix(in oklab, var(--ed-paper) 78%, var(--ed-ink));

    --ed-on-ink-soft: #C4C8E9;
    --ed-on-ink-soft: color-mix(in oklab, var(--ed-paper) 75%, var(--ed-ink));

    --ed-on-footer: #CED1EC;
    --ed-on-footer: color-mix(in oklab, var(--ed-paper) 80%, var(--ed-ink));

    --ed-on-footer-soft: #9CA2DB;
    --ed-on-footer-soft: color-mix(in oklab, var(--ed-paper) 55%, var(--ed-ink));

    /* Hairlines — plain alpha, no mixing needed */
    --ed-line: rgba(48, 60, 181, 0.12);
    --ed-line-soft: rgba(48, 60, 181, 0.10);
    --ed-line-mid: rgba(48, 60, 181, 0.16);
    --ed-line-strong: rgba(48, 60, 181, 0.25);
    --ed-line-heavy: rgba(48, 60, 181, 0.30);
    --ed-line-light: rgba(245, 246, 250, 0.12);
    --ed-line-light-strong: rgba(245, 246, 250, 0.40);

    /* Type */
    --ed-serif: 'Newsreader', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
    --ed-sans: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --ed-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* Layout */
    --ed-shell: 1200px;
    --ed-gutter: 32px;
    --ed-header-height: 76px;
    --ed-section-y: 96px;
    --ed-radius: 8px;
    --ed-radius-sm: 6px;

    --ed-lift: 0 16px 32px -16px rgba(48, 60, 181, 0.35);
}

@keyframes ed-rise {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* ----------------------------------------
   2. Shell — header
   ---------------------------------------- */
.ed-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: var(--ed-header-bg);
    border-bottom: 1px solid var(--ed-line-mid);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    transition: box-shadow 0.25s ease;
}

.ed-header.scrolled {
    box-shadow: 0 8px 24px -18px rgba(48, 60, 181, 0.55);
}

.ed-header-inner {
    max-width: var(--ed-shell);
    margin: 0 auto;
    padding: 0 var(--ed-gutter);
    min-height: var(--ed-header-height);
    display: flex;
    align-items: center;
    gap: var(--ed-gutter);
}

.ed-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
}

.ed-brand:hover {
    text-decoration: none;
}

/* The institution logo is a lockup of unknown proportions, so it keeps its
   own aspect ratio and is bounded rather than cropped into a square tile. */
.ed-brand-logo {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

.ed-brand-logo img {
    display: block;
    height: 42px;
    width: auto;
    max-width: 140px;
    object-fit: contain;
    /* Logos are often supplied on a solid white plate rather than with a
       transparent background; multiply drops it into the header tint. */
    mix-blend-mode: multiply;
}

/* A hairline keeps the logo's own wordmark from colliding with ours. */
.ed-brand-text {
    min-width: 0;
    padding-left: 14px;
    border-left: 1px solid var(--ed-line-mid);
}

.ed-brand-name {
    display: block;
    font-family: var(--ed-serif);
    font-size: 21px;
    font-weight: 600;
    line-height: 1.1;
    color: var(--ed-ink);
}

.ed-brand-kicker {
    display: block;
    font-family: var(--ed-mono);
    font-size: 9.5px;
    letter-spacing: 0.06em;
    line-height: 1.3;
    max-width: 270px;
    color: var(--ed-kicker-muted);
    margin-top: 2px;
}

.ed-nav {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 28px;
    font-family: var(--ed-sans);
    font-size: 14px;
    font-weight: 500;
}

.ed-nav-link {
    color: var(--ed-nav-muted);
    padding: 4px 0;
    border-bottom: 2px solid transparent;
    text-decoration: none;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.ed-nav-link:hover,
.ed-nav-link:focus-visible {
    color: var(--ed-ink);
    text-decoration: none;
}

.ed-nav-link.is-active {
    color: var(--ed-ink);
    border-bottom-color: var(--ed-gold);
}

/* The nav is a Bootstrap collapse target so the mobile toggle works without
   extra JS. On desktop it must stay visible, which means beating
   `.collapse:not(.show)`. */
@media (min-width: 992px) {

    .ed-nav.collapse:not(.show),
    .ed-nav.collapsing {
        display: flex;
        height: auto !important;
        transition: none;
    }
}

.ed-nav-toggle {
    display: none;
    margin-left: auto;
    width: 44px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--ed-line-heavy);
    border-radius: var(--ed-radius);
    color: var(--ed-ink);
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-direction: column;
}

.ed-nav-toggle-bar {
    display: block;
    width: 18px;
    height: 1.5px;
    background: currentColor;
}

/* ----------------------------------------
   2b. Buttons — shared by the shell and pages
   ---------------------------------------- */
.ed-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: var(--ed-sans);
    border-radius: var(--ed-radius);
    border: 1px solid transparent;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: background-color 0.18s ease, color 0.18s ease,
        border-color 0.18s ease, transform 0.18s ease;
}

.ed-btn:hover {
    text-decoration: none;
}

.ed-btn:disabled,
.ed-btn.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}

.ed-btn-solid {
    background: var(--ed-ink);
    color: var(--ed-paper);
    padding: 11px 22px;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.ed-btn-solid:hover,
.ed-btn-solid:focus-visible {
    background: var(--ed-ink-hover);
    color: var(--ed-paper);
}

.ed-btn-ghost {
    background: transparent;
    color: var(--ed-ink);
    border-color: var(--ed-line-heavy);
    padding: 10px 18px;
    font-size: 13.5px;
    font-weight: 600;
}

.ed-btn-ghost:hover,
.ed-btn-ghost:focus-visible {
    border-color: var(--ed-ink);
    color: var(--ed-ink);
}

.ed-btn-gold {
    background: var(--ed-gold);
    color: var(--ed-ink);
    padding: 16px 34px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.ed-btn-gold:hover,
.ed-btn-gold:focus-visible {
    background: var(--ed-gold-hover);
    color: var(--ed-ink);
}

.ed-btn-outline-light {
    background: transparent;
    color: var(--ed-paper);
    border-color: var(--ed-line-light-strong);
    padding: 16px 34px;
    font-size: 15px;
    font-weight: 600;
}

.ed-btn-outline-light:hover,
.ed-btn-outline-light:focus-visible {
    border-color: var(--ed-paper);
    color: var(--ed-paper);
}

.ed-btn-outline-ink {
    background: transparent;
    color: var(--ed-ink);
    border-color: var(--ed-line-heavy);
    padding: 15px 32px;
    font-size: 15px;
    font-weight: 600;
}

.ed-btn-outline-ink:hover,
.ed-btn-outline-ink:focus-visible {
    border-color: var(--ed-ink);
    color: var(--ed-ink);
}

.ed-btn-danger {
    background: transparent;
    color: #c5332f;
    border-color: rgba(197, 51, 47, 0.45);
    padding: 11px 22px;
    font-size: 13.5px;
    font-weight: 600;
}

.ed-btn-danger:hover,
.ed-btn-danger:focus-visible {
    background: #c5332f;
    border-color: #c5332f;
    color: #fff;
}

.ed-btn-block {
    display: flex;
    width: 100%;
}

.ed-btn-sm {
    padding: 10px 18px;
    font-size: 13.5px;
    font-weight: 600;
}

/* ----------------------------------------
   2c. Shell — footer
   ---------------------------------------- */
.ed-footer {
    background: var(--ed-ink-deep);
    color: var(--ed-on-footer);
    font-family: var(--ed-sans);
}

.ed-footer-grid {
    max-width: var(--ed-shell);
    margin: 0 auto;
    padding: 72px var(--ed-gutter) 0;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1.2fr 1fr;
    gap: 48px;
}

.ed-footer-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.ed-footer-mark {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    background: var(--ed-gold);
    color: var(--ed-ink);
    display: grid;
    place-items: center;
    font-family: var(--ed-serif);
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    border-radius: 2px;
}

.ed-footer-name {
    font-family: var(--ed-serif);
    font-size: 20px;
    font-weight: 600;
    color: var(--ed-paper);
}

.ed-footer-blurb {
    font-size: 13.5px;
    line-height: 1.7;
    margin: 0;
    max-width: 34ch;
    color: var(--ed-on-footer);
}

.ed-footer-title {
    font-family: var(--ed-mono);
    font-size: 11px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ed-gold);
    margin-bottom: 20px;
}

.ed-footer-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ed-footer-list a,
.ed-footer a {
    color: var(--ed-on-footer);
    text-decoration: none;
    transition: color 0.15s ease;
}

.ed-footer-list a:hover,
.ed-footer a:hover,
.ed-footer a:focus-visible {
    color: var(--ed-paper);
    text-decoration: none;
}

.ed-footer-hours {
    font-size: 14px;
    line-height: 1.6;
}

.ed-footer-bottom {
    max-width: var(--ed-shell);
    margin: 48px auto 0;
    padding: 22px var(--ed-gutter);
    border-top: 1px solid var(--ed-line-light);
    display: flex;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 12.5px;
    color: var(--ed-on-footer-soft);
}

.ed-footer-tag {
    font-family: var(--ed-mono);
    letter-spacing: 0.06em;
    font-size: 11px;
    line-height: 1.4;
}

/* ----------------------------------------
   2d. Shell hardening
   heritage-clay.css paints every anchor with its own primary via
   `body.heritage-clay a` — specificity (0,1,2) — on the admissions flow.
   These rules restate the shell palette with a higher class count so the
   brand frame keeps its own colours on those pages.
   ---------------------------------------- */
.ed-header .ed-nav-link {
    color: var(--ed-nav-muted);
}

.ed-header .ed-nav-link:hover,
.ed-header .ed-nav-link:focus-visible,
.ed-header .ed-nav-link.is-active {
    color: var(--ed-ink);
}

.ed-header .ed-btn-solid {
    color: var(--ed-paper);
}

.ed-header .ed-btn-ghost {
    color: var(--ed-ink);
}

.ed-footer .ed-footer-grid a,
.ed-footer .ed-footer-bottom a {
    color: var(--ed-on-footer);
}

.ed-footer .ed-footer-grid a:hover,
.ed-footer .ed-footer-grid a:focus-visible,
.ed-footer .ed-footer-bottom a:hover,
.ed-footer .ed-footer-bottom a:focus-visible {
    color: var(--ed-paper);
}

/* ----------------------------------------
   3. Marketing pages — base
   ---------------------------------------- */
body.public-site {
    font-family: var(--ed-sans);
    font-size: 16px;
    line-height: 1.65;
    letter-spacing: 0;
    color: var(--ed-ink);
    background: var(--ed-paper);
    -webkit-font-smoothing: antialiased;
}

body.public-site ::selection {
    background: rgba(199, 154, 59, 0.4);
}

/* Element defaults are wrapped in :where() so they carry no specificity of
   their own. Component classes below (.ed-hero-title, .ed-btn-*, …) must be
   able to set their own colour without needing !important. */
:where(body.public-site) h1,
:where(body.public-site) h2,
:where(body.public-site) h3,
:where(body.public-site) h4,
:where(body.public-site) h5,
:where(body.public-site) h6 {
    font-family: var(--ed-serif);
    color: var(--ed-ink);
    letter-spacing: -0.01em;
    line-height: 1.15;
}

:where(body.public-site) p {
    color: var(--ed-muted);
}

:where(body.public-site) a {
    color: var(--ed-ink);
}

:where(body.public-site) a:hover {
    color: var(--ed-gold);
}

body.public-site :focus-visible {
    outline: 2px solid var(--ed-gold);
    outline-offset: 3px;
}

.ed-shell {
    max-width: var(--ed-shell);
    margin: 0 auto;
    padding: 0 var(--ed-gutter);
}

.ed-shell-narrow {
    max-width: 860px;
    margin: 0 auto;
    padding: 0 var(--ed-gutter);
}

.ed-section {
    padding: var(--ed-section-y) 0;
}

.ed-section--white {
    background: #fff;
}

.ed-section--paper {
    background: var(--ed-paper);
    border-top: 1px solid var(--ed-line-soft);
}

.ed-section--ink {
    background: var(--ed-ink);
    color: var(--ed-paper);
}

.ed-section--gold {
    background: var(--ed-gold);
}

/* The closing CTA sits on the ink panel inside the gold section. Keep the
   panel's copy and controls legible against that blue surface. */
.ed-section--gold .ed-cta .ed-kicker,
.ed-section--gold .ed-cta .ed-h2,
.ed-section--gold .ed-cta .ed-prose {
    color: var(--ed-paper);
}

.ed-section--gold .ed-cta .ed-btn-solid {
    background: var(--ed-paper);
    border-color: var(--ed-paper);
    color: var(--ed-ink);
}

.ed-section--gold .ed-cta .ed-btn-solid:hover,
.ed-section--gold .ed-cta .ed-btn-solid:focus-visible {
    background: #fff;
    border-color: #fff;
    color: var(--ed-ink);
}

.ed-section--gold .ed-cta .ed-btn-outline-ink {
    border-color: var(--ed-line-light-strong);
    color: var(--ed-paper);
}

.ed-section--gold .ed-cta .ed-btn-outline-ink:hover,
.ed-section--gold .ed-cta .ed-btn-outline-ink:focus-visible {
    border-color: var(--ed-paper);
    color: var(--ed-paper);
}

.ed-section--tight {
    padding: 56px 0;
}

.ed-kicker {
    font-family: var(--ed-mono);
    font-size: 11.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ed-gold);
    margin-bottom: 16px;
}

.ed-h2 {
    font-family: var(--ed-serif);
    font-weight: 500;
    font-size: 42px;
    line-height: 1.1;
    margin: 0;
    color: var(--ed-ink);
}

.ed-h2--spaced {
    margin-bottom: 48px;
}

.ed-h3 {
    font-family: var(--ed-serif);
    font-weight: 600;
    font-size: 26px;
    line-height: 1.2;
    margin: 0;
    color: var(--ed-ink);
}

.ed-lead {
    font-size: 17px;
    line-height: 1.65;
    color: var(--ed-muted);
}

.ed-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 48px;
    flex-wrap: wrap;
}

.ed-link-arrow {
    font-weight: 600;
    font-size: 14.5px;
    border-bottom: 1px solid var(--ed-gold);
    padding-bottom: 3px;
    text-decoration: none;
    white-space: nowrap;
}

.ed-link-arrow:hover {
    text-decoration: none;
}

.ed-link-arrow--light {
    color: var(--ed-paper);
}

.ed-link-arrow--light:hover {
    color: var(--ed-gold);
}

/* ----------------------------------------
   3a. Hero
   ---------------------------------------- */
.ed-hero {
    /* Pointer position within the hero, written by public-hero-grid.js.
       --ed-px / --ed-py are the same position normalised to -1..1 and drive
       the parallax drift; they stay at 0 when the script does not engage. */
    --ed-mx: 50%;
    --ed-my: 40%;
    --ed-px: 0;
    --ed-py: 0;
    --ed-hero-cell: 40px;
    --ed-hero-bleed: 60px;

    background: var(--ed-ink);
    color: var(--ed-paper);
    position: relative;
    overflow: hidden;
}

.ed-hero::before {
    content: "";
    position: absolute;
    inset: calc(var(--ed-hero-bleed) * -1);
    pointer-events: none;
    background: radial-gradient(900px 500px at 85% 22%, rgba(199, 154, 59, 0.18), transparent 70%);
    transform: translate3d(calc(var(--ed-px) * 26px), calc(var(--ed-py) * 20px), 0);
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Base grid: always on, uniform, unaffected by the pointer. */
.ed-hero-grid {
    position: absolute;
    inset: calc(var(--ed-hero-bleed) * -1);
    pointer-events: none;
    background-image:
        linear-gradient(90deg, rgba(245, 246, 250, 0.16) 0 1px, transparent 1px),
        linear-gradient(180deg, rgba(245, 246, 250, 0.16) 0 1px, transparent 1px);
    background-size: var(--ed-hero-cell) var(--ed-hero-cell);
    background-position: calc(var(--ed-px) * 10px) calc(var(--ed-py) * 10px);
    opacity: 0.42;
    transition: background-position 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Highlight layer: the same lattice in gold, revealed only around the
   cursor by a radial mask, and faded in as a whole on pointer enter. */
.ed-hero-grid-glow {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(90deg, rgba(230, 196, 132, 0.9) 0 1px, transparent 1px),
        linear-gradient(180deg, rgba(230, 196, 132, 0.9) 0 1px, transparent 1px);
    background-size: var(--ed-hero-cell) var(--ed-hero-cell);
    background-position: calc(var(--ed-px) * 10px) calc(var(--ed-py) * 10px);
    opacity: 0;
    transition: opacity 0.35s ease, background-position 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
    will-change: opacity;
    -webkit-mask-image: radial-gradient(circle 380px at calc(var(--ed-mx) + var(--ed-hero-bleed)) calc(var(--ed-my) + var(--ed-hero-bleed)),
            rgba(0, 0, 0, 1) 0%,
            rgba(0, 0, 0, 0.75) 30%,
            transparent 75%);
    mask-image: radial-gradient(circle 380px at calc(var(--ed-mx) + var(--ed-hero-bleed)) calc(var(--ed-my) + var(--ed-hero-bleed)),
            rgba(0, 0, 0, 1) 0%,
            rgba(0, 0, 0, 0.75) 30%,
            transparent 75%);
}

/* Warm wash under the lit lattice. It inherits the parent's mask, so it stays
   concentric with the highlight instead of needing its own tracking. */
.ed-hero-grid-glow::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle 380px at calc(var(--ed-mx) + var(--ed-hero-bleed)) calc(var(--ed-my) + var(--ed-hero-bleed)),
            rgba(199, 154, 59, 0.16),
            transparent 70%);
}

.ed-hero.is-lit .ed-hero-grid-glow {
    opacity: 1;
}

.ed-hero-inner {
    max-width: var(--ed-shell);
    margin: 0 auto;
    padding: 88px var(--ed-gutter) 96px;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 64px;
    align-items: center;
    position: relative;
}

.ed-hero-copy {
    animation: ed-rise 0.7s ease both;
}

.ed-eyebrow {
    font-family: var(--ed-mono);
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--ed-gold);
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.ed-eyebrow-rule {
    width: 36px;
    height: 1px;
    background: var(--ed-gold);
    display: inline-block;
    flex: 0 0 36px;
}

.ed-hero-title {
    font-family: var(--ed-serif);
    font-weight: 500;
    font-size: clamp(46px, 6vw, 84px);
    line-height: 1.02;
    margin: 0 0 26px;
    letter-spacing: -0.01em;
    color: var(--ed-paper);
}

.ed-hero-title em {
    font-style: italic;
    color: var(--ed-gold);
}

.ed-hero-lead {
    font-size: 19px;
    line-height: 1.6;
    color: var(--ed-on-ink);
    margin: 0 0 40px;
    max-width: 46ch;
}

.ed-hero-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.ed-hero-meta {
    margin-top: 32px;
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.ed-meta-chip {
    font-family: var(--ed-mono);
    font-size: 11.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ed-paper);
    border: 1px solid var(--ed-line-light-strong);
    padding: 7px 14px;
    border-radius: 999px;
}

.ed-meta-chip--gold {
    background: var(--ed-gold);
    border-color: var(--ed-gold);
    color: var(--ed-ink);
    font-weight: 600;
}

.ed-meta-chip--closed {
    background: rgba(245, 246, 250, 0.12);
    border-color: var(--ed-line-light-strong);
    color: var(--ed-paper);
    font-weight: 600;
}

.ed-hero-figure {
    position: relative;
    justify-self: end;
    animation: ed-rise 0.7s 0.15s ease both;
}

.ed-hero-figure::before {
    content: "";
    position: absolute;
    top: -18px;
    left: -18px;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(199, 154, 59, 0.55);
    border-radius: 999px 999px 0 0;
    pointer-events: none;
}

.ed-hero-photo {
    width: 360px;
    max-width: 100%;
    height: 440px;
    border-radius: 999px 999px 0 0;
    overflow: hidden;
    background: rgba(245, 246, 250, 0.08);
    display: block;
}

.ed-hero-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ----------------------------------------
   3b. Admissions banner
   ---------------------------------------- */
.ed-banner {
    background: var(--ed-gold);
    color: var(--ed-ink);
}

.ed-banner-inner {
    max-width: var(--ed-shell);
    margin: 0 auto;
    padding: 16px var(--ed-gutter);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
    font-size: 14.5px;
    text-align: center;
}

.ed-banner strong {
    font-weight: 700;
    letter-spacing: 0.01em;
}

.ed-banner-sep {
    width: 1px;
    height: 14px;
    background: rgba(48, 60, 181, 0.35);
}

.ed-banner-link {
    font-weight: 700;
    border-bottom: 1px solid currentColor;
    margin-left: 6px;
    text-decoration: none;
}

.ed-banner-link:hover {
    opacity: 0.72;
    color: inherit;
    text-decoration: none;
}

.ed-banner--closed {
    background: #fff;
    color: var(--ed-ink);
    border-bottom: 1px solid var(--ed-line-mid);
}

.ed-banner--closed .ed-banner-sep {
    background: var(--ed-line-strong);
}

/* ----------------------------------------
   3c. Pillars
   ---------------------------------------- */
.ed-split {
    display: grid;
    grid-template-columns: 0.9fr 2fr;
    gap: 64px;
    align-items: start;
}

.ed-split--center {
    align-items: center;
}

.ed-h2--light {
    color: var(--ed-paper);
}

.ed-kicker--light {
    color: var(--ed-gold);
}

.ed-prose--light,
.ed-prose--light p {
    color: var(--ed-on-ink-soft);
}

.ed-pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.ed-pillar {
    border-top: 2px solid var(--ed-ink);
    padding-top: 22px;
}

.ed-pillar-num {
    font-family: var(--ed-mono);
    font-size: 12px;
    color: var(--ed-gold);
    font-weight: 600;
    margin-bottom: 14px;
}

.ed-pillar h3 {
    font-family: var(--ed-serif);
    font-weight: 600;
    font-size: 22px;
    margin: 0 0 10px;
    color: var(--ed-ink);
}

.ed-pillar p {
    font-size: 14px;
    line-height: 1.65;
    color: var(--ed-muted);
    margin: 0;
}

/* ----------------------------------------
   3d. Program cards
   ---------------------------------------- */
.ed-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.ed-card-grid--two {
    grid-template-columns: repeat(2, 1fr);
}

.ed-prog-card {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
    padding: 30px 30px 26px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ed-prog-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--ed-lift);
}

.ed-testimonial {
    max-width: 860px;
    margin: 0 auto;
    text-align: center;
}

.ed-testimonial blockquote {
    font-family: var(--ed-serif);
    font-size: clamp(25px, 3vw, 38px);
    line-height: 1.24;
    color: var(--ed-ink);
    margin: 0 0 24px;
}

.ed-testimonial-byline {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
}

.ed-testimonial-byline strong {
    color: var(--ed-ink);
}

.ed-testimonial-byline span {
    color: var(--ed-muted-soft);
    font-size: 14px;
}

.ed-prog-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.ed-chip-code {
    font-family: var(--ed-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--ed-ink);
    border: 1px solid var(--ed-line-strong);
    padding: 4px 10px;
}

.ed-chip-level {
    font-family: var(--ed-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ed-gold);
    text-align: right;
}

.ed-prog-title {
    font-family: var(--ed-serif);
    font-weight: 600;
    font-size: 23px;
    line-height: 1.2;
    margin: 0;
    color: var(--ed-ink);
}

.ed-prog-dept {
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ed-muted-soft);
    font-weight: 600;
}

.ed-prog-desc {
    font-size: 14px;
    line-height: 1.6;
    color: var(--ed-muted);
    margin: 0;
    flex: 1;
}

.ed-prog-foot {
    display: flex;
    align-items: center;
    gap: 22px;
    border-top: 1px solid var(--ed-line-soft);
    padding-top: 16px;
    margin-top: 4px;
}

.ed-prog-foot a {
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
}

.ed-prog-foot .ed-prog-apply {
    font-weight: 700;
    color: var(--ed-gold);
    margin-left: auto;
}

.ed-prog-foot .ed-prog-apply:hover {
    color: var(--ed-ink);
}

.ed-prog-foot .ed-prog-apply.is-disabled {
    color: var(--ed-muted-soft);
    cursor: not-allowed;
    pointer-events: none;
}

.ed-card-cta {
    border: 1px dashed var(--ed-line-heavy);
    border-radius: var(--ed-radius);
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    min-height: 220px;
    text-decoration: none;
    transition: border-color 0.2s ease;
}

.ed-card-cta:hover {
    border-color: var(--ed-ink);
    text-decoration: none;
}

.ed-card-cta-title {
    font-family: var(--ed-serif);
    font-size: 26px;
    font-weight: 500;
    color: var(--ed-ink);
    line-height: 1.2;
}

.ed-card-cta-link {
    font-weight: 700;
    font-size: 14px;
    color: var(--ed-gold);
}

/* ----------------------------------------
   3e. Faculty list
   ---------------------------------------- */
.ed-fac-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 64px;
}

.ed-fac-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 24px;
    border-top: 1px solid var(--ed-line-mid);
    padding: 22px 0;
}

.ed-fac-name {
    font-family: var(--ed-serif);
    font-size: 22px;
    font-weight: 600;
    color: var(--ed-ink);
}

.ed-fac-desc {
    font-size: 13px;
    color: var(--ed-muted-soft);
    margin-top: 4px;
}

.ed-fac-count {
    font-family: var(--ed-mono);
    font-size: 12px;
    color: var(--ed-gold);
    white-space: nowrap;
    font-weight: 600;
}

/* ----------------------------------------
   3f. Closing CTA
   ---------------------------------------- */
.ed-cta {
    background: var(--ed-ink);
    color: var(--ed-paper);
    position: relative;
    overflow: hidden;
}

.ed-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(700px 400px at 50% 120%, rgba(199, 154, 59, 0.16), transparent 70%);
    pointer-events: none;
}

.ed-cta.ed-shell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding-top: 44px;
    padding-bottom: 44px;
    border-radius: var(--ed-radius);
}

.ed-cta-inner {
    max-width: 800px;
    margin: 0 auto;
    padding: 110px var(--ed-gutter);
    text-align: center;
    position: relative;
}

.ed-cta-title {
    font-family: var(--ed-serif);
    font-weight: 500;
    font-size: clamp(34px, 4.5vw, 58px);
    line-height: 1.08;
    margin: 0 0 20px;
    color: var(--ed-paper);
}

.ed-cta-title em {
    font-style: italic;
    color: var(--ed-gold);
}

.ed-cta-lead {
    font-size: 17px;
    line-height: 1.6;
    color: var(--ed-on-ink-soft);
    margin: 0 0 40px;
}

.ed-cta-actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: center;
}

/* ----------------------------------------
   3g. Interior page header
   ---------------------------------------- */
.ed-page-head {
    background: var(--ed-ink);
    color: var(--ed-paper);
    position: relative;
    overflow: hidden;
}

.ed-page-head::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(760px 420px at 88% 10%, rgba(199, 154, 59, 0.16), transparent 70%);
    pointer-events: none;
}

.ed-page-head-inner {
    max-width: var(--ed-shell);
    margin: 0 auto;
    padding: 72px var(--ed-gutter);
    position: relative;
}

.ed-page-title {
    font-family: var(--ed-serif);
    font-weight: 500;
    font-size: clamp(34px, 4.4vw, 56px);
    line-height: 1.06;
    letter-spacing: -0.01em;
    margin: 0 0 18px;
    color: var(--ed-paper);
}

.ed-page-lead {
    font-size: 18px;
    line-height: 1.6;
    color: var(--ed-on-ink);
    margin: 0;
    max-width: 60ch;
}

.ed-crumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-family: var(--ed-mono);
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 24px;
    color: var(--ed-on-ink);
}

.ed-crumbs a {
    color: var(--ed-gold);
    text-decoration: none;
}

.ed-crumbs a:hover {
    color: var(--ed-paper);
}

.ed-crumbs-sep {
    opacity: 0.5;
}

.ed-page-chips {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 22px;
}

/* ----------------------------------------
   3h. Editorial surfaces (panels, rows, notes)
   ---------------------------------------- */
.ed-panel {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
    padding: 32px;
}

.ed-panel--pad-lg {
    padding: 40px;
}

.ed-panel--accent {
    border-color: var(--ed-gold);
}

.ed-panel--danger {
    border-color: rgba(197, 51, 47, 0.35);
}

.ed-stack {
    display: grid;
    gap: 24px;
}

.ed-kicker--danger {
    color: #c5332f;
}

.ed-panel-title {
    font-family: var(--ed-serif);
    font-weight: 600;
    font-size: 24px;
    margin: 0 0 18px;
    color: var(--ed-ink);
}

.ed-note {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-left: 3px solid var(--ed-gold);
    border-radius: var(--ed-radius);
    padding: 24px 28px;
}

.ed-note p {
    margin: 0 0 8px;
    font-size: 14.5px;
}

.ed-note p:last-child {
    margin-bottom: 0;
}

.ed-check-list {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
}

.ed-check-list li {
    position: relative;
    border-top: 1px solid var(--ed-line-mid);
    padding: 13px 0 13px 26px;
    color: var(--ed-muted);
    line-height: 1.5;
}

.ed-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 13px;
    color: var(--ed-gold);
    font-weight: 700;
}

.ed-def-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 40px;
}

.ed-def-label {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ed-gold);
    margin-bottom: 6px;
}

.ed-def-value {
    font-size: 15px;
    color: var(--ed-ink);
    font-weight: 500;
}

.ed-feature-row {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    border-top: 1px solid var(--ed-line-mid);
    padding-top: 20px;
}

.ed-feature-num {
    font-family: var(--ed-mono);
    font-size: 12px;
    font-weight: 600;
    color: var(--ed-gold);
    flex: 0 0 auto;
    padding-top: 3px;
}

.ed-feature-row h4 {
    font-family: var(--ed-serif);
    font-size: 19px;
    font-weight: 600;
    margin: 0 0 6px;
    color: var(--ed-ink);
}

.ed-feature-row p {
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    color: var(--ed-muted);
}

.ed-prose {
    font-size: 16px;
    line-height: 1.75;
    color: var(--ed-muted);
}

.ed-prose p:last-child {
    margin-bottom: 0;
}

.ed-detail-image {
    margin: 0;
    border-radius: var(--ed-radius);
    overflow: hidden;
    background: var(--ed-ink);
}

.ed-detail-image img {
    width: 100%;
    max-height: 420px;
    object-fit: cover;
    display: block;
}

.ed-outline-list {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: outline;
}

.ed-outline-list li {
    counter-increment: outline;
    display: flex;
    gap: 16px;
    border-top: 1px solid var(--ed-line-mid);
    padding: 16px 0;
    color: var(--ed-muted);
    line-height: 1.55;
}

.ed-outline-list li::before {
    content: counter(outline, decimal-leading-zero);
    font-family: var(--ed-mono);
    color: var(--ed-gold);
    font-size: 11px;
    padding-top: 3px;
    flex: 0 0 auto;
}

.ed-empty {
    border: 1px dashed var(--ed-line-heavy);
    border-radius: var(--ed-radius);
    background: #fff;
    padding: 56px 32px;
    text-align: center;
}

.ed-empty i {
    font-size: 40px;
    color: var(--ed-muted-soft);
    display: block;
    margin-bottom: 14px;
}

.ed-empty h3 {
    font-family: var(--ed-serif);
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 8px;
    color: var(--ed-ink);
}

.ed-empty p {
    margin: 0 0 22px;
    font-size: 14.5px;
}

/* Contact / location tiles */
.ed-tile {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
    padding: 28px;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ed-tile-label {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ed-gold);
}

.ed-tile h3 {
    font-family: var(--ed-serif);
    font-size: 22px;
    font-weight: 600;
    margin: 0;
    color: var(--ed-ink);
}

.ed-tile p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--ed-muted);
}

.ed-tile a {
    color: var(--ed-ink);
    text-decoration: none;
    border-bottom: 1px solid var(--ed-line-strong);
}

.ed-tile a:hover {
    color: var(--ed-gold);
    border-bottom-color: var(--ed-gold);
}

/* Inline messages — validation, session flashes, standing notices. */
.ed-alert {
    border: 1px solid var(--ed-line-strong);
    border-left-width: 3px;
    border-radius: var(--ed-radius);
    background: #fff;
    padding: 16px 20px;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ed-muted);
    margin-bottom: 20px;
}

.ed-alert strong {
    color: var(--ed-ink);
}

.ed-alert ul {
    margin: 0;
    padding-left: 18px;
}

.ed-alert li + li {
    margin-top: 4px;
}

.ed-alert--info {
    border-left-color: var(--ed-ink);
}

.ed-alert--notice {
    border-left-color: var(--ed-gold);
}

.ed-alert--success {
    border-left-color: #168a5a;
}

.ed-alert--danger {
    border-left-color: #c5332f;
    color: #8f2723;
}

.ed-alert--danger strong {
    color: #8f2723;
}

.ed-contact-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 14.5px;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--ed-muted);
}

.ed-contact-list a {
    color: var(--ed-ink);
    text-decoration: none;
    border-bottom: 1px solid var(--ed-line-strong);
}

.ed-contact-list a:hover {
    color: var(--ed-gold);
    border-bottom-color: var(--ed-gold);
}

.ed-small-note {
    font-size: 13px;
    line-height: 1.6;
    color: var(--ed-muted-soft);
}

/* Module tables on the program page */
.ed-level-title {
    font-family: var(--ed-mono);
    font-size: 11.5px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--ed-gold);
    margin: 0 0 14px;
}

body.public-site .ed-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

body.public-site .ed-table th {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-muted-soft);
    font-weight: 600;
    text-align: left;
    padding: 0 12px 10px 0;
    border-bottom: 1px solid var(--ed-line-mid);
}

body.public-site .ed-table td {
    padding: 14px 12px 14px 0;
    border-bottom: 1px solid var(--ed-line-soft);
    color: var(--ed-muted);
    vertical-align: top;
}

body.public-site .ed-table td strong {
    color: var(--ed-ink);
    font-weight: 600;
}

body.public-site .ed-table .ed-num {
    text-align: center;
    font-family: var(--ed-mono);
    padding-right: 0;
}

.ed-tag {
    display: inline-block;
    font-family: var(--ed-mono);
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 3px 8px;
    border: 1px solid var(--ed-line-strong);
    color: var(--ed-ink);
}

.ed-tag--elective {
    color: var(--ed-gold);
    border-color: rgba(199, 154, 59, 0.5);
}

/* ----------------------------------------
   3i. Bootstrap components inside marketing pages
   ---------------------------------------- */
body.public-site .form-label {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-muted-soft);
    font-weight: 600;
    margin-bottom: 8px;
}

/* public-premium.css forces `border-radius: var(--radius) !important` (3px) on
   controls, modals and accordions from a blanket utility block. The editorial
   radius has to be flagged too in order to win. */
body.public-site .form-control,
body.public-site .form-select {
    font-family: var(--ed-sans);
    font-size: 14.5px;
    color: var(--ed-ink);
    background-color: #fff;
    border: 1px solid var(--ed-line-strong);
    border-radius: var(--ed-radius-sm) !important;
    padding: 11px 14px;
    box-shadow: none;
}

body.public-site .form-control::placeholder {
    color: var(--ed-muted-soft);
}

body.public-site .form-control:focus,
body.public-site .form-select:focus {
    border-color: var(--ed-ink);
    box-shadow: 0 0 0 3px rgba(199, 154, 59, 0.25);
}

body.public-site .input-group-text {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line-strong);
    border-radius: var(--ed-radius-sm) !important;
    color: var(--ed-muted-soft);
}

/* Only the outer corners of an input group are rounded, so the addon and the
   control still read as one field. */
body.public-site .input-group > :not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

body.public-site .input-group > :not(:last-child) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

body.public-site .form-check-input {
    border-color: var(--ed-line-heavy);
}

body.public-site .form-check-input:checked {
    background-color: var(--ed-ink);
    border-color: var(--ed-ink);
}

body.public-site .form-check-input:focus {
    border-color: var(--ed-ink);
    box-shadow: 0 0 0 3px rgba(199, 154, 59, 0.25);
}

body.public-site .accordion-item {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius) !important;
    overflow: hidden;
    margin-bottom: 12px;
}

body.public-site .accordion-button {
    font-family: var(--ed-serif);
    font-size: 19px;
    font-weight: 600;
    color: var(--ed-ink);
    background: #fff;
    border-radius: 0;
    box-shadow: none;
    padding: 20px 24px;
}

body.public-site .accordion-button:not(.collapsed) {
    background: var(--ed-paper);
    color: var(--ed-ink);
    box-shadow: inset 3px 0 0 var(--ed-gold);
}

body.public-site .accordion-button:focus {
    box-shadow: 0 0 0 3px rgba(199, 154, 59, 0.25);
}

body.public-site .accordion-body {
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--ed-muted);
    padding: 4px 24px 22px;
}

body.public-site .form-check-label {
    font-size: 14.5px;
    color: var(--ed-muted);
}

body.public-site .modal-content {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius) !important;
    overflow: hidden;
}

body.public-site .modal-header {
    display: block;
    background: var(--ed-paper);
    border-bottom: 1px solid var(--ed-line);
    padding: 26px 30px 22px;
}

body.public-site .modal-title {
    font-family: var(--ed-serif);
    font-size: 26px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--ed-ink);
}

body.public-site .modal-body {
    padding: 26px 30px;
}

body.public-site .modal-footer {
    background: var(--ed-paper);
    border-top: 1px solid var(--ed-line);
    padding: 18px 30px;
    gap: 12px;
}

body.public-site .modal-footer > * {
    margin: 0;
}

body.public-site .pagination {
    --bs-pagination-color: var(--ed-ink);
    --bs-pagination-active-bg: var(--ed-ink);
    --bs-pagination-active-border-color: var(--ed-ink);
}

/* ----------------------------------------
   4. Responsive
   ---------------------------------------- */
@media (max-width: 1199.98px) {
    :root {
        --ed-gutter: 24px;
        --ed-section-y: 80px;
    }

    .ed-hero-inner {
        gap: 40px;
    }

    .ed-hero-photo {
        width: 300px;
        height: 380px;
    }

    .ed-split {
        gap: 40px;
    }

    .ed-fac-grid {
        gap: 0 40px;
    }

    .ed-footer-grid {
        gap: 32px;
    }
}

@media (max-width: 991.98px) {
    .ed-nav-toggle {
        display: flex;
    }

    .ed-nav {
        margin-left: 0;
        flex-basis: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        padding: 8px 0 20px;
        border-top: 1px solid var(--ed-line-mid);
        margin-top: 0;
    }

    .ed-header-inner {
        flex-wrap: wrap;
        padding-top: 0;
        padding-bottom: 0;
    }

    .ed-nav-link {
        padding: 12px 0;
        border-bottom: 1px solid var(--ed-line-soft);
    }

    .ed-nav-link.is-active {
        border-bottom-color: var(--ed-gold);
    }

    .ed-nav .ed-btn {
        margin-top: 10px;
    }

    .ed-hero-inner {
        grid-template-columns: 1fr;
        padding: 64px var(--ed-gutter) 72px;
    }

    .ed-hero-figure {
        justify-self: start;
        order: -1;
        margin-bottom: 8px;
    }

    .ed-hero-photo {
        width: 240px;
        height: 300px;
    }

    .ed-split {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .ed-pillars {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .ed-card-grid,
    .ed-card-grid--two {
        grid-template-columns: repeat(2, 1fr);
    }

    .ed-fac-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .ed-footer-grid {
        grid-template-columns: 1fr 1fr;
    }

    .ed-cta-inner {
        padding: 80px var(--ed-gutter);
    }

    .ed-def-grid {
        gap: 22px 28px;
    }
}

@media (max-width: 767.98px) {
    :root {
        --ed-section-y: 64px;
    }

    .ed-hero {
        --ed-hero-cell: 32px;
        --ed-hero-bleed: 40px;
    }

    .ed-h2 {
        font-size: 32px;
    }

    .ed-card-grid,
    .ed-card-grid--two {
        grid-template-columns: 1fr;
    }

    .ed-footer-grid {
        grid-template-columns: 1fr;
        padding-top: 56px;
    }

    .ed-def-grid {
        grid-template-columns: 1fr;
    }

    .ed-panel,
    .ed-panel--pad-lg {
        padding: 24px;
    }

    .ed-hero-lead {
        font-size: 17px;
    }

    .ed-banner-inner {
        justify-content: flex-start;
        text-align: left;
    }

    .ed-banner-sep {
        display: none;
    }

    .ed-cta.ed-shell {
        align-items: flex-start;
        flex-direction: column;
    }

    .ed-btn-gold,
    .ed-btn-outline-light,
    .ed-btn-outline-ink {
        padding: 14px 26px;
    }

    .ed-footer-bottom {
        justify-content: flex-start;
    }

    /* Keep the arch outline clear of the viewport edge. */
    .ed-hero-figure::before {
        top: -12px;
        left: -12px;
    }
}

@media (max-width: 575.98px) {
    .ed-brand-name {
        font-size: 18px;
    }

    .ed-brand-kicker {
        font-size: 9px;
        letter-spacing: 0.04em;
        max-width: 220px;
    }

    .ed-brand-logo img {
        height: 34px;
        max-width: 104px;
    }

    .ed-brand-text {
        padding-left: 10px;
    }

    .ed-brand {
        gap: 10px;
    }

    .ed-contact-form-panel {
        padding: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {

    .ed-hero-copy,
    .ed-hero-figure {
        animation: none;
    }

    .ed-prog-card,
    .ed-btn,
    .ed-card-cta,
    .ed-hero::before,
    .ed-hero-grid,
    .ed-hero-grid-glow {
        transition: none;
    }

    .ed-prog-card:hover {
        transform: none;
    }

    /* The script already bails on reduced motion; this covers the case where
       the preference changes after the class has been applied. */
    .ed-hero-grid-glow {
        opacity: 0;
    }
}

/* ============================================================
   5. Application wizard

   The wizard steps render Bootstrap plus a large vocabulary of
   per-view widget classes, each defined in that view's own
   @push('styles'). This layer loads last and is scoped to
   body.public-site — specificity (0,1,2) against the views'
   (0,1,0) — so the editorial palette wins without touching
   ~8,500 lines of step markup.
   ============================================================ */

/* ----------------------------------------
   5a. Journey header + step rail
   ---------------------------------------- */
.ed-wiz-head .ed-page-head-inner {
    padding-bottom: 44px;
}

.ed-wiz-chips {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 22px;
}

.ed-wiz-track {
    margin-top: 28px;
    height: 6px;
    border-radius: 999px;
    background: rgba(245, 246, 250, 0.18);
    overflow: hidden;
}

.ed-wiz-track-fill {
    height: 100%;
    border-radius: inherit;
    background: var(--ed-gold);
    transition: width 0.4s ease;
}

.ed-wiz-track-meta {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 12px;
    font-family: var(--ed-mono);
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-on-ink);
}

/* The heartbeat script toggles these state classes on the pill. */
.wizard-connection-pill {
    gap: 8px;
    display: inline-flex;
    align-items: center;
}

.wizard-connection-pill i {
    font-size: 14px;
}

.wizard-connection-pill.is-checking i {
    animation: ed-spin 1s linear infinite;
}

.wizard-connection-pill.is-good {
    border-color: rgba(93, 214, 166, 0.6);
    color: #b7f0da;
}

.wizard-connection-pill.is-fair {
    border-color: rgba(199, 154, 59, 0.7);
    color: #e8c98a;
}

.wizard-connection-pill.is-weak,
.wizard-connection-pill.is-unstable,
.wizard-connection-pill.is-offline {
    border-color: rgba(255, 154, 150, 0.6);
    color: #ffc4c1;
}

@keyframes ed-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.ed-wiz-rail {
    background: #fff;
    border-bottom: 1px solid var(--ed-line);
    padding: 26px 0 22px;
}

.ed-wiz-steps {
    display: flex;
    align-items: flex-start;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-x: auto;
    scrollbar-width: thin;
}

.ed-wiz-step {
    flex: 1 1 0;
    min-width: 96px;
    text-align: center;
}

.ed-wiz-step-head {
    position: relative;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ed-wiz-step-dot {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border-radius: 50%;
    border: 1px solid var(--ed-line-strong);
    background: #fff;
    color: var(--ed-muted-soft);
    display: grid;
    place-items: center;
    font-size: 16px;
    position: relative;
    z-index: 1;
    transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.ed-wiz-step-line {
    position: absolute;
    top: 50%;
    left: calc(50% + 26px);
    width: calc(100% - 52px);
    height: 1px;
    background: var(--ed-line-mid);
    transform: translateY(-50%);
}

.ed-wiz-step-line.is-done {
    background: var(--ed-gold);
}

.ed-wiz-step-index {
    display: block;
    margin-top: 10px;
    font-family: var(--ed-mono);
    font-size: 10px;
    letter-spacing: 0.16em;
    color: var(--ed-muted-soft);
}

.ed-wiz-step-label {
    display: block;
    margin-top: 3px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--ed-muted-soft);
    white-space: nowrap;
}

.ed-wiz-step.is-done .ed-wiz-step-dot {
    background: var(--ed-gold);
    border-color: var(--ed-gold);
    color: var(--ed-ink);
}

.ed-wiz-step.is-current .ed-wiz-step-dot {
    background: var(--ed-ink);
    border-color: var(--ed-ink);
    color: var(--ed-paper);
}

.ed-wiz-step.is-current .ed-wiz-step-index,
.ed-wiz-step.is-current .ed-wiz-step-label {
    color: var(--ed-ink);
}

.ed-wiz-body {
    padding-top: 40px;
}

.ed-wiz-edit-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.ed-wiz-edit-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* ----------------------------------------
   5b. Step form scaffolding
   ---------------------------------------- */
body.public-site .form-section {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
    overflow: hidden;
    box-shadow: none;
}

body.public-site .section-header,
body.public-site .section-header-success,
body.public-site .section-header-warning {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--ed-paper);
    border-bottom: 1px solid var(--ed-line);
    padding: 14px 22px;
    font-family: var(--ed-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ed-ink);
}

body.public-site .section-header i,
body.public-site .section-header-success i,
body.public-site .section-header-warning i {
    font-size: 17px;
    color: var(--ed-gold);
}

body.public-site .section-header-warning {
    box-shadow: inset 3px 0 0 var(--ed-gold);
}

body.public-site .section-header-success {
    box-shadow: inset 3px 0 0 #168a5a;
}

body.public-site .section-body {
    padding: 24px 22px;
    background: #fff;
}

body.public-site .sub-section-title {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-muted-soft);
    margin-bottom: 12px;
}

body.public-site .section-badge {
    font-family: var(--ed-mono);
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ed-gold);
    margin-left: auto;
}

body.public-site .required-asterisk {
    color: #c5332f;
}

body.public-site .form-text,
body.public-site .instructions-text {
    font-size: 13px;
    color: var(--ed-muted-soft);
}

body.public-site .invalid-feedback {
    font-size: 12.5px;
    color: #c5332f;
}

body.public-site .form-control.is-invalid,
body.public-site .form-select.is-invalid {
    border-color: #c5332f;
}

body.public-site .form-control.is-invalid:focus,
body.public-site .form-select.is-invalid:focus {
    box-shadow: 0 0 0 3px rgba(197, 51, 47, 0.18);
}

/* Contact enquiry form */
.ed-contact-form-panel {
    padding: 32px;
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
}

.ed-contact-form-panel .ed-panel-title {
    margin-bottom: 12px;
}

.ed-contact-form-intro {
    color: var(--ed-ink-deep) !important;
    font-size: 15px;
    line-height: 1.65;
    margin-bottom: 10px;
}

.ed-contact-form-recipient {
    color: #5f668e !important;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 24px;
}

.ed-contact-form-recipient a {
    color: var(--ed-ink-deep) !important;
    font-weight: 600;
}

.ed-contact-form .form-label {
    color: var(--ed-ink-deep);
    font-family: var(--ed-sans);
    font-size: 13px;
    letter-spacing: normal;
    text-transform: none;
    font-weight: 600;
}

.ed-contact-form .form-label span[aria-hidden="true"] {
    color: var(--ed-gold);
}

.ed-contact-form .form-control,
.ed-contact-form .form-select {
    min-height: 46px;
    color: var(--ed-ink-deep);
}

body.public-site .ed-contact-form textarea.form-control {
    min-height: 132px;
    resize: vertical;
}

.ed-contact-form .form-control::placeholder {
    color: #6f769e;
    opacity: 1;
}

.ed-contact-form .form-control:focus,
.ed-contact-form .form-select:focus {
    border-color: var(--ed-ink);
    box-shadow: 0 0 0 3px rgba(48, 60, 181, 0.14);
}

.ed-contact-form .form-control.is-invalid,
.ed-contact-form .form-select.is-invalid {
    border-color: #b42318;
}

.ed-contact-form-note {
    max-width: 30ch;
    color: #5f668e !important;
    font-size: 12px;
    line-height: 1.5;
}

.ed-form-optional {
    color: #5f668e;
    font-weight: 400;
    margin-left: 4px;
}

.ed-contact-alert {
    padding: 12px 14px;
    border-radius: var(--ed-radius-sm);
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 20px;
}

.ed-contact-alert--success {
    background: #edf8f0;
    color: #176b3a;
    border: 1px solid #b9e2c6;
}

.ed-contact-alert--error {
    background: #fff3f1;
    color: #8e2118;
    border: 1px solid #f0b8b0;
}

.ed-contact-trap {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* The step views set fixed control heights; keep them, restate the palette. */
body.public-site textarea.form-control {
    min-height: 96px;
}

/* ----------------------------------------
   5c. Bootstrap buttons inside the editorial pages
   ---------------------------------------- */
body.public-site .btn {
    font-family: var(--ed-sans);
    font-size: 14px;
    font-weight: 600;
    border-radius: var(--ed-radius) !important;
    border: 1px solid transparent;
    padding: 11px 22px;
    box-shadow: none !important;
    transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

body.public-site .btn-lg {
    padding: 14px 30px;
    font-size: 15px;
}

body.public-site .btn-sm {
    padding: 8px 16px;
    font-size: 13px;
}

body.public-site .btn-primary,
body.public-site .btn-submit,
body.public-site .btn-home {
    background: var(--ed-ink);
    border-color: var(--ed-ink);
    color: var(--ed-paper);
}

body.public-site .btn-primary:hover,
body.public-site .btn-primary:focus-visible,
body.public-site .btn-submit:hover,
body.public-site .btn-home:hover {
    background: var(--ed-ink-hover);
    border-color: var(--ed-ink-hover);
    color: var(--ed-paper);
}

body.public-site .btn-outline-primary {
    background: transparent;
    border-color: var(--ed-line-heavy);
    color: var(--ed-ink);
}

body.public-site .btn-outline-primary:hover,
body.public-site .btn-outline-primary:focus-visible {
    background: var(--ed-ink);
    border-color: var(--ed-ink);
    color: var(--ed-paper);
}

body.public-site .btn-outline-secondary,
body.public-site .btn-secondary,
body.public-site .btn-light {
    background: transparent;
    border-color: var(--ed-line-heavy);
    color: var(--ed-ink);
}

body.public-site .btn-outline-secondary:hover,
body.public-site .btn-outline-secondary:focus-visible,
body.public-site .btn-secondary:hover,
body.public-site .btn-light:hover {
    background: var(--ed-paper);
    border-color: var(--ed-ink);
    color: var(--ed-ink);
}

body.public-site .btn-success {
    background: #168a5a;
    border-color: #168a5a;
    color: #fff;
}

body.public-site .btn-danger {
    background: #c5332f;
    border-color: #c5332f;
    color: #fff;
}

body.public-site .btn-outline-danger {
    background: transparent;
    border-color: rgba(197, 51, 47, 0.45);
    color: #c5332f;
}

body.public-site .btn-outline-danger:hover,
body.public-site .btn-outline-danger:focus-visible {
    background: #c5332f;
    border-color: #c5332f;
    color: #fff;
}

body.public-site .btn:disabled,
body.public-site .btn[disabled] {
    opacity: 0.5;
}

/* ----------------------------------------
   5d. Bootstrap alerts, badges, tables, cards
   ---------------------------------------- */
body.public-site .alert {
    border: 1px solid var(--ed-line-strong);
    border-left-width: 3px;
    border-radius: var(--ed-radius) !important;
    background: #fff;
    color: var(--ed-muted);
    font-size: 14.5px;
    padding: 16px 20px;
}

body.public-site .alert strong {
    color: var(--ed-ink);
}

body.public-site .alert-success {
    border-left-color: #168a5a;
}

body.public-site .alert-info,
body.public-site .alert-primary {
    border-left-color: var(--ed-ink);
}

body.public-site .alert-warning {
    border-left-color: var(--ed-gold);
}

body.public-site .alert-danger {
    border-left-color: #c5332f;
    color: #8f2723;
}

body.public-site .alert-danger strong {
    color: #8f2723;
}

body.public-site .badge {
    font-family: var(--ed-mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: var(--ed-radius-sm) !important;
    padding: 5px 10px;
}

body.public-site .badge.bg-primary,
body.public-site .badge.bg-info,
body.public-site .badge.bg-secondary {
    background: var(--ed-ink) !important;
    color: var(--ed-paper);
}

body.public-site .badge.bg-warning,
body.public-site .badge.bg-light {
    background: var(--ed-gold) !important;
    color: var(--ed-ink) !important;
}

body.public-site .badge.bg-success {
    background: #168a5a !important;
    color: #fff;
}

body.public-site .badge.bg-danger {
    background: #c5332f !important;
    color: #fff;
}

body.public-site .table {
    font-size: 14px;
    color: var(--ed-muted);
    --bs-table-bg: transparent;
}

body.public-site .table > thead th {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-muted-soft);
    border-bottom: 1px solid var(--ed-line-mid);
    background: transparent;
}

body.public-site .table > tbody td {
    border-bottom: 1px solid var(--ed-line-soft);
    vertical-align: middle;
}

body.public-site .table > tbody tr:hover > * {
    background: var(--ed-paper);
}

body.public-site .card {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius) !important;
    box-shadow: none !important;
}

body.public-site .card-header {
    background: var(--ed-paper);
    border-bottom: 1px solid var(--ed-line);
    color: var(--ed-ink);
}

body.public-site .progress {
    background: var(--ed-line);
    border-radius: 999px !important;
}

body.public-site .progress-bar {
    background: var(--ed-ink);
}

body.public-site .list-group-item {
    background: #fff;
    border-color: var(--ed-line);
    color: var(--ed-muted);
}

/* ----------------------------------------
   5e. Step widget families
   Shapes stay as the views define them; only the palette,
   type and corners are restated here.
   ---------------------------------------- */
body.public-site .upload-card,
body.public-site .document-card,
body.public-site .summary-card,
body.public-site .program-card,
body.public-site .program-choice-card,
body.public-site .funding-card,
body.public-site .qualification-card,
body.public-site .tertiary-toggle-card,
body.public-site .next-steps-card,
body.public-site .declaration-box,
body.public-site .upload-info-box,
body.public-site .payment-info,
body.public-site .entry-evaluation,
body.public-site .requirement-group,
body.public-site .best-six-preview {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
    box-shadow: none;
}

body.public-site .upload-card-header,
body.public-site .summary-card-header {
    background: var(--ed-paper);
    border-bottom: 1px solid var(--ed-line);
    color: var(--ed-ink);
}

body.public-site .upload-card-body,
body.public-site .summary-card-body {
    background: #fff;
}

body.public-site .upload-title,
body.public-site .document-card-title,
body.public-site .existing-upload-title,
body.public-site .program-header {
    font-family: var(--ed-serif);
    font-weight: 600;
    color: var(--ed-ink);
}

body.public-site .upload-subtitle,
body.public-site .document-card-meta,
body.public-site .existing-upload-meta,
body.public-site .file-types,
body.public-site .file-upload-hint,
body.public-site .upload-size-summary,
body.public-site .program-details {
    font-size: 12.5px;
    color: var(--ed-muted-soft);
}

body.public-site .upload-icon,
body.public-site .document-card-icon,
body.public-site .declaration-icon,
body.public-site .success-icon-wrapper {
    color: var(--ed-gold);
}

body.public-site .upload-status-badge,
body.public-site .fee-badge,
body.public-site .ref-badge,
body.public-site .program-badges span {
    font-family: var(--ed-mono);
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: var(--ed-radius-sm);
}

body.public-site .file-drop-zone,
body.public-site .file-upload-wrapper {
    background: var(--ed-paper);
    border: 1px dashed var(--ed-line-heavy);
    border-radius: var(--ed-radius);
    color: var(--ed-muted);
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

body.public-site .file-drop-zone:hover,
body.public-site .file-drop-zone.is-dragover,
body.public-site .file-upload-wrapper:hover {
    border-color: var(--ed-ink);
    background: #fff;
}

body.public-site .drop-text,
body.public-site .file-upload-text {
    color: var(--ed-muted);
    font-size: 14px;
}

body.public-site .file-name-display {
    font-family: var(--ed-mono);
    font-size: 12px;
    color: var(--ed-ink);
}

body.public-site .file-size-error,
body.public-site .ovc-warning-text {
    color: #c5332f;
    font-size: 12.5px;
}

body.public-site .upload-progress-panel {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
}

body.public-site .upload-progress-bar {
    background: var(--ed-ink);
}

body.public-site .existing-upload-item,
body.public-site .attachment-preview-frame {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
}

/* Review and summary read-out rows */
body.public-site .review-field {
    border-bottom: 1px solid var(--ed-line-soft);
}

body.public-site .review-field-label,
body.public-site .summary-field-label,
body.public-site .fee-label,
body.public-site .selected-fee-label {
    font-family: var(--ed-mono);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-gold);
}

body.public-site .review-field-value,
body.public-site .summary-field-value,
body.public-site .selected-fee-value,
body.public-site .fee-amount {
    font-size: 15px;
    color: var(--ed-ink);
    font-weight: 500;
}

body.public-site .review-edit-link {
    font-size: 13px;
    font-weight: 600;
    color: var(--ed-ink);
    border-bottom: 1px solid var(--ed-gold);
    text-decoration: none;
}

body.public-site .review-edit-link:hover {
    color: var(--ed-gold);
}

body.public-site .program-number,
body.public-site .choice-number,
body.public-site .step-number,
body.public-site .best-six-total {
    font-family: var(--ed-mono);
    font-weight: 600;
    color: var(--ed-gold);
}

body.public-site .declaration-section,
body.public-site .complete-section {
    background: transparent;
}

body.public-site .complete-title {
    font-family: var(--ed-serif);
    font-weight: 500;
    color: var(--ed-ink);
}

body.public-site .complete-subtitle {
    color: var(--ed-muted);
}

body.public-site .premium-radio:checked,
body.public-site .ovc-checkbox:checked,
body.public-site .supplemented-checkbox:checked {
    background-color: var(--ed-ink);
    border-color: var(--ed-ink);
}

body.public-site .requirement-type,
body.public-site .requirement-min,
body.public-site .requirement-note {
    color: var(--ed-muted);
    font-size: 13px;
}

/* ----------------------------------------
   5f. Wizard responsive
   ---------------------------------------- */
@media (max-width: 767.98px) {
    .ed-wiz-step {
        min-width: 84px;
    }

    .ed-wiz-step-label {
        font-size: 10.5px;
    }

    .ed-wiz-track-meta {
        font-size: 9.5px;
        gap: 10px;
    }

    body.public-site .section-body {
        padding: 20px 16px;
    }

    body.public-site .section-header,
    body.public-site .section-header-success,
    body.public-site .section-header-warning {
        padding: 12px 16px;
        font-size: 10px;
        letter-spacing: 0.14em;
    }
}

/* ----------------------------------------
   5g. Bootstrap colour utilities
   The step views lean on .text-dark / .text-muted / .bg-light, all of
   which Bootstrap flags !important. Remap them onto the editorial
   palette rather than editing every call site.
   ---------------------------------------- */
body.public-site .text-dark,
body.public-site .text-primary,
body.public-site .text-body {
    color: var(--ed-ink) !important;
}

body.public-site .text-muted,
body.public-site .text-secondary {
    color: var(--ed-muted) !important;
}

body.public-site .text-danger {
    color: #c5332f !important;
}

body.public-site .text-success {
    color: #168a5a !important;
}

body.public-site .text-warning {
    color: #a06300 !important;
}

body.public-site .text-info {
    color: var(--ed-ink) !important;
}

body.public-site .bg-light,
body.public-site .bg-body-tertiary {
    background-color: var(--ed-paper) !important;
}

body.public-site .border,
body.public-site .border-top,
body.public-site .border-bottom,
body.public-site .border-start,
body.public-site .border-end {
    border-color: var(--ed-line) !important;
}

body.public-site hr {
    border-color: var(--ed-line);
    opacity: 1;
}

/* ----------------------------------------
   5h. Confirmation + summary specifics
   These views paint gradients inline in their own pushed styles;
   restate the fills so nothing green/blue survives.
   ---------------------------------------- */
body.public-site .success-icon-wrapper {
    background: rgba(199, 154, 59, 0.14);
}

body.public-site .success-icon-wrapper i {
    color: var(--ed-gold);
}

body.public-site .ref-badge {
    background: var(--ed-ink);
    color: var(--ed-paper);
    border-radius: 999px;
    padding: 6px 16px;
}

body.public-site .summary-card-header h5,
body.public-site .summary-card-header h6,
body.public-site .upload-card-header h5,
body.public-site .upload-card-header h6 {
    font-family: var(--ed-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ed-ink);
}

body.public-site .summary-field,
body.public-site .program-list li,
body.public-site .next-steps-list li,
body.public-site .existing-upload-list li {
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius-sm);
}

body.public-site .declaration-box,
body.public-site .upload-info-box,
body.public-site .payment-info,
body.public-site .ovc-proof-alert {
    background: #fff;
    border-left: 3px solid var(--ed-gold);
}

/* .funding-label and .program-label wrap an icon, a <strong> title and a
   <small> description, so the mono treatment goes on the title only —
   putting it on the label itself uppercases the description too. */
body.public-site .funding-label strong,
body.public-site .program-label strong {
    font-family: var(--ed-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ed-ink);
}

body.public-site .funding-label small,
body.public-site .program-label small {
    font-family: var(--ed-sans);
    font-size: 12.5px;
    letter-spacing: 0;
    text-transform: none;
    color: var(--ed-muted-soft);
}

body.public-site .funding-label i,
body.public-site .program-label i {
    color: var(--ed-gold);
}

body.public-site .funding-card.selected,
body.public-site .program-card.selected,
body.public-site .program-choice-card.selected,
body.public-site .qualification-card.selected,
body.public-site .tertiary-toggle-card.selected {
    border-color: var(--ed-ink);
    background: var(--ed-paper);
}

/* ----------------------------------------
   5i. Attachments step — state fills
   The upload widgets paint pastel gradients for their state variants.
   Re-express those states in the editorial semantic set: gold for
   attention, green for done, red for error.
   ---------------------------------------- */
body.public-site .upload-size-summary,
body.public-site .upload-progress-panel {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-radius: var(--ed-radius);
}

body.public-site .upload-size-summary__icon {
    background: rgba(199, 154, 59, 0.14);
    color: var(--ed-gold);
}

body.public-site .upload-size-summary__title {
    font-family: var(--ed-mono);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--ed-ink);
}

body.public-site .upload-size-summary__text {
    color: var(--ed-muted);
}

body.public-site .upload-size-summary__hint {
    color: var(--ed-muted-soft);
}

body.public-site .upload-size-summary.is-over-limit,
body.public-site .upload-progress-panel.is-error {
    border-color: rgba(197, 51, 47, 0.4);
    background: #fff;
}

body.public-site .upload-size-summary.is-over-limit .upload-size-summary__icon {
    background: rgba(197, 51, 47, 0.12);
    color: #c5332f;
}

body.public-site .upload-progress-panel.is-success {
    border-color: rgba(22, 138, 90, 0.4);
    background: #fff;
}

body.public-site .upload-card.warning {
    border-color: rgba(199, 154, 59, 0.5);
}

body.public-site .upload-card.warning .upload-card-header {
    background: rgba(199, 154, 59, 0.1);
}

body.public-site .upload-card.success {
    border-color: rgba(22, 138, 90, 0.4);
}

body.public-site .upload-card.success .upload-card-header {
    background: rgba(22, 138, 90, 0.08);
}

body.public-site .selected-fee {
    background: #fff;
    border: 1px solid var(--ed-line);
    border-left: 3px solid var(--ed-gold);
    border-radius: var(--ed-radius-sm);
}

body.public-site .selected-fee-value {
    color: var(--ed-ink);
}

body.public-site .selected-fee-type {
    font-family: var(--ed-mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ed-gold);
}

body.public-site .fee-badge,
body.public-site .fee-badge.citizens,
body.public-site .fee-badge.international {
    background: #fff;
    border: 1px solid var(--ed-line-strong);
    border-radius: var(--ed-radius-sm);
    color: var(--ed-ink);
}

body.public-site .fee-badge.is-selected {
    border-color: var(--ed-ink);
    background: var(--ed-paper);
}

body.public-site .fee-badge .fee-amount {
    font-family: var(--ed-mono);
    color: var(--ed-ink);
}

/* .step-number, .program-number and .choice-number are filled counters, so
   they need the fill restated rather than just the text colour. */
body.public-site .step-number,
body.public-site .program-number,
body.public-site .choice-number {
    background: var(--ed-gold);
    color: var(--ed-ink);
}
