/* Fontes e Tipografia do Projeto EducaLab */

:root {
    /* Fontes */
    --font-family-main: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --font-family-heading: 'Poppins', 'Segoe UI', sans-serif;
    --font-family-code: 'Courier New', monospace;
    
    /* Tamanhos de Fonte - Desktop */
    --font-size-h1: 3.5rem;        /* 56px */
    --font-size-h2: 2.25rem;       /* 36px */
    --font-size-h3: 1.875rem;      /* 30px */
    --font-size-h4: 1.5rem;        /* 24px */
    --font-size-h5: 1.25rem;       /* 20px */
    --font-size-h6: 1rem;          /* 16px */
    
    --font-size-base: 1rem;        /* 16px */
    --font-size-sm: 0.875rem;      /* 14px */
    --font-size-xs: 0.75rem;       /* 12px */
    --font-size-lg: 1.125rem;      /* 18px */
    --font-size-xl: 1.25rem;       /* 20px */
    --font-size-2xl: 1.5rem;       /* 24px */
    
    /* Pesos de Fonte */
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extra-bold: 800;
    
    /* Altura de Linha */
    --line-height-tight: 1.2;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.75;
    --line-height-loose: 2;
    
    /* Espaçamento de Letra */
    --letter-spacing-tight: -0.02em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: 0.05em;
}

/* Fonte base do corpo */
body {
    font-family: var(--font-family-main);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
}

/* Títulos - H1 */
h1, .h1 {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h1);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
}

/* Títulos - H2 */
h2, .h2 {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
}

/* Títulos - H3 */
h3, .h3 {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h3);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-normal);
}

/* Títulos - H4 */
h4, .h4 {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h4);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
}

/* Títulos - H5 */
h5, .h5 {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h5);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
}

/* Títulos - H6 */
h6, .h6 {
    font-family: var(--font-family-heading);
    font-size: var(--font-size-h6);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
}

/* Parágrafo */
p, .p {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
}

/* Texto pequeno */
small, .small {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
}

/* Texto extra pequeno */
.xs {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
}

/* Texto grande */
.lg {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
}

/* Links */
a {
    font-family: var(--font-family-main);
    font-weight: var(--font-weight-medium);
}

/* Código */
code, pre {
    font-family: var(--font-family-code);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-normal);
}

/* Ênfase */
strong, .bold {
    font-weight: var(--font-weight-bold);
}

em, .italic {
    font-style: italic;
}

/* Responsivo - Tablets */
@media (max-width: 768px) {
    :root {
        --font-size-h1: 2.5rem;
        --font-size-h2: 1.875rem;
        --font-size-h3: 1.5rem;
        --font-size-h4: 1.25rem;
        --font-size-h5: 1rem;
        --font-size-h6: 0.875rem;
    }
}

/* Responsivo - Mobile */
@media (max-width: 480px) {
    :root {
        --font-size-h1: 1.875rem;
        --font-size-h2: 1.5rem;
        --font-size-h3: 1.25rem;
        --font-size-h4: 1rem;
        --font-size-h5: 0.875rem;
        --font-size-h6: 0.75rem;
    }
}
