:root {
  --ink: #172126;
  --muted: #67757a;
  --paper: #f4f2ed;
  --white: #fffdf8;
  --line: #d8d9d2;
  --cyan: #62d4d0;
  --cyan-deep: #0d8f8d;
  --coral: #f47769;
  --gold: #f2c75c;
  --night: #172126;
  --display: 'Manrope', sans-serif;
  --mono: 'DM Mono', monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--display); }
a { color: inherit; text-decoration: none; }
.page-shell { overflow: clip; }
.container-fluid { max-width: 1440px; }
.topbar { align-items: center; background: rgba(244, 242, 237, .9); display: flex; gap: 28px; justify-content: space-between; max-width: none; min-height: 74px; position: sticky; top: 0; transition: min-height .35s ease, padding .35s ease, box-shadow .35s ease, background-color .35s ease; width: 100%; z-index: 10; }
.topbar.is-compact { background: rgba(244, 242, 237, .97); box-shadow: 0 8px 24px rgba(23, 33, 38, .08); min-height: 56px; padding-bottom: .65rem !important; padding-top: .65rem !important; }
.brand-mark { align-items: center; display: flex; flex-shrink: 0; font-size: .76rem; gap: 10px; letter-spacing: .06em; text-transform: uppercase; transition: font-size .35s ease, gap .35s ease; }
.topbar.is-compact .brand-mark { font-size: .68rem; gap: 7px; }
.brand-mark strong { font-weight: 800; }
.brand-mark__icon { align-items: center; background: var(--ink); color: var(--cyan); display: inline-flex; font-family: var(--mono); font-size: .7rem; height: 31px; justify-content: center; transition: height .35s ease, width .35s ease, font-size .35s ease; width: 38px; }
.topbar.is-compact .brand-mark__icon { font-size: .6rem; height: 25px; width: 32px; }
.topbar__meta { align-items: center; color: var(--muted); display: flex; font-family: var(--mono); font-size: .66rem; gap: 11px; text-transform: uppercase; }
.topbar__date { border-left: 1px solid var(--line); padding-left: 11px; }
.status-dot { background: var(--coral); border-radius: 50%; height: 7px; width: 7px; }
.zse-link { color: var(--ink); font-family: var(--mono); font-size: .65rem; font-weight: 500; text-transform: uppercase; }
.zse-link i { color: var(--coral); margin-left: 4px; }
.zse-link:hover { color: var(--coral); }
.section-nav { align-items: center; display: flex; flex: 1; gap: clamp(14px, 2.2vw, 31px); justify-content: center; }
.section-nav a { color: var(--muted); font-family: var(--mono); font-size: .76rem; position: relative; text-transform: uppercase; }
.section-nav a::after { background: var(--coral); bottom: -7px; content: ''; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; width: 100%; }
.section-nav a:hover, .section-nav a:focus-visible { color: var(--ink); }
.section-nav a:hover::after, .section-nav a:focus-visible::after { transform: scaleX(1); }
.menu-toggle, .nav-backdrop, .offcanvas-head, .section-nav#mobile-nav { display: none; }
.offcanvas-close { background: transparent; border: 0; color: var(--ink); font-size: .85rem; padding: 8px; }
.menu-is-open { overflow: hidden; }
.hero { align-items: flex-end; background: radial-gradient(circle at 83% 38%, rgba(98, 212, 208, .2), transparent 25%), linear-gradient(115deg, var(--paper) 0%, #e8ede5 100%); display: flex; justify-content: space-between; min-height: 570px; padding-bottom: 84px; padding-top: 76px; position: relative; }
.hero::before { border: 1px solid rgba(23, 33, 38, .08); border-radius: 50%; content: ''; height: 560px; position: absolute; right: 9%; top: -140px; width: 560px; }
.hero__copy { position: relative; z-index: 1; }
.eyebrow { color: var(--cyan-deep); font-family: var(--mono); font-size: .68rem; letter-spacing: .09em; margin: 0 0 17px; text-transform: uppercase; }
.eyebrow span { color: var(--muted); padding: 0 8px; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(3.5rem, 8vw, 7.8rem); font-weight: 800; letter-spacing: -.07em; line-height: .9; margin-bottom: 30px; }
h1 em { color: var(--coral); font-style: normal; }
.hero__lead { color: var(--muted); font-size: 1rem; line-height: 1.65; margin-bottom: 25px; max-width: 370px; }
.text-link { border-bottom: 1px solid var(--ink); display: inline-flex; font-size: .76rem; font-weight: 800; gap: 12px; padding-bottom: 7px; }
.hero__signal { align-items: center; display: flex; flex-direction: column; margin-right: 17%; position: relative; z-index: 1; }
.signal-ring { align-items: center; border: 1px solid var(--ink); border-radius: 50%; display: flex; height: 232px; justify-content: center; position: relative; width: 232px; }
.signal-ring::before { border: 13px solid var(--cyan); border-left-color: transparent; border-radius: 50%; content: ''; height: 193px; position: absolute; transform: rotate(37deg); width: 193px; }
.signal-ring > span { font-size: 2.7rem; font-weight: 800; letter-spacing: -.08em; position: relative; }
.signal-ring__unit { color: var(--coral); font-size: 1.2rem; margin-left: 3px; }
.hero__signal p { color: var(--muted); font-family: var(--mono); font-size: .61rem; line-height: 1.5; margin: 18px 0 0; text-align: center; text-transform: uppercase; }
.hero__signal strong { color: var(--ink); font-family: var(--display); font-size: .7rem; }
.hero__note { bottom: 30px; color: var(--muted); font-family: var(--mono); font-size: .65rem; position: absolute; right: 20px; transform: rotate(-90deg); transform-origin: right; }
.hero__note span { color: var(--ink); margin-left: 16px; }
.section { padding-bottom: 112px; padding-top: 105px; }
.section-heading { align-items: flex-end; display: flex; justify-content: space-between; margin-bottom: 46px; }
.section-heading h2, .methodology h2 { font-size: clamp(2rem, 4.5vw, 4rem); font-weight: 800; letter-spacing: -.07em; line-height: .96; margin: 0; }
.section-heading__aside { color: var(--muted); font-family: var(--mono); font-size: .68rem; line-height: 1.7; margin: 0; text-align: right; }
.kpi-card { border-top: 2px solid var(--ink); min-height: 178px; padding: 20px 0 17px; position: relative; }
.kpi-card::after { background: currentColor; bottom: 0; content: ''; height: 4px; left: 0; position: absolute; width: 40px; }
.kpi-card--cyan { color: var(--cyan-deep); }.kpi-card--dark { color: var(--ink); }.kpi-card--coral { color: var(--coral); }.kpi-card--gold { color: #b18720; }
.kpi-card p { color: var(--muted); font-size: .72rem; margin-bottom: 21px; }
.kpi-card strong { color: var(--ink); display: block; font-size: clamp(2.2rem, 4vw, 3.35rem); font-weight: 800; letter-spacing: -.08em; line-height: 1; }
.kpi-card span { color: var(--muted); display: block; font-family: var(--mono); font-size: .62rem; margin-top: 13px; }
.section--contrast { background: var(--night); color: var(--white); max-width: none; }
.section--contrast > * { margin-left: auto; margin-right: auto; max-width: 1344px; }
.section-heading--light .eyebrow { color: var(--cyan); }.section-heading--light .section-heading__aside { color: #9ca9aa; }.section-heading--light strong { color: var(--cyan); }
.school-comparison__labels { color: #9ca9aa; display: flex; font-family: var(--mono); font-size: .61rem; justify-content: space-between; margin-bottom: 13px; text-transform: uppercase; }
.school-bars { border-bottom: 1px solid #364348; padding-bottom: 8px; }
.school-row { align-items: center; display: grid; gap: 20px; grid-template-columns: minmax(190px, 1.1fr) 3fr; margin: 22px 0; }
.school-row__label strong { display: block; font-size: .92rem; font-weight: 700; }.school-row__label span { color: #8e9a9c; font-family: var(--mono); font-size: .6rem; }
.school-row__track { background: #2a373b; height: 28px; }.school-row__fill { align-items: center; animation: grow .9s cubic-bezier(.2,.8,.2,1) both; background: var(--cyan); color: var(--ink); display: flex; height: 100%; justify-content: flex-end; min-width: 65px; padding-right: 9px; width: var(--bar-width); }.school-row__fill--coral { background: var(--coral); }.school-row__fill--gold { background: var(--gold); }.school-row__fill span { font-family: var(--mono); font-size: .65rem; font-weight: 500; }
.school-insight { border-left: 2px solid var(--white); min-height: 132px; padding: 5px 0 4px 17px; }.school-insight--coral { border-color: var(--coral); }.school-insight--gold { border-color: var(--gold); }.school-insight span { color: #9ca9aa; display: block; font-size: .72rem; margin-bottom: 14px; }.school-insight strong { color: var(--white); display: block; font-size: 2.35rem; letter-spacing: -.07em; line-height: 1; }.school-insight p { color: #9ca9aa; font-family: var(--mono); font-size: .6rem; line-height: 1.5; margin: 10px 0 0; }
.controls { border-bottom: 1px solid var(--line); padding-bottom: 17px; }.segmented { background: #e3e3dc; display: inline-flex; padding: 4px; }.segmented__button { background: transparent; border: 0; color: var(--muted); font-family: var(--mono); font-size: .64rem; padding: 10px 16px; text-transform: uppercase; }.segmented__button.is-active { background: var(--ink); color: var(--white); }.search-field { align-items: center; border-bottom: 1px solid var(--ink); display: flex; gap: 9px; max-width: 255px; padding: 8px 0; width: 100%; }.search-field i { color: var(--cyan-deep); }.search-field input { background: transparent; border: 0; font-family: var(--mono); font-size: .67rem; outline: 0; width: 100%; }.table-wrap { overflow-x: auto; }.results-table { border-collapse: collapse; min-width: 720px; width: 100%; }.results-table th, .results-table td { border-bottom: 1px solid var(--line); padding: 18px 12px; text-align: right; white-space: nowrap; }.results-table thead th { color: var(--muted); font-family: var(--mono); font-size: .6rem; font-weight: 400; text-transform: uppercase; }.results-table th:first-child, .results-table td:first-child { padding-left: 0; text-align: left; }.results-table tbody th { font-size: .88rem; font-weight: 700; }.results-table tbody td { color: var(--muted); font-family: var(--mono); font-size: .68rem; }.results-table tbody td strong { color: var(--ink); font-size: .82rem; }.subject-index { color: var(--cyan-deep); display: inline-block; font-family: var(--mono); font-size: .58rem; margin-right: 18px; }.mono { font-family: var(--mono); }.success-pill { background: var(--cyan); color: var(--ink); display: inline-block; font-weight: 500; padding: 5px 7px; }.not-published { color: #a7acab; }.spread { align-items: center; display: inline-flex; gap: 8px; }.spread i { background: var(--coral); display: inline-block; height: 4px; width: var(--spread); }.table-note { color: var(--muted); font-family: var(--mono); font-size: .61rem; margin: 19px 0 0; }.table-note i { color: var(--cyan-deep); margin-right: 6px; }
.section--warm { background: #ebe4d7; max-width: none; }.section--warm > * { margin-left: auto; margin-right: auto; max-width: 1344px; }.comparison-panel { border-top: 2px solid var(--ink); }.comparison-panel__toolbar { align-items: center; display: flex; justify-content: space-between; padding: 17px 0 28px; }.segmented--small .segmented__button { padding: 8px 13px; }.mono-label { color: var(--muted); font-family: var(--mono); font-size: .61rem; text-transform: uppercase; }.comparison-chart { display: grid; gap: 22px 34px; grid-template-columns: repeat(2, minmax(0, 1fr)); }.chart-item { border-bottom: 1px solid #cec6b8; padding-bottom: 14px; }.chart-item__heading { align-items: center; display: flex; justify-content: space-between; margin-bottom: 11px; }.chart-item__heading strong { font-size: .77rem; }.chart-item__heading span { color: var(--coral); font-family: var(--mono); font-size: .59rem; }.chart-item__bars { display: flex; flex-direction: column; gap: 5px; }.chart-bar { align-items: center; background: var(--cyan); color: var(--ink); display: flex; font-family: var(--mono); font-size: .59rem; height: 20px; justify-content: space-between; padding: 0 7px; width: var(--bar-width); }.chart-bar--coral { background: var(--coral); }.chart-bar b { font-weight: 500; }
.insight-card { min-height: 230px; padding: 22px; position: relative; }.insight-card--cyan { background: var(--cyan); }.insight-card--coral { background: var(--coral); }.insight-card--gold { background: var(--gold); }.insight-card__number { font-family: var(--mono); font-size: .65rem; }.insight-card h3 { font-size: 1.35rem; letter-spacing: -.05em; margin: 65px 0 12px; }.insight-card p { font-size: .77rem; line-height: 1.5; max-width: 295px; }.insight-card > i { bottom: 21px; font-size: 1.1rem; position: absolute; right: 22px; }
.methodology { background: var(--cyan); display: grid; gap: 50px; grid-template-columns: 1fr 1fr; max-width: none; padding-bottom: 92px; padding-top: 91px; }.methodology > * { margin-left: auto; margin-right: auto; max-width: 650px; width: 100%; }.methodology .eyebrow { color: var(--ink); }.methodology__details > p { font-size: 1.25rem; letter-spacing: -.03em; line-height: 1.4; margin: 27px 0 55px; max-width: 470px; }.methodology__facts { border-top: 1px solid rgba(23,33,38,.34); display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); padding-top: 16px; }.methodology__facts span, .methodology__facts small { color: rgba(23,33,38,.65); display: block; font-family: var(--mono); font-size: .59rem; line-height: 1.45; }.methodology__facts strong { display: block; font-size: 1.2rem; margin: 13px 0 7px; }.footer { align-items: center; background: var(--cyan); border-top: 1px solid rgba(23,33,38,.25); display: flex; font-family: var(--mono); font-size: .61rem; justify-content: space-between; text-transform: uppercase; }.footer a { border-bottom: 1px solid var(--ink); padding-bottom: 4px; }
.empty-state { color: var(--muted); font-family: var(--mono); font-size: .75rem; padding: 30px 0; }
.footer { max-width: none; width: 100%; }
.footer__links { align-items: center; display: flex; gap: 25px; }
.footer .zse-link { border-bottom: 0; padding-bottom: 0; }
.footer .cke-link { border-bottom: 0; padding-bottom: 0; }
.reveal-section { opacity: 0; transform: translateY(34px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal-section.is-visible { opacity: 1; transform: translateY(0); }
.reveal-section.is-visible .section-heading,
.reveal-section.is-visible .kpi-card,
.reveal-section.is-visible .school-row,
.reveal-section.is-visible .comparison-panel,
.reveal-section.is-visible .insight-card,
.reveal-section.is-visible .methodology__details { animation: reveal-child .7s both; }
.reveal-section .school-row__fill,
.reveal-section .chart-bar { animation: none; transform: scaleX(0); transform-origin: left; }
.reveal-section.is-visible .school-row__fill,
.reveal-section.is-visible .chart-bar { animation: grow .9s cubic-bezier(.2,.8,.2,1) both; }
.reveal-section.is-visible .school-row:nth-child(2) .school-row__fill,
.reveal-section.is-visible .chart-item:nth-child(2) .chart-bar { animation-delay: .08s; }
.reveal-section.is-visible .school-row:nth-child(3) .school-row__fill,
.reveal-section.is-visible .chart-item:nth-child(3) .chart-bar { animation-delay: .16s; }
.reveal-section.is-visible .chart-item:nth-child(4) .chart-bar { animation-delay: .24s; }
.reveal-section.is-visible .chart-item:nth-child(5) .chart-bar { animation-delay: .32s; }
.reveal-section.is-visible .chart-item:nth-child(6) .chart-bar { animation-delay: .4s; }
.reveal-section.is-visible .chart-item:nth-child(7) .chart-bar { animation-delay: .48s; }
.reveal-section.is-visible .chart-item:nth-child(8) .chart-bar { animation-delay: .56s; }
.reveal-section.is-visible .kpi-card:nth-child(2),
.reveal-section.is-visible .school-row:nth-child(2),
.reveal-section.is-visible .insight-card:nth-child(2) { animation-delay: .08s; }
.reveal-section.is-visible .kpi-card:nth-child(3),
.reveal-section.is-visible .school-row:nth-child(3),
.reveal-section.is-visible .insight-card:nth-child(3) { animation-delay: .16s; }
.reveal-section.is-visible .kpi-card:nth-child(4) { animation-delay: .24s; }
button, a, input { transition: opacity .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease; } button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid var(--coral); outline-offset: 3px; }.text-link:hover, .footer a:hover { opacity: .65; }
@keyframes grow { from { transform: scaleX(0); transform-origin: left; } to { transform: scaleX(1); transform-origin: left; } }
@keyframes reveal-child { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 767px) { .topbar { flex-wrap: wrap; gap: 12px; min-height: 72px; }.topbar__meta { margin-left: auto; }.topbar__meta .zse-link, .topbar__meta .status-dot, .topbar__meta > span:not(.topbar__date) { display: none; }.topbar__date { display: block; }.menu-toggle { align-items: center; background: var(--ink); border: 0; color: var(--white); display: inline-flex; font-family: var(--mono); font-size: .64rem; gap: 9px; padding: 10px 13px; text-transform: uppercase; }.menu-toggle i { color: var(--cyan); font-size: 1.1rem; line-height: 1; }.nav-backdrop { background: rgba(23, 33, 38, .52); display: block; inset: 0; opacity: 0; pointer-events: none; position: fixed; transition: opacity .35s ease; z-index: 19; }.nav-backdrop.is-visible { opacity: 1; pointer-events: auto; }.section-nav#mobile-nav { align-items: stretch; background: var(--paper); box-shadow: -18px 0 40px rgba(23, 33, 38, .16); display: flex; flex-direction: column; gap: 0; height: 100dvh; justify-content: flex-start; max-width: min(88vw, 370px); overflow-y: auto; padding: 26px 25px; position: fixed; right: 0; top: 0; transform: translateX(100%); transition: transform .4s cubic-bezier(.2,.8,.2,1); visibility: hidden; width: 100%; z-index: 20; }.section-nav#mobile-nav.is-open { transform: translateX(0); visibility: visible; }.offcanvas-head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 48px; }.offcanvas-head .eyebrow { margin: 0; }.section-nav#mobile-nav a { align-items: baseline; border-bottom: 1px solid var(--line); color: var(--ink); display: flex; font-size: 1.35rem; justify-content: space-between; padding: 19px 0; text-transform: none; }.section-nav#mobile-nav a::after { display: none; }.section-nav#mobile-nav a span { color: var(--cyan-deep); font-family: var(--mono); font-size: .63rem; }.topbar.is-compact { min-height: 66px; }.topbar.is-compact .menu-toggle { padding-bottom: 8px; padding-top: 8px; }.hero { align-items: flex-start; flex-direction: column; min-height: 650px; padding-bottom: 60px; padding-top: 65px; }.hero__signal { align-self: flex-end; margin: 65px 4% 0 0; }.signal-ring { height: 170px; width: 170px; }.signal-ring::before { height: 142px; width: 142px; }.signal-ring > span { font-size: 2rem; }.hero__note { right: 10px; }.section { padding-bottom: 75px; padding-top: 75px; }.section-heading { align-items: flex-start; flex-direction: column; gap: 20px; margin-bottom: 32px; }.section-heading__aside { text-align: left; }.school-row { display: block; }.school-row__label { margin-bottom: 10px; }.school-row__track { height: 25px; }.comparison-chart { grid-template-columns: 1fr; }.comparison-panel__toolbar { align-items: flex-start; flex-direction: column; gap: 17px; }.methodology { display: block; padding-bottom: 70px; padding-top: 70px; }.methodology__details { margin-top: 50px; }.methodology__facts { grid-template-columns: 1fr; }.footer { align-items: flex-start; flex-direction: column; gap: 18px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }
@media (max-width: 767px) { .topbar > .section-nav { display: none; } }
