/* ============================================================
   «ROTATIVA» — consent.css: il banner dei cookie e i moduli del
   consenso (blocco 5, 7/9/2026). Caricato su ogni pagina DOPO
   motion.css: non contiene regole della regia (.reveal/.fx), solo
   il banner (scheda fissa in basso a destra sul computer, a tutta
   larghezza sopra la barretta sul telefono), i due bottoni uguali,
   lo stato della scelta nella cookie policy. La riga sotto la mappa
   di Contatti sta in contact.css. Entra con la stessa animazione
   rise dell'apertura (motion.css) ed esce al contrario col JS
   (regola 8, decisione di Giorgio del 7/9); tutto fermo sotto
   prefers-reduced-motion. Nessuna custom property nuova: i colori
   vengono da base.css.
   ============================================================ */

/* ============ IL BANNER: scheda in basso a destra ============ */
.consent-banner{
  position:fixed;right:1.1rem;bottom:1.1rem;z-index:58;   /* fra il «torna su» (55) e la barretta (60) */
  width:min(560px,calc(100vw - 2.2rem));
  max-height:min(55vh,30rem);overflow:auto;
  background:var(--paper);color:var(--ink);
  border:1px solid var(--border);border-top:4px solid var(--red);
  box-shadow:var(--shadow-lift);
  padding:1.25rem 1.4rem 1.4rem;
}
/* una sola frase (giro a vista del 7/9: niente titolo), poi i bottoni */
.consent-text{margin:0 0 1rem;max-width:none;font-size:1.125rem;line-height:1.5}
/* il «torna su» resta nascosto finché il banner c'è: sono fratelli nel body, e quando il banner sparisce
   (scelta fatta, col JS o alla pagina successiva) il tondo torna da solo */
.consent-banner ~ .to-top{display:none}

/* ============ I MODULI DEL CONSENSO: due bottoni uguali ============ */
.consent-form{display:flex;flex-wrap:wrap;gap:.75rem;margin:0}
/* lo UA darebbe al <button> il suo fondo grigio: .button-outline non lo azzera */
.consent-form .button{flex:1 1 0;text-align:center;background:transparent;cursor:pointer;padding-inline:1rem}
.consent-form .button:hover{background:var(--red);color:var(--paper)}
/* durante l'invio via JS i bottoni restano attivi (il fuoco non si perde) ma si sbiadiscono */
.consent-form.is-busy .button{opacity:.6;cursor:default}

/* ============ LA COOKIE POLICY: stato della scelta e bottoni ============ */
/* la sezione dei cookie è l'unico atto con più paragrafi: un respiro fra l'uno e l'altro */
.legal-note p + p{margin-top:.8rem}
.consent-choice{margin-top:1rem}
.consent-choice .consent-form{max-width:24rem;margin-top:.75rem}
.consent-status{font-weight:600}
.legal-version{font-size:.9375rem;color:var(--gray-2)}

/* ============ MOVIMENTO: entra come l'apertura, esce al contrario ============ */
@keyframes consent-out{
  from{opacity:1;transform:none}
  to{opacity:0;transform:translateY(18px)}
}
@media (prefers-reduced-motion:no-preference){
  .consent-banner{animation:rise .7s var(--ease-soft) both}
  .consent-banner.is-leaving{animation:consent-out .3s var(--ease-soft) both}
}

/* ===== RESPONSIVE — banner ===== */
@media (max-width:760px){
  /* a tutta larghezza, sopra la barretta del Numero Verde (54 px + safe-area, come il «torna su») */
  .consent-banner{
    right:0;left:0;bottom:calc(54px + env(safe-area-inset-bottom,0px));
    width:auto;border-left:0;border-right:0;
    padding:1rem 1rem 1.1rem;
  }
}
@media (max-width:480px){
  /* i due bottoni restano affiancati anche a 360 px */
  .consent-form .button{padding:.75rem .5rem;font-size:.9375rem}
}

/* ===== STAMPA: il banner fisso non va sulla carta ===== */
@media print{
  .consent-banner{display:none !important}
}