/* =========================================================
   V27 · Mobile full-frame cinema
   Complete images, native flow and visible scroll motion.
   Loaded after V26 to intentionally override the earlier crop.
   ========================================================= */

@media (max-width:900px){
  html,body{overflow-x:hidden}
  body.cinematic-home main{overflow:clip!important}

  /* Every visual scene becomes a natural stacked composition.
     The image is no longer used as a cropped full-height backdrop. */
  body.cinematic-home .cinema-scene,
  body.cinematic-home .cinema-scene.cinema-hero{
    min-height:0!important;
    height:auto!important;
    padding:18px 0 34px!important;
    overflow:visible!important;
    background:#fff!important;
    perspective:1200px!important;
  }

  body.cinematic-home .cinema-sticky,
  body.cinematic-home .cinema-hero .cinema-sticky{
    position:relative!important;
    top:auto!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    background:#fff!important;
    isolation:isolate;
    transform-style:preserve-3d!important;
  }

  body.cinematic-home .cinema-media{
    position:relative!important;
    inset:auto!important;
    order:1!important;
    display:block!important;
    width:calc(100% - 24px)!important;
    height:auto!important;
    margin:0 auto!important;
    aspect-ratio:16 / 9;
    overflow:hidden!important;
    border:1px solid rgba(19,55,81,.08)!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:0 18px 46px rgba(29,63,87,.10)!important;
    opacity:1!important;
    transform-origin:center center!important;
    transform-style:preserve-3d!important;
  }
  body.cinematic-home [data-scene-label="Inicio"] .cinema-media{aspect-ratio:1717 / 916}
  body.cinematic-home [data-scene-label="Información"] .cinema-media{aspect-ratio:1800 / 842}
  body.cinematic-home [data-scene-label="Equipo"] .cinema-media{aspect-ratio:1600 / 800}
  body.cinematic-home [data-scene-label="Sectores"] .cinema-media{aspect-ratio:1600 / 875}
  body.cinematic-home [data-scene-label="Contacto"] .cinema-media{aspect-ratio:1717 / 916}

  body.cinematic-home .cinema-media img,
  body.cinematic-home .cinema-media-wide img,
  body.cinematic-home .cinema-hero .cinema-media img,
  body.cinematic-home .cinema-contact-scene .cinema-media img,
  body.cinematic-home .cinema-scene:nth-of-type(3) .cinema-media img,
  body.cinematic-home .cinema-scene:nth-of-type(5) .cinema-media img,
  body.cinematic-home .cinema-scene:nth-of-type(7) .cinema-media img{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#fff!important;
    opacity:1!important;
    filter:saturate(.98) contrast(.99) brightness(1.02)!important;
    transform-origin:center center!important;
  }

  /* A very light edge treatment integrates the complete image without hiding it. */
  body.cinematic-home .cinema-media::before{
    width:100%!important;
    inset:0!important;
    display:block!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.20),transparent 16%,transparent 84%,rgba(255,255,255,.34)),
      linear-gradient(90deg,rgba(255,255,255,.20),transparent 12%,transparent 88%,rgba(255,255,255,.20))!important;
    mix-blend-mode:normal!important;
    opacity:1!important;
    pointer-events:none!important;
  }
  body.cinematic-home .cinema-media::after{
    inset:0!important;
    border:1px solid rgba(255,255,255,.72)!important;
    border-radius:inherit!important;
    opacity:1!important;
    pointer-events:none!important;
  }

  body.cinematic-home .cinema-overlay,
  body.cinematic-home .cinema-overlay-right,
  body.cinematic-home .cinema-overlay-center,
  body.cinematic-home .cinema-overlay-strong{
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    opacity:1!important;
    background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 70%,rgba(255,255,255,.24))!important;
    pointer-events:none!important;
  }

  body.cinematic-home .cinema-content,
  body.cinematic-home .cinema-content-center-y,
  body.cinematic-home .cinema-content-center,
  body.cinematic-home .cinema-content-right{
    position:relative!important;
    inset:auto!important;
    order:2!important;
    display:block!important;
    width:calc(100% - 32px)!important;
    min-height:0!important;
    height:auto!important;
    margin:-18px auto 0!important;
    padding:0!important;
    text-align:left!important;
    transform-style:preserve-3d!important;
  }

  body.cinematic-home .cinema-copy,
  body.cinematic-home .cinema-copy-narrow,
  body.cinematic-home .cinema-copy-centered,
  body.cinematic-home .cinema-copy-contact{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:26px 18px 22px!important;
    border:1px solid rgba(19,55,81,.08)!important;
    border-radius:21px!important;
    background:rgba(255,255,255,.94)!important;
    box-shadow:0 18px 44px rgba(25,59,83,.09)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
    text-align:left!important;
    transform-style:preserve-3d!important;
  }
  body.cinematic-home .cinema-copy::after,
  body.cinematic-home .cinema-copy-centered::before{display:none!important}

  body.cinematic-home .cinema-copy h1,
  body.cinematic-home .cinema-copy h2{
    margin:0!important;
    color:#132d40!important;
    font-size:clamp(2.05rem,9.8vw,3.1rem)!important;
    line-height:1.04!important;
    letter-spacing:-.045em!important;
    text-align:left!important;
    text-shadow:0 1px 0 #fff,0 8px 26px rgba(17,47,68,.09)!important;
  }
  body.cinematic-home .cinema-copy h1{font-size:clamp(2.2rem,10.8vw,3.3rem)!important}
  body.cinematic-home .cinema-copy p{font-size:.93rem!important;line-height:1.62!important}
  body.cinematic-home .cinema-kicker{font-size:.66rem!important}

  /* Let JavaScript control opacity and transforms again on mobile. */
  body.cinematic-home .cinema-word-inner,
  body.cinematic-home .cinema-detail-line,
  body.cinematic-home [data-cinema-line],
  body.cinematic-home .kinetic-word-inner,
  body.cinematic-home .scroll-3d-block{
    will-change:transform,opacity!important;
    backface-visibility:hidden!important;
  }

  body.cinematic-home .cinema-hero .hero-facts{
    position:relative!important;
    inset:auto!important;
    order:3!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:calc(100% - 32px)!important;
    margin:12px auto 0!important;
    padding:8px!important;
    border:1px solid rgba(19,55,81,.08)!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 14px 34px rgba(25,59,83,.07)!important;
    transform-style:preserve-3d!important;
  }
  body.cinematic-home .cinema-hero .hero-facts::before{display:none!important}
  body.cinematic-home .cinema-hero .hero-facts>div{padding:10px 8px!important}

  body.cinematic-home .scene-meta{display:none!important}
  body.cinematic-home .ambient-particles{
    z-index:3!important;
    opacity:.76!important;
    border-radius:20px!important;
    overflow:hidden!important;
  }
  body.cinematic-home .ambient-particles.dissolve-particles.is-active{opacity:.92!important}

  /* All white sections remain animated and do not become static lists. */
  body.cinematic-home .cinema-intro-grid,
  body.cinematic-home .cinema-strip-head,
  body.cinematic-home .client-marquee,
  body.cinematic-home .cinema-process-head,
  body.cinematic-home .process-horizontal li,
  body.cinematic-home .cinema-pricing-head,
  body.cinematic-home .cinema-price-row{
    transform-style:preserve-3d!important;
    backface-visibility:hidden!important;
  }
}

@media (max-width:420px){
  body.cinematic-home .cinema-scene,
  body.cinematic-home .cinema-scene.cinema-hero{padding-top:12px!important;padding-bottom:28px!important}
  body.cinematic-home .cinema-media{width:calc(100% - 18px)!important;border-radius:17px!important}
  body.cinematic-home .cinema-content,
  body.cinematic-home .cinema-content-center-y,
  body.cinematic-home .cinema-content-center,
  body.cinematic-home .cinema-content-right{width:calc(100% - 24px)!important;margin-top:-13px!important}
  body.cinematic-home .cinema-copy,
  body.cinematic-home .cinema-copy-narrow,
  body.cinematic-home .cinema-copy-centered,
  body.cinematic-home .cinema-copy-contact{padding:22px 15px 19px!important;border-radius:18px!important}
  body.cinematic-home .cinema-copy h1{font-size:clamp(2.05rem,10.5vw,2.85rem)!important}
  body.cinematic-home .cinema-copy h2{font-size:clamp(1.9rem,9.7vw,2.6rem)!important}
  body.cinematic-home .cinema-hero .hero-facts{width:calc(100% - 24px)!important}
}