/**
 * DESIGN TOKENS — GROÜ Casuarinas 339
 * ------------------------------------------------------------------
 * Única fuente de verdad del sistema visual. No declarar colores,
 * tamaños de fuente, espaciados ni radios sueltos en otros archivos:
 * todo debe derivar de estas variables. Si necesitas un valor nuevo,
 * agrégalo aquí primero — así el sistema se mantiene consistente y
 * es trivial de portar a theme.json / ACF Options cuando esto se
 * convierta en tema de WordPress.
 */
:root{
  /* ---- Color: extraído del brochure de marca ---- */
  --color-bg:            #FFFFFF; /* Blanco puro — fondo base, look editorial/galería */
  --color-bg-alt:        #F7F6F3; /* Gris casi imperceptible — solo para separar bandas, nunca "crema" */
  --color-stone:         #A69E8F; /* Microcemento — neutro estructural */
  --color-stone-dark:    #8B8377;
  --color-brand:         #af0047; /* Color principal de interacción — botones, CTAs, footer */
  --color-brand-hover:   #c81a5c;
  --color-ink:           #211C18; /* Texto principal / fondo hero-dark */
  --color-amber:         #D2934E; /* Ámbar — el "339" iluminado; CTA principal y detalle de firma */
  --color-amber-soft:    #E8B57C;
  --color-line:          rgba(33,28,24,0.10);

  /* ---- Tipografía ----
     Sistema de marca oficial (reemplaza al set provisional Big Shoulders
     Display / Fraunces / Hanken Grotesk usado en el primer prototipo):
     Gazzetta para titulares, Aeonik para todo el texto de cuerpo/UI.
     Solo 2 familias en todo el sitio — ver 01-fonts.css. */
  --font-display:       'Gazzetta', Georgia, serif; /* peso 500 vía font-weight — ver 01-fonts.css */
  --font-display-light: 'Gazzetta', Georgia, serif; /* mismo family, peso 300 — se fija con font-weight:300 en el selector, no aquí */
  --font-body:          'Aeonik', -apple-system, Segoe UI, sans-serif;

  /* ---- Layout ---- */
  --maxw: 1240px;
  --radius: 2px; /* el sistema usa esquinas casi rectas a propósito — parte del look editorial/arquitectónico */
  --header-h: 69px; /* alto real del CorporateHeader ya scrolleado (16px padding*2 + 36px logo + 1px borde) — usado por ProjectSubnav y por scroll-margin-top de anchors */
  --subnav-h: 45px; /* alto real del ProjectSubnav */

  /* ---- Espaciado (escala de 8px) ---- */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;
  --space-7: 96px;

  /* ---- Movimiento ---- */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur-fast: .2s;
  --dur-base: .35s;
  --dur-slow: .7s;
}