/* ===== NUOVA INTERFACCIA MOBILE ===== */

@media (max-width: 700px) {

  #home .ranch,
  #home .ranch-scene-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  #home .ranch-scene {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1024 / 1536 !important;
    background: url('/ranch-mobile.webp') center / 100% 100% no-repeat !important;
    border: none !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    isolation: isolate !important;
  }

  #home .ranch-scene > a.gate {
    position: absolute !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    z-index: 10 !important;
    transform: none !important;
    transition: background 350ms ease, opacity 350ms ease !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  #home .ranch-scene > a.gate *,
  #home .ranch-scene > a.gate::before,
  #home .ranch-scene > a.gate::after {
    display: none !important;
    pointer-events: none !important;
  }

  #home .ranch-scene > a.gate:nth-child(1) {
    left: 6% !important; top: 19% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(2) {
    left: 51% !important; top: 19% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(3) {
    left: 6% !important; top: 34% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(4) {
    left: 51% !important; top: 34% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(5) {
    left: 6% !important; top: 49% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(6) {
    left: 51% !important; top: 49% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(7) {
    left: 6% !important; top: 64% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(8) {
    left: 51% !important; top: 64% !important;
    width: 43% !important; height: 14% !important;
  }
  #home .ranch-scene > a.gate:nth-child(9) {
    left: 18% !important; top: 80% !important;
    width: 64% !important; height: 15% !important;
  }

  #home .ranch-scene > a.gate.mobile-opening {
    background: rgba(255, 255, 255, 0.32) !important;
    opacity: 0.65 !important;
  }
}