/* ============================================================
   VARIABLES.CSS — Design Tokens
   CREATIO ET INNOVATIO S.A.S.
   Editar aquí para cambiar colores, fuentes y espaciados
   globalmente en toda la página.
   ============================================================ */

:root {
  /* ── Colores base ── */
  --bg:            #060C16;
  --bg-surface:    #0C1524;
  --bg-elevated:   #111E33;
  --bg-card:       #0F1A2E;

  /* ── Colores de marca ── */
  --primary:       #1B6EF3;
  --primary-light: #3D86FF;
  --primary-dark:  #1255C7;
  --primary-glow:  rgba(27, 110, 243, 0.18);
  --primary-subtle:rgba(27, 110, 243, 0.08);

  --accent:        #F59E0B;
  --accent-light:  #FCD34D;
  --accent-glow:   rgba(245, 158, 11, 0.18);

  --success:       #10B981;
  --danger:        #EF4444;

  /* ── Texto ── */
  --text:          #EBF2FF;
  --text-secondary:#7B9BBC;
  --text-muted:    #3D5A76;

  /* ── Bordes ── */
  --border:        rgba(255,255,255,0.07);
  --border-strong: rgba(255,255,255,0.13);

  /* ── Tipografía ── */
  --font-display:  'Barlow Condensed', sans-serif;
  --font-body:     'Barlow', sans-serif;
  --font-mono:     'JetBrains Mono', monospace;

  /* ── Espaciado ── */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* ── Layout ── */
  --container:     1180px;
  --container-pad: clamp(1rem, 4vw, 2rem);
  --section-py:    clamp(4rem, 8vw, 7rem);

  /* ── Bordes redondeados ── */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  14px;
  --radius-xl:  24px;
  --radius-pill:999px;

  /* ── Sombras ── */
  --shadow-sm:   0 2px 8px  rgba(0,0,0,0.35);
  --shadow-md:   0 8px 24px rgba(0,0,0,0.5);
  --shadow-lg:   0 20px 60px rgba(0,0,0,0.6);
  --glow-primary: 0 0 40px rgba(27,110,243,0.25);
  --glow-accent:  0 0 40px rgba(245,158,11,0.25);

  /* ── Transiciones ── */
  --ease:        cubic-bezier(0.22, 1, 0.36, 1);
  --t-fast:  150ms var(--ease);
  --t-base:  300ms var(--ease);
  --t-slow:  600ms var(--ease);

  /* ── Navbar ── */
  --navbar-h: 72px;
}