*{box-sizing:border-box}body{margin:0;background:#f4ede1;color:#29241c;font:16px system-ui,sans-serif;padding-bottom:75px}header{background:var(--primary,#31513a);color:white;display:flex;align-items:center;justify-content:space-between;padding:15px 18px;gap:10px}header a{color:white;font-weight:800;text-decoration:none;font-size:1.1rem}main{max-width:1040px;margin:auto;padding:18px}h1,h2{font-family:Georgia,serif}h1{font-size:clamp(1.6rem,4vw,2.5rem)}button{border:0;background:var(--primary,#31513a);color:white;border-radius:10px;padding:12px 17px;font:inherit;cursor:pointer}button:hover{filter:brightness(1.12)}button:disabled{opacity:.5}input,select,textarea{width:100%;padding:12px;border:1px solid #b9ac99;border-radius:9px;background:#fff;font:inherit;margin:6px 0}textarea{min-height:90px}form{max-width:600px;margin:12px 0;padding:16px;background:#fff9f0;border:1px solid #d5c6ad;border-radius:12px}form button{margin-top:8px}.page{animation:enter .18s ease}@keyframes enter{from{opacity:.4;transform:translateY(8px)}to{opacity:1;transform:none}}.ranch{background:linear-gradient(#99c4d4 0%,#d8dcb0 44%,#759055 45%,#4e713b 100%);border:8px solid #76502c;border-radius:20px;min-height:600px;padding:20px;position:relative;overflow:hidden;box-shadow:0 8px 28px #543a2166}.sky{text-align:right;font-size:38px}.barn{margin:5px auto 20px;background:repeating-linear-gradient(90deg,#8a452b 0 18px,#a45935 19px 36px);width:min(380px,90%);height:125px;border:7px solid #55321f;position:relative;display:grid;place-items:center}.roof{position:absolute;top:-42px;left:-25px;width:calc(100% + 50px);height:38px;background:#573a2d;clip-path:polygon(50% 0,100% 100%,0 100%)}.barnname{color:#ffe7b2;background:#59341f;padding:10px 18px;font-family:Georgia,serif;font-weight:bold}.gates{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;position:relative}.gate{min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-decoration:none;color:#fff2d5;font-size:35px;font-weight:bold;text-shadow:1px 2px #38210d;background:repeating-linear-gradient(90deg,#79502e 0 15px,#966239 16px 31px);border:7px ridge #c49b60;border-radius:9px 9px 3px 3px;box-shadow:0 8px 0 #49321e,0 11px 10px #1e321c70;transition:transform .16s}.gate span{font:700 15px Georgia,serif;text-align:center}.gate:hover,.gate:focus-visible{transform:translateY(-5px) rotateY(5deg);outline:3px solid #fff0b4}.card{padding:16px;background:#fff9f0;border:1px solid #d3c5af;border-radius:12px;margin:12px 0}.meta{color:#655c4f;font-size:.9rem}.feed{display:grid;gap:10px}.chat{height:min(55vh,500px);overflow:auto;background:#fff9f0;padding:12px;border-radius:12px}.bubble{background:#e3eddd;border-radius:12px;padding:10px;max-width:85%}.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.photos img{width:100%;height:180px;object-fit:cover;border-radius:10px}.poster{background:#f9e9c6;border:12px double #79502e;max-width:550px;min-height:620px;margin:20px auto;padding:35px;text-align:center}.poster h2{font-size:40px;color:#704023}.poster .logo{max-width:110px;max-height:110px}#bottom{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:#294a35;padding:9px 4px max(9px,env(safe-area-inset-bottom));z-index:5}#bottom a{color:white;text-decoration:none;display:flex;flex-direction:column;text-align:center;gap:2px;font-size:22px}#bottom small{font-size:11px}#toast{position:fixed;top:70px;right:12px;max-width:350px;background:#3a342b;color:white;border-radius:8px;padding:12px;display:none;z-index:10}@media(max-width:680px){main{padding:12px}.ranch{min-height:650px;padding:12px}.gates{grid-template-columns:repeat(2,1fr);gap:12px}.gate{min-height:118px;font-size:27px}.gate span{font-size:13px}.barn{height:90px;margin-top:20px}header #who{font-size:12px}}@media print{header,nav,button,form,.page:not(#posters),#posters>h1,#posters>p,#posterEvent{display:none!important}body{background:white;padding:0}.poster{break-inside:avoid;box-shadow:none;margin:0 auto}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* ===== RANCH: CANCELLI PADDOCK ANIMATI ===== */

.gates {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  padding: 32px 8px;
}

.gate {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-height: 215px;
  padding: 0 10px 12px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #4b2b18;
  text-shadow: none;
  text-decoration: none;
  isolation: isolate;
  perspective: 800px;
  transition: none;
}

.gate:hover,
.gate:focus-visible {
  transform: none;
  outline-offset: 5px;
}

.gate::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 6%;
  width: 88%;
  height: 100px;
  border: 12px solid #85502c;
  border-bottom: 0;
  border-radius: 100% 100% 0 0;
  box-sizing: border-box;
  background: transparent;
  pointer-events: none;
}

.gate::after {
  content: "";
  position: absolute;
  top: 91px;
  left: 8%;
  right: 8%;
  height: 12px;
  border-radius: 4px;
  background: linear-gradient(#b57942, #75401f);
  box-shadow: 0 3px 4px #3d241b55;
  pointer-events: none;
}

.gate .gate-title {
  position: absolute;
  top: 42px;
  left: 15%;
  right: 15%;
  z-index: 3;
  padding: 7px 3px;
  border-radius: 8px;
  background: #754525;
  color: #fff1d2;
  font: bold 13px Georgia, serif;
  text-align: center;
  box-shadow: 0 3px 5px #39201566;
}

.gate .gate-leaves {
  position: relative;
  display: flex;
  width: 85%;
  height: 108px;
  margin-top: 90px;
  border-left: 9px solid #a86c3c;
  border-right: 9px solid #a86c3c;
  border-bottom: 9px solid #70431f;
  transform-style: preserve-3d;
}

.gate .gate-leaf {
  position: relative;
  width: 50%;
  height: 100%;
  background:
    linear-gradient(35deg, transparent 46%, #9c673b 47% 53%, transparent 54%),
    linear-gradient(-35deg, transparent 46%, #9c673b 47% 53%, transparent 54%),
    repeating-linear-gradient(
      to bottom,
      transparent 0 18px,
      #a87546 19px 28px,
      transparent 29px 42px
    );
  border: 4px solid #c3945d;
  box-sizing: border-box;
  transition: transform 0.8s ease-in-out;
  backface-visibility: visible;
}

.gate .gate-left {
  transform-origin: left center;
}

.gate .gate-right {
  transform-origin: right center;
}

.gate.opening .gate-left {
  transform: rotateY(-75deg);
}

.gate.opening .gate-right {
  transform: rotateY(75deg);
}

.gate.opening {
  pointer-events: none;
}

@media (max-width: 850px) {
  .gates {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
}

@media (max-width: 420px) {
  .gates {
    gap: 10px;
    padding: 20px 0;
  }

  .gate {
    min-height: 190px;
  }

  .gate .gate-title {
    font-size: 11px;
  }

  .gate .gate-leaves {
    height: 95px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gate .gate-leaf {
    transition: none;
  }
}


/* ===== RANCH ALBA INTERATTIVO ===== */

#home {
  max-width: 1500px;
  margin: 0 auto;
}

#home .ranch-scene {
  position: relative;
  width: 100%;
  aspect-ratio: 1536 / 1024;
  overflow: hidden;
  border-radius: 18px;
  background: #425c35 url('/ranch-alba.webp') center / 100% 100% no-repeat;
  box-shadow: 0 16px 45px rgba(34, 25, 15, .28);
}

#home .ranch-scene .gate {
  position: absolute;
  display: block;
  width: 17.6%;
  height: 26.5%;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  perspective: 900px;
  transform: none;
  text-decoration: none;
  z-index: 2;
}

#home .ranch-scene .gate:nth-child(1) { left:3.3%; top:31.0%; width:24.0%; height:28.0%; }
#home .ranch-scene .gate:nth-child(2) { left:26.0%; top:31.0%; width:23.0%; height:28.0%; }
#home .ranch-scene .gate:nth-child(3) { left:49.5%; top:31.0%; width:22.0%; height:28.0%; }
#home .ranch-scene .gate:nth-child(4) { left:73.0%; top:31.0%; width:23.0%; height:28.0%; }
#home .ranch-scene .gate:nth-child(5) { left:3.2%; top:60.5%; width:18.0%; height:30.0%; }
#home .ranch-scene .gate:nth-child(6) { left:22.2%; top:60.5%; width:18.0%; height:30.0%; }
#home .ranch-scene .gate:nth-child(7) { left:41.2%; top:60.5%; width:18.0%; height:30.0%; }
#home .ranch-scene .gate:nth-child(8) { left:60.2%; top:60.5%; width:18.0%; height:30.0%; }
#home .ranch-scene .gate:nth-child(9) { left:79.2%; top:60.5%; width:18.0%; height:30.0%; }









#home .ranch-scene .gate-title {
  display: none;
}

#home .ranch-scene .gate-leaves {
  position: absolute;
  inset: 0;
  display: flex;
  pointer-events: none;
  overflow: visible;
}

#home .ranch-scene .gate-leaf {
  position: relative;
  width: 50%;
  height: 100%;
  background:
    repeating-linear-gradient(
      90deg,
      #6b391c 0,
      #965a2f 12%,
      #7c4523 25%
    );
  border: 3px solid #4d2c19;
  opacity: 0;
  transition: transform 850ms ease, opacity 180ms ease;
  backface-visibility: hidden;
}

#home .ranch-scene .gate-left {
  transform-origin: left center;
}

#home .ranch-scene .gate-right {
  transform-origin: right center;
}

#home .ranch-scene .gate.opening .gate-leaf {
  opacity: 1;
}

#home .ranch-scene .gate.opening .gate-left {
  transform: rotateY(-85deg);
}

#home .ranch-scene .gate.opening .gate-right {
  transform: rotateY(85deg);
}

#home .ranch-scene .gate:focus-visible {
  outline: 3px solid #ffe3a0;
  outline-offset: 3px;
}

@media (max-width: 700px) {
  #home .ranch-scene {
    min-width: 850px;
  }

  #home .ranch-scene-wrap {
    overflow-x: auto;
    border-radius: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #home .ranch-scene .gate-leaf {
    transition: none;
  }
}


/* ===== CORREZIONE FOTOGRAFICA HOME ===== */

#home {
  max-width: none;
}

#home #ranch.ranch {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#home .ranch-scene-wrap {
  width: 100%;
  overflow: visible;
}

#home .ranch-scene {
  width: 100%;
  aspect-ratio: 1536 / 1024;
  border-radius: 12px;
  background-image: url('/ranch-alba.webp') !important;
  background-size: 100% 100% !important;
  background-position: center !important;
}

/* Cancella le decorazioni dei vecchi cancelli CSS. */
#home .ranch-scene .gate,
#home .ranch-scene .gate:hover,
#home .ranch-scene .gate:focus {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  text-shadow: none !important;
  filter: none !important;
}

#home .ranch-scene .gate::before,
#home .ranch-scene .gate::after {
  content: none !important;
  display: none !important;
}

/* Nessun cancello artificiale sopra la fotografia. */
#home .ranch-scene .gate-leaves,
#home .ranch-scene .gate-title {
  display: none !important;
}

/* Le nove aree rimangono cliccabili. */
#home .ranch-scene .gate {
  position: absolute !important;
  display: block !important;
  z-index: 2;
  cursor: pointer;
  transform: none !important;
}

#home .ranch-scene .gate:focus-visible {
  outline: 3px solid #ffe7a2 !important;
  outline-offset: -3px;
}

/* Adattamento telefono: immagine intera, senza tagli. */
@media (max-width: 700px) {
  #home .ranch-scene-wrap {
    overflow: visible !important;
  }

  #home .ranch-scene {
    min-width: 0 !important;
    width: 100% !important;
  }
}



/* ===== PADDOCK MOBILE V1 ===== */

@media (max-width: 700px) {

  #home .ranch-scene-wrap {
    overflow: visible !important;
  }

  #home .ranch-scene {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    aspect-ratio: auto !important;
    min-height: 0 !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px 12px;
    padding: 145px 12px 24px !important;

    background-image:
      linear-gradient(
        180deg,
        rgba(16,34,19,.08),
        rgba(19,48,25,.35)
      ),
      url('/ranch-alba.webp') !important;

    background-size: cover !important;
    background-position: center top !important;
    border-radius: 15px;
  }

  /* Cancelli grandi, due per fila */
  #home .ranch-scene .gate {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    height: 145px !important;
    min-height: 145px !important;

    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;

    background:
      linear-gradient(
        90deg,
        #533019,
        #98643b 10%,
        #734321 50%,
        #a36b3f 90%,
        #533019
      ) !important;

    border: 7px ridge #b88953 !important;
    border-radius: 22px 22px 5px 5px !important;
    box-shadow:
      0 6px 0 #3b2415,
      0 9px 13px #0005 !important;

    overflow: hidden;
    perspective: 700px;
    text-decoration: none;
  }

  /* Due ante di legno */
  #home .ranch-scene .gate-leaves {
    display: flex !important;
    position: absolute !important;
    inset: 31px 0 0 !important;
    overflow: visible !important;
    pointer-events: none;
  }

  #home .ranch-scene .gate-leaf {
    display: block !important;
    opacity: 1 !important;
    width: 50% !important;
    height: 100% !important;

    background:
      linear-gradient(
        35deg,
        transparent 44%,
        #c38b52 45%,
        #c38b52 49%,
        #482a17 50%,
        #c38b52 52%,
        #c38b52 56%,
        transparent 57%
      ),
      linear-gradient(
        -35deg,
        transparent 44%,
        #c38b52 45%,
        #c38b52 49%,
        #482a17 50%,
        #c38b52 52%,
        #c38b52 56%,
        transparent 57%
      ),
      repeating-linear-gradient(
        90deg,
        #71401e 0 13px,
        #985d30 14px 26px
      ) !important;

    border: 3px solid #3c2415 !important;
    transition: transform .8s ease !important;
  }

  #home .ranch-scene .gate-left {
    transform-origin: left center !important;
  }

  #home .ranch-scene .gate-right {
    transform-origin: right center !important;
  }

  /* Targhetta del paddock */
  #home .ranch-scene .gate-title {
    display: block !important;
    position: relative !important;
    z-index: 4;
    width: 100%;
    margin: 0 !important;
    padding: 7px 3px !important;

    background: #392313 !important;
    color: #ffedbf !important;
    font: bold 13px Georgia, serif !important;
    text-align: center;
    text-shadow: 1px 1px #000 !important;
    white-space: nowrap;
  }

  /* Apertura delle ante */
  #home .ranch-scene .gate.opening .gate-left {
    transform: rotateY(-80deg) !important;
  }

  #home .ranch-scene .gate.opening .gate-right {
    transform: rotateY(80deg) !important;
  }

  /* Academy centrata */
  #home .ranch-scene .gate:nth-child(9) {
    grid-column: 1 / -1;
    width: calc(50% - 6px) !important;
    justify-self: center;
  }
}

@media (max-width: 700px) and (prefers-reduced-motion: reduce) {
  #home .ranch-scene .gate-leaf {
    transition: none !important;
  }
}


/* ===== MOBILE SENZA CANCELLI SOVRAPPOSTI ===== */

@media (max-width: 700px) {

  /* Niente fotografia con altri cancelli sotto. */
  #home .ranch-scene {
    background-image:
      linear-gradient(
        180deg,
        #a9c6d1 0%,
        #d9ddbb 35%,
        #8ba56c 36%,
        #426b3d 100%
      ) !important;
  }

  /* Il paesaggio appare quando le ante si aprono. */
  #home .ranch-scene .gate {
    background:
      linear-gradient(
        180deg,
        #b5d3db 0%,
        #dce5c4 43%,
        #759b61 44%,
        #315a31 100%
      ) !important;
  }

  #home .ranch-scene .gate-leaves {
    z-index: 2;
  }

  #home .ranch-scene .gate-title {
    z-index: 5;
  }
}


/* ===== PADDOCK MOBILE V2 ===== */

@media (max-width: 700px) {

  #home .ranch-scene-wrap {
    overflow: visible !important;
  }

  #home .ranch-scene {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 17px 12px !important;
    padding: 24px 10px 30px !important;
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: auto !important;
    background:
      linear-gradient(180deg,#9dbfc3 0%,#d9d3a9 30%,#66854d 65%,#355c35 100%)
      !important;
  }

  #home .ranch-scene .gate {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    height: 150px !important;
    min-height: 150px !important;
    padding: 0 !important;
    display: block !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    perspective: 700px;
  }

  /* Pali laterali del paddock */
  #home .ranch-scene .gate::before,
  #home .ranch-scene .gate::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: -7px !important;
    bottom: -9px !important;
    width: 13px !important;
    height: auto !important;
    background:
      linear-gradient(90deg,#3d2413,#b77a43 32%,#865027 72%,#352012)
      !important;
    border: 2px solid #392316 !important;
    border-radius: 3px !important;
    box-shadow: 2px 3px 4px #0005 !important;
    z-index: 4 !important;
  }

  #home .ranch-scene .gate::before {
    left: -5px !important;
    right: auto !important;
  }

  #home .ranch-scene .gate::after {
    right: -5px !important;
    left: auto !important;
  }

  /* Ante in legno: non più cornici vuote */
  #home .ranch-scene .gate-leaves {
    display: flex !important;
    position: absolute !important;
    inset: 15px 9px 0 !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    opacity: 1 !important;
    z-index: 2 !important;
  }

  #home .ranch-scene .gate-leaf {
    display: block !important;
    position: relative !important;
    width: 50% !important;
    height: 100% !important;
    opacity: 1 !important;
    border: 3px solid #4a2a15 !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 0 2px #b5814c !important;

    background:
      linear-gradient(
        45deg,
        transparent 43%,
        #422510 44%,
        #c38a4d 47%,
        #c38a4d 53%,
        #422510 56%,
        transparent 57%
      ),
      linear-gradient(
        -45deg,
        transparent 43%,
        #422510 44%,
        #c38a4d 47%,
        #c38a4d 53%,
        #422510 56%,
        transparent 57%
      ),
      linear-gradient(
        to bottom,
        #6a3e20 0 9%,
        #c28a50 10% 17%,
        transparent 18% 43%,
        #b47a40 44% 53%,
        transparent 54% 78%,
        #b47a40 79% 88%,
        #59341d 89% 100%
      ) !important;

    transform: none;
    transition: transform .8s ease !important;
    backface-visibility: visible !important;
  }

  #home .ranch-scene .gate-left {
    transform-origin: left center !important;
  }

  #home .ranch-scene .gate-right {
    transform-origin: right center !important;
  }

  /* Targhetta leggibile, sopra le ante */
  #home .ranch-scene .gate-title {
    display: block !important;
    position: absolute !important;
    z-index: 8 !important;
    top: 39% !important;
    left: 4% !important;
    width: 92% !important;
    margin: 0 !important;
    padding: 9px 2px !important;
    background: linear-gradient(#58351c,#2e1a0e) !important;
    border: 2px solid #c18a4e !important;
    border-radius: 5px !important;
    color: #fff0c9 !important;
    font: bold clamp(11px,3.2vw,15px) Georgia,serif !important;
    white-space: nowrap !important;
    text-align: center !important;
    text-shadow: 1px 1px #000 !important;
    pointer-events: none !important;
  }

  #home .ranch-scene .gate.opening .gate-left {
    transform: rotateY(-75deg) !important;
  }

  #home .ranch-scene .gate.opening .gate-right {
    transform: rotateY(75deg) !important;
  }

  /* Academy al centro */
  #home .ranch-scene .gate:nth-child(9) {
    grid-column: 1 / -1 !important;
    width: calc(50% - 6px) !important;
    justify-self: center !important;
  }
}



/* ===== RANCH MOBILE FOTOGRAFICO DEFINITIVO ===== */

@media (max-width: 700px) {

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

  #home .ranch-scene {
    position: relative !important;
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;

    aspect-ratio: 1024 / 1536 !important;

    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;

    background-image: url('/ranch-mobile.webp') !important;
    background-size: 100% 100% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  /* Nove aree trasparenti sopra i cancelli fotografici. */
  #home .ranch-scene .gate,
  #home .ranch-scene .gate:hover,
  #home .ranch-scene .gate:focus {
    position: absolute !important;

    display: block !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    transform: none !important;
    overflow: hidden !important;
    cursor: pointer;
    z-index: 3 !important;
  }

  /* Posizioni dei cancelli nella fotografia mobile. */
  #home .ranch-scene .gate:nth-child(1) {
    left: 6%; top: 19%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(2) {
    left: 51%; top: 19%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(3) {
    left: 6%; top: 34%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(4) {
    left: 51%; top: 34%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(5) {
    left: 6%; top: 49%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(6) {
    left: 51%; top: 49%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(7) {
    left: 6%; top: 64%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(8) {
    left: 51%; top: 64%; width: 43%; height: 14%;
  }

  #home .ranch-scene .gate:nth-child(9) {
    left: 18%; top: 80%; width: 64%; height: 15%;
  }

  /* Elimina tutti i vecchi disegni CSS. */
  #home .ranch-scene .gate::before,
  #home .ranch-scene .gate::after {
    content: none !important;
    display: none !important;
  }

  #home .ranch-scene .gate-title,
  #home .ranch-scene .gate-leaves,
  #home .ranch-scene .gate-leaf {
    display: none !important;
  }

  #home .ranch-scene .gate:focus-visible {
    outline: 3px solid #ffdf82 !important;
    outline-offset: -3px !important;
  }
}


/* ===== FIX CLICK CANCELLI MOBILE ===== */
@media (max-width: 700px) {
  #home .ranch-scene {
    pointer-events: auto !important;
  }

  #home .ranch-scene > a.gate {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    z-index: 999 !important;
  }

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

/* ===== RIMOZIONE RIQUADRI CANCELLI ===== */
#home .ranch-scene .gate,
#home .ranch-scene .gate:hover,
#home .ranch-scene .gate:focus,
#home .ranch-scene .gate:focus-visible,
#home .ranch-scene .gate.opening {
  outline: none !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  border-color: transparent !important;
}

#home .ranch-scene .gate::before,
#home .ranch-scene .gate::after {
  border: none !important;
  box-shadow: none !important;
}


/* ===== CANCELLI CLICCABILI SENZA RIQUADRI ===== */
#home .ranch-scene a.gate {
  pointer-events: auto !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
}

#home .ranch-scene a.gate:focus,
#home .ranch-scene a.gate:focus-visible,
#home .ranch-scene a.gate.opening {
  outline: none !important;
  box-shadow: none !important;
}

#home .ranch-scene a.gate::before,
#home .ranch-scene a.gate::after {
  box-shadow: none !important;
}

@media (max-width: 700px) {
  #home .ranch-scene a.gate {
    z-index: 999 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }
}


/* ===== EFFETTO DISSOLVENZA CANCELLI ===== */

#home .ranch-scene > a.gate {
  cursor: pointer !important;
  pointer-events: auto !important;
  outline: none !important;
  box-shadow: none !important;
}

#home .ranch-scene > a.gate:focus,
#home .ranch-scene > a.gate:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

#home .ranch-scene > a.gate.gate-fading {
  background: rgba(255, 244, 205, 0.24) !important;
  transition: background 450ms ease !important;
}

@media (max-width: 700px) {
  #home .ranch-scene > a.gate {
    z-index: 999 !important;
    touch-action: manipulation !important;
  }
}