*,*::before,*::after{box-sizing:border-box;}

/* El overflow-x va en AMBOS y con !important a propósito. Es el corte de
   raíz del bucle: si el lienzo escalado se pasa un píxel del ancho, sale
   una barra horizontal; al salir encoge el interior de la ventana, eso
   dispara un resize, el resize recalcula la escala, el contenido vuelve a
   caber, la barra desaparece, la ventana crece... y vuelta a empezar.
   Sin barra horizontal posible, el ciclo no puede arrancar. */
html,body{
  margin:0;
  padding:0;
  overflow-x:hidden !important;
  background:var(--white);
}

/* El ancho se fija SOLO en html, nunca en body.

   body lleva la compensacion de zoom (frencore.css). Un width:100% ahi lo
   ata al ancho de la ventana SIN zoomear, y acto seguido el zoom lo encoge:
   a 175% el pie se quedaba en el 57% de la pantalla en vez de ir a sangre.
   Dejandolo automatico, body toma el ancho de la ventana YA ajustado al
   zoom, que es el que necesita.

   A zoom 100% esto no cambia nada: un body de bloque sin ancho declarado ya
   ocupa el 100% de html. */
html{
  width:100%;
  max-width:100vw;
}

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}
/* Aquí llegó a haber overflow-y:scroll —y antes scrollbar-gutter:stable—
   para que la barra vertical no apareciera y desapareciera. Los dos eran
   parches: el temblor no lo causaba la barra, sino que .navbar seguía
   midiendo 1440px por debajo del umbral, porque su regla móvil estaba
   declarada ANTES que la base y perdía en la cascada. Corregido el orden
   en nav.css, la barra puede comportarse con normalidad. */

body{
  padding-top:var(--nav-h);   /* compensa el navbar fijo: único padding del body */
  color:var(--secondary-grey);
  font-family:var(--font-ui);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block;}

a{text-decoration:none;color:inherit;}

button{font:inherit;cursor:pointer;border:none;background:none;color:inherit;}

ul{margin:0;padding:0;list-style:none;}

h1,h2,h3,h4,h5,p{margin:0;}

input{font:inherit;}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;}
}