/*
|--------------------------------------------------------------------------
| Fontes oficiais
|--------------------------------------------------------------------------
*/
    
@font-face {
    font-family: "Barlow Condensed";
    src: url("/assets/fonts/barlow-condensed/BarlowCondensed-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Barlow Condensed";
    src: url("/assets/fonts/barlow-condensed/BarlowCondensed-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Barlow Condensed";
    src: url("/assets/fonts/barlow-condensed/BarlowCondensed-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Barlow Condensed";
    src: url("/assets/fonts/barlow-condensed/BarlowCondensed-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/assets/fonts/inter/Inter-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

:root {
    /*
    |--------------------------------------------------------------------------
    | Cores oficiais
    |--------------------------------------------------------------------------
    */

    --ec-white: #ffffff;
    --ec-cream: #f6f1e8;

    --ec-zinc-900: #3e3a36;
    --ec-zinc-700: #5f5a54;
    --ec-zinc-500: #817a72;
    --ec-zinc-300: #c9c1b7;
    --ec-zinc-150: #e5ded4;

    --ec-orange: #f26a3d; /*VERDE NEON: #39FF14*/
    --ec-orange-hover: #dc5930; /*VERDE NEON hover: #88FF27*/

    --ec-black: #111111;

    /*
    |--------------------------------------------------------------------------
    | Tipografia
    |--------------------------------------------------------------------------
    */

    --ec-font-body:
        "Inter",
        Arial,
        Helvetica,
        sans-serif;
    
    --ec-font-display:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;

    /*
    |--------------------------------------------------------------------------
    | Espaçamentos
    |--------------------------------------------------------------------------
    */

    --ec-space-1: .25rem;
    --ec-space-2: .5rem;
    --ec-space-3: .75rem;
    --ec-space-4: 1rem;
    --ec-space-5: 1.5rem;
    --ec-space-6: 2rem;
    --ec-space-7: 3rem;
    --ec-space-8: 4.5rem;
    --ec-space-9: 7rem;

    /*
    |--------------------------------------------------------------------------
    | Bordas, raios e sombras
    |--------------------------------------------------------------------------
    */

    --ec-radius-sm: .5rem;
    --ec-radius-md: .875rem;
    --ec-radius-lg: 1.5rem;
    --ec-radius-pill: 999px;

    --ec-border: 1px solid var(--ec-zinc-150);

    --ec-shadow-soft:
        0 20px 60px rgba(17, 17, 17, .08);

    /*
    |--------------------------------------------------------------------------
    | Movimento
    |--------------------------------------------------------------------------
    */

    --ec-transition-fast: 180ms ease;
    --ec-transition-normal: 280ms ease;
    --ec-transition-slow: 600ms cubic-bezier(.2, .7, .2, 1);

    /*
    |--------------------------------------------------------------------------
    | Layout
    |--------------------------------------------------------------------------
    */

    --ec-content-max: 1280px;
    --ec-text-max: 720px;
    --ec-navbar-height: 76px;
}