/* Base común: reseteo mínimo, accesibilidad y la estructura de la plantilla. El diseño de la marca
   se construye encima, con los tokens de tokens.css. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--texto);font:400 var(--t-cuerpo)/1.55 var(--fuente);overflow-wrap:break-word}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:3px solid var(--foco);outline-offset:3px}

.saltar{position:absolute;left:var(--pad);top:-100px;padding:10px 14px;background:var(--texto);color:var(--fondo);z-index:10}
.saltar:focus{top:12px}

.barra{display:flex;align-items:center;justify-content:space-between;padding:20px var(--pad)}
.marca{font-weight:700;text-decoration:none}

.hero{padding:var(--seccion) var(--pad);min-height:min(80vh,900px);display:flex;flex-direction:column;justify-content:center;gap:24px}
.hero h1{margin:0;font-family:var(--fuente-titulo);font-size:var(--t-display);line-height:.95;letter-spacing:-.03em;font-weight:700;max-width:14ch}
.bajada{margin:0;font-size:var(--t-bajada);color:var(--texto-2);max-width:46ch}
.llamada{align-self:flex-start;display:inline-flex;align-items:center;min-height:48px;padding:12px 22px;border-radius:var(--radio);background:var(--acento);color:var(--sobre-acento);font-weight:600;text-decoration:none;transition:transform var(--duracion) var(--ease)}
.llamada:hover{transform:translateY(-2px)}

.seccion{padding:var(--seccion) var(--pad);border-top:1px solid var(--linea)}
.seccion h2{margin:0 0 16px;font-size:var(--t-h2);line-height:1.05}
.pie{padding:32px var(--pad);border-top:1px solid var(--linea);font-size:var(--t-chico);color:var(--texto-2)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}