/* ==========================================================================
   typography.css — Fluid Type Scale (refined/premium, 320px → 1536px)
   formula: slope = (max_px − min_px) / 1216 × 100  |  intercept = min_rem − slope/100 × 20
   ========================================================================== */

:root {
    --text-xs: clamp(0.75rem, 0.33vw + 0.68rem, 1rem);
    --text-body: clamp(0.875rem, 0.33vw + 0.81rem, 1.125rem);
    --text-h6: clamp(0.875rem, 0.16vw + 0.84rem, 1rem);
    --text-h5: clamp(0.875rem, 0.66vw + 0.74rem, 1.375rem);
    --text-h4: clamp(1rem, 0.82vw + 0.84rem, 1.625rem);
    --text-h3: clamp(1.125rem, 1.15vw + 0.90rem, 2rem);
    --text-h2: clamp(1.25rem, 1.64vw + 0.92rem, 2.5rem);
    --text-h1: clamp(1.375rem, 2.47vw + 0.88rem, 3.25rem);
}

body {
    font-size: var(--text-body);
}

h1 {
    font-size: var(--text-h1);
}

h2 {
    font-size: var(--text-h2);
}

h3 {
    font-size: var(--text-h3);
}

h4 {
    font-size: var(--text-h4);
}

h5 {
    font-size: var(--text-h5);
}

h6 {
    font-size: var(--text-h6);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading), sans-serif;
    font-weight: 900;
    line-height: 1.25;
    color: var(--color-black-secondary);
    text-transform: uppercase;
    margin-bottom: var(--space-md);
}

/* Typography Utilities */
.font-heading {
    font-family: var(--font-heading), sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    color: var(--color-black-secondary);
    line-height: 1.375;
}
