/* ============================================================
   TORNA SU

   Foglio a sé perché il pulsante deve comparire su tutto il sito, e il sito
   non ha un CSS solo: la home carica home2.css piu' home_ottone.css, tutte le
   altre pagine caricano style.css. Mettere queste regole in uno dei due
   avrebbe lasciato meta' del sito senza pulsante; metterle in entrambi
   avrebbe creato due copie destinate ad allontanarsi. Un file piccolo caricato
   da tutte e due le teste e' la terza strada.

   Per lo stesso motivo i colori sono scritti con var(...) e un valore di
   ripiego: i token della home (--signal, ottone) e quelli del percorso
   (--gold) hanno nomi diversi, e questo file non puo' presupporre né gli uni
   né gli altri.
   ============================================================ */
/* ANGOLO SINISTRO, e non destro come sarebbe la convenzione. In basso a destra
   c'e' gia' il lucchetto di Iubenda, che e' un widget di terzi: ci si sovrappone
   e vince lui, perche' la sua posizione non la decidiamo noi. Alzare lo z-index
   avrebbe coperto il lucchetto invece di essere coperti, che e' peggio: quel
   pulsante e' la porta delle preferenze privacy. Spostarsi e' l'unica soluzione
   che non toglie niente a nessuno dei due. */
.torna-su {
  position: fixed;
  left: clamp(14px, 2.5vw, 28px);
  bottom: clamp(14px, 2.5vw, 28px);
  z-index: 60;

  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;

  border: 1px solid var(--gold, var(--signal, #E3B457));
  border-radius: 999px;
  background: var(--gold, var(--signal, #E3B457));
  color: #14100A;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .18);

  /* Nascosto finché non si è scorso: non è display:none perché così la
     comparsa può essere una transizione invece di uno scatto, e perché un
     elemento tolto dal flusso e rimesso fa saltare il focus della tastiera. */
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s;
}
.torna-su.vista {
  opacity: 1;
  visibility: visible;
  transform: none;
}
.torna-su:hover { filter: brightness(1.06); }
.torna-su:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* In stampa non esiste un "su". */
@media print { .torna-su { display: none; } }

/* Chi ha chiesto meno movimento vede il pulsante comparire senza scorrimento
   animato: la risalita istantanea la gestisce lo script. */
@media (prefers-reduced-motion: reduce) {
  .torna-su { transition: none; transform: none; }
}
