/**
 * BOLTEK V2 — Design tokens (identidad industrial unificada)
 * Cargar antes de main.css en todas las páginas.
 */
:root {
    /* —— Marca Boltek —— */
    --boltek-blue:          #00467F;
    --boltek-blue-dark:     #003559;
    --boltek-blue-light:    #1a5f9e;
    --boltek-blue-muted:    #e8f0f7;
    --boltek-red:           #E31837;
    --boltek-red-dark:      #b8122c;

    /* —— Neutros industriales —— */
    --boltek-ink:           #0f172a;
    --boltek-slate:         #1e293b;
    --boltek-steel:         #64748b;
    --boltek-steel-light:   #94a3b8;
    --boltek-steel-pale:    #cbd5e1;
    --boltek-surface:       #f4f6f9;
    --boltek-surface-alt:   #eef2f6;
    --boltek-white:         #ffffff;

    /* —— Semánticos (uso en componentes) —— */
    --color-primary:        var(--boltek-blue);
    --color-primary-dark:   var(--boltek-blue-dark);
    --color-primary-hover:  var(--boltek-blue-light);
    --color-primary-muted:  var(--boltek-blue-muted);
    --color-secondary:      var(--boltek-red);
    --color-secondary-dark: var(--boltek-red-dark);

    --color-text:           var(--boltek-slate);
    --color-text-light:     var(--boltek-steel);
    --color-text-muted:     var(--boltek-steel-light);
    --color-head:           var(--boltek-ink);

    --color-bg:             var(--boltek-surface);
    --color-bg-light:       var(--boltek-white);
    --color-bg-muted:       var(--boltek-surface-alt);
    --color-border:         #e2e8f0;
    --color-border-strong:  var(--boltek-steel-pale);

    /* Aliases legacy */
    --color-text-mutted:    var(--color-text-muted);

    /* —— Header claro industrial —— */
    --header-height:        4.5rem;
    --header-bg:            #f7f8fa;
    --header-bg-scrolled:   #ffffff;
    --header-border:        #e2e8f0;
    --header-accent:        rgba(0, 70, 127, 0.1);
    --header-link:          #1e293b;
    --header-link-muted:    #475569;

    /* —— Naranja exacto del logo (#F26122) —— */
    --boltek-orange:        #F26122;
    --boltek-orange-dark:   #d4521a;

    /* —— Footer corporativo (negro / gris / naranja) —— */
    --footer-band-bg:       #161616;
    --footer-bg:            #f7f8fa;
    --footer-divider:       #e2e8f0;
    --footer-title:         #111111;
    --footer-text:          #3f3f46;
    --footer-link:          #27272a;
    --footer-bottom-bg:     #161616;
    --footer-bottom-text:   rgba(255, 255, 255, 0.70);

    /* —— Tipografía —— */
    --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-body:    var(--font-heading);
    --font-main:    var(--font-body);

    /* —— Forma y elevación —— */
    --radius-sm:    6px;
    --radius:       8px;
    --radius-lg:    12px;
    --border-radius: var(--radius);

    --shadow-sm:    0 1px 3px rgba(15, 23, 42, 0.06);
    --shadow:       0 4px 16px rgba(15, 23, 42, 0.08);
    --shadow-md:    0 8px 24px rgba(15, 23, 42, 0.1);
    --shadow-lg:    0 12px 40px rgba(15, 23, 42, 0.12);

    --transition-fast:   0.2s ease-in-out;
    --transition:        0.22s ease;
    --transition-smooth: 0.35s cubic-bezier(0.4, 0, 0.2, 1);

    /* —— Terceros (solo WhatsApp) —— */
    --color-whatsapp:       #25d366;
    --color-whatsapp-dark:  #1da851;
}