/* One interior guide for public-page breadcrumbs, hero copy and section tabs. */
:root {
    --site-content-inset: clamp(20px, 2.6vw, 40px);
    --site-type-page-title: clamp(44px, 4.6vw, 62px);
    --site-type-section-title: clamp(24px, 2.25vw, 32px);
    --site-type-card-title: clamp(18px, 1.55vw, 22px);
    --site-type-lede: clamp(15px, 1.12vw, 17px);
}

/* Public typography contract. Page-specific skins may change colour and
   decoration, but navigation and semantic text roles must not change family
   or scale when a visitor moves between modules. The home page keeps its own
   editorial hierarchy and acts as the visual baseline. */
body:not([data-home="1"]):not(.admin-body) {
    font-family: var(--ui);
    font-size: 16px;
    line-height: 1.55;
}

.topbar .topnav > a,
.topbar .topnav-dd-trigger,
.topbar .topnav-dd-menu a,
.topbar .player-search input,
.topbar .lang-switch button,
.mobile-drawer .md-nav a {
    font-family: var(--ui) !important;
}

.topbar .topnav > a,
.topbar .topnav-dd-trigger {
    font-size: 14px !important;
    line-height: 1.2 !important;
}

/* The game shell exposes the full menu on laptop widths. Keep that responsive
   behaviour, but do not let it introduce a smaller navigation type scale. */
body[data-game] .topbar .topnav > a,
body[data-game] .topbar .topnav-dd-trigger {
    font-family: var(--ui) !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
}

body:not([data-home="1"]):not(.admin-body) :is(
    .stats-hub-hero h1,
    .stats-hero h1,
    .content-index-head h1,
    .content-document > header h1,
    .community-hero h1,
    .community-module-copy h1,
    .legal-head h1,
    .acc-head h1,
    .broadcast-head h1,
    .auth-main h1,
    .game-shell .gmw-tool-head h1,
    .game-shell #game-hub-title,
    .tournament-directory-hero h1,
    .tournament-hero-copy h1
) {
    font-family: var(--display) !important;
    font-size: var(--site-type-page-title) !important;
    font-weight: 600 !important;
    line-height: 1.02 !important;
    letter-spacing: -.02em;
}

/* On Hall of Fame the record heading is the page's visual title; the compact
   command-bar label above it intentionally remains a navigation heading. */
.hof-records-head h2 {
    font-family: var(--display) !important;
    font-size: clamp(38px, 4.2vw, 56px) !important;
    font-weight: 600 !important;
    line-height: 1.02 !important;
}

body:not([data-home="1"]):not(.admin-body) :is(
    .content-body h2,
    .content-releases > h2,
    .community-card > header h2,
    .legal-document h2,
    .acc-section-head h2,
    .broadcast-section h2,
    .game-shell .section-head h2,
    .game-shell .group-title h2
) {
    font-family: var(--display) !important;
    font-size: var(--site-type-section-title) !important;
    font-weight: 700 !important;
    line-height: 1.12 !important;
}

body:not([data-home="1"]):not(.admin-body) :is(
    .content-index-card h2,
    .stats-panel > header h2,
    .stats-data-panel > header h2,
    .community-action h2
) {
    font-family: var(--display) !important;
    font-size: var(--site-type-card-title) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

body:not([data-home="1"]):not(.admin-body) :is(
    .stats-hub-hero > p,
    .stats-hero > p:last-of-type,
    .content-index-head > p,
    .content-document > header > p,
    .community-hero > p:last-child,
    .community-module-copy > p:not(.eyebrow),
    .legal-head p,
    .broadcast-head p,
    .auth-lede,
    .game-shell .gmw-tool-head > p,
    .game-shell .cs-hub-identity > p
) {
    font-family: var(--ui) !important;
    font-size: var(--site-type-lede) !important;
    line-height: 1.55 !important;
}

body:not([data-home="1"]):not(.admin-body) :is(
    .eyebrow,
    .acc-kicker,
    .content-index-head > span,
    .content-document > header > span,
    .broadcast-head > div > span,
    .hof-title > span,
    .hof-records-head span
) {
    font-family: var(--mono) !important;
}

.stats-hub .stats-game-identity h2 {
    font-family: var(--display) !important;
    font-size: clamp(28px, 2.6vw, 36px) !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
}

.site-breadcrumbs {
    padding-inline: var(--site-content-inset) !important;
}

/* Breadcrumbs and the page shell form one vertical stack. Individual modules
   still own their top margin when breadcrumbs are absent (home, embeds, etc.),
   but must not add a second hero-sized spacer below the shared trail. */
.site-breadcrumbs + main {
    margin-top: clamp(18px, 1.6vw, 26px) !important;
}

.ts3e-hero-copy {
    padding-inline-start: var(--site-content-inset) !important;
}

.ts3e-nav {
    padding-inline: var(--site-content-inset) !important;
}

.ts3e-nav > a:first-child {
    margin-inline-start: 0 !important;
}

body[data-game] .cs-hub-hero-inner {
    padding-inline: var(--site-content-inset) !important;
}

body[data-game] main.game-shell > .game-subnav-cs,
body[data-hub="1"] main.game-shell > .game-subnav-cs {
    padding-inline: var(--site-content-inset) !important;
}

.stats-page > .stats-hero,
.stats-page > .stats-tabs,
.q3-live-content > .q3-live-head,
.legal-page > .legal-head,
.legal-page > .legal-tabs,
.history-page .history-hero {
    padding-inline: var(--site-content-inset) !important;
}

.community-page {
    padding-inline: 0 !important;
}

.community-page > .community-hero,
.community-page .community-module-copy,
.community-page > .community-tabs,
.community-page .community-module-tabs,
.community-page > .tournament-directory-hero,
.tournament-hub .tournament-hero-copy {
    padding-inline: var(--site-content-inset) !important;
}

/* Long legal document names contain words that cannot wrap naturally. Stack
   the metadata before the left column becomes narrow enough to collide. */
@media (max-width: 1280px) {
    .legal-head {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
    }

    .legal-head-meta {
        width: min(100%, 420px);
        justify-self: start;
    }
}

@media (max-width: 760px) {
    :root {
        --site-content-inset: 18px;
        --site-type-page-title: clamp(34px, 10.8vw, 44px);
        --site-type-section-title: clamp(22px, 7vw, 28px);
        --site-type-card-title: 18px;
    }

    .site-breadcrumbs + main {
        margin-top: 14px !important;
    }
}