/* Typography roles: UI stays legible; fantasy is reserved for display copy. */

@font-face {
    font-family: 'NordicCyr';
    src: url('/fonts/nordicCyr/NordicCyr-Bold.otf') format('opentype');
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Jura';
    src: url('/fonts/jura/Jura-Bold.woff2') format('woff2');
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

:root {
    --font-fantasy: 'NordicCyr', 'Jura', sans-serif;
    --font-story: 'Philosopher', Georgia, serif;
    --font-ui: 'Golos Text', Arial, sans-serif;
}

/* NordicCyr lacks Kazakh-specific letters; keep complete Kazakh headings in Jura. */
html:lang(kk) {
    --font-fantasy: 'Jura', sans-serif;
}

/* UI typography */
body.font-sans,
.font-ui {
    font-family: var(--font-ui);
}

button,
input,
select,
textarea {
    font-family: var(--font-ui);
}

/* Fantasy headings */
.story-page .font-fantasy,
.arena-page .font-fantasy,
.arkveil-page .font-fantasy,
.font-fantasy {
    font-family: var(--font-fantasy);
    font-weight: 700;
    line-height: 1.12;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    hyphens: auto;
    text-wrap: balance;
}

/* Story text */
.font-story {
    font-family: var(--font-story);
    line-height: 1.6;
}

/* Mobile */
@media (max-width: 640px) {
    .site-header .header-tagline {
        max-width: calc(100vw - 3rem);
        white-space: normal;
        overflow-wrap: break-word;
    }
}