/* Mortar — Framework base
 * Reglas estructurales del design system. Los tokens llegan por alias desde la hoja
 * generada: --mortar-header-height y --mortar-container-gap.
 */
html {
  scroll-behavior: smooth;
}
[id] {
  scroll-margin-block-start: var(--header-height-measured, var(--mortar-header-height, 0px));
}
ul {
  margin: 0;
  padding: 0;
}

/* — Ritmo vertical (solo texto enriquecido) —————————————————————————————
   Acotado a contenedores de prosa para no meter márgenes a hijos de flex/grid, que
   Bricks separa con gap. Las dos reglas tienen la misma especificidad, así que el
   orden entre ellas importa: no separarlas. */
p, h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

/* Las reglas que nombran elementos de un constructor concreto (la prosa, los contenedores
   internos, el header) NO viven aquí: este archivo lo comparten todos los destinos y se
   sirve tal cual. Las emite el motor desde el perfil del destino activo, en ds.css. */

/* — Secciones y contenedores ————————————————————————————————————————— */
section:where(:not(.bricks-shape-divider)) {
  gap: var(--mortar-container-gap, 1.5rem);
}

/* — Alto mínimo ——————————————————————————————————————————————————————
   Una página más corta que la ventana dejaba el body terminando a media altura. En el
   frontend no se nota (el fondo suele ser blanco sobre blanco), pero en el LIENZO DE UN
   BUILDER sí: debajo del body asoma su fondo, y Etch además le pinta una sombra grande al
   canvas, así que una sección vacía aparecía con un degradado gris de origen misterioso.
   Con esto el body llega abajo y no hay hueco. 100svh, no 100vh: en móvil vh cuenta la
   barra del navegador y provoca un salto. */
body {
  min-height: 100vh;
  min-height: 100svh;
}

/* — Overflow ————————————————————————————————————————————————————————— */
/* Sin la clase de Bricks: en otro constructor el body no la lleva y estas dos reglas no se
   aplicaban. La de no-scroll además se registra como clase del sistema, así que allí
   ofrecíamos una utilidad que no hacía nada. */
body {
  overflow-x: clip;
}
body.no-scroll {
  overflow: hidden !important;
}

/* — Medida de lectura (compatible con full-bleed) ————————————————————— */
.u-max-width-50ch {
  max-inline-size: 50ch;
}
.u-max-width-60ch {
  max-inline-size: 60ch;
}
.u-max-width-70ch {
  max-inline-size: 70ch;
}