/*
 * Pala Todisco — passata di luminosità e contrasto.
 * Caricato per ultimo su ogni pagina: alza i fondali navy di uno scalino e
 * porta i testi secondari sopra la soglia di leggibilità (WCAG AA, 4.5:1).
 * Non tocca la palette: solo luminanza. Se serve tornare indietro, basta
 * togliere l'enqueue di 'pala-contrast' in functions.php.
 */

:root{
  /* fondali: +1 scalino di luminosità, la tinta resta la stessa */
  --ink:#111634;
  --navy-900:#141a42;
  --navy-800:#1b2455;
  --navy-700:#243066;
  /* bordi e divisori: erano quasi invisibili */
  --line:rgba(255,255,255,.20);
}

/* Testi secondari sui fondali scuri.
   Prima: #b9c0d8 / #8b93b4 / #6a7490 → contrasti tra 3.4:1 e 7:1.
   Ora tutti sopra 4.5:1 sul nuovo fondale.

   ATTENZIONE: queste regole valgono SOLO sui fondali scuri. La home ha due
   sezioni su fondo crema (.soluzioni e .territorio) che usano gli stessi
   selettori: schiarire lì il testo lo rende illeggibile. Per questo .sec-head p
   è elencato sezione per sezione invece che in blocco. */
body{color:#f2f4fa}
.manifesto p,
.storia .tx p,
.spazi .sec-head p,
.gallery .sec-head p,
.reels .sec-head p{color:#d4dae9}

/* Sezioni su fondo crema: il testo va nella direzione opposta, scurito.
   Era #5a5f72 su #faf9f4 = 6.1:1, già a norma ma tenue: portato a 8.4:1. */
.soluzioni .sec-head p,
.territorio .sec-head p{color:#474d63}

.num .l{color:#b4bcd6}
.form-footer p,
.cf-orari,
.cm-orari{color:#a9b2cd}

/* Elementi con opacità ridotta: erano il punto più debole. */
.drop a{opacity:.92}
.scrollcue{opacity:.78}
.has-drop>a::after{opacity:.8}

/* Velature sulle foto: schiarite, le immagini erano spente. */
.tile .veil,
.scene .veil{background:linear-gradient(180deg,rgba(10,14,34,0) 30%,rgba(10,14,34,.55) 72%,rgba(10,14,34,.86) 100%)}

/* Bordi delle card: da .10-.13 a .20, così i blocchi si staccano dal fondo.
   Solo su fondo scuro: su crema un bordo bianco al 20% sparisce. */
.card,
.std,
.feat,
.dl-card,
.check-item,
.field input,
.field select,
.field textarea{border-color:rgba(255,255,255,.20)}
.soluzioni .card,
.soluzioni .std,
.territorio .card,
.territorio .std{border-color:rgba(10,14,34,.14)}

/* Focus visibile da tastiera (mancava del tutto). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

/* Margini laterali dell'hero nelle pagine interne.
   Il markup è <div class="wrap hero-content">: .wrap dà padding:0 32px, ma
   .hero-content arriva dopo con padding:0 0 60px (shorthand) e azzera i
   laterali. Su desktop largo non si nota perché il max-width centra il
   blocco; su mobile il testo finisce attaccato al bordo. */
.wrap.hero-content{padding-left:32px;padding-right:32px}
@media(max-width:640px){
  .wrap{padding-left:22px;padding-right:22px}
  .wrap.hero-content{padding-left:22px;padding-right:22px}
}

/* Correzioni pre-consegna: contrasto, menu mobile e spazi cliccabili. */
.fbot,.pala-foot .fbot{color:#b4bcd6}
.pala-nl-slot{margin-bottom:48px}
#hdr .lang button{opacity:1;color:#d4dae9}
#hdr .lang button.active{color:var(--cyan)}
#hdr .drop a{opacity:1}
.tile .cap{color:#f1f3fa}
.tile .go{opacity:1;transform:none}
.tile-link{position:absolute;inset:0;z-index:3;border-radius:inherit}
.tile:focus-within{outline:2px solid var(--cyan);outline-offset:4px}
@media(max-width:980px){
 #hdr .lang{display:flex}
 #hdr .bar{padding-left:18px;padding-right:18px}
 #hdr .nav-right{gap:12px}
 #hdr .menu-toggle{min-width:40px;min-height:44px}
 #hdr .lang button{min-width:32px;min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .rv,.hero .eyebrow,.hero h1 span,.hero .sub,.hero-cta{opacity:1;transform:none;animation:none}
 .hero-img img,.prism{animation:none}
}