/* ============================================================
   Los Altillos — ajustes UX por página (revisión 29/9/2026)
   Archivo: assets/ux-pages.css — se carga en todo el sitio DESPUÉS del CSS
   de cada página. Solo layout/espaciado: tamaños de letra y áreas táctiles
   viven en ux-mobile.css (no tocar aquí).
   Ver ux/UX-REVIEW.md para el porqué de cada bloque.
   ============================================================ */

/* 1 · Doble compensación del header fijo en los heros de artículos.
   header.css ya da body{padding-top:var(--header-height)}; estos heros sumaban
   otra vez var(--header-height) y dejaban ~64 px de banda vacía arriba de las
   migas. En el móvil eso empujaba la tarjeta de precio / respuesta directa
   debajo del primer viewport. Se deja solo el aire propio de cada diseño. */
.labvap-hero,
.lawfc-hero,
.lacid-hero,
.lapvc-hero,
.laemp-hero,
.lainst-hero,
.ladur-hero,
.lamam-hero,
.laent-hero,
.sfgag-hero,
.sfgu-hero,
.sfge-hero,
.sfgmx-hero,
.sfgpe-hero,
.laiso-hero,
.lalan-hero,
.lapdu-hero,
.sfpag-hero,
.sfec-hero,
.sfes-hero,
.sfpmx-hero,
.sfppe-hero,
.sfcl-hero,
.sfgc-hero,
.latar-hero,
.latdw-hero,
.laqu-hero { padding-top: 64px; }
.laag-hero,
.lacl-hero,
.laec-hero,
.laes-hero,
.lamx-hero,
.lape-hero { padding-top: 72px; }
.laco-hero { padding-top: 6rem; }
.sfco-hero, .sfcop-hero, .sfmx-hero { padding-top: 4rem; }
.sfcop-hero__spec { top: 1.25rem; }
.gx-hero__inner { padding-top: 5rem; }

@media (max-width: 767px) {
  .labvap-hero,
  .lawfc-hero,
  .lacid-hero,
  .lapvc-hero,
  .laemp-hero,
  .lainst-hero,
  .ladur-hero,
  .lamam-hero,
  .laent-hero,
  .sfgag-hero,
  .sfgu-hero,
  .sfge-hero,
  .sfgmx-hero,
  .sfgpe-hero,
  .laiso-hero,
  .lalan-hero,
  .lapdu-hero,
  .sfpag-hero,
  .sfec-hero,
  .sfes-hero,
  .sfpmx-hero,
  .sfppe-hero,
  .sfcl-hero,
  .sfgc-hero,
  .latar-hero,
  .latdw-hero,
  .laqu-hero,
  .laag-hero,
  .lacl-hero,
  .laec-hero,
  .laes-hero,
  .lamx-hero,
  .lape-hero { padding-top: 24px; }
  .sfco-hero, .sfcop-hero { padding-top: 2rem; }
  .sfmx-hero { padding-top: 2.5rem; }
  .laco-hero { padding-top: 3rem; }
  .gx-hero__inner { padding-top: 2.5rem; }
  /* la ficha (fecha, fuentes, lectura) queda más pegada a la bajada */
  .labvap-meta,
  .lawfc-meta,
  .lacid-meta,
  .lapvc-meta,
  .laemp-meta,
  .lainst-meta,
  .ladur-meta,
  .lamam-meta,
  .laent-meta,
  .sfgag-meta,
  .sfgu-meta,
  .sfge-meta,
  .sfgmx-meta,
  .sfgpe-meta,
  .laiso-meta,
  .lalan-meta,
  .lapdu-meta,
  .sfpag-meta,
  .sfec-meta,
  .sfes-meta,
  .sfpmx-meta,
  .sfppe-meta,
  .sfcl-meta,
  .sfgc-meta,
  .latar-meta,
  .latdw-meta,
  .laqu-meta { margin-top: 20px; }
}

/* 2 · Heros de las páginas hub (Steel Framing, Drywall, Cielorrasos, etc.):
   en el móvil ocupaban 100svh (una pantalla entera sin contenido útil).
   Altura natural + menos aire: la definición, las cifras y el primer bloque
   de contenido entran en el primer scroll. La home (.home) no se toca. */
@media (max-width: 768px) {
  .ladw-hero,
  .lacr-hero,
  .lacm-hero,
  .lais-hero,
  .lapm-hero,
  .larv-hero,
  .laar-hero,
  .lacomp-hero,
  body:not(.home) .lahome-hero { min-height: auto; }
  .ladw-hero__inner,
  .lacr-hero__inner,
  .lacm-hero__inner,
  .lais-hero__inner,
  .lapm-hero__inner,
  .larv-hero__inner,
  .laar-hero__inner,
  .lacomp-hero__inner,
  body:not(.home) .lahome-hero__inner { padding-top: 2.25rem; padding-bottom: 2rem; }
  .ladw-hero__ctas,
  .lacr-hero__ctas,
  .lacm-hero__ctas,
  .lais-hero__ctas,
  .lapm-hero__ctas,
  .larv-hero__ctas,
  .laar-hero__ctas,
  .lacomp-hero__ctas,
  body:not(.home) .lahome-hero__ctas { margin-bottom: 1.5rem; }
  .ladw-hero__trust,
  body:not(.home) .lahome-hero__trust { padding-top: 1rem; gap: .5rem 1.25rem; }
}

/* 3 · /steel-framing/casas/: hero más bajo en el móvil para que la galería
   de fotos (búsqueda «casas steel framing fotos») asome en la primera pantalla. */
@media (max-width: 640px) {
  .page-template-page-casas-steel-framing .p2-hero { min-height: 0; }
  .page-template-page-casas-steel-framing .p2-hero__inner { padding-top: 1.75rem; padding-bottom: 1.5rem; }
}
