/* =========================================================
   variables.css
   Fuente única de colores/espaciados/tipografía (regla: todo color pasa por aquí)
   Paleta B: Azul Noche + Amarillo (CTA de alto contraste)
   ========================================================= */
/* 【1-2e05cb】【2-65fe0c】 */

:root {
    /* ---------- Color System (Paleta B) ---------- */
    --color-bg: #0F1B2D;
    /* Azul Noche (fondo principal) */
    /* 【2-65fe0c】 */
    --color-bg-2: #12233A;
    /* Variante para secciones (misma familia) */
    --color-surface: #162B46;
    /* Tarjetas / paneles */
    --color-border: rgba(255, 255, 255, .10);

    --color-text: rgba(255, 255, 255, .92);
    --color-text-2: rgba(255, 255, 255, .72);
    --color-text-3: rgba(255, 255, 255, .55);

    --color-accent: #FACC15;
    /* Amarillo (solo para CTA / acentos críticos) */
    /* 【2-65fe0c】 */
    --color-accent-2: #EAB308;
    /* Amarillo más profundo para hover/sombra */

    /* Estados */
    --color-success: #22C55E;
    --color-danger: #EF4444;

    /* ---------- Typography ---------- */
    /* Headings: Barlow Condensed / Bebas Neue
     Body: Inter / DM Sans */
    /* 【1-2e05cb】【2-65fe0c】 */
    --font-heading: "Barlow Condensed", "Bebas Neue", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-body: "Inter", "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

    /* Desktop base (ajustable después en mobile) */
    --fs-base: 16px;
    --lh-base: 1.6;

    /* Escala de títulos */
    --h1: clamp(40px, 3.0vw, 56px);
    --h2: clamp(28px, 2.1vw, 40px);
    --h3: clamp(22px, 1.6vw, 28px);

    /* ---------- Layout / spacing ---------- */
    --container: 1100px;
    --container-pad: 24px;

    --radius-sm: 10px;
    --radius-md: 14px;
    --radius-lg: 18px;

    --shadow-1: 0 10px 30px rgba(0, 0, 0, .25);

    /* Espaciado (diseño limpio + espacios claros) */
    /* 【3-e3816d】 */
    --space-1: 6px;
    --space-2: 10px;
    --space-3: 14px;
    --space-4: 20px;
    --space-5: 28px;
    --space-6: 40px;
    --space-7: 56px;
    --space-8: 80px;

    /* ---------- Components ---------- */
    --btn-h: 48px;
    --btn-pad-x: 18px;

    --transition: 180ms ease;
}