/* tokens.css — Variables de diseño: Amaro Coctels SCQ */
/* Dark mode fijo: identidad de marca, no se adapta a prefers-color-scheme */

:root {
  /* Paleta — Verde Amsterdam */
  --color-bg:           #07120A;
  --color-surface:      #0C1E10;
  --color-surface-2:    #122618;
  --color-border:       #1E3B25;
  --color-border-light: #2A5033;

  --color-text-primary: #ECF0E8;
  --color-text-muted:   #789A7E;
  --color-text-faint:   #46604E;

  --color-accent:       #C9A84C;
  --color-accent-hover: #E2C06A;
  --color-accent-warm:  #E8A87C;
  --color-danger:       #D9534F;
  --color-success:      #4CAF50;

  /* Verde Amsterdam — verde bosque saturado */
  --color-teal:         #3A7A50;
  --color-teal-light:   #54A06E;
  --color-teal-dark:    #1D3E28;
  --color-teal-glow:    rgba(58,122,80,0.22);

  /* WhatsApp */
  --color-whatsapp:     #25D366;

  /* Tipografía */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'DM Mono', 'Courier New', monospace;

  /* Escala tipográfica — clamp: responsive sin media queries */
  --text-xs:   clamp(0.70rem,  1.4vw, 0.80rem);
  --text-sm:   clamp(0.85rem,  1.8vw, 0.95rem);
  --text-base: clamp(1rem,     2.2vw, 1.1rem);
  --text-lg:   clamp(1.15rem,  2.8vw, 1.4rem);
  --text-xl:   clamp(1.4rem,   3.5vw, 2rem);
  --text-2xl:  clamp(1.9rem,   5vw,   3rem);
  --text-hero: clamp(3rem,     8vw,   6.5rem);

  /* Espaciado */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 7rem;

  /* Layout */
  --max-width:     1200px;
  --content-width: 720px;
  --nav-height:    72px;

  /* Bordes */
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --radius-full: 999px;

  /* CTAs */
  --cta-min-height:    52px;
  --cta-padding:       0 2rem;
  --cta-font-weight:   700;
  --cta-letter-spacing:0.06em;
  --cta-transition:    background 0.22s ease, transform 0.15s ease, box-shadow 0.22s ease;

  /* Sombras */
  --shadow-sm:  0 1px 4px rgba(0,0,0,0.4);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.5);
  --shadow-lg:  0 12px 40px rgba(0,0,0,0.6);
  --shadow-accent: 0 0 24px rgba(201,168,76,0.18);
  --shadow-teal:   0 0 24px rgba(58,122,80,0.28);

  /* Animaciones */
  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in:    cubic-bezier(0.55, 0, 1, 0.45);
  --duration-fast:   180ms;
  --duration-base:   320ms;
  --duration-slow:   600ms;
}