/**
 * Variables de Diseño (Design Tokens) — 360 Vision HSE
 * Metodología Crecienta — Rediseño Premium
 */

:root {
    /* --- Paleta Institucional (Extraída del Logo Oficial) --- */
    --v360-color-blue: #0055A3;
    --v360-color-blue-hover: #00407a;
    --v360-color-blue-dark: #002d57;
    --v360-color-blue-light: #e8f2fc;
    --v360-color-blue-glow: rgba(0, 85, 163, 0.45);

    /* Seguridad & Medio Ambiente Acentos */
    --v360-color-green: #10b981;
    --v360-color-green-glow: rgba(16, 185, 129, 0.4);
    --v360-color-orange: #f59e0b;
    --v360-color-orange-glow: rgba(245, 158, 11, 0.45);
    --v360-color-cyan: #06b6d4;
    --v360-color-cyan-glow: rgba(6, 182, 212, 0.4);
    --v360-color-red: #ef4444;

    /* Fondos Dark Premium */
    --v360-bg-dark-base: #070d1e;
    --v360-bg-dark-surface: #0e172f;
    --v360-bg-dark-card: #131e3d;
    --v360-bg-dark-alt: #0a1329;

    /* Fondos Light Limpios */
    --v360-bg-light-base: #f8fafc;
    --v360-bg-light-surface: #ffffff;
    --v360-bg-light-alt: #f1f5f9;

    /* Regla Tipográfica DARK: Texto blanco con sombra sutil y nítida */
    --v360-text-dark-white: #ffffff;
    --v360-text-dark-light: #cbd5e1;
    --v360-text-dark-muted: #94a3b8;
    --v360-shadow-text-tight: 0 1px 2px rgba(0, 0, 0, 0.45);
    --v360-shadow-text-hero: 0 1px 3px rgba(0, 0, 0, 0.55);

    /* Separadores de Sección con Bordes Gradientes */
    --v360-gradient-divider: linear-gradient(90deg, transparent 0%, rgba(56, 189, 248, 0.3) 20%, rgba(0, 85, 163, 0.85) 50%, rgba(56, 189, 248, 0.3) 80%, transparent 100%);
    --v360-gradient-divider-light: linear-gradient(90deg, transparent 0%, rgba(0, 85, 163, 0.15) 25%, rgba(0, 85, 163, 0.45) 50%, rgba(0, 85, 163, 0.15) 75%, transparent 100%);

    /* Regla Tipográfica LIGHT: Texto en azul del logo (#0055A3) y contrastes oscuros */
    --v360-text-light-title: #0055A3;
    --v360-text-light-body: #1e293b;
    --v360-text-light-muted: #475569;


    /* Bordes & Sombras */
    --v360-border-radius-xs: 4px;
    --v360-border-radius-sm: 8px;
    --v360-border-radius-md: 16px;
    --v360-border-radius-lg: 24px;
    --v360-border-radius-full: 9999px;

    --v360-border-dark: rgba(255, 255, 255, 0.12);
    --v360-border-dark-glow: rgba(0, 85, 163, 0.5);
    --v360-border-light: #e2e8f0;

    /* Aliases de compatibilidad unificada */
    --v360-color-primary: var(--v360-color-blue);
    --v360-color-primary-light: var(--v360-color-blue-light);
    --v360-color-safety-green: var(--v360-color-green);
    --v360-color-safety-green-dark: #059669;
    --v360-color-safety-cyan: var(--v360-color-cyan);
    --v360-color-dark: var(--v360-bg-dark-base);
    --v360-color-dark-surface: var(--v360-bg-dark-surface);
    --v360-text-main: var(--v360-text-light-body);
    --v360-text-muted: var(--v360-text-light-muted);
    --v360-text-inverse: #ffffff;
    --v360-border-color: var(--v360-border-light);
    --v360-bg-body: #ffffff;
    --v360-bg-surface: #ffffff;
    --v360-bg-alt: var(--v360-bg-light-alt);
    --v360-gradient-accent: linear-gradient(180deg, var(--v360-color-blue) 0%, #06b6d4 100%);

    --v360-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
    --v360-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
    --v360-shadow-lg: 0 12px 24px -4px rgba(0, 0, 0, 0.12);
    --v360-shadow-glow-blue: 0 0 24px rgba(0, 85, 163, 0.35);
    --v360-shadow-glow-green: 0 0 24px rgba(16, 185, 129, 0.35);
    --v360-shadow-glow-orange: 0 0 24px rgba(245, 158, 11, 0.35);

    /* Patrones con Metáforas Visuales (Seguridad, Grillas Técnicas, Blueprint) */
    --v360-pattern-grid-dark: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px);
    --v360-pattern-grid-light: radial-gradient(rgba(0, 85, 163, 0.12) 1px, transparent 1px);
    --v360-pattern-dots: radial-gradient(circle, rgba(0, 85, 163, 0.15) 1.5px, transparent 1.5px);
    --v360-pattern-hazard: repeating-linear-gradient(
        45deg,
        rgba(245, 158, 11, 0.08),
        rgba(245, 158, 11, 0.08) 12px,
        transparent 12px,
        transparent 24px
    );

    /* Tipografía Dinámica con clamp() */
    --v360-font-title: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --v360-font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    --v360-text-xs: clamp(0.75rem, 0.72rem + 0.2vw, 0.8125rem);
    --v360-text-sm: clamp(0.8125rem, 0.78rem + 0.25vw, 0.875rem);
    --v360-text-base: clamp(0.9375rem, 0.9rem + 0.3vw, 1.0625rem);
    --v360-text-lg: clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
    --v360-text-xl: clamp(1.25rem, 1.15rem + 0.6vw, 1.5rem);
    --v360-text-2xl: clamp(1.5rem, 1.35rem + 0.9vw, 1.875rem);
    --v360-text-3xl: clamp(1.875rem, 1.65rem + 1.2vw, 2.375rem);
    --v360-text-4xl: clamp(2.25rem, 1.95rem + 1.8vw, 3.125rem);
    --v360-text-hero: clamp(2.6rem, 2.2rem + 2.5vw, 4rem);

    /* Contenedor y Transiciones */
    --v360-container-max: 1260px;
    --v360-transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --v360-transition-base: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    --v360-transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}