/* HOME PAGE */
/* La testata sta nel flusso della pagina, sopra lo slider: prima era in
   position:absolute, sovrapposta a uno slider a tutta larghezza (2026-10-07). */
#headerbox{position:relative;width:100%;z-index:999;background:transparent;}
#global{background:transparent;}
#container02{background:transparent;border-radius:0;}

#home{background:transparent;margin:0;padding:0;position:static;width:100%;}
#wrapper{width:100%;margin:0 auto;}

/* SLIDER */
/* Lo slider e' un riquadro centrato, allineato ai box sotto (.home-spots:
   1200px con 20px di margine), con angoli arrotondati: non piu' a tutta pagina. */
.aw-slider{position:relative;z-index:1;width:calc(100% - 40px);max-width:1160px;margin:28px auto 0;
  background:#e9ecef;border-radius:16px;overflow:hidden;
  box-shadow:0 1px 3px rgba(0,0,0,.06),0 12px 32px rgba(0,0,0,.10);}
.aw-viewport{position:relative;width:100%;overflow:hidden;}
/* Altezza robusta (proporzione 8:3, 37.5%): senza un'altezza esplicita la viewport
   sarebbe alta 0px (le slide sono in position:absolute) e non vedresti nulla. */
.aw-viewport::before{content:"";display:block;padding-top:37.5%;}
.aw-track{list-style:none;margin:0;padding:0;}
.aw-slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;}
.aw-slide.is-active{opacity:1;}
.aw-link{display:block;width:100%;height:100%;text-decoration:none;color:#fff;}
div.aw-link{cursor:default;}
.aw-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.aw-caption{position:absolute;left:0;right:0;bottom:0;padding:16px 20px 22px;
  background:linear-gradient(transparent, rgba(0,0,0,.62));}
.aw-caption p{margin:0;font-size:clamp(.95rem,2vw,1.3rem);color:#fff;font-weight:600;
  text-shadow:0 1px 3px rgba(0,0,0,.45);}

/* frecce: z-index sopra .aw-hero (2), altrimenti il pannello del log
   (posizionato a destra) copre il pulsante "next" e ne blocca il click */
.aw-prev,.aw-next{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;border:0;border-radius:50%;cursor:pointer;
  background:rgba(0,0,0,.45);color:#fff;font-size:26px;line-height:1;
  display:flex;align-items:center;justify-content:center;transition:background .2s;}
.aw-prev{left:12px;}
.aw-next{right:12px;}
.aw-prev:hover,.aw-next:hover{background:rgba(0,0,0,.7);}

/* riga controlli: play/pausa + puntini */
.aw-controls{position:absolute;left:0;right:0;bottom:6px;z-index:2;
  display:flex;align-items:center;justify-content:center;gap:14px;}
.aw-toggle{width:34px;height:34px;border:0;border-radius:50%;cursor:pointer;
  background:rgba(0,0,0,.45);color:#fff;font-size:14px;line-height:1;
  display:flex;align-items:center;justify-content:center;}
.aw-toggle:hover{background:rgba(0,0,0,.7);}
.aw-dots{display:flex;gap:8px;}
.aw-dot{width:12px;height:12px;padding:0;border:2px solid #fff;border-radius:50%;
  background:transparent;cursor:pointer;}
.aw-dot[aria-current="true"]{background:#fff;}

/* messa a fuoco sempre visibile (accessibilità da tastiera) */
.aw-prev:focus-visible,.aw-next:focus-visible,.aw-toggle:focus-visible,
.aw-dot:focus-visible,.aw-link:focus-visible,.aw-log-list:focus-visible{
  outline:3px solid var(--color-focus-outline);outline-offset:2px;}

/* testo solo per screen reader */
.aw-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap;border:0;padding:0;margin:-1px;}

/* rispetta "riduci animazioni": niente dissolvenza, niente autoplay (gestito anche in JS) */
@media (prefers-reduced-motion: reduce){
  .aw-slide{transition:none;}
}

/* LOG sovrapposto allo slider: .aw-hero e' un livello assoluto che copre
   l'intero .aw-slider (stessa altezza di .aw-viewport), cosi' controlli e log
   restano sopra le immagini invece di finire sotto nel flusso normale. */
.aw-hero{position:absolute;inset:0;z-index:2;pointer-events:none;}
.aw-hero > *{pointer-events:auto;}

.aw-log{
  position:absolute;right:18px;bottom:56px;
  width:min(360px,42%);max-height:60%;
  display:flex;flex-direction:column;
  color:#fff;background:rgba(15,17,21,.66);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  border-radius:10px;padding:12px 14px;box-sizing:border-box;
}
.aw-log-title{margin:0 0 8px;font-size:1rem;font-weight:bold;letter-spacing:.02em;}
.aw-log-list{
  list-style:none;margin:0;padding:0 4px 0 0;
  overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.aw-log-list:focus-visible{border-radius:4px;}
.aw-log-item{
  display:flex;gap:10px;padding:8px 2px;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.aw-log-item:last-child{border-bottom:0;}
.aw-log-time{
  flex:0 0 auto;min-width:4.2em;font-size:.78rem;opacity:.82;
  font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.5);
}
.aw-log-text{font-size:.9rem;line-height:1.35;text-shadow:0 1px 2px rgba(0,0,0,.5);}

/* su smartphone alziamo un po' l'area per leggere meglio la didascalia */
@media (max-width:700px){
  .aw-viewport::before{padding-top:75%;}
}

/* SMARTPHONE: il log passa da overlay a blocco pieno sotto l'immagine */
@media (max-width:640px){
  .aw-slider{width:calc(100% - 24px);margin-top:16px;border-radius:12px;}
  .aw-hero{position:static;display:flex;flex-direction:column;}
  .aw-controls{position:static;margin-top:6px;}
  .aw-log{
    position:static;width:auto;max-height:none;border-radius:0;
    background:#15171b;-webkit-backdrop-filter:none;backdrop-filter:none;
  }
  .aw-log-list{max-height:260px;}
}

/* BOX SPOT: accessibile / area riservata / assistenza clienti */
.home-spots{max-width:1200px;margin:32px auto;padding:0 20px;}
.home-spots h2{text-align:center;margin:0 0 20px;color:var(--color-body-text);}
.spot-list{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:20px;}
.spot-item{margin:0;}
.spot-link{display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:8px;height:100%;padding:24px 18px;box-sizing:border-box;
  border:1px solid rgba(0,0,0,.1);border-radius:10px;
  text-decoration:none;color:var(--color-body-text);
  background:var(--color-body-bg);transition:box-shadow .2s,transform .2s;}
.spot-link:hover{box-shadow:0 4px 14px rgba(0,0,0,.12);transform:translateY(-2px);}
.spot-link:focus-visible{outline:3px solid var(--color-focus-outline);outline-offset:2px;}
.spot-icon{width:40px;height:40px;fill:var(--color-accent);flex:0 0 auto;}
.spot-title{font-weight:700;font-size:1.05rem;}
.spot-text{font-size:.9rem;line-height:1.4;opacity:.85;}

@media (prefers-reduced-motion: reduce){
  .spot-link{transition:none;}
  .spot-link:hover{transform:none;}
}

@media (max-width:768px){
  .spot-list{grid-template-columns:1fr;}
}