/* Tokens compartidos por las 8 paginas.
 *
 * Antes este bloque estaba copiado dentro del <style> de cada archivo. Cada
 * cambio de color habia que hacerlo 8 veces y alcanzaba con olvidarse de uno
 * para que quedara una pagina distinta — ya habia pasado al aclarar el fondo.
 * Ahora se toca aca y sale en todas.
 *
 * PALETA "Petroleo" — decidida en la sesion de diseno del 7/8/2026.
 * Logo en variante "Uva": azul original #006C9C + sol violeta-vino #6E4463.
 *
 * Los grises y el terracota estan calculados para pasar el contraste minimo
 * de WCAG AA (4.5:1) sobre los tres fondos. Si se tocan, hay que volver a
 * medirlos: --ink-faint da 4.50 sobre --sand-deep, que es el caso mas justo.
 */
/* Ver la nota en index.html: sin esto, Chrome en Android agranda solo
   el texto de columnas angostas (la barra de contacto, sobre todo) y
   nunca se reproduce en un emulador. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;}

:root{
  /* fondos */
  --sand:#F8F6F1; --sand-deep:#EFEBE3; --cream:#FFFEFA;

  /* texto */
  --ink:#1C1F1B; --ink-soft:#484B44; --ink-faint:#696C62;

  /* acentos */
  --olive:#0E4649; --olive-deep:#082C2E; --olive-pale:#CDE3E1;
  --terracotta:#A85D40; --terracotta-deep:#9C5236;
  --error:#A8321E;

  /* lineas y sombras */
  --line:rgba(28,31,27,.13); --line-soft:rgba(28,31,27,.07);
  /* La misma linea suave pero opaca. Hace falta para el borde giratorio de
     las tarjetas: ahi el borde se pinta con un degradado, y un color
     translucido dejaria ver la pagina a traves del marco. Es el resultado
     de aplanar --line-soft sobre --sand. */
  --line-solida:#E8E7E2;
  --shadow-soft:0 1px 2px rgba(28,31,27,.06);
  --shadow-lift:0 24px 48px -20px rgba(8,44,46,.4);
  --shadow-card:0 2px 10px rgba(28,31,27,.05), 0 1px 1px rgba(28,31,27,.04);

  /* movimiento y radios */
  --ease:cubic-bezier(.32,.72,0,1);
  --r-lg:26px; --r-md:16px; --r-sm:10px; --r-pill:999px;

  /* Escala de espaciado. Antes cada seccion usaba el mismo padding y el
     resultado era monotono: sin ritmo, todo pesaba igual. */
  --sp-xs:10px; --sp-sm:18px; --sp-md:28px; --sp-lg:46px;
  --sp-xl:clamp(56px, 7vw, 84px);
  --sp-2xl:clamp(56px, 7vw, 92px);
  --sp-3xl:clamp(76px, 9.5vw, 118px);
}