/* ============================================================================
   DPAI · Base
   Reset ligero, elementos HTML, tipografía base y primitivas de layout
   (.wrap, section, .sec-head, .eyebrow, .accent). Depende de tokens.css.
   ========================================================================== */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto} *{animation:none!important;transition:none!important}}
body{margin:0;background:var(--carbon);color:var(--nieve);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--cian)}
h1,h2,h3{font-family:var(--display);line-height:1.15;margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-size:clamp(2rem,5.2vw,3.6rem);font-weight:700}
h2{font-size:clamp(1.6rem,3.4vw,2.4rem);font-weight:600}
h3{font-size:1.15rem;font-weight:600}
p{margin:0}
[hidden]{display:none!important}
/* Las anclas (#nosotros, #servicios…) caen debajo del header fijo, no detrás */
[id]{scroll-margin-top:clamp(84px,10vw,100px)}

/* Primitivas de layout */
.wrap{max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
section{padding-block:clamp(44px,9vw,104px)}
.sec-head{display:grid;gap:14px;max-width:62ch;margin-bottom:clamp(24px,4vw,40px)}
.sec-head p{font-size:1.08rem;color:var(--bruma)}

/* Tipografía de apoyo */
.eyebrow{font-family:var(--display);font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--cian)}
.accent{color:var(--cian)}
