/* ============================================================
   KIZAMI THEME — variables.css
   Design tokens globales
   ============================================================ */

:root {
  /* Colores de marca */
  --kz-navy:        #1A2F4E;
  --kz-navy-dark:   #0d1d30;
  --kz-navy-mid:    #14263f;
  --kz-crimson:     #E80040;
  --kz-crimson-hover: #cc0038;
  --kz-light:       #F4F6F9;
  --kz-white:       #ffffff;

  /* Colores de estado */
  --kz-green:       #16A34A;
  --kz-amber:       #F59E0B;
  --kz-red-soft:    #FEF2F2;

  /* Tipografías */
  --font-display:   'Bebas Neue', sans-serif;
  --font-body:      'DM Sans', sans-serif;

  /* Tamaños tipográficos */
  --text-xs:        11px;
  --text-sm:        13px;
  --text-base:      15px;
  --text-md:        16px;
  --text-lg:        18px;
  --text-xl:        20px;
  --text-2xl:       24px;

  /* Display sizes */
  --display-sm:     36px;
  --display-md:     48px;
  --display-lg:     60px;
  --display-xl:     72px;

  /* Espaciado */
  --space-xs:       8px;
  --space-sm:       16px;
  --space-md:       24px;
  --space-lg:       40px;
  --space-xl:       64px;
  --space-2xl:      80px;

  /* Layout */
  --container:      1100px;
  --nav-height:     64px;
  --radius-sm:      6px;
  --radius-md:      10px;
  --radius-lg:      14px;
  --radius-xl:      20px;

  /* Sombras */
  --shadow-sm:      0 1px 3px rgba(26,47,78,0.08);
  --shadow-md:      0 4px 16px rgba(26,47,78,0.1);
  --shadow-lg:      0 8px 32px rgba(26,47,78,0.12);

  /* Transiciones */
  --transition:     0.2s ease;
  --transition-slow:0.35s ease;

  /* Bordes */
  --border-light:   1px solid rgba(26,47,78,0.08);
  --border-mid:     1px solid rgba(26,47,78,0.15);
  --border-white:   1px solid rgba(255,255,255,0.12);
  --border-white-soft: 1px solid rgba(255,255,255,0.08);
}
