/* ===== IMPORTAÇÃO DE FONTES ===== */
@import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@400;500;600;700;800;900&display=swap');

/* ===== VARIÁVEIS DE FONTE ===== */
:root {
    --font-primary: 'Gabarito', sans-serif;
    --font-fallback: system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    --font-stack: var(--font-primary), var(--font-fallback);
    
    /* Pesos disponíveis */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;
    --font-weight-black: 900;
}

/* ===== APLICAÇÃO GLOBAL ===== */
* {
    font-family: var(--font-stack);
}

body {
    font-family: var(--font-stack);
    font-weight: var(--font-weight-normal);
}

/* ===== HIERARQUIA TIPOGRÁFICA ===== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-stack);
    font-weight: var(--font-weight-bold);
}

.title-primary {
    font-family: var(--font-stack);
    font-weight: var(--font-weight-extrabold);
}

.title-secondary {
    font-family: var(--font-stack);
    font-weight: var(--font-weight-semibold);
}

button, .button {
    font-family: var(--font-stack);
    font-weight: var(--font-weight-medium);
}

.tooltip, .legend, .nav-button {
    font-family: var(--font-stack);
    font-weight: var(--font-weight-normal);
}