/* V61 — estabilidad visual entre pantallas de escritorio.
   Solo regula el contenedor horizontal de los heroes; no cambia su diseño. */
@media (min-width:861px){
  :root{--hero-safe-gutter:clamp(32px,4.5vw,96px);}

  /* Servicios: evita que el contenido se pegue al borde en escritorios medianos. */
  .services-hero-v26__content{
    margin-left:max(var(--hero-safe-gutter),calc((100vw - 1440px)/2))!important;
  }
}

@media (min-width:981px){
  /* Inicio: conserva la composición aprobada y añade un margen seguro fluido. */
  .home-hero-v57 .hero-v18-layout{
    width:min(1440px,calc(100% - (2 * var(--hero-safe-gutter))))!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .home-hero-v57 .hero-v18-copy{
    left:0!important;
  }

  /* Flota: mismo criterio de contención sin modificar imagen, texto o proporciones. */
  .fleet-hero-v33__layout{
    width:min(1440px,calc(100% - (2 * var(--hero-safe-gutter))))!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* Empresa: mantiene su alineación derecha, pero con margen lateral estable. */
  .company-hero-v43__inner{
    width:min(1440px,calc(100% - (2 * var(--hero-safe-gutter))))!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Portátiles/escritorios compactos: margen suficiente sin comprimir el hero. */
@media (min-width:861px) and (max-width:1280px){
  :root{--hero-safe-gutter:clamp(28px,3.5vw,48px);}
  .services-hero-v26__content{width:min(650px,47vw)!important;}
}
