/* Correcciones del sitio (revisión del 07/11/2026). */

/* El botón flotante de WhatsApp tapaba el final del pie en teléfono. */
@media (max-width: 600px) {
  footer { padding-bottom: 76px; }
  footer a { display: inline-flex; align-items: center; min-height: 44px; }
}
/* Renglones del menú plegado de 44 px como mínimo para el dedo. */
#site-header #main-nav .nav-link { min-height: 44px; }

/* Cabecera B (Sergio, 07/11): sin bloque oscuro. El nombre de la página es una
   etiqueta (el h1) con una línea roja sobre el contenido; el menú queda en barra
   oscura sólida. Contacto ya no repite su título en la sección. */
/* Barra oscura con el logo blanco; al desplazarse el sitio la pone blanca con su logo oscuro (is-solid): no se fuerza. */
#site-header.cab-barra:not(.is-solid) { background: #111; }
.cab-min-caja { padding-top: 130px; }
.cab-min-caja + section { padding-top: 32px !important; }
.cab-min { display: flex; align-items: center; gap: 16px; margin: 0; font-size: 13px; line-height: 1.2; letter-spacing: .14em; text-transform: uppercase; font-weight: 800; color: var(--color-dark, #111); }
.cab-min::after { content: ""; flex: 1; max-width: 120px; height: 2px; background: var(--color-primary, #c00); }
@media (max-width: 768px) { .cab-min-caja { padding-top: 116px; } }

/* Servicios en teléfono: los tres recuadros de tipo iban en carrusel de
   78 % de ancho, cortados y del alto de media pantalla. Ahora, tres renglones
   bajos con el nombre completo. */
@media (max-width: 800px) {
  #service-filter { display: grid; grid-template-columns: 1fr; gap: 8px; margin: 0 0 24px; padding: 0; overflow: visible; }
  #service-filter li { width: auto; }
  #service-filter .cat-tile { aspect-ratio: auto; height: 56px; }
  #service-filter .cat-tile__text { top: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 16px; }
  #service-filter .cat-tile__text > span { margin: 0; font-size: 15px; }
  #service-filter .cat-tile__text > span + span { display: none; }
}

/* Mínimo de calidad (07/11): letra de 12 px como mínimo y 44 px para el dedo
   (managestorm/sitio-web/scripts/calidad.mjs). */
[class*="text-[10px]"], [class*="text-[11px]"] { font-size: 12px; }
@media (max-width: 600px) {
  .min-h-6 { min-height: 44px; }
}