/* ============================================================
   layout.css — Contenedor, grid 12 col, ritmo vertical
   ============================================================ */
.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.content{max-width:var(--content);margin-inline:auto}

/* Ritmo vertical de secciones */
.section{padding-block:var(--space-12);scroll-margin-top:88px}
.section--tight{padding-block:var(--space-10)}
.section--flush-top{padding-top:0}

/* Grid 12 columnas (desktop) */
.grid{display:grid;gap:var(--space-3)}
.grid-12{grid-template-columns:repeat(12,1fr)}
.col-6{grid-column:span 6}
.col-4{grid-column:span 4}
.col-3{grid-column:span 3}

/* Stacks utilitarios */
.stack{display:flex;flex-direction:column}
.stack-2{gap:var(--space-2)}
.stack-3{gap:var(--space-3)}
.stack-4{gap:var(--space-4)}
.row{display:flex;align-items:center}
.wrap{flex-wrap:wrap}
.gap-2{gap:var(--space-2)}
.gap-3{gap:var(--space-3)}

.center{text-align:center}
.measure{max-width:64ch}
.measure-narrow{max-width:52ch}
.mx-auto{margin-inline:auto}