/* =============================================
   CELEBRA MATRIMONIOS — DESIGN TOKENS
   EazyBiz SpA · Mayo 2026 · v1
   Archivo: tokens.css
   ============================================= */

:root {

  /* ─── COLORES BASE ─── */
  --color-ink:          #1A1A2E;
  --color-ink-soft:     #2E2B4A;
  --color-cream:        #F5EDD6;
  --color-warm-white:   #FAF8F5;
  --color-white:        #FFFFFF;

  /* ─── ACENTO MATRIMONIOS ─── */
  --color-accent:       #C9A96E;
  --color-accent-light: #DFC090;
  --color-accent-pale:  #F5EDD6;
  --color-accent-dark:  #A8884A;

  /* ─── ROSA COMPLEMENTARIO ─── */
  --color-blush:        #E8D5C4;
  --color-blush-dark:   #D4B89E;

  /* ─── NEUTROS ─── */
  --color-border:       #EAE7E0;
  --color-border-strong:#DDD9D0;
  --color-muted:        #B4B2A9;
  --color-subtle:       #888780;

  /* ─── SEMÁNTICOS ─── */
  --color-success:      #4A7C6F;
  --color-success-pale: #E0EDE8;
  --color-error:        #C06B6B;
  --color-error-pale:   #F5E8E8;
  --color-warning:      #C9A96E;
  --color-info:         #3A5A8C;
  --color-info-pale:    #E0E6F0;

  /* ─── TIPOGRAFÍA ─── */
  --font-display:        'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body:           'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

  --font-size-xs:        11px;
  --font-size-sm:        13px;
  --font-size-base:      15px;
  --font-size-md:        17px;
  --font-size-lg:        20px;
  --font-size-xl:        24px;
  --font-size-2xl:       30px;
  --font-size-3xl:       38px;
  --font-size-4xl:       48px;
  --font-size-display:   64px;

  --font-weight-light:   300;
  --font-weight-regular: 400;
  --font-weight-medium:  500;
  --font-weight-semibold:600;
  --font-weight-bold:    700;

  --line-height-tight:   1.1;
  --line-height-snug:    1.3;
  --line-height-normal:  1.5;
  --line-height-relaxed: 1.7;

  --letter-spacing-tight:  -0.5px;
  --letter-spacing-normal:  0px;
  --letter-spacing-wide:    2px;
  --letter-spacing-wider:   4px;
  --letter-spacing-widest:  6px;

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

  /* ─── BORDES ─── */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-full: 9999px;

  --border-thin:   0.5px solid var(--color-border);
  --border-normal: 1px solid var(--color-border);
  --border-strong: 1px solid var(--color-border-strong);
  --border-accent: 1px solid var(--color-accent);

  /* ─── SOMBRAS ─── */
  --shadow-xs:     0 1px 2px rgba(26,26,46,0.04);
  --shadow-sm:     0 2px 8px rgba(26,26,46,0.06);
  --shadow-md:     0 4px 16px rgba(26,26,46,0.08);
  --shadow-lg:     0 8px 32px rgba(26,26,46,0.12);
  --shadow-xl:     0 16px 48px rgba(26,26,46,0.16);
  --shadow-accent: 0 4px 20px rgba(201,169,110,0.25);

  /* ─── TRANSICIONES ─── */
  --transition-fast:   150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow:   400ms ease;

  /* ─── Z-INDEX ─── */
  --z-base:     0;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-modal:    200;
  --z-toast:    300;
  --z-tooltip:  400;
}
