/* BCO light-spatial system. Screen-only so printable decision tools keep their layout. */
@media screen {
  :root {
    --type-title: clamp(1.875rem, 1.4rem + 1.5vw, 2.75rem);
    --type-section: clamp(1.375rem, 1.1rem + .8vw, 1.875rem);
    --type-article: clamp(1.375rem, 1.1rem + .6vw, 1.75rem);
    --type-card: 1.125rem;
    --sp-ink: #102e47;
    --sp-muted: #455f70;
    --sp-line: #cbdedc;
    --sp-blue: #17558a;
    --sp-teal: #17695f;
    --sp-amber: #c4772e;
    --sp-surface: linear-gradient(145deg, #ffffff 22%, #f0f8f5 100%);
    --sp-shadow: 0 2px 3px #174b5010, 0 14px 32px #174b5012, inset 0 1px 0 #fff;
    --sp-raised: 0 3px 0 #d8e7e4, 0 18px 38px #174b501b, inset 0 1px 0 #fff;
    --slate-600: var(--sp-muted);
    --shadow-soft: var(--sp-shadow);
  }

  body,
  .home-page,
  .resource-page,
  .feature-page,
  .tour-page,
  .trust-centre-page,
  .readiness-page {
    color: var(--sp-ink);
    background: radial-gradient(ellipse at 92% 1%, #ddf2e9 0, transparent 38rem),
      radial-gradient(ellipse at 2% 30%, #fff4e8 0, transparent 34rem),
      linear-gradient(180deg, #f8fbfa, #fff 60%, #f4faf8);
    background-size: auto;
  }

  h1, h2, h3 { text-wrap: balance; }
  p { text-wrap: pretty; }
  :where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid #1262ac;
    outline-offset: 4px;
  }
  .health-check-form :is(input, select, textarea):focus-visible,
  .preference-form input:focus-visible,
  .purchase-form :is(input, select, textarea):focus-visible,
  .tour-tab:focus-visible, .analytics-preference input:focus-visible {
    outline: 3px solid #1262ac;
    outline-offset: 4px;
  }
  :where(a, button, input, select, textarea) { -webkit-tap-highlight-color: #c4e8ff; }
  .site-header {
    gap: 18px;
    padding-block: 14px;
    background: #fbfdfcf0;
    border-bottom: 1px solid #d7e8e3;
    box-shadow: 0 4px 22px #174b500a;
  }
  .nav-links { gap: 18px; }
  .nav-links a { font-size: .875rem; padding-block: 10px; }
  .nav-links a::after { bottom: 2px; }
  .brand small { font-size: .875rem; }
  .button {
    min-height: 48px;
    border-radius: 15px;
    font-weight: 750;
    line-height: 1.35;
    transition: box-shadow 180ms ease, border-color 180ms ease, transform 180ms ease;
  }
  .button::before { display: none; }
  .button-primary {
    color: #fff;
    border: 1px solid #164f84;
    background: linear-gradient(135deg, #1d629c, #164f84 65%, #136b68);
    box-shadow: 0 3px 0 #123f63, 0 10px 22px #155d812a, inset 0 1px #ffffff40;
  }
  .button-secondary, .button-glass {
    color: var(--sp-ink);
    border: 1px solid #bed6d4;
    background: var(--sp-surface);
    box-shadow: var(--sp-raised);
    backdrop-filter: none;
  }
  .button:active { transform: translateY(1px); box-shadow: inset 0 2px 5px #173b651c; }
  .eyebrow { color: var(--sp-teal); font-size: .875rem; letter-spacing: .09em; }
  .eyebrow::before { background: linear-gradient(90deg, #d9792b 0 46%, #fff 46% 54%, #168363 54%); }
  .gradient-text {
    color: #1758a4;
    background: none;
  }
  .live-pill, .tour-status { font-size: .875rem; color: #075f51; background: #e4f6ed; }
  .live-pill span, .tour-status i { animation: none; box-shadow: none; background: #14826d; }
  .hero {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: clamp(32px, 4vw, 64px);
    min-height: auto;
    max-width: 1560px;
    margin-inline: auto;
    padding-top: clamp(36px, 5vw, 76px);
    padding-bottom: 54px;
  }
  .future-hero { overflow: visible; }
  .future-hero::before, .future-hero::after { display: none; }
  .hero h1 {
    margin-top: 22px;
    font-size: clamp(2.55rem, 4.25vw, 4.3rem);
    line-height: 1.08;
    letter-spacing: -.04em;
  }
  .hero-copy > p { font-size: 1.0625rem; line-height: 1.75; }
  .hero-kicker-row { gap: 14px; }
  .hero-actions { gap: 12px; }
  .hero-metrics { gap: 0; border-top: 1px solid var(--sp-line); padding-top: 22px; }
  .hero-metrics div { padding: 0 16px; background: none; border: 0; border-radius: 0; box-shadow: none; }
  .hero-metrics div:first-child { padding-left: 0; }
  .hero-metrics div + div { border-left: 1px solid var(--sp-line); }
  .hero-metrics dt { font-size: 1.6rem; }
  .hero-metrics dd { font-size: .875rem; line-height: 1.45; }
  .future-stage { min-height: 0; padding: 0; }
  .campus-ecosystem-card {
    border: 1px solid #cfe2df;
    border-radius: 32px 32px 56px 32px;
    background: #f2faf7;
    box-shadow: var(--sp-raised);
  }
  .campus-ecosystem-card > img { width: 100%; height: auto; object-fit: contain; }
  .campus-ecosystem-card figcaption {
    position: static;
    max-width: none;
    margin: 0;
    padding: 20px 24px 24px;
    border: 0;
    border-top: 1px solid #deebf3;
    border-radius: 0;
    background: #ffffffc9;
    box-shadow: none;
    backdrop-filter: none;
  }
  .campus-ecosystem-card figcaption strong { font-size: 1rem; line-height: 1.5; }
  .command-kicker { font-size: .875rem; color: #1b667f; }
  .future-stage .product-window {
    position: relative;
    inset: auto;
    width: 84%;
    margin: 24px auto 0;
    border: 1px solid #bfcfde;
    border-radius: 16px;
    box-shadow: 0 5px 0 #d0dfeb, 0 22px 42px #274d6a24;
    transform: none;
  }
  .product-window img { width: 100%; height: auto; object-fit: contain; }
  .window-top { background: #edf4fa; color: var(--sp-ink); border-bottom: 1px solid #cbdde9; }
  .future-stage .window-top small { color: #45637b; border-color: #bfd4e4; font-size: .75rem; }
  .window-top strong { color: var(--sp-ink); }
  .logos-band { background: #ffffffc4; border-block: 1px solid #dceae5; }

  /* Shared reading, decision and transaction surfaces. */
  h2 { font-size: clamp(1.8rem, 3.1vw, 3rem); line-height: 1.16; letter-spacing: -.025em; }
  .section { padding-block: clamp(52px, 6vw, 88px); }
  .section-heading { max-width: 820px; }
  .resource-hero h1, .feature-hero h1, .tour-hero h1, .preference-card h1 { font-size: clamp(2.4rem, 5vw, 4.25rem); line-height: 1.1; letter-spacing: -.04em; }
  .resource-hero { padding-top: 52px; padding-bottom: 36px; }
  .resource-deck { font-size: 1.125rem; line-height: 1.75; }
  .resource-content h2, .resource-library-intro h2 { font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.2; }
  .resource-card, .decision-grid article, .module-grid article,
  .pricing-card, .price-card, .proof-grid article, .impact-cards article,
  .journey-card, .terminology-card, .operation-card, .role-outcomes-grid article,
  .trust-bento-card, .readiness-gates article, .availability-list li,
  .growth-entry-grid article, .usp-card, .home-feature-map a {
    border: 1px solid var(--sp-line);
    border-radius: 24px 24px 32px 12px;
    background: var(--sp-surface);
    box-shadow: var(--sp-raised);
    backdrop-filter: none;
  }
  .resource-card { min-height: 0; border-top: 3px solid #2d7396; }
  .resource-card:nth-child(2n) { border-top-color: #23816b; }
  .resource-card h2 { font-size: clamp(1.4rem, 2.5vw, 1.9rem); line-height: 1.2; }
  .resource-card a { color: #1757a1; padding-block: 8px; }
  .resource-card-meta { font-size: .875rem; letter-spacing: .035em; color: var(--sp-muted); }
  .resource-card-featured { background: linear-gradient(135deg, #e8f2f8, #e8f7ee); color: var(--sp-ink); }
  .resource-card-featured p { color: var(--sp-muted); }
  .resource-card-featured .resource-card-meta { color: #215c76; }
  .decision-grid article { padding: 24px; }
  .decision-grid article h3 { margin-top: 0; }
  .decision-grid article p:last-child { margin-bottom: 0; }
  .resource-visual { max-width: 840px; margin-inline: 0; border-radius: 18px; box-shadow: var(--sp-raised); }
  .resource-visual img { height: auto; object-fit: contain; }
  .resource-visual figcaption { background: #f5faf8; line-height: 1.6; }
  .breadcrumb a, .resource-content a { color: var(--sp-blue); }
  .resource-toc { border: 1px solid #cadbdc; border-radius: 20px; padding: 18px; gap: 4px; background: #fbfdfc; box-shadow: 0 8px 24px #183d4210, inset 0 1px #fff; }
  .resource-toc { max-height: calc(100vh - 144px); max-height: calc(100dvh - 144px); overflow-y: auto; }
  .resource-content > section { scroll-margin-top: 0; }
  .resource-toc strong { padding: 5px 10px 12px; }
  .resource-toc a { padding: 10px; border-left: 3px solid transparent; border-radius: 4px 10px 10px 4px; line-height: 1.4; }
  .resource-toc a:hover, .resource-toc a[aria-current="location"] { color: #115c53; background: #e7f4ef; border-left-color: #19816d; }
  .resource-callout { border-radius: 4px 18px 18px 4px; border-left-color: var(--sp-amber); background: #fff9ee; }
  .table-scroll, .readiness-table { border-color: #c8d9df; border-radius: 16px; box-shadow: 0 3px 0 #dce9e9, 0 14px 30px #153c5310; }
  .table-scroll:focus-visible { outline: 3px solid #1262ac; outline-offset: 4px; }
  .table-scroll-hint { display: none; }
  .resource-table caption { border-bottom: 1px solid #dbe6ea; background: linear-gradient(90deg, #f2f7f8, #fff); }
  .resource-table thead th { color: #fff; background: #173d59; font-size: .875rem; }
  .resource-table tbody th[scope="row"] { color: #173d59; background: #edf5f4; }
  .resource-table tbody tr:nth-child(even) td { background: #f8fbfa; }
  .resource-next, .tour-convert, .growth-entry-section, .feature-final-cta,
  .trust-section, .impact-section, .cta-section {
    border: 1px solid #b8d9d9;
    border-radius: 32px 32px 48px 16px;
    color: var(--sp-ink);
    background: radial-gradient(ellipse at 95% 4%, #d9f0e7, transparent 52%), linear-gradient(120deg, #f0f6fa, #f8fbfa);
    box-shadow: 0 3px 0 #d5e6e5, 0 18px 36px #19465817;
  }
  .resource-next h2, .tour-convert h2, .growth-entry-copy h2, .growth-entry-grid h3 { color: var(--sp-ink); }
  .resource-next p, .tour-convert p, .growth-entry-copy p, .growth-entry-grid p { color: var(--sp-muted); }
  .resource-next .button-secondary, .tour-convert .button-secondary { color: var(--sp-ink); background: #fff; border-color: #c1d4e3; }
  .growth-entry-grid a { color: #1757a1; }
  .growth-entry-grid article::before, .journey-card::before, .terminology-card::after { display: none; }
  .entry-icon, .module-icon, .terminology-icon, .journey-card > span, .gate-number, .evidence-steps li > span {
    color: #164c86;
    border: 1px solid #c3ddee;
    border-radius: 16px 16px 20px 9px;
    background: linear-gradient(145deg, #fff, #dcecf9);
    box-shadow: 0 3px 0 #c4d8e8, 0 9px 15px #205c8420, inset 0 1px #fff;
  }
  .terminology-college .terminology-icon, .journey-card-violet > span { color: #514288; background: linear-gradient(145deg, #fff, #eeeafa); }
  .terminology-academy .terminology-icon, .journey-card-green > span { color: #106958; background: linear-gradient(145deg, #fff, #ddf4ec); }
  .pricing-card.featured, .price-card.featured { border: 2px solid #28816f; background: linear-gradient(155deg, #fff, #e8f5ef); box-shadow: 0 4px 0 #b9ddd1, 0 22px 42px #245c6920; }
  .pricing-estimator, .preference-card, .health-check-panel, .health-check-form, .purchase-section, .purchase-aside { border-color: #c5dbd9; background: var(--sp-surface); border-radius: 24px; box-shadow: var(--sp-shadow); }
  .preference-card { border-top-color: #23816b; }
  .estimate-total { background: #e7f4ef; }
  .plan-badge { color: #115c53; background: #e1f3eb; font-size: .875rem; }
  :where(input, select, textarea):not([type="checkbox"]):not([type="radio"]) { box-shadow: inset 0 2px 3px #173b6508; }
  .site-footer { color: var(--sp-ink); border-top: 1px solid #d1e4e1; background: linear-gradient(180deg, #edf6f4, #e7f1f2); }
  .site-footer nav strong { color: var(--sp-ink); }
  .site-footer nav a { color: #315675; padding-block: 5px; }
  .site-footer nav a:hover { color: #174e92; text-decoration: underline; text-underline-offset: 4px; }
  .site-footer p, .footer-brand small, .analytics-preference small, .analytics-preference-status { color: var(--sp-muted); }
  .analytics-preference { border-top-color: #c7dbe8; }
  .analytics-preference small, .analytics-preference-status { font-size: .875rem; }
  .impact-section h2, .impact-section h3 { color: var(--sp-ink); }
  .impact-section p, .impact-cards p { color: var(--sp-muted); }
  .impact-section .eyebrow { color: #116f7a; }

  /* Object-specific depth; real screenshots remain flat and undistorted. */
  .home-feature-teaser, .feature-hero, .classroom-sales-section, .usp-section { color: var(--sp-ink); background: radial-gradient(ellipse at 85% 20%, #d5f0e9, transparent 65%), radial-gradient(ellipse at 5% 85%, #fff0e0, transparent 45%), linear-gradient(135deg, #f3f8fa, #ecf8f4); border-block: 1px solid #d3e7e3; }
  .home-feature-intro h2, .feature-hero h1, .feature-hero-proof strong, .classroom-sales-copy h2, .usp-section h2, .usp-card h3, .home-feature-map strong { color: var(--sp-ink); }
  .home-feature-intro h2, .feature-final-cta h2 { font-size: clamp(1.9rem, 3.5vw, 3.25rem); line-height: 1.15; }
  .home-feature-intro p, .feature-hero-deck, .feature-hero-proof span, .classroom-sales-copy > p:not(.scope-note), .classroom-sales-copy .scope-note, .usp-section .section-heading p, .usp-card p, .home-feature-map small { color: var(--sp-muted); }
  .home-feature-intro .eyebrow, .feature-hero .eyebrow, .classroom-sales-copy .eyebrow, .usp-section .eyebrow, .home-feature-map span, .usp-card > span { color: var(--sp-teal); }
  .home-feature-map span, .home-feature-map small { font-size: .875rem; }
  .feature-hero { padding-block: clamp(42px, 6vw, 82px); min-height: 0; gap: 42px; }
  .feature-hero::before, .feature-hero::after { display: none; }
  .feature-hero .breadcrumb, .feature-hero .breadcrumb a { color: #365d7b; }
  .feature-hero .button-glass { color: var(--sp-ink); border-color: #bcd0e1; background: #fff; }
  .feature-hero-proof li { border-top-color: #bcd5e1; }
  .feature-hero-proof span { font-size: .875rem; }
  .feature-command-stage { min-height: 560px; }
  .feature-command-core { min-height: 245px; border-radius: 34px 34px 68px 34px; border: 1px solid #a6d4ce; background: linear-gradient(145deg, #fff, #e2f4f0 65%, #c9e8e2); box-shadow: 0 7px 0 #a9d1cb, 0 32px 52px #245c6926, inset 0 2px #fff; }
  .feature-command-core strong { color: #123e69; line-height: 1.12; }
  .feature-command-core { padding: 28px; }
  .feature-command-core small, .feature-command-core span { color: #365d77; font-size: .875rem; }
  .feature-command-core small { letter-spacing: .08em; }
  .feature-command-halo { border-color: #a5cec8; box-shadow: 0 0 0 28px #b8ded635, 0 0 0 56px #b8ded622; }
  .feature-command-node { color: var(--sp-ink); border-color: #c3dae8; background: var(--sp-surface); box-shadow: var(--sp-raised); backdrop-filter: none; }
  .feature-command-node > span { color: #246c90; font-size: .875rem; }
  .feature-command-node small { color: var(--sp-muted); font-size: .875rem; }
  .feature-command-node::after { background: linear-gradient(90deg, #4d93b7, transparent); }
  .terminology-card dt, .terminology-card dd, .terminology-type, .operation-kicker, .operation-benefit strong, .role-outcomes-grid span, .scope-note, .classroom-action-list span, .usp-card > span { font-size: .875rem; }
  .operation-card li, .operation-benefit, .role-outcomes-grid p, .usp-card p, .phone-story p, .availability-list span { font-size: 1rem; }
  .operation-card h3 { line-height: 1.3; }
  .operation-number { box-shadow: 0 3px 0 #d6e3ed, inset 0 1px #fff; }
  .classroom-action-list span { color: #235a72; border-color: #bad8e5; background: #faffff; }
  .classroom-showcase { border-color: #c6dce8; background: #f2f9fb; box-shadow: var(--sp-raised); }
  .classroom-showcase > img { width: 100%; height: auto; object-fit: contain; }
  .classroom-showcase figcaption { background: #d8e7ee; border-color: #d8e7ee; }
  .classroom-showcase figcaption span { background: #f7fbfe; }
  .classroom-showcase figcaption strong { color: var(--sp-ink); font-size: .875rem; }
  .classroom-showcase figcaption small { color: var(--sp-muted); font-size: .875rem; }
  .phone-frame { border-color: #b5c8d6; background: #dce7ef; box-shadow: 0 2px 0 #fff, 0 6px 0 #8fa9bc, 0 24px 40px #294d7226, inset 0 0 0 2px #faffff; }
  .phone-frame img { width: 100%; height: auto; object-fit: contain; }
  .phone-speaker { background: #dce7ef; box-shadow: inset 0 1px 3px #597185; }
  .phone-index { background: #ddecf8; color: #1f5284; box-shadow: 0 2px 0 #c5dae9; font-size: .875rem; }

  /* Light tour workspace with clearly differentiated selected states. */
  .tour-workspace { background: #f8fcfa; border-color: #cfdfdc; box-shadow: var(--sp-raised); backdrop-filter: none; }
  .tour-tabs { background: #e8f2ee; border: 1px solid #cfdfd9; }
  .tour-tab { color: #355672; font-size: .9375rem; }
  .tour-tab span { color: #506982; font-size: .875rem; }
  .tour-tab[aria-selected="true"] { color: #115c53; background: #fff; box-shadow: 0 3px 0 #abd4c5, 0 5px 12px #284c6814; }
  .tour-tab[aria-selected="true"] span { color: #17695f; }
  .tour-screen { border-color: #b9d0df; background: linear-gradient(145deg, #f1f7fc, #e5eff7); box-shadow: inset 0 2px 8px #1f507412, 0 5px 0 #ccdde9; }
  .tour-rail { border-color: #c9dce9; background: #e4eef6; }
  .tour-rail-logo { color: #175586; background: #fff; box-shadow: 0 3px 0 #c2d5e4; }
  .tour-rail i { border-color: #96b5cb; background: #f4f9fd; }
  .tour-rail i.active { border-color: #2674aa; background: #cbe5f6; box-shadow: none; }
  .tour-canvas, .tour-canvas-title h3 { color: var(--sp-ink); }
  .tour-canvas-title small, .tour-kpi-grid small, .tour-pipeline article small, .tour-ledger small { color: #266080; font-size: .875rem; }
  .signal-chip { color: #106450; border-color: #b4d8ca; background: #e6f6ee; font-size: .875rem; }
  .tour-kpi-grid article, .tour-pipeline article, .tour-feed, .tour-focus-row, .tour-ledger article { border-color: #c8dce9; background: var(--sp-surface); box-shadow: var(--sp-shadow); }
  .tour-kpi-grid span { color: #176552; font-size: .875rem; }
  .tour-feed p, .tour-focus-row p, .tour-ledger p, .tour-pipeline article p { color: var(--sp-muted); font-size: .9375rem; }
  .tour-feed p span { color: #23658a; }
  .tour-pipeline > i { background: #91b5ce; }
  .tour-avatar { background: #dcecf9; color: #1b5489; box-shadow: 0 3px 0 #b9d1e4; }
  .tour-focus-row button, .tour-action-row button { color: #395971; background: #e9f2f8; border-color: #bbd2e2; font-size: .875rem; }
  .tour-classroom { background: linear-gradient(160deg, #f8fcff, #e0eef0); border-color: #c1d8e1; }
  .tour-board { border-color: #cfbf96; background: #164f49; color: #effff9; box-shadow: 0 4px 0 #b3b99e, 0 12px 22px #345c6526; }
  .tour-board small { color: #d3eee4; font-size: .875rem; }
  .tour-seats span { color: #47647a; background: #fff; border-color: #bbd0df; box-shadow: 0 3px 0 #c3d5de; font-size: .875rem; }
  .tour-seats span.present { color: #12634d; background: #e6f6ee; border-color: #abd3c3; }
  .tour-seats span.selected { color: #fff; background: #1b6299; border-color: #114d7c; box-shadow: 0 3px 0 #16466c; }
  .tour-teacher { color: #695023; background: #efe4cc; box-shadow: 0 3px 0 #d1be97; font-size: .875rem; }
  .ledger-icon, .ledger-icon.shield, .ledger-icon.trail { color: #185c8b; background: #e0f0fa; box-shadow: 0 3px 0 #c0d9e8; }
  .trust-core { border-radius: 36px 36px 42% 42%; border-color: #b4d8d0; color: #145d63; background: linear-gradient(145deg, #fff, #d9f1e9 60%, #d5e9ef); box-shadow: 0 6px 0 #add2c9, 0 26px 46px #2b567d26, inset 0 2px #fff; }
  .trust-core > span:not(.trust-core-label), .trust-core-label, .trust-core small { color: #305d77; }
  .trust-core small, .trust-core-label { font-size: .875rem; }
  .trust-core-orbit { display: none; }
  .trust-bento-dark { background: linear-gradient(140deg, #e8f2f7, #e6f5eb); color: var(--sp-ink); }
  .trust-bento-dark p, .trust-bento-dark li { color: var(--sp-muted); }
  .trust-bento-dark .control-index { color: #236685; }
  .trust-bento-dark .evidence-chip { color: #235d7c; background: #d6eaf3; }
  .control-index, .evidence-chip, .readiness-legend span, .readiness-gates li, .readiness-table [role="columnheader"] { font-size: .875rem; }

  /* Motion is feedback, never needed to read content. */
  [data-tilt] { transform: none; transform-style: flat; will-change: auto; }
  .module-grid article:hover, .pricing-card:hover, .proof-grid article:hover, .impact-cards article:hover, .resource-card:hover { transform: none; box-shadow: var(--sp-raised); }
  [data-reveal] { transition: opacity 300ms ease, transform 300ms ease; }
  .experience-ready [data-reveal].reveal-pending:not(.is-revealed) { transform: translateY(10px); }
  @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .home-feature-map a:hover, .resource-card:has(a):hover { transform: translateY(-3px); box-shadow: 0 5px 0 #c9e2d8, 0 22px 36px #27567722; }
    .button:hover { filter: saturate(1.12); }
    .tour-tab:hover:not([aria-selected="true"]) { background: #f7fcf9; }
  }
  .resource-card:focus-within { border-color: #3f82bb; box-shadow: var(--sp-raised); transform: none; }
  @media (prefers-reduced-motion: reduce) {
    .button, .resource-card, .home-feature-map a { transform: none !important; }
  }
  @media (forced-colors: active) {
    .button, .tour-tab, .resource-toc a[aria-current="location"] { border: 2px solid ButtonText; }
    .tour-tab[aria-selected="true"] { outline: 2px solid Highlight; }
  }

  @media (max-width: 1180px) {
    html { scroll-padding-top: 24px; }
    .site-header { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
    .site-header .brand { grid-column: 1; grid-row: 1; }
    .site-header .header-actions { grid-column: 2; grid-row: 1; width: auto; }
    .site-header .nav-links { grid-column: 1 / -1; grid-row: 2; width: 100%; flex-wrap: wrap; }
    .resource-toc { top: 24px; max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); }
    .hero { grid-template-columns: 1fr; }
    .hero-copy { max-width: 860px; }
    .future-stage { width: min(740px, 100%); margin-inline: auto; }
  }
  @media (max-width: 820px) {
    .hero-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .resource-toc { position: static; max-height: none; overflow-y: visible; }
    .site-header { position: relative; }
    html { scroll-padding-top: 24px; }
  }
  @media (max-width: 680px) {
    .resource-content .table-scroll-hint { display: block; margin: 12px 0 -12px; color: var(--sp-muted); font-size: .875rem; font-weight: 650; line-height: 1.4; }
    html { scroll-padding-top: 2rem; }
    .site-header { position: relative; display: flex; flex-direction: column; }
    .site-header .header-actions { width: 100%; }
    .site-header .nav-links { flex-wrap: nowrap; }
    .hero { padding-top: 30px; padding-bottom: 36px; }
    .hero h1 { font-size: clamp(2.25rem, 9.5vw, 3.5rem); }
    .hero-metrics div { padding-inline: 10px; }
    .hero-metrics dt { font-size: 1.35rem; }
    .campus-ecosystem-card { border-radius: 24px 24px 38px 24px; }
    .campus-ecosystem-card figcaption { padding: 18px; }
    .future-stage .product-window { width: 94%; margin-top: 20px; }
    .future-stage .window-top small { display: none; }
    .feature-hero h1, .resource-hero h1, .tour-hero h1, .preference-card h1 { font-size: clamp(2.2rem, 9vw, 3.25rem); }
    .feature-command-stage { min-height: 0; }
    .feature-command-core { min-height: 220px; border-radius: 28px 28px 48px 28px; }
    .feature-command-node { border-radius: 14px; }
    .resource-toc { padding: 12px; }
    .resource-body { gap: 32px; padding-top: 28px; }
    .resource-card, .decision-grid article { padding: 22px; }
    .resource-next, .tour-convert, .growth-entry-section { border-radius: 24px; }
    .tour-tab { justify-content: flex-start; }
    .phone-frame { width: min(285px, 90%); }
  }

  /* One editorial scale overrides legacy page-specific display sizes.
     Keep semantic heading levels; visual prominence follows reading context. */
  main[id] h1 {
    max-width: 28ch;
    font-size: var(--type-title);
    font-weight: 650;
    line-height: 1.2;
    letter-spacing: -.025em;
    text-wrap: balance;
    margin-bottom: 18px;
  }
  main[id] h2 {
    max-width: 42ch;
    font-size: var(--type-section);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -.015em;
    text-wrap: pretty;
    margin-bottom: 14px;
  }
  main[id] h3 {
    font-size: var(--type-card);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0;
    text-wrap: pretty;
  }
  main[id] .resource-content h2 { font-size: var(--type-article); }
  main[id] :is(.resource-card, .readiness-gates, .purchase-aside, .tour-summary) h2 {
    font-size: 1.25rem;
    line-height: 1.35;
  }
  main[id] .tour-canvas-title h3 { font-size: 1.25rem; }
  main[id] :is(.section-heading, .resource-content, .hero-copy, .resource-hero, .feature-hero-copy, .tour-hero) > p {
    max-width: 68ch;
    font-size: 1.0625rem;
    line-height: 1.65;
  }
  /* Prose should not inherit the full width reserved for diagrams and tables. */
  .resource-content > section > p,
  .pricing-disclosure p,
  .growth-entry-copy > p,
  .trust-bento-card p,
  .scope-note { max-width: 68ch; }
  .feature-value-strip p,
  .health-check-form label span,
  .health-check-dimension legend { font-size: .9375rem; }
  .resource-content > section > :is(ul, ol) { max-width: 68ch; }
  .section-heading { max-width: 780px; margin-bottom: 26px; }
  .section { padding-block: clamp(38px, 4vw, 60px); }
  .resource-body { padding-block: 36px 56px; }
  .resource-content > section { padding-bottom: 38px; }
  .hero { align-items: start; padding-top: 42px; }
  .hero-copy { padding-top: 16px; }
  .hero-kicker-row { gap: 10px; }
  .hero-copy h1 { margin-top: 18px; }
  .eyebrow, .resource-card-meta {
    font-weight: 600;
    letter-spacing: .025em;
    text-transform: none;
  }
  .eyebrow::before { width: 18px; }
  .button { font-weight: 650; }
  .journey-card h3, .growth-entry-grid h3 { margin-top: 22px; }
  @media (max-width: 680px) {
    .hero { padding-top: 24px; }
    .hero-copy { padding-top: 0; }
    main[id] :is(.section-heading, .resource-content, .hero-copy, .resource-hero, .feature-hero-copy, .tour-hero) > p { font-size: 1rem; }
    .resource-hero { padding-top: 32px; }
  }

  /* Graphic-first explanations: color identifies the work, never the only label. */
  .flow-story-panel { max-width: 920px; margin: 28px 0 30px; }
  .flow-story-panel figcaption {
    margin-bottom: 10px;
    color: #315873;
    font-size: .875rem;
    font-weight: 700;
  }
  .flow-story {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    border: 1px solid #c7dce4;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 4px 0 #d8e8e9, 0 18px 32px #264d6517;
    list-style: none;
  }
  .flow-story-hero { margin-top: 27px; }
  .flow-step {
    --step-color: #1e6495;
    --step-wash: #eef5fb;
    position: relative;
    min-width: 0;
    min-height: 116px;
    padding: 13px 16px 16px;
    border-top: 4px solid var(--step-color);
    background: linear-gradient(155deg, #fff 35%, var(--step-wash));
  }
  .flow-step + .flow-step { border-left: 1px solid #dce9e9; }
  .flow-step:not(:last-child)::after {
    position: absolute;
    z-index: 1;
    top: 51px;
    right: -5px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #527689;
    border-right: 2px solid #527689;
    background: transparent;
    content: "";
    transform: rotate(45deg);
  }
  .flow-index {
    display: inline-grid;
    width: 27px;
    height: 27px;
    place-items: center;
    border-radius: 9px;
    color: #fff;
    background: var(--step-color);
    font-size: .7rem;
    font-weight: 750;
  }
  .flow-step strong, .flow-step small { display: block; }
  .flow-step strong { margin-top: 9px; color: var(--sp-ink); font-size: 1rem; line-height: 1.2; }
  .flow-step small { margin-top: 4px; color: #4b6472; font-size: .875rem; line-height: 1.5; }
  .flow-step-blue { --step-color: #2468a0; --step-wash: #e9f3fb; }
  .flow-step-teal { --step-color: #20836f; --step-wash: #e7f6ef; }
  .flow-step-amber { --step-color: #95571e; --step-wash: #fff3e6; }
  .flow-step-violet { --step-color: #6959a0; --step-wash: #f1eefb; }
  .flow-story-pricing { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .flow-story-pricing .flow-step:not(:last-child)::after {
    top: 49px;
    right: -7px;
    width: 12px;
    height: 12px;
    border: 0;
    background: linear-gradient(#527689, #527689) center / 12px 2px no-repeat,
      linear-gradient(#527689, #527689) center / 2px 12px no-repeat;
    transform: none;
  }
  .cost-story { max-width: 840px; margin-bottom: 8px; }
  .cost-story p { margin: 13px 0 0; color: var(--sp-muted); font-size: .875rem; }
  .cost-story a { font-weight: 700; }
  .college-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(400px, .94fr);
    gap: 24px 46px;
    align-items: center;
  }
  .college-hero .breadcrumb { grid-column: 1 / -1; }
  .college-hero-copy { min-width: 0; }
  .college-hero-copy h1 { margin-top: 16px; }
  .college-story { min-width: 0; margin: 0; }
  .college-story .flow-story { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .college-story .flow-step { min-height: 154px; padding: 18px; }
  .college-story .flow-step:nth-child(3) { border-left: 0; }
  .college-story .flow-step:nth-child(n + 3) { border-top: 4px solid var(--step-color); }
  .college-story .flow-step:nth-child(2)::after { display: none; }
  .resource-hub-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(380px, .98fr);
    gap: 25px 46px;
    align-items: center;
  }
  .resource-hub-hero .breadcrumb { grid-column: 1 / -1; }
  .resource-hub-copy { min-width: 0; }
  .resource-hub-copy h1 { margin-top: 16px; }
  .resource-hub-note { max-width: 60ch; margin: 18px 0 0; color: #536979; font-size: .875rem; line-height: 1.55; }
  .decision-compass {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    min-width: 0;
  }
  .decision-compass a {
    --compass-color: #2468a0;
    --compass-wash: #e9f3fb;
    display: flex;
    min-height: 150px;
    flex-direction: column;
    align-items: flex-start;
    border: 1px solid #c8dce3;
    border-top: 4px solid var(--compass-color);
    border-radius: 18px 18px 26px 12px;
    padding: 18px;
    color: var(--sp-ink);
    background: linear-gradient(145deg, #fff 30%, var(--compass-wash));
    box-shadow: var(--sp-raised);
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease;
  }
  .decision-compass a:nth-child(2) { --compass-color: #95571e; --compass-wash: #fff3e6; }
  .decision-compass a:nth-child(3) { --compass-color: #20836f; --compass-wash: #e7f6ef; }
  .decision-compass a:nth-child(4) { --compass-color: #6959a0; --compass-wash: #f1eefb; }
  .decision-compass span {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    border-radius: 9px;
    color: #fff;
    background: var(--compass-color);
    font-size: .7rem;
    font-weight: 750;
  }
  .decision-compass strong { margin-top: 18px; font-size: 1.1rem; line-height: 1.2; }
  .decision-compass small { margin-top: 4px; color: #4b6472; font-size: .825rem; line-height: 1.4; }
  @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .decision-compass a:hover { transform: translateY(-3px); box-shadow: 0 6px 0 #d8e8e9, 0 23px 36px #264d6520; }
  }

  /* More color on decision surfaces, without turning every section into a banner. */
  :is(.decision-grid article, .proof-grid article, .resource-card, .pricing-card, .price-card) {
    --card-accent: #266ea3;
    --card-wash: #e7f3fa;
    border-top: 3px solid var(--card-accent);
    background: radial-gradient(circle at 96% 3%, var(--card-wash), transparent 48%), #fff;
  }
  :is(.decision-grid article, .proof-grid article, .resource-card, .pricing-card, .price-card):nth-child(4n + 2) {
    --card-accent: #218470;
    --card-wash: #e7f6ed;
  }
  :is(.decision-grid article, .proof-grid article, .resource-card, .pricing-card, .price-card):nth-child(4n + 3) {
    --card-accent: #a96b2d;
    --card-wash: #fff3e5;
  }
  :is(.decision-grid article, .proof-grid article, .resource-card, .pricing-card, .price-card):nth-child(4n + 4) {
    --card-accent: #6a5aa3;
    --card-wash: #f1eefb;
  }
  .pricing-card.featured, .price-card.featured { background: linear-gradient(155deg, #fff, #e8f5ef); }
  .journey-card { min-height: 165px; padding: 22px; border-top: 3px solid var(--card-accent); }
  .journey-card h3 { margin: 13px 0 5px; }
  .journey-card p { line-height: 1.5; }
  .proof-grid article { padding: 22px; }
  .proof-grid article h3 { margin-top: 0; }
  .proof-grid article p { margin-bottom: 0; line-height: 1.5; }
  .home-feature-map a { border-left: 4px solid #2468a0; padding: 16px 18px; }
  .home-feature-map a:nth-child(3n + 2) { border-left-color: #20836f; }
  .home-feature-map a:nth-child(3n) { border-left-color: #ad6d2c; }
  .home-feature-map a::after {
    position: absolute;
    top: 16px;
    right: 18px;
    width: 8px;
    height: 8px;
    border-top: 2px solid #5b8495;
    border-right: 2px solid #5b8495;
    content: "";
  }

  /* Progressive disclosure keeps detailed evidence available without a link wall. */
  .resource-more {
    max-width: 68ch;
    margin-top: 18px;
    border: 1px solid #c6dce2;
    border-radius: 15px;
    background: #f8fcfb;
  }
  .resource-more summary {
    cursor: pointer;
    padding: 12px 16px;
    color: #175c6e;
    font-weight: 700;
  }
  .resource-more[open] summary { border-bottom: 1px solid #d7e8e9; }
  .resource-more .resource-links { gap: 8px 16px; margin: 0; padding: 14px 16px 16px; }
  .resource-more .resource-links a { color: #17558a; font-size: .9rem; font-weight: 650; }
  .resource-more-detail { margin-block: 16px; }
  .resource-more-detail :is(ul, ol) { margin: 0; padding: 14px 24px 18px 38px; }
  .resource-more-detail li + li { margin-top: 9px; }

  @media (max-width: 900px) {
    .college-hero, .resource-hub-hero { display: block; }
    .college-story { margin-top: 26px; }
    .college-story .flow-step { min-height: 116px; padding: 13px 16px; }
    .decision-compass { margin-top: 28px; }
  }
  @media (max-width: 680px) {
    .site-header {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      column-gap: 10px;
      row-gap: 2px;
      padding: 10px 18px 8px;
    }
    .site-header .brand { grid-column: 1; grid-row: 1; }
    .site-header .brand img { width: clamp(105px, 30vw, 145px); }
    .site-header .header-actions {
      display: flex;
      grid-column: 2;
      grid-row: 1;
      justify-content: flex-end;
      align-items: center;
      flex-direction: row;
      width: auto;
      gap: 8px;
    }
    .site-header .header-actions .text-link { font-size: .75rem; }
    .site-header .header-actions .button {
      width: auto;
      min-height: 36px;
      padding: 6px 9px;
      font-size: .75rem;
      line-height: 1.15;
      text-align: center;
      white-space: normal;
    }
    .site-header .nav-links {
      grid-column: 1 / -1;
      grid-row: 2;
      width: 100%;
      gap: 18px;
      margin: 0;
      padding: 5px 1px 3px;
    }
    .site-header .nav-links a { padding-block: 6px; }
    .flow-story { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .flow-step { min-height: 101px; padding: 11px 12px 13px; }
    .flow-step:nth-child(3) { border-left: 0; }
    .flow-step:nth-child(n + 3) { border-top: 1px solid #dce9e9; }
    .flow-step:nth-child(2)::after { display: none; }
    .flow-story-pricing { grid-template-columns: 1fr; }
    .flow-story-pricing .flow-step {
      display: grid;
      grid-template-columns: 28px minmax(0, 1fr);
      gap: 2px 10px;
      min-height: 0;
      padding: 10px 13px;
      border-left: 0;
      border-top: 1px solid #dce9e9;
    }
    .flow-story-pricing .flow-step:first-child { border-top: 4px solid var(--step-color); }
    .flow-story-pricing .flow-step::after { display: none; }
    .flow-story-pricing .flow-step strong { margin: 0; }
    .flow-story-pricing .flow-step small { grid-column: 2; margin: 0; }
    .college-story .flow-step { min-height: 101px; padding: 11px 12px 13px; }
    .decision-compass a { min-height: 112px; padding: 13px; }
    .decision-compass strong { margin-top: 10px; }
    .resource-hero { padding-bottom: 22px; }
    .flow-story-panel { margin-block: 20px 24px; }
    .journey-card { min-height: 0; }
  }
}