/* ============================================================
   GRUPO ALDORF — DESIGN TOKENS
   Sistema de identidad visual centralizado.
   Alineado al manual de marca oficial.
   ============================================================ */

:root {
  /* ---- Color · Marca (manual oficial) ---- */
  --crimson:        #C8102E;        /* Rojo Aldorf */
  --crimson-deep:   #9A0B22;
  --crimson-bright: #E11932;
  --crimson-glow:   rgba(200, 16, 46, 0.20);

  /* ---- Color · Neutros ---- */
  --ink:            #0F0F0F;        /* Negro Aldorf */
  --ink-soft:       #1A1A1A;
  --steel:          #2A2A2D;
  --slate:          #5C5C61;
  --mist:           #B8B6B0;
  --bone:           #F5F2ED;
  --bone-deep:      #EBE7E0;
  --paper:          #FFFFFF;

  /* ---- Color · Estado ---- */
  --success:        #1F7A3F;
  --warning:        #C97B0E;

  /* ---- Tipografía ---- */
  /* Saira: angular, geométrica, automotriz — alineada al wordmark oficial */
  --font-display:   "Saira", "Inter", system-ui, sans-serif;
  --font-body:      "Manrope", "Inter", system-ui, sans-serif;
  --font-mono:      "JetBrains Mono", ui-monospace, "SF Mono", monospace;

  /* Tracking */
  --tracking-tight: -0.03em;
  --tracking-snug:  -0.01em;
  --tracking-norm:  0;
  --tracking-loose: 0.08em;
  --tracking-mega:  0.22em;
  --tracking-logo:  0.04em;

  /* ---- Spacing ---- */
  --s-1:  4px;  --s-2:  8px;   --s-3:  12px; --s-4:  16px;
  --s-5:  20px; --s-6:  24px;  --s-8:  32px; --s-10: 40px;
  --s-12: 48px; --s-16: 64px;  --s-20: 80px; --s-24: 96px;
  --s-32: 128px;

  /* ---- Layout ---- */
  --max-width:      1280px;
  --max-narrow:     960px;
  --max-prose:      720px;
  --gutter:         clamp(20px, 4vw, 48px);

  /* ---- Radio (sutil — look angular automotriz) ---- */
  --r-sm:   2px;
  --r-md:   4px;
  --r-lg:   8px;
  --r-xl:   12px;
  --r-2xl:  20px;
  --r-full: 999px;

  /* ---- Sombras ---- */
  --shadow-sm:  0 1px 2px rgba(15,15,15,.06);
  --shadow-md:  0 4px 16px rgba(15,15,15,.08);
  --shadow-lg:  0 16px 40px rgba(15,15,15,.12);
  --shadow-xl:  0 32px 80px rgba(15,15,15,.18);
  --shadow-red: 0 24px 60px rgba(200, 16, 46, 0.28);

  /* ---- Borde ---- */
  --border-thin:  1px solid rgba(15,15,15,.08);
  --border-mid:   1px solid rgba(15,15,15,.14);
  --border-dark:  1px solid rgba(255,255,255,.10);

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(.22, 1, .36, 1);
  --ease-in:    cubic-bezier(.55, 0, 1, .45);
  --ease-snap:  cubic-bezier(.65, 0, .35, 1);
  --t-fast:     180ms;
  --t-base:     320ms;
  --t-slow:     560ms;

  /* ---- Z-index ---- */
  --z-base:    1;
  --z-overlay: 10;
  --z-sticky:  50;
  --z-modal:   100;
  --z-toast:   200;
}