/* MONKY · Cabeceras de servicios móvil R1 · 12/10/2026.
   Imágenes del usuario, sin retoque ni regeneración.
   Hoja adicional y aislada; PC y tablet conservan la base publicada. */
body[data-service] .design-hero > .service-mobile-visual { display: none; }

@media (max-width: 600px) {
  body[data-service] .design-hero > .hero-photo { display: none; }

  body[data-service] .design-hero > .service-mobile-visual {
    display: block;
    position: relative;
    z-index: 0;
    order: -1;
    flex: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    /* Completa el sombreado que ya tienen las fotos, revelando el mismo
       fondo del bloque al final. Evita añadir una segunda franja oscura. */
    --service-mobile-fade: linear-gradient(to bottom,
      #000 58%, rgba(0,0,0,.99) 66%, rgba(0,0,0,.96) 74%,
      rgba(0,0,0,.85) 82%, rgba(0,0,0,.63) 88%,
      rgba(0,0,0,.34) 93%, rgba(0,0,0,.12) 97%,
      rgba(0,0,0,.015) 99%, transparent 100%);
    -webkit-mask-image: var(--service-mobile-fade);
    mask-image: var(--service-mobile-fade);
  }

  body[data-service] .design-hero > .service-mobile-visual > img {
    display: block;
    position: static;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: center;
  }
}