/* assets/css/variables.css – Versión PURA 2025 */
/* Solo variables oficiales – NINGÚN reset, box-sizing ni estilo base */

:root {
    /* ==================== COLORES PRINCIPALES ==================== */
    --verde-urbano:        #275C49;   /* Verde medio usado en navbar, botones, etc. */
    --verde-hero:          #0A3231;   /* Verde oscuro original del hero y secciones clave */
    --violeta-urbano:      #4A2E47;
    --arena:               #F7F1D4;
    --maiz:                #F0DB91;
    --negro:               #1A1A1A;
    --blanco:              #FFFFFF;
    --offwhite:           #F9F7EC;

    /* ==================== RGB PARA TRANSPARENCIAS ==================== */
    --verde-rgb:           10, 50, 49;      /* #0A3231 */
    --verde-urbano-rgb:     39, 92, 73;
    --arena-rgb:           247, 241, 212;   /* #F7F1D4 */
    --violeta-rgb:         74, 46, 71;
    --maiz-rgb:            240, 219, 145;
    --negro-rgb:           26, 26, 26;
    --blanco-rgb:          255, 255, 255;

    /* ==================== TRANSPARENCIAS COMUNES ==================== */
    --overlay-hero:        rgba(var(--verde-rgb), 0.82);
    --verde-translucido:   rgba(var(--verde-rgb), 0.88);
    --blanco-opaco:        rgba(var(--blanco-rgb), 0.88);
    --blanco-translucido:  rgba(var(--blanco-rgb), 0.45);
    --negro-sombra:        rgba(var(--negro-rgb), 0.15);
    --maiz-translucido:    rgba(var(--maiz-rgb), 0.35);

    /* ==================== COLORES ADICIONALES ==================== */
    --gris-medio:                 #696969;
    --gris-medio-translucido:     rgba(105, 105,105,0.35);

    /* ==================== SOMBRAS Y EFECTOS ==================== */
    --sombra-suave:    0 8px 32px var(--negro-sombra);
    --sombra-card:     0 20px 40px rgba(var(--negro-rgb), 0.12);

    /* ==================== GRADIENTES OFICIALES ==================== */
    --overlay-gradient-hero: linear-gradient(
        to bottom,
        rgba(var(--verde-rgb), 0.82) 0%,
        rgba(var(--verde-rgb), 0.62) 50%,
        rgba(var(--arena-rgb), 0.65) 100%
    );

    /* ==================== TIPOGRAFÍA ==================== */
    --font-primary:    'Inter Tight', sans-serif;
    --font-secondary:  'PP Mori', sans-serif;

    /* ==================== UTILIDADES GLOBALES ================= */
    --transition:      0.35s ease;
    --radius:          12px;
    --max-width:       1400px;
    --padding-x:       4vw;
}