/* LA PILLOLA (Francesco, 03/11/2026): in basso a destra, su tutte le pagine che hanno il gemello nell'altra lingua (src/inglese.py).
   In cima la lingua sta nella testata; passata quasi una schermata sale la pillola con la lingua (EN / IT) e subito dopo si
   completa con la ↑ che riporta in cima. In cima alla home ⛔ c'è posto: l'angolo è dello «Disponibile per progetti».
   Sul telefono la lingua sta nel menu (sua, 03/11/2026: «su mobile lo switch di lingua va nel menu hamburger»): resta solo la ↑.
   Sul nero del brand come il riquadro dei cookie; si fa da parte col riquadro aperto, col menu aperto e quando arriva il piede,
   che ha già il suo «Torna su ↑». Il gesto in src/pillola.js */
.pillola{position:fixed;right:var(--gronda,32px);bottom:calc(var(--gronda,32px) + env(safe-area-inset-bottom));z-index:85;display:flex;align-items:stretch;
  height:44px;background:var(--nero);color:var(--crema);border-radius:2px;box-shadow:0 12px 32px rgba(53,30,28,.24);
  font:500 12px/1 var(--mono);letter-spacing:.04em;text-transform:uppercase;
  opacity:0;visibility:hidden;transform:translateY(14px);
  transition:opacity .4s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1),visibility 0s .5s}
.pillola--su{opacity:1;visibility:visible;transform:none;
  transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1),visibility 0s}
.pillola a,.pillola button{display:flex;align-items:center;justify-content:center;color:inherit;text-decoration:none;font:inherit;letter-spacing:inherit;
  background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .4s cubic-bezier(.16,1,.3,1)}
.pillola .pillola__lingua{padding:0 16px}
/* la ↑ si apre un attimo dopo che la pillola è salita: si completa, ⛔ arriva tutta insieme */
.pillola .pillola__su{width:0;overflow:hidden;opacity:0;font-size:15px;padding-bottom:3px;
  transition:width .3s cubic-bezier(.16,1,.3,1),opacity .2s cubic-bezier(.16,1,.3,1),color .4s cubic-bezier(.16,1,.3,1)}
.pillola--su .pillola__su{width:44px;opacity:1;box-shadow:inset 1px 0 rgba(245,244,237,.22);
  transition:width .6s cubic-bezier(.16,1,.3,1) .22s,opacity .4s cubic-bezier(.16,1,.3,1) .3s,color .4s cubic-bezier(.16,1,.3,1)}
.pillola a:focus-visible,.pillola button:focus-visible{outline:1px solid var(--arancio);outline-offset:-4px}
@media (hover:hover){.pillola a:hover,.pillola button:hover{color:var(--arancio)}}
/* sul telefono: solo la freccia, già aperta */
@media (max-width:860px){
  .pillola .pillola__lingua{display:none}
  .pillola--su .pillola__su{box-shadow:none;transition-delay:0s}
}
/* via col riquadro dei cookie aperto (prende la stessa fascia), col menu aperto e col piede in vista */
html:has(.consenso--su) .pillola,html.menu-aperto .pillola,.pillola.pillola--piede{opacity:0;visibility:hidden;transform:translateY(14px);
  transition:opacity .4s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1),visibility 0s .5s}
@media print{.pillola{display:none}}
@media (prefers-reduced-motion:reduce){.pillola,.pillola .pillola__su{transition-duration:.01s!important;transition-delay:0s!important}}