/* ============================================================
   AMUN ARQUITECTURA — Design Tokens / Variables CSS
   ============================================================ */

:root {
  /* ── Colores de marca ── */
  --midnight: #1F33FC;          /* azul del mockup (brief: #384D95) */
  --midnight-dark: #1148AB;     /* azul footer del mockup */
  --midnight-light: #4a62b8;
  --velvet-rose: #FD0080;       /* rosa del mockup (brief: #E63E88) */
  --velvet-rose-dark: #D9006E;
  --velvet-rose-light: #ff5ea0;
  --white: #FFFFFF;
  --black: #000000;
  --bg-crema: #FAF9F5;
  --bg-water: #ECF5FE;
  --rose-tint: #FDEFF6;
  --bg-blanco: #FBFBFB;
  --rose-soft: #F5C0DD;
  --rose-pref: #FC5CB6;
  --wa-green: #08B60A;
  --line: #E3E6EA;
  --off-white: #F7F5F2;
  --gray-50: #F5F5F5;
  --gray-100: #EBEBEB;
  --gray-200: #D8D8D8;
  --gray-400: #A0A0A0;
  --gray-600: #646669;
  --gray-800: #222222;

  /* ── Tipografías ── */
  --font-heading: 'League Spartan', 'Arial Black', sans-serif;
  --font-body: 'DM Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-script: 'Caveat', 'Comic Sans MS', cursive;

  /* ── Escala tipográfica fluida ── */
  --text-xs: clamp(0.75rem, 0.9vw, 0.8125rem);
  --text-sm: clamp(0.9375rem, 1.2vw, 1.125rem);
  --text-base: clamp(1rem, 1.3vw, 1.1875rem);
  --text-lead: clamp(1.0625rem, 1.5vw, 1.375rem);
  --text-xl: clamp(1.25rem, 2vw, 1.75rem);
  --text-2xl: clamp(1.5rem, 2.4vw, 2.1rem);
  --text-h3: clamp(1.6rem, 2.5vw, 2.1rem);
  --text-h2: clamp(2rem, 4vw, 3.6rem);
  --text-h1: clamp(2.5rem, 5vw, 4.25rem);
  --text-hero: clamp(2.6rem, 5vw, 4.5rem);
  --text-display: clamp(3.4rem, 9.5vw, 8.6rem);

  /* ── 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;

  /* ── Layout ── */
  --container-max: 1400px;
  --container-padding: clamp(1.25rem, 4vw, 3rem);
  --section-padding-y: clamp(3.5rem, 6vw, 5.5rem);

  /* ── Bordes ── */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-full: 9999px;

  /* ── Sombras ── */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 20px rgba(0,0,0,0.07);
  --shadow-lg: 0 12px 36px rgba(0,0,0,0.1);
  --shadow-rose: 0 4px 20px rgba(230, 62, 136, 0.28);

  /* ── Transiciones ── */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 400ms ease;

  /* ── Z-index ── */
  --z-base: 1;
  --z-sticky: 200;
  --z-modal: 300;
}