/* ==========================================================================
   LA SCENA DI MARE — il fondo della porta d'ingresso e delle pagine
   pubbliche che ci somigliano (/entra, /nuova-password, /cerca, /qui).
   Nasce per tenere insieme DUE porte, quella del cliente e quella del
   personale, che avevano due azzurri diversi e due decorazioni diverse:
   ora la porta e' una sola e la scena e' la sua.
   ========================================================================== */

/* Il fondo sta sul BODY, non su un contenitore: cosi' si propaga alla tela
   della pagina e dipinge anche lo spazio riservato alla barra di
   scorrimento (base.css). Messo su un div, quello spazio restava una
   striscia chiara sul bordo destro — si vedeva, ed era brutta.
   La sabbia e' l'ultimo tratto dello stesso gradiente, con uno stacco netto:
   un div separato non sarebbe arrivato sotto la striscia riservata.
   LA SCENA STA IN FONDO ALLA PAGINA, non in fondo allo schermo: il
   gradiente si misura sul documento (niente "fixed") e la scena sul corpo.
   Fissa, sul telefono la sabbia e gli ombrelloni restavano a 844px mentre
   /entra ne e' lunga 1153, e i punti bianchi dell'invito ci scorrevano
   sopra, illeggibili. /qui l'aveva gia' imparato per conto suo (qui.css);
   ora vale per tutte le pagine della scena. */
body.scena-corpo {
    position: relative;
    min-height: 100vh;
    background:
        linear-gradient(180deg,
            #0e3247 0%, #16506f 34%, #2b7fa8 64%, #62b3df calc(100% - 96px),
            #f7ecd6 calc(100% - 96px), #efe0c2 100%);
}

.scena { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
/* Due file di ombrelloni VISTI DALL'ALTO su una sabbia vista dall'alto: e'
   l'unico modo in cui questi sprite funzionano fuori dalla mappa. La fila
   lontana e' piu' piccola e sbiadita, quella davanti intera.
   Le immagini le mette scena.js, che calcola il passo dalla larghezza: con
   background-repeat si toccavano e si tagliavano, e una fila di ombrelloni
   senza spazio in mezzo non e' una spiaggia, e' una carta da parati. */
.scena-fila { position: absolute; left: 0; right: 0; }
.scena-fila img { position: absolute; bottom: 0; transform: translateX(-50%); width: auto; }
.scena-fila.lontana { bottom: 58px; height: 46px; opacity: .42; }
.scena-fila.vicina  { bottom: 4px;  height: 68px; opacity: .88; }