/* Tokens del sitio (ver DESIGN.md). Ningún color, tamaño o radio fuera de aquí. */
/* ================= Fuente (local, licencia OFL) ================= */
@font-face { font-family: "Cooper Hewitt"; src: url("../fonts/CooperHewitt-300.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Cooper Hewitt"; src: url("../fonts/CooperHewitt-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Cooper Hewitt"; src: url("../fonts/CooperHewitt-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Cooper Hewitt"; src: url("../fonts/CooperHewitt-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }

/* ================= Tokens ================= */
:root {
  --profundo: #063a4f;     /* texto principal y bandas oscuras */
  --marca: #0a5f8a;        /* bloque principal, CTA */
  --marca-hover: #084c6f;
  --liston: #4a7399;       /* azul del listón del logo: bloque secundario */
  --liston-hover: #3d6386;
  --cielo: #eaf3f8;        /* bandas claras */
  --cielo-2: #d7e7f1;      /* espacio de foto */
  --blanco: #ffffff;
  --gris: #5a6b75;         /* texto secundario */
  --linea: #dfe6ea;
  --oro: #c2963f;          /* solo detalles: el dorado del logo */
  --pend-bg: #fbe7a8; --pend-ink: #5a3d00;

  --f: "Cooper Hewitt", "Helvetica Neue", Arial, sans-serif;
  --t-h1: clamp(40px, 5.6vw, 84px);
  --t-h2: clamp(32px, 3.8vw, 54px);
  --t-h3: clamp(20px, 1.6vw, 24px);
  --t-lead: clamp(18px, 1.35vw, 21px);
  --t-texto: 17px;
  --t-chico: 15px;
  --t-mini: 13px;
  --t-cap: 13px;           /* navegación y botones en mayúsculas */

  --s-1: 4px; --s-2: 8px; --s-3: 16px; --s-4: 24px; --s-5: 40px; --s-6: 64px; --s-7: 96px;
  --seccion: clamp(72px, 9vw, 128px);
  --gutter: clamp(20px, 5vw, 96px);
  --ancho: 1400px;
  --alto-nav: 104px;
  --curva: cubic-bezier(.16, 1, .3, 1);
}