/* ============================================================================
 * Five Solutions — fs-brand-tokens.css v71.8.0
 *
 * FUENTE ÚNICA DE VERDAD de la paleta de marca.
 * Extraída pixel-exacto del logo oficial (FINAL-01-FOTO-PERFIL.png):
 *   - Navy top:    rgb(9,35,72)    #092348
 *   - Navy mid:    rgb(12,46,94)   #0C2E5E
 *   - Navy bot:    rgb(13,58,117)  #0D3A75
 *   - Punto naranja: rgb(254,90,53) #FE5A35
 *
 * Se carga PRIMERO en todos los HTMLs públicos, antes de cualquier otro CSS.
 * Sobreescribe variables locales mal definidas en gracias/terminos/privacidad
 * (que tenían --accent-lt:#22d3de cyan en vez de naranja, etc.)
 *
 * Sintaxis: declaramos las variables tanto con el nombre canónico (--accent,
 * --accent-light, --navy-800, etc.) como con los aliases que usan las páginas
 * standalone (--accent-lt, --navy-2, --t1, --t2, --t3) para garantizar que
 * cualquier referencia las encuentre.
 * ========================================================================== */

:root{
  /* --- NAVY (3 niveles principales del logo + 2 stops auxiliares) --- */
  --navy-900: #051634;  /* navy más profundo (background base) */
  --navy-800: #082347;  /* navy top del logo */
  --navy-700: #0C2D5D;  /* navy mid */
  --navy-600: #0D3A76;  /* navy bot del logo */
  --navy-500: #164A93;  /* navy claro / highlight */

  /* Aliases standalone (gracias, terminos, privacidad usan estos) */
  --navy-2: #0C2D5D;
  --navy-darker: #051634;

  /* --- ACCENT (naranja del punto del logo) --- */
  --accent:       #FF5A34;
  --accent-light: #FF7A5C;
  --accent-warm:  #FFB800;
  --accent-glow:  rgba(255,90,52,.18);
  --accent-shine: radial-gradient(40% 100% at 50% 50%, rgba(255,90,52,.32), transparent 70%);
  --accent-gradient: linear-gradient(135deg,#FFB800 0%,#FF5A34 60%,#FF7A1C 100%);

  /* Alias mal escrito en standalone — apuntamos al mismo accent-light */
  --accent-lt: #FF7A5C;

  /* --- VERDE / GREEN (en este branding "green" es naranja también, no verde real) --- */
  --green:       #FF5A34;
  --green-hover: #E64A1F;
  --green-real:  #10B981;  /* solo cuando se necesita verde de verdad (checks, success) */

  /* --- TEXT --- */
  --text:  #F1F5F9;
  --text2: #B8C5D6;
  --text3: #5E7290;
  --white: #FFFFFF;

  /* Alias standalone (gracias/terminos/privacidad usan --t1, --t2, --t3) */
  --t1: #F1F5F9;
  --t2: #B8C5D6;
  --t3: #5E7290;

  /* --- WARN/ALERT --- */
  --orange: #F59E0B;
  --warn:   #F59E0B;

  /* --- TYPOGRAPHY --- */
  --font-h: 'Plus Jakarta Sans', sans-serif;
  --font:   'Plus Jakarta Sans', sans-serif;  /* v72.3.0 — Unificado (era DM Sans) */
  --font-m: 'JetBrains Mono', 'SF Mono', monospace;

  /* --- SHADOWS --- */
  --shadow:      0 8px 32px rgba(0,0,0,.35);
  --shadow-lg:   0 24px 60px rgba(0,0,0,.45);
  --shadow-glow: 0 12px 40px rgba(255,90,52,.32);
  --border:      1px solid rgba(255,255,255,.08);
  --border-lit:  1px solid rgba(255,90,52,.22);

  /* --- RADIUS --- */
  --r-sm:  8px;
  --r-md:  12px;
  --r-lg:  16px;
  --r-xl:  22px;
  --r-2xl: 28px;
  --r:     14px;

  /* --- EASE --- */
  --ease:        all .28s cubic-bezier(.4,0,.2,1);
  --ease-spring: all .35s cubic-bezier(.34,1.56,.64,1);

  /* --- MOTION TOKENS (consistencia con fs-premium) --- */
  --fs-ease-out:    cubic-bezier(.16,1,.3,1);
  --fs-ease-spring: cubic-bezier(.34,1.45,.55,1.05);
}

/* === Fix específico para PÁGINAS STANDALONE ===
 * gracias.html, terminos.html y privacidad.html declaran SUS PROPIAS variables
 * dentro de :root. La especificidad es la misma que la nuestra, pero ellas
 * aparecen DESPUÉS en el orden del documento.
 * Para forzar a que predominen las nuestras, redeclaramos en html[lang]:root
 * con mayor especificidad, e incluso usamos un selector compuesto. */
html:root,
html[lang="es"]:root,
html[data-geo]:root{
  --accent:       #FF5A34 !important;
  --accent-light: #FF7A5C !important;
  --accent-lt:    #FF7A5C !important;  /* arreglar el cyan #22d3de */
  --green:        #FF5A34 !important;
  --green-hover:  #E64A1F !important;
  --navy-900:     #051634 !important;
  --navy-800:     #082347 !important;
  --navy-700:     #0C2D5D !important;
  --navy-600:     #0D3A76 !important;
  --navy-500:     #164A93 !important;
  --navy-2:       #0C2D5D !important;
  --t1: #F1F5F9 !important;
  --t2: #B8C5D6 !important;
  --t3: #5E7290 !important;
}

/* === Para que las páginas standalone usen el mismo gradient navy del logo === */
html[lang="es"] body{
  background-color: var(--navy-800) !important;
}
