/* ====== TYPO ====== */

/* ----- Fonts ----- */
@font-face {
    font-family: 'League Gothic Regular';
    src: url('../fonts/league-gothic/LeagueGothic-Regular.woff2') format('woff2'),
    url('../fonts/league-gothic/LeagueGothic-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Figtree';
    src: url('../fonts/figtree/Figtree-VariableFont_wght.woff2') format("woff2 supports variations"),
    url('../fonts/figtree/Figtree-VariableFont_wght.woff2') format("woff2-variations");
    font-weight: 300 900;
    font-style: normal;
}
@font-face {
    font-family: 'Figtree';
    src: url('../fonts/figtree/Figtree-Italic-VariableFont_wght.woff2') format("woff2 supports variations"),
    url('../fonts/figtree/Figtree-Italic-VariableFont_wght.woff2') format("woff2-variations");
    font-weight: 300 900;
    font-style: italic;
}
@font-face {
    font-family: 'Myriad Pro Bold';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/myriad-pro/MYRIADPRO-BOLD.woff') format('woff');
}

:root {

    --h1-font-family: "League Gothic Regular", sans-serif !important;
    --h2l-font-size: clamp(2.5rem, 1.96rem + 1.63vw, 3.44rem);
    /* H1L: un singolo step sopra H1 */
    --h1l-font-size: clamp(
            3.83rem,               /* 2.99rem × 1.28 */
            3.32rem + 2.53vw,      /* offset + slope */
            5.60rem                /* 4.375rem × 1.28 */
    );

    /* H1XL: due step sopra H1 */
    --h1xl-font-size: clamp(
            4.90rem,               /* 2.99rem × 1.28² */
            4.25rem + 3.24vw,      /* offset + slope */
            7.17rem                /* 4.375rem × 1.28² */
    );

    /* H1XXL: tre step sopra H1 */
    --h1xxl-font-size: clamp(
            6.27rem,               /* 2.99rem × 1.28³ */
            5.44rem + 4.15vw,      /* offset + slope */
            9.17rem                /* 4.375rem × 1.28³ */
    );

}


.les {

    font-size: clamp(
        /* minimo: 15px */ 0.9375rem,
        /* fluido: 14.27px + 0.2273vw */ calc(14.27px + 0.2273vw),
        /* massimo: 17px */ 1.0625rem
    );

    --font-family: Figtree;
    font-family: var(--font-family);
    font-stretch: 100%;

    --les-text-font-scale: 1.125;
    --les-text-size-xl: calc( var(--les-text-size-lg)  * var(--les-text-font-scale) );
    --les-text-size-lg: calc( var(--les-text-size-md)  * var(--les-text-font-scale) );
    --les-text-size-md: 1em;
    --les-text-size-sm: calc( var(--les-text-size-md)  / var(--les-text-font-scale) );
    --les-text-size-xs: calc( var(--les-text-size-sm) / var(--les-text-font-scale) );
    --les-text-size-xxs: calc( var(--les-text-size-xs) / var(--les-text-font-scale) );
    --les-text-size-3xs: calc( var(--les-text-size-xxs) / var(--les-text-font-scale) );
    --les-text-size-4xs: calc( var(--les-text-size-3xs) / var(--les-text-font-scale) );
    --les-text-size-5xs: calc( var(--les-text-size-4xs) / var(--les-text-font-scale) );

    --les-emoji-font-scale: 3;

}

h1, .h1,
h2, .h2, .h2l,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    display: inline-block;
}

.h1l   { font-size: var(--h1l-font-size); }
.h1xl  { font-size: var(--h1xl-font-size); }
.h1xxl { font-size: var(--h1xxl-font-size); }

.h1l, .h1xl, .h1xxl {
    font-family: var(--h1-font-family, inherit);
    font-weight: var(--h1-font-weight, inherit);
    font-style: var(--h1-font-style, inherit);
    line-height: var(--h1-line-height, inherit);
    letter-spacing: var(--h1-letter-spacing, inherit);
    text-transform: var(--h1-text-transform, inherit);
    margin-bottom: var(--h1-margin-bottom, 2rem);
}

.h2l { font-size: var(--h2l-font-size); }
.h2xl { font-size: var(--h1-font-size); }
.h2xxl { font-size: var(--h1l-font-size); }

.h2l, .h2xl, .h2xxl {
    font-family: var(--h2-font-family, inherit);
    font-weight: var(--h2-font-weight, inherit);
    font-style: var(--h2-font-style, inherit);
    line-height: 1.2;
    letter-spacing: var(--h2-letter-spacing, inherit);
    text-transform: var(--h2-text-transform, inherit);
    margin-bottom: var(--h2-margin-bottom, 1.5rem);
}


.body-xl { font-size: var(--les-text-size-xl);  }
.body-lg { font-size: var(--les-text-size-lg);  }
.body-md { font-size: var(--les-text-size-md);  }
.body-sm { font-size: var(--les-text-size-sm);  }
.body-xs { font-size: var(--les-text-size-xs);  }
.body-xxs { font-size: var(--les-text-size-xxs); }
.body-3xs { font-size: var(--les-text-size-3xs); }
.body-4xs { font-size: var(--les-text-size-4xs); }
.body-5xs { font-size: var(--les-text-size-5xs); }

.emoji {
    line-height: 1;
}

.emoji-body-xs { font-size: calc( var(--les-text-size-xs) * var(--les-emoji-font-scale) ) ; }
.emoji-body-sm { font-size: calc( var(--les-text-size-sm) * var(--les-emoji-font-scale) ) ; }
.emoji-body-md { font-size: calc( var(--les-text-size-md) * var(--les-emoji-font-scale) ) ; }
.emoji-body-lg { font-size: calc( var(--les-text-size-lg) * var(--les-emoji-font-scale) ) ; }
.emoji-body-xl { font-size: calc( var(--les-text-size-xl) * var(--les-emoji-font-scale) ) ; }

.button-text {
    line-height: 1.40 !important;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-family: var(--font-family);
}

.font-family-linkedin {
    font-family: 'Myriad Pro Bold', sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
    text-transform: none !important;
    color: #1669bf !important;
}