/* =========================
   RESPONSIVE TOKENS
   Ajustes globales por breakpoint
========================= */

@media (max-width: 767px) {
    :root {
        --text-display: var(--font-size-40);

        --text-title-xl: var(--font-size-40);
        --text-title-lg: var(--font-size-36);
        --text-title-md: var(--font-size-28);
        --text-title-sm: var(--font-size-24);
        --text-title-xs: var(--font-size-18);

        --text-title: var(--font-size-20);

        --text-section-title: var(--font-size-20);
        --text-lead: var(--font-size-18);
    }
}