/* =========================================================
   FLEXO FONT FAMILY
========================================================= */

/* ===== FLEXO LIGHT / DEMI CUSTOM ===== */
@font-face {
    font-family: 'Flexo';
    src: url('../fonts/242863_3_0.woff2') format('woff2'),
         url('../fonts/242863_3_0.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Flexo';
    src: url('../fonts/242863_C_0.woff2') format('woff2'),
         url('../fonts/242863_C_0.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Flexo';
    src: url('../fonts/242863_E_0.woff2') format('woff2'),
         url('../fonts/242863_E_0.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Flexo';
    src: url('../fonts/Flexo-Demi-webfont.woff2') format('woff2'),
         url('../fonts/Flexo-Demi-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

/* =========================================================
   GLOBAL
========================================================= */

body.funnel {
    font-family: 'Flexo', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-weight: 400;
}

/* =========================================================
   EXAMPLES
========================================================= */

/* Light / custom */
.texto-light {
    font-family: 'Flexo', sans-serif;
    font-weight: 300;
}

/* Regular */
.texto-regular {
    font-family: 'Flexo', sans-serif;
    font-weight: 400;
}

/* Demi */
.texto-demi {
    font-family: 'Flexo', sans-serif;
    font-weight: 600;
}

/* Bold */
.texto-bold {
    font-family: 'Flexo', sans-serif;
    font-weight: 700;
}