/* ==========================================
   IMPORTAÇÃO DE FONTE (SELF-HOSTED)
========================================== */

/* Fontes hospedadas localmente (WOFF2) para eliminar
   a requisição externa ao Google Fonts, reduzir
   render-blocking e melhorar o Lighthouse Performance.
   Apenas os pesos realmente usados no projeto são carregados. */

@font-face {
    font-family: "Outfit";
    src: url("../assets/fonts/Outfit/woff2/Outfit-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

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

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

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

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

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


/* ==========================================
   ROOT
========================================== */

:root {

    /* ======================================
       CORES
    ====================================== */

    --color-primary: #FF7A00;
    --color-primary-light: #FF9736;
    --color-primary-dark: #E66900;

    --color-background: #0D0D0D;
    --color-surface: #171717;
    --color-card: #1F1F1F;

    --color-white: #FFFFFF;
    --color-text: #F5F5F5;
    --color-text-muted: #BDBDBD;

    --color-border: #2E2E2E;

    --color-success: #22C55E;
    --color-warning: #FACC15;
    --color-error: #EF4444;


    /* ======================================
       TIPOGRAFIA
    ====================================== */

    --font-family: "Outfit", sans-serif;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.5rem;
    --font-size-2xl: 2rem;
    --font-size-3xl: 3rem;
    --font-size-4xl: 4rem;

    --font-light: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;

    --line-height: 1.6;


    /* ======================================
       ESPAÇAMENTOS
    ====================================== */

    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 1.5rem;
    --space-lg: 2rem;
    --space-xl: 3rem;
    --space-2xl: 4rem;
    --space-3xl: 6rem;
    --space-4xl: 8rem;


    /* ======================================
       BORDAS
    ====================================== */

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --radius-xl: 24px;
    --radius-full: 999px;


    /* ======================================
       SOMBRAS
    ====================================== */

    --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.20);

    --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.30);

    --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.45);

    --shadow-primary: 0 0 30px rgba(255, 122, 0, 0.30);


    /* ======================================
       TRANSIÇÕES
    ====================================== */

    --transition-fast: .2s ease;
    --transition-normal: .35s ease;
    --transition-slow: .6s ease;


    /* ======================================
       LARGURAS
    ====================================== */

    --container-width: 1280px;
    --container-padding: 24px;


    /* ======================================
       Z-INDEX
    ====================================== */

    --z-background: -1;
    --z-default: 1;
    --z-header: 100;
    --z-menu: 200;
    --z-modal: 500;
    --z-loader: 999;
}