/* ============================================
   A+D VALUACION - DESIGN SYSTEM
   Basado en la Guia de Identidad Visual
   Colores extraidos del logo oficial
   ============================================ */

:root {
    /* ── Color Primario (del logo) ── */
    --primary:         #218BCB;   /* Azul principal del logo */
    --primary-100:     #E6F3FB;   /* Backgrounds suaves */
    --primary-300:     #8CC8E8;   /* Hover states, bordes */
    --primary-500:     #218BCB;   /* Botones CTA, header, links */
    --primary-700:     #1A5A8A;   /* Hover oscuro */
    --primary-900:     #0F2D4D;   /* Textos premium */

    /* ── Color Primario Oscuro (navy del logo) ── */
    --navy:            #1C2E5A;   /* Texto logo, headers */
    --navy-dark:       #0F1B35;   /* Footer, backgrounds premium */

    /* ── Color Secundario (complementario) ── */
    --secondary:       #00A86B;   /* Indicadores positivos */
    --secondary-light: #4DC99B;   /* Hover */
    --secondary-dark:  #007A4D;   /* Contraste */

    /* ── Neutros ── */
    --neutral-900:     #1A1A1A;   /* Texto principal */
    --neutral-700:     #374151;   /* Texto secundario */
    --neutral-500:     #6B7280;   /* Texto terciario, labels */
    --neutral-300:     #D1D5DB;   /* Bordes, separadores */
    --neutral-200:     #E5E7EB;   /* Bordes suaves */
    --neutral-100:     #F5F7FA;   /* Fondos, cards */
    --neutral-50:      #FAFBFC;   /* Fondo base */
    --white:           #FFFFFF;

    /* ── Alertas ── */
    --alert-error:     #E53935;   /* Errores criticos */
    --alert-error-bg:  #FEF2F2;
    --alert-warning:   #FFC107;   /* Alertas suaves */
    --alert-warning-bg:#FFFBEB;
    --alert-success:   #00A86B;   /* Estados exitosos */
    --alert-success-bg:#ECFDF5;
    --alert-info:      #218BCB;   /* Informacion */
    --alert-info-bg:   #E6F3FB;

    /* ── Gradientes (del logo) ── */
    --gradient-logo:     linear-gradient(135deg, #1C2E5A 0%, #218BCB 50%, #4DB8E8 100%);
    --gradient-primary:  linear-gradient(135deg, #1C2E5A 0%, #218BCB 100%);
    --gradient-accent:   linear-gradient(135deg, #218BCB 0%, #4DB8E8 100%);
    --gradient-hero:     linear-gradient(135deg, #0F1B35 0%, #1C2E5A 35%, #218BCB 100%);

    /* ── WhatsApp ── */
    --wa-green:        #25D366;
    --wa-green-hover:  #20BD5A;
    --wa-green-glow:   rgba(37, 211, 102, 0.35);

    /* ── Radios ── */
    --radius-xs:       6px;
    --radius-sm:       10px;
    --radius-md:       14px;
    --radius-lg:       18px;
    --radius-xl:       24px;
    --radius-full:     50px;

    /* ── Sombras ── */
    --shadow-sm:       0 1px 3px rgba(28,46,90,0.06);
    --shadow-md:       0 4px 16px rgba(28,46,90,0.08);
    --shadow-lg:       0 12px 40px rgba(28,46,90,0.10);
    --shadow-xl:       0 20px 60px rgba(28,46,90,0.12);
    --shadow-primary:  0 8px 24px rgba(33,139,203,0.25);
    --shadow-wa:       0 4px 20px rgba(37,211,102,0.40);

    /* ── Tipografia ── */
    --font-family:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-xs:         12px;
    --font-sm:         13px;
    --font-base:       14px;
    --font-md:         15px;
    --font-lg:         16px;
    --font-xl:         18px;
    --font-2xl:        20px;
    --font-3xl:        24px;
    --font-4xl:        28px;
    --font-5xl:        36px;
    --font-display:    clamp(34px, 5vw, 58px);

    /* ── Transiciones ── */
    --transition-fast:   0.15s ease;
    --transition-base:   0.25s ease;
    --transition-slow:   0.4s ease;
}