/* ═══════════════════════════════════════════════════════════════
   CNDC 2026 — Design Tokens (identidad visual corporativa)
   Exportado desde cndc-2026/style.css — v1.0.11
   Uso: incluir este archivo ANTES que cualquier otro CSS de CNDC
   ═══════════════════════════════════════════════════════════════ */

/* Fuente institucional — Inter (Google Fonts CDN, sin archivos locales) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ── Variables corporativas — Identidad Visual CNDC 2026 ── */
:root {
    /* ── Paleta corporativa ─────────────────────────────── */
    --primary:           #005db9;   /* Azul PANTONE 300 C */
    --primary-light:     #1a78d6;
    --primary-dark:      #004898;
    --accent-orange:     #ff6c00;   /* Naranja Fuerte PANTONE 1505 C */
    --accent-orange-mid: #ff9016;   /* Naranja Medio PANTONE 1495 C */
    --accent-yellow:     #ffb81d;   /* Naranja Bajo PANTONE 1235C */
    --plomo:             #a6bbc9;   /* Plomo PANTONE 5435 C */

    /* Colores bandera boliviana */
    --flag-red:    #e1261c;
    --flag-yellow: #ffdb00;
    --flag-green:  #00953b;

    /* Superficies */
    --surface:      #ffffff;
    --surface-alt:  #f5f7fa;
    --surface-card: #ffffff;
    --border:       #dde3ed;

    /* Texto */
    --text-primary:   #1a1a2e;
    --text-secondary: #4a5568;
    --text-muted:     #718096;

    /* Aliases semánticos (compatibilidad) */
    --white:        #ffffff;
    --neutral-dark: #1a1a2e;
    --neutral-mid:  #4a5568;
    --neutral-light:#f5f7fa;
    --neutral-line: #e2e8f0;
    --accent-green: var(--flag-green);

    /* ── Tipografía ─────────────────────────────────────── */
    --font-primary: 'Inter', Arial, sans-serif;

    /* Escala tipográfica */
    --text-xs:   0.75rem;    /* 12px */
    --text-sm:   0.875rem;   /* 14px */
    --text-base: 1rem;       /* 16px */
    --text-lg:   1.125rem;   /* 18px */
    --text-xl:   1.25rem;    /* 20px */
    --text-2xl:  1.5rem;     /* 24px */
    --text-3xl:  1.875rem;   /* 30px */
    --text-4xl:  2.25rem;    /* 36px */

    /* Encabezados fluidos */
    --h1: clamp(1.5rem, 2.5vw, 2rem);
    --h2: clamp(1.2rem, 2vw, 1.5rem);
    --h3: clamp(1.05rem, 1.5vw, 1.25rem);
    --h4: 1rem;
    --h5: 0.9rem;
    --h6: 0.875rem;

    /* ── Espaciado (base 4px) ───────────────────────────── */
    --sp-1:  0.25rem;   /*  4px */
    --sp-2:  0.5rem;    /*  8px */
    --sp-3:  0.75rem;   /* 12px */
    --sp-4:  1rem;      /* 16px */
    --sp-5:  1.25rem;   /* 20px */
    --sp-6:  1.5rem;    /* 24px */
    --sp-8:  2rem;      /* 32px */
    --sp-10: 2.5rem;    /* 40px */
    --sp-12: 3rem;      /* 48px */
    --sp-16: 4rem;      /* 64px */

    /* ── Layout ─────────────────────────────────────────── */
    --max-width: 1200px;

    /* Radio de borde */
    --radius-sm: 4px;
    --radius:    8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;

    /* Sombras */
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.07);
    --shadow:    0 2px 12px rgba(0,0,0,0.08);
    --shadow-md: 0 4px 20px rgba(0,0,0,0.12);
    --shadow-lg: 0 8px 32px rgba(0,0,0,0.16);

    /* Transiciones */
    --transition:      0.2s ease;
    --transition-slow: 0.35s ease;

    /* Breakpoints de referencia (documentación — no se usan en media queries) */
    /* --bp-sm: 640px | --bp-md: 960px | --bp-lg: 1200px */
}
