/*

https://www.fluid-type-scale.com/calculate?minFontSize=18&minWidth=768&minRatio=1.19&maxFontSize=20&maxWidth=1310&maxRatio=1.31&steps=xs%2Cs%2Cm%2Cl%2Cxl%2C2xl%2C3xl%2C4xl%2C5xl&baseStep=m&prefix=t-s&useContainerWidth=true&includeFallbacks=true&useRems=true&remValue=16&decimals=4&previewFont=Karla&previewText=Almost+before+we+knew+it%2C+we+had+left+the+ground&previewWidth=752

*/
/* For browsers that support clamp and container queries */
@supports (font-size: clamp(1rem, 1cqi, 1rem)) {
    :root {
        --t-s-xs: clamp(0.7062rem, -0.1494cqi + 0.7779rem, 0.6556rem);
        --t-s-s: clamp(0.8403rem, 0.0544cqi + 0.8142rem, 0.8588rem);
        --t-s-m: clamp(1rem, 0.369cqi + 0.8229rem, 1.125rem);
        --t-s-l: clamp(1.19rem, 0.8376cqi + 0.7879rem, 1.4738rem);
        --t-s-xl: clamp(1.4161rem, 1.5189cqi + 0.687rem, 1.9306rem);
        --t-s-2xl: clamp(1.6852rem, 2.4913cqi + 0.4893rem, 2.5291rem);
        --t-s-3xl: clamp(2.0053rem, 3.8606cqi + 0.1522rem, 3.3131rem);
        --t-s-4xl: clamp(2.3864rem, 5.7678cqi + -0.3822rem, 4.3402rem);
        --t-s-5xl: clamp(2.8398rem, 8.4012cqi + -1.1928rem, 5.6857rem);
    }
}

/* For browsers that don't support clamp or container queries */
@supports not (font-size: clamp(1rem, 1cqi, 1rem)) {
    :root {
        --t-s-xs: 0.7062rem;
        --t-s-s: 0.8403rem;
        --t-s-m: 1rem;
        --t-s-l: 1.19rem;
        --t-s-xl: 1.4161rem;
        --t-s-2xl: 1.6852rem;
        --t-s-3xl: 2.0053rem;
        --t-s-4xl: 2.3864rem;
        --t-s-5xl: 2.8398rem;
    }

    @media screen and (min-width: 1310px) {
        :root {
            --t-s-xs: 0.6556rem;
            --t-s-s: 0.8588rem;
            --t-s-m: 1.125rem;
            --t-s-l: 1.4738rem;
            --t-s-xl: 1.9306rem;
            --t-s-2xl: 2.5291rem;
            --t-s-3xl: 3.3131rem;
            --t-s-4xl: 4.3402rem;
            --t-s-5xl: 5.6857rem;
        }
    }
}

/**/
:root {
    --t-w-b: 600;
    --t-w-r: 400;
    --t-lh-xl: 120%;
    --t-lh-l: 130%;
    --t-lh-m: 140%;
    --t-lh-s: 150%;
}

body:has(#layout-2024-08) {

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-weight: var(--t-w-b) !important;
        font-family: 'Lato', sans-serif !important;
        letter-spacing: .05em !important;
    }

    p {
        font-weight: var(--t-w-r) !important;
        font-family: 'Karla', sans-serif !important;
        letter-spacing: .0em !important;
    }

    h1 {
        font-size: var(--t-s-5xl) !important;
        line-height: var(--t-lh-xl) !important;
    }

    h2 {
        font-size: var(--t-s-4xl) !important;
        line-height: var(--t-lh-xl) !important;
    }

    h3 {
        font-size: var(--t-s-3xl) !important;
        line-height: var(--t-lh-xl) !important;
    }

    h4 {
        font-size: var(--t-s-2xl) !important;
        line-height: var(--t-lh-l) !important;
    }

    h5 {
        font-size: var(--t-s-xl) !important;
        line-height: var(--t-lh-l) !important;
    }

    h6 {
        font-size: var(--t-s-l) !important;
        line-height: var(--t-lh-m) !important;
    }

    p {
        font-size: var(--t-s-m) !important;
        line-height: var(--t-lh-m) !important;
    }

    small {
        font-size: var(--t-s-s) !important;
    }

    strong {
        font-weight: var(--t-w-b) !important;
    }

    /**/
    .t-s-xs,
    .t-s-xs * {
        font-size: var(--t-s-xs) !important;
        line-height: var(--t-lh-s) !important;
    }

    .t-s-s,
    .t-s-s * {
        font-size: var(--t-s-s) !important;
        line-height: var(--t-lh-s) !important;
    }

    .t-s-m,
    .t-s-m * {
        font-size: var(--t-s-m) !important;
        line-height: var(--t-lh-m) !important;
    }

    .t-s-m-02,
    .t-s-m-02 *

    /* variant of font m – slightly bigger than m */
        {
        font-size: calc(1.1 * var(--t-s-m)) !important;
        line-height: var(--t-lh-m) !important;
    }

    .t-s-l,
    .t-s-l * {
        font-size: var(--t-s-l) !important;
        line-height: var(--t-lh-l) !important;
    }

    .t-s-xl,
    .t-s-xl * {
        font-size: var(--t-s-xl) !important;
        line-height: var(--t-lh-l) !important;
    }

    .t-s-2xl,
    .t-s-2xl * {
        font-size: var(--t-s-2xl) !important;
        line-height: var(--t-lh-l) !important;
    }

    .t-s-3xl,
    .t-s-3xl * {
        font-size: var(--t-s-3xl) !important;
        line-height: var(--t-lh-xl) !important;
    }

    .t-s-4xl,
    .t-s-4xl * {
        font-size: var(--t-s-4xl) !important;
        line-height: var(--t-lh-xl) !important;
    }

    .t-s-5xl,
    .t-s-5xl * {
        font-size: var(--t-s-5xl) !important;
        line-height: var(--t-lh-xl) !important;
    }
}

.t-tw-balanced,
.t-tw-balanced * {
    text-wrap: balance !important;
}

.t-tw-pretty,
.t-tw-pretty * {
    text-wrap: pretty !important;
}

