/* ========================================================
   ACTIVOPLUS+ DESIGN TOKENS - ESTILO KOOBA / NATURE CRAFT
   Acuarela, papel artesanal rasgado, verde oliva y cinta kraft
   ======================================================== */

:root {
  /* Paleta cromática inspirada en la referencia */
  --color-olive-header: #769538;
  --color-olive-header-dark: #627e2a;
  --color-olive-header-border: #567123;
  
  --color-watercolor-green: #597b2b;
  --color-watercolor-terracotta: #c9755f;
  --color-watercolor-teal: #5d8882;
  
  /* Fondos y papel */
  --bg-parchment: #FAF7EE;
  --bg-parchment-darker: #F0EAD8;
  --bg-parchment-card: #FFFFFF;
  --color-kraft-tape: #D7C5A3;
  
  /* Botones oscuros icónicos */
  --btn-dark-bg: #1e2b24;
  --btn-dark-hover: #131c17;
  --btn-dark-text: #FFFFFF;
  
  /* Textos y contrastes */
  --color-text-main: #333a32;
  --color-text-muted: #5e685c;
  --color-text-light: #7c8879;
  --color-text-on-dark: #FFFFFF;
  
  /* Compatibilidad con tokens previos */
  --color-verde-petroleo: #2d4c38;
  --color-verde-salvia: #829f4f;
  --color-blanco-calido: #FAF7EE;
  --color-beige-arena: #EBE3D0;
  --color-terracota: #c9755f;
  --color-gris-carbon: #333a32;
  --color-verde-claro: #eff5e7;
  
  --border-light: rgba(60, 75, 50, 0.12);
  --border-card: rgba(0, 0, 0, 0.08);

  /* Sombras estilo papel */
  --shadow-xs: 0 1px 3px rgba(35, 45, 25, 0.06);
  --shadow-sm: 0 4px 10px rgba(35, 45, 25, 0.08);
  --shadow-md: 0 8px 20px rgba(35, 45, 25, 0.12);
  --shadow-lg: 0 14px 32px rgba(35, 45, 25, 0.16);

  /* Tipografía */
  --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Escala de texto */
  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-md: 1.1875rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --fs-3xl: 2.85rem;
  --fs-4xl: 3.5rem;

  --lh-tight: 1.18;
  --lh-base: 1.65;
  --lh-relaxed: 1.8;

  /* Espaciado */
  --sp-xs: 0.5rem;
  --sp-sm: 0.75rem;
  --sp-md: 1rem;
  --sp-lg: 1.5rem;
  --sp-xl: 2rem;
  --sp-2xl: 3rem;
  --sp-3xl: 4.5rem;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 9999px;

  --max-width: 1140px;
  --content-width: 800px;
  --header-height: 52px;
}