/* ===================================
   Tipografia Simplificada com 2 Breakpoints
   Base (mobile < 768px) e Desktop (≥768px)
   Base: 16px (1rem); mínimo 14px para secundário
====================================== */

/* -----------------------------------
   Corpo e Legendas (Base / Mobile < 768px)
-------------------------------------- */
.body-regular {
    font-size: 1rem;         /* 16px */ 
    line-height: 1.6;       /* ~25.6px */
    font-weight: 400;
}
.body-small,
.caption {
    font-size: 0.875rem;     /* 14px */ 
    line-height: 1.4;       /* ~19.6px */
    font-weight: 400;
}

/* -----------------------------------
   Headings / Display (Base / Mobile < 768px)
   Inicia <h4> em 24px conforme solicitado
-------------------------------------- */
.heading-display {
    font-size: 3.5rem;       /* 56px */ 
    line-height: 1.1;       /* ~61.6px */
    font-weight: 500;
    letter-spacing: -1px;
}
.heading-1 {
    font-size: 2.5rem;      /* 40px */ 
    line-height: 1.1;       /* ~48.4px */
    font-weight: 500;
}
.heading-2 {
    font-size: 2rem;     /* 32px */
    line-height: 1.2;       /* ~40.8px */
    font-weight: 600;
}
.heading-3 {
    font-size: 1.75rem;      /* 28px */ 
    line-height: 1.3;       /* ~36.4px */
    font-weight: 500;
}
.heading-4 {
    font-size: 1.5rem;       /* 24px */ 
    line-height: 1.4;       /* ~33.6px */
    font-weight: 500;
}
.heading-5 {
    font-size: 1.5rem;      /* 24px */ 
    line-height: 1.4;       /* ~28px */
    font-weight: 500;
}
.heading-6 {
    font-size: 1.25rem;     /* 20px */ 
    line-height: 1.4;       /* ~25px */
    font-weight: 500;
}

/* -----------------------------------
   Utilitários de Peso e Transformações
-------------------------------------- */
.font-light    { font-weight: 300; }

.text-uppercase   { text-transform: uppercase; }
.text-lowercase   { text-transform: lowercase; }
.text-capitalize  { text-transform: capitalize; }
.text-normal-case { text-transform: none; }

/* ===================================
   Breakpoint Único para Desktop (≥768px)
====================================== */
@media (min-width: 768px) {
    /* Corpo de Texto em Desktop */
    .body-regular {
        font-size: 1.125rem;    /* 18px */
        line-height: 1.6;      /* ~28.8px */
    }
    .body-small,
    .caption {
        font-size: 0.875rem;    /* 14px (mantém) */
    }

    /* Headings / Display em Desktop */
    .heading-display {
        font-size: 4.25rem;     /* 68px */ 
    }
    .heading-1 {
        font-size: 3.5rem;      /* 56px */
    }
    .heading-2 {
        font-size: 2.75rem;     /* 44px */ 
    }
    .heading-3 {
        font-size: 2.125rem;    /* 34px */ 
    }
    .heading-4 {
        font-size: 1.75rem;     /* 28px */ 
    }
    .heading-5 {
        font-size: 1.5rem;      /* 24px */ 
    }
    .heading-6 {
        font-size: 1.25rem;     /* 20px */ 
    }
}