/* CARTA DA RISO CONTINUA E SENZA STACCHI */
  body {
    background-color: #fff9eb !important;
    background-image: url('https://www.transparenttextures.com/patterns/rice-paper.png') !important;
    background-repeat: repeat !important;
    background-attachment: fixed !important;
  }
  .bg-surface-container-high, .bg-surface-container\/60 {
    background-color: transparent !important;
    background-image: none !important;
  }

  /* SFONDO HERO DEDICATO */
  #top {
    background-color: #1d1c13 !important;
    background-image: url('images/hero-cover.webp') !important;
    background-position: 60% 40% !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
  }

  .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
  
  /* GRADIENTE MOBILE PIÙ TRASPARENTE PER LASCIARE VEDERE LA PISCINA / FOTO COME NEL VECCHIO SITO */
  .hero-gradient { background: linear-gradient(to bottom, rgba(255, 249, 235, 0.75) 0%, rgba(255, 249, 235, 0.20) 45%, rgba(255, 249, 235, 0.85) 100%); }
  @media(min-width: 768px) {
    .hero-gradient { background: linear-gradient(to right, rgba(255, 249, 235, 0.97) 0%, rgba(255, 249, 235, 0.7) 38%, rgba(255, 249, 235, 0) 62%); }
  }

  .reveal-on-scroll { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease-out, transform 0.8s ease-out; }
  .reveal-on-scroll.visible { opacity: 1; transform: translateY(0); }
  
  .logo-img { height: 78px !important; width: auto !important; max-width: none !important; object-fit: contain; }

  /* LIGHTBOX MODAL GALLERIA */
  .lightbox-modal { display:none; position:fixed; inset:0; background:rgba(29,28,19,0.96); z-index:200; justify-content:center; align-items:center; padding:15px; }
  .lightbox-modal.active { display:flex; }
  .lightbox-img-wrap { position:relative; max-width:900px; width:100%; text-align:center; }
  .lightbox-img-wrap img { max-height:75vh; max-width:100%; margin:0 auto; border-radius:2px; box-shadow:0 15px 40px rgba(0,0,0,0.5); object-fit:contain; }
  .lightbox-close { position:absolute; top:-40px; right:0; color:#fff; font-size:32px; cursor:pointer; font-family:sans-serif; }
  .lightbox-nav { position:absolute; top:50%; width:100%; display:flex; justify-content:space-between; transform:translateY(-50%); pointer-events:none; }
  .lightbox-btn { background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.3); color:#fff; font-size:24px; padding:12px 18px; cursor:pointer; pointer-events:auto; border-radius:2px; }

  .parallax-bg {
    background-attachment: scroll;
  }
  @media (min-width: 768px) {
    .parallax-bg {
      background-attachment: fixed;
    }
  }
/* =========================================================
   OTTIMIZZAZIONI MOBILE (Max-Width: 768px)
========================================================= */
@media (max-width: 768px) {
  
  /* 1. Prevenzione globale dello scroll orizzontale */
  html, body {
    overflow-x: hidden !important;
    width: 100%;
  }

  /* 2. Ridimensionamento fluido del Logo nella Navbar */
  .logo-img {
    height: 48px !important; /* Riduce l'ingombro della navbar */
    width: auto !important;
  }

  /* 3. Prevenzione fuoriuscita testi e rottura layout */
  p, h1, h2, h3, h4, a, span {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }

  /* 4. Correzione della Lightbox Modal per evitare pulsanti tagliati */
  .lightbox-img-wrap {
    margin-top: 40px; /* Crea spazio in alto per il pulsante */
    padding: 0 10px;
    width: 95%;
  }
  
  .lightbox-close {
    top: -35px; /* Riporta il pulsante visibile */
    right: 5px;
    font-size: 28px;
  }

  /* Rimpicciolisce i pulsanti di navigazione della galleria su mobile */
  .lightbox-btn {
    font-size: 18px;
    padding: 8px 12px;
  }

  /* 5. Sicurezza per evitare che i form e i pulsanti larghi generino scroll */
  input, textarea, button, form {
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Assicura che i bottoni flessibili nella Hero occupino il 100% della larghezza */
  section#top .flex-col a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}