/* GENWAY mobile compatibility fixes, revision 2 (2026-09-01). */
html {
  max-width: 100%;
  overflow-x: hidden;
  scroll-behavior: auto !important;
  scroll-snap-type: none !important;
}

body,
main {
  max-width: 100%;
  overflow-x: hidden;
  scroll-snap-type: none !important;
  overscroll-behavior-y: auto;
}

img,
video {
  max-width: 100%;
}

section[id] {
  scroll-snap-align: none !important;
  scroll-snap-stop: normal !important;
}

/* iOS Safari/WebView cannot reliably composite a video behind a negative layer. */
.hero__video {
  z-index: 0 !important;
  display: block !important;
  background: #020303;
}

.hero__shade {
  z-index: 1 !important;
  pointer-events: none;
}

.hero .site-header,
.hero .hero__signature,
.hero .scroll-cue {
  z-index: 2 !important;
}

.science-visual video,
.studio-player video {
  width: 100% !important;
  height: auto !important;
  object-fit: contain;
}

/* Reduced-motion mode keeps a useful poster instead of a blank hero. */
@media (prefers-reduced-motion: reduce) {
  .hero__video {
    display: block !important;
  }
}

@media (max-width: 760px) {
  /* The 16:9 brand film must fit inside a portrait screen. Cover enlarged the
     GENWAY wordmark until only its middle letters were visible. */
  .hero__video {
    object-fit: contain !important;
    object-position: center 42% !important;
    width: 100% !important;
    height: 100% !important;
    transform: none !important;
  }

  .hero__shade {
    background:
      linear-gradient(#000a 0%, #0000 23%),
      linear-gradient(#0000 62%, #000000d1 100%) !important;
  }

  .science,
  .method,
  .studio,
  .delivery,
  .protection,
  .about {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .science-visual,
  .studio-player,
  .home-loop-panel {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .science-visual video {
    aspect-ratio: 233 / 88;
  }

  .studio-player video {
    aspect-ratio: 959 / 471;
  }
}