/* ==========================================================================
   ALBENIZ ATONDO — Design Tokens v2 "Porcelana & Esmeralda"
   Paleta clara y clean: porcelana · esmeralda profundo · menta · azul piedra
   Tipografía: Space Grotesk (display) + Inter (texto). Sin cursivas.
   ========================================================================== */
:root {
  /* ---- Color ---- */
  --bg:            #f7f5f1;   /* porcelana cálida (fondo general) */
  --blanco:        #ffffff;   /* tarjetas y superficies elevadas */
  --tinta:         #14201a;   /* texto principal (verde-negro) */
  --gris:          #5c6b62;   /* texto secundario */
  --gris-suave:    #8a978e;   /* texto terciario / hints */
  --linea:         #e6e2da;   /* bordes y divisores */

  --primario:      #17594a;   /* esmeralda profundo (marca) */
  --primario-osc:  #0f4438;   /* hover */
  --menta:         #e2efe9;   /* superficie suave de marca */
  --menta-2:       #f0f6f2;   /* tinte casi imperceptible */

  --acento:        #4e7da6;   /* azul piedra (detalles) */
  --acento-suave:  #e8f0f6;

  --arena:         #efe9df;   /* bloques alternos cálidos */
  --error:         #b4544a;

  --wa:            #0e8f62;   /* WhatsApp adaptado a paleta (texto blanco AA) */
  --wa-osc:        #0b7550;

  /* ---- Tipografía ---- */
  --f-display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --f-texto:   "Inter", system-ui, -apple-system, sans-serif;

  /* ---- Escala fluida (mobile-first) ---- */
  --fs-hero:  clamp(2.3rem, 7.5vw, 4.2rem);
  --fs-h2:    clamp(1.65rem, 4.6vw, 2.5rem);
  --fs-h3:    clamp(1.12rem, 2.4vw, 1.35rem);
  --fs-body:  clamp(.95rem, 1.02vw, 1.02rem);
  --fs-small: .8rem;

  /* ---- Ritmo / layout ---- */
  --sp-1: .5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2.5rem;
  --sp-5: 4rem;
  --sp-6: 6rem;
  --ancho: 1160px;
  --radio: 8px;      /* máximo global */
  --radio-s: 6px;
  --header-h: 72px;

  /* ---- Sombra / transición ---- */
  --sombra:      0 10px 30px -14px rgba(20, 32, 26, .16);
  --sombra-alta: 0 24px 50px -20px rgba(20, 32, 26, .22);
  --tr: .3s cubic-bezier(.25, .6, .3, 1);
  --tr-lenta: .65s cubic-bezier(.25, .6, .3, 1);
}