/* Immersify – Typography
   Text styles are the --text-* tokens in tokens.css. Heading levels carry
   them as element defaults, so ACF wysiwyg content gets them without a class.

   Fonts are self-hosted latin subsets (fonts/), preloaded from
   inc/load-assets.php. Outfit and Inter are variable fonts, so one file
   covers every weight. font-display: swap keeps text visible while they load.

   TYPOGRAPHY ONLY – the page ground lives in default.css. */

@font-face {
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 400 900;
    font-display: swap;
    src: url('../../fonts/outfit-variable-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    src: url('../../fonts/inter-variable-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Press Start 2P';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../../fonts/press-start-2p-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    font:  var(--text-16ir);
    color: var(--color-snow);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
    color:         var(--color-snow);
    margin-top:    0;
    margin-bottom: var(--space-md);
}

h1, .h1 {
    font:           var(--text-44ok);
    letter-spacing: -0.02em;

    @media (min-width: 992px) {
        font: var(--text-80ok);
    }
}

h2, .h2 {
    font:           var(--text-34ok);
    letter-spacing: -0.02em;

    @media (min-width: 768px) {
        font: var(--text-48ok);
    }
}

h3, .h3 {
    font: var(--text-24ob);
}

h4, .h4 {
    font: var(--text-20ob);
}

p {
    margin-top:    0;
    margin-bottom: var(--space-md);
}

a {
    color:           var(--color-violet);
    text-decoration: none;
    transition:      color var(--transition-base);

    &:hover {
        color: var(--color-cyan);
    }
}

strong, b {
    font-weight: 600;
    color:       var(--color-snow);
}

::selection {
    background: var(--color-violet);
    color:      var(--color-black);
}

/* Arcade label: ── SELECTED WORK */
.eyebrow {
    font:           var(--text-10pr);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color:          var(--color-violet);
    margin:         0 0 var(--space-lg);
    display:        flex;
    align-items:    center;
    gap:            10px;

    &::before {
        content:    '';
        width:      20px;
        height:     1px;
        background: currentColor;
        flex:       none;
    }

    &.is-plain::before {
        content: none;
    }
}

.text-intro {
    font:  var(--text-18ir);
    color: var(--color-silver);
}

.text-muted {
    color: var(--color-grey);
}