/**
 * 1:1 Arquitectura - Variables de Diseño y Tokens Oficiales
 * Tipografías de Marca: Bolota Bold (Titulares & Display) y Futura PT (Textos & Técnico)
 * Paleta exacta extraída de guía de identidad y diseño gráfico
 */

@import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@700;800;900&family=Jost:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500&family=Paytone+One&display=swap');

:root {
  /* Tipografías Oficiales de Marca (Alternancia Equilibrada) */
  --font-display: 'Bolota Bold', 'Bolota', 'Gabarito', 'Paytone One', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-heading: 'Bolota Bold', 'Bolota', 'Gabarito', 'Paytone One', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Futura PT', 'Futura', 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-technical: 'Futura PT', 'Futura', 'Jost', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Paleta Oficial Exacta (Foto 2) */
  --color-dark-moss: #2D331B;     /* 2D331B - Verde Oscuro Profundo / Casi Negro */
  --color-olive: #475626;         /* 475626 - Verde Oliva Medio */
  --color-verde-vivo: #3AA448;    /* 3AA448 - Verde Vivo Esmeralda */
  --color-lima: #D7D725;          /* D7D725 - Amarillo Lima / Chartreuse Vibrante */
  --color-crema: #FFECD7;         /* FFECD7 - Crema Suave / Vainilla Cálido */
  --color-coral: #F15D51;         /* F15D51 - Coral Terracota Vibrante */
  --color-coral-hover: #db473b;
  --color-lavanda: #A1A3D1;       /* A1A3D1 - Lavanda / Azul Perla Suave */

  /* Colores de Apoyo y Superficies */
  --color-negro: #1E2312;
  --color-blanco: #FFFFFF;
  --color-fondo-oscuro: #212613;
  --color-fondo-suave: #FAF4EB;
  --color-gris-texto: #525C3C;
  --color-borde-suave: rgba(45, 51, 27, 0.12);
  --color-borde-fuerte: #2D331B;

  /* Sombras Sticker / Neo-Architectural Offset Shadows */
  --shadow-sticker-green: 5px 5px 0px var(--color-verde-vivo);
  --shadow-sticker-coral: 5px 5px 0px var(--color-coral);
  --shadow-sticker-dark: 5px 5px 0px var(--color-dark-moss);
  --shadow-sticker-lime: 5px 5px 0px var(--color-lima);
  --shadow-sticker-lavender: 5px 5px 0px var(--color-lavanda);
  --shadow-float: 0 16px 32px rgba(45, 51, 27, 0.15);

  /* Radios de Esquinas (Estilo Pastilla / Pill Shape) */
  --radius-xs: 6px;
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 28px;
  --radius-xl: 38px;
  --radius-pill: 9999px;

  /* Escala de Espaciado Armónica y Proporcional */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.35rem;
  --space-xl: 1.75rem;
  --space-2xl: 2.25rem;
  --space-3xl: 3.25rem;
  --space-4xl: 4.25rem;

  --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.32s cubic-bezier(0.16, 1, 0.3, 1);
  --max-width-container: 1240px;
  --header-height: 84px;
}
