/* ========================================================================
   CAPA 2 · BASE
   ------------------------------------------------------------------------
   Reset, tipografía base, primitivas de layout (.wrap / .sec) y encabezados
   de sección (.eyebrow / .sec-head). Consume los tokens de tokens.css.
   ======================================================================== */

/* ----------------------------- RESET ----------------------------------- */
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 14px); }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
html,body{ margin:0; padding:0; }
body{
  font-family:var(--font-sans);
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;
  line-height:1.55;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; }

/* foco de teclado visible y consistente (accesibilidad) */
:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; border-radius:4px; }

/* ----------------------------- UTILIDADES ------------------------------ */
.num{ font-variant-numeric:tabular-nums; }

/* ----------------------------- LAYOUT ---------------------------------- */
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 28px; }
section{ position:relative; }
.sec{ padding:104px 0; }
.sec-tight{ padding:80px 0; }

/* ------------------------ ENCABEZADO DE SECCIÓN ------------------------ */
.eyebrow{
  font-size:13px; font-weight:600; color:var(--amber-text);
  letter-spacing:.14em; text-transform:uppercase; margin:0 0 18px;
}
.eyebrow.on-navy{ color:var(--amber); }
.sec-head{ max-width:none; }
.sec-head h2{
  font-size:clamp(30px, 4.2vw, 50px); font-weight:600; letter-spacing:-.03em;
  line-height:1.04; margin:0; color:var(--ink); text-wrap:balance;
}
.sec-head h2 em{ font-style:normal; color:var(--amber-text); }
.sec-head .lede{
  font-size:clamp(17px,1.5vw,20px); line-height:1.55; color:var(--muted);
  margin:20px 0 0; max-width:58ch; text-wrap:pretty;
}
