/* ============================================
   CAB GLOBAL — Componente: Texto / Heading
   --------------------------------------------
   Sistema tipográfico de 3 niveles.
   Clases:
     .txt              → base
     .txt--display     → títulos grandes (heros, section titles)
     .txt--title       → subtítulos / card titles
     .txt--body        → texto corrido / párrafos / labels
     .txt--w-{peso}    → light regular semibold bold black
     .txt--c-{color}   → white green dark muted
     .txt--a-{align}   → left center right
     .txt--italic
     .txt--label       → estilo "label": uppercase + verde + tracking (apto con .txt--body)
   ============================================ */

.txt {
    font-family: var(--font-family);
    margin: 0;
}

/* ========================================
   NIVELES
   ======================================== */
.txt--display {
    font-family: var(--font-display);
    font-size: var(--text-display);
    line-height: var(--leading-display);
    letter-spacing: 0;
}

.txt--title {
    font-size: var(--text-title);
    line-height: var(--leading-title);
}

.txt--body {
    font-size: var(--text-body);
    line-height: var(--leading-body);
}

/* ========================================
   PESOS
   ======================================== */
.txt--w-light    { font-weight: var(--weight-light); }
.txt--w-regular  { font-weight: var(--weight-regular); }
.txt--w-semibold { font-weight: var(--weight-semibold); }
.txt--w-bold     { font-weight: var(--weight-bold); }
.txt--w-black    { font-weight: var(--weight-black); }

/* ========================================
   COLORES
   ======================================== */
.txt--c-white { color: var(--color-white); }
.txt--c-green { color: var(--color-green); }
.txt--c-dark  { color: var(--color-dark); }
.txt--c-muted { color: var(--color-text-muted); }

/* ========================================
   ALINEACIÓN
   ======================================== */
.txt--a-left   { text-align: left; }
.txt--a-center { text-align: center; }
.txt--a-right  { text-align: right; }

/* ========================================
   MODIFICADORES
   ======================================== */
.txt--italic { font-style: italic; }

/* Estilo "label": pensado para usar con .txt--body
   Ejemplo: "NUESTROS SERVICIOS" */
.txt--label {
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--color-green);
    font-weight: var(--weight-bold);
}