@font-face {
    font-family: 'Source Serif 4';
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    src: url('../fonts/source-serif-4-latin-var.woff2') format('woff2');
}

:root {
    --font-display: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --display-weight: 600;
    --display-tracking: -0.01em;
    --hairline: #E5DFD6;
    --primary: #7A6345;
}

html { font-synthesis: none; }
h1, h2, h3 { font-optical-sizing: auto; text-wrap: balance; }
.logo, .rv-footer .brand strong { font-family: var(--font-body); }
.rv-letter { font-family: var(--font-body); }

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.nowrap { white-space: nowrap; }

.rv-hero-split { padding: calc(var(--nav-height) + 2rem) 0 4.5rem; }
.rv-hero-split .wrap {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    gap: 1.5rem 3rem;
    align-items: end;
}
.rv-hero-split h1 {
    font-weight: 550;
    letter-spacing: -0.015em;
    line-height: 1.08;
    font-size: clamp(2.125rem, 1.3rem + 2.6vw, 3.125rem);
    max-width: none;
    margin-bottom: 0;
}
.rv-hero-split .lede { font-size: 1.0625rem; margin-bottom: 1.25rem; max-width: 44ch; }
.rv-hero-split .cta-buttons { gap: 0.5rem; margin-top: 0.25rem; }
.rv-hero-split .btn { padding: 0.75rem 1.25rem; }

.rv-section { padding-top: 8rem; }
.rv-updates { margin-top: 9rem; }
.rv-section h2 { display: flex; align-items: center; gap: 1rem; }
.rv-section h2::after { content: ""; flex: 1; height: 1px; background: var(--hairline); }
.rv-prose p a, .rv-stats .about-line a { color: var(--link); }

.rv-stage-grid { gap: 2.75rem 2.5rem; }
a.rv-stage { border: 0; border-radius: 0; background: transparent; padding: 0; transition: none; }
a.rv-stage:hover { border-color: transparent; }
a.rv-stage .go { color: var(--link); }
a.rv-stage:hover .go { text-decoration: underline; }
a.rv-stage:focus-visible { outline: 2px solid var(--primary); outline-offset: 6px; border-radius: 4px; }

.rv-audience-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem 2rem; }
.rv-audience h3 { font-size: 1.125rem; font-weight: 600; margin-bottom: 0.25rem; }
.rv-audience p { font-size: 0.9875rem; color: var(--text-secondary); line-height: 1.55; max-width: 38ch; }

@media (max-width: 980px) {
    .rv-hero-split .wrap { grid-template-columns: 1fr; }
    .rv-audience-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .rv-hero-split { padding: calc(var(--nav-height) + 1.25rem) 0 2.25rem; }
    .rv-hero-split .wrap { gap: 0.75rem; }
    .rv-hero-split h1 { font-size: 1.875rem; }
    .rv-hero-split .lede { font-size: 1rem; margin-bottom: 1rem; }
    .rv-hero-split .btn { padding: 0.625rem 1rem; }
    .rv-section { padding-top: 6rem; }
    .rv-updates { margin-top: 7rem; }
    .rv-stage-grid { gap: 2.25rem; }
}
@media (max-width: 560px) { .rv-audience-grid { grid-template-columns: 1fr; gap: 1.125rem; } }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

.ex-compare { padding: 1rem 0 4rem; }
.ex-compare h2 {
    font-size: 1.75rem;
    font-weight: 650;
    letter-spacing: -0.01em;
    max-width: none;
    margin: 0 0 0.75rem;
}
.ex-lede { font-size: 1.125rem; line-height: 1.5; color: var(--text-secondary); max-width: 60ch; margin: 0 0 2rem; }

.ex-grid { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 2rem 4rem; align-items: start; }

.ex-col-label {
    font-family: var(--font-body);
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--text-secondary);
    margin: 0 0 0.75rem;
}

.ex-cats { list-style: none; }
.ex-cats li, .ex-loss {
    font-family: var(--font-display);
    font-optical-sizing: auto;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.3;
    color: var(--text-primary);
}
.ex-cats li + li { margin-top: 0.25rem; }
.ex-loss {
    font-variant-numeric: tabular-nums;
    border-top: 1px solid var(--hairline);
    margin-top: 1.25rem;
    padding-top: 1.25rem;
}

.ex-spine { list-style: none; }
.ex-row {
    display: grid;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    column-gap: 1rem;
    align-items: start;
    margin-bottom: 1.5rem;
}
.ex-row:last-child { margin-bottom: 0; }
.ex-mark { grid-column: 1; grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: flex-start; gap: 0.375rem; }
.ex-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.375rem;
    color: #FFFFFF;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
}
.ex-stage { font-size: 0.8125rem; line-height: 1.4; color: var(--text-secondary); margin: 0; }
.ex-beat { grid-column: 2; font-size: 1.125rem; line-height: 1.5; color: var(--text-primary); max-width: 52ch; margin: 0; }
.ex-techs { grid-column: 2; font-size: 0.875rem; line-height: 1.6; color: var(--text-secondary); margin: 0.25rem 0 0; }


a.cm-tech { color: var(--text-primary); font-weight: 500; text-decoration: none; }
a.cm-tech:hover,
a.cm-tech:focus-visible { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
a.cm-tech:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 2px; }
.cm-id {
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums slashed-zero;
    color: var(--text-secondary);
    white-space: nowrap;
}

.ex-foot { font-size: 0.9375rem;line-height: 1.5; color: var(--text-secondary); margin: 1.5rem 0 0; }
.ex-foot a { color: var(--link); }

@media (max-width: 48rem) {
    .ex-grid { grid-template-columns: minmax(0, 1fr); }
    .ex-row { grid-template-columns: auto minmax(0, 1fr); column-gap: 0.625rem; row-gap: 0.25rem; margin-bottom: 1.25rem; }
    .ex-mark { grid-row: 1; grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 0.625rem; }
    .ex-stage { margin: 0; }
    .ex-beat, .ex-techs { grid-column: 1 / -1; }
    .ex-badge { width: 1.5rem; height: 1.5rem; font-size: 0.875rem; }
}
@media (max-width: 640px) {
    .ex-compare h2 { font-size: 1.375rem; }
    .ex-lede { font-size: 1.0625rem; }
    .ex-cats li, .ex-loss { font-size: 1.25rem; }
}
.ex-foot a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 2px; }