/* ---------------------------------------------------------------
   notte.css — la notte condivisa da tutte le pagine.
   --------------------------------------------------------------- */

body.notte{
  background:#070a14;
  color:#ece4d2;
}
body.notte::before{ display:none; }   /* via la grana color crema */

.notte-sfondo{
  position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none;
  background:#070a14;
}
.notte-cielo{ position:absolute; inset:0; width:100%; height:100%; }

/* il lampione: bagliore caldo dal basso, fuori quadro */
.notte-lampione{
  position:absolute; left:50%; bottom:-16vh; width:130vw; height:60vh;
  transform:translateX(-50%);
  background:
    radial-gradient(48% 68% at 50% 100%, rgba(255,160,60,.34), rgba(255,140,50,.13) 45%, transparent 72%),
    radial-gradient(20% 30% at 50% 100%, rgba(255,210,140,.35), transparent 70%);
  filter:blur(6px);
}

/* dischi fuori fuoco */
.notte-bokeh{
  position:absolute; border-radius:50%;
  background:radial-gradient(circle at 42% 38%, rgba(255,196,110,.5), rgba(255,160,60,.22) 60%, rgba(255,160,60,0) 72%);
  filter:blur(10px);
  animation:bokeh-respiro 7s ease-in-out infinite alternate;
}
.notte-bokeh.b1{ right:4vw;  bottom:6vh;  width:16vmin; height:16vmin; animation-delay:-2s; }
.notte-bokeh.b2{ right:16vw; bottom:-3vh; width:24vmin; height:24vmin; opacity:.75; animation-delay:-4s; }
.notte-bokeh.b3{ left:6vw;   bottom:2vh;  width:10vmin; height:10vmin; opacity:.6;  animation-delay:-1s; }
.notte-bokeh.b4{ right:30vw; bottom:8vh;  width:6vmin;  height:6vmin;  opacity:.5;  animation-delay:-5s; }
@keyframes bokeh-respiro{ from{ transform:scale(1); } to{ transform:scale(1.12) translateY(-6px); } }

.notte-ramo{
  position:absolute; left:-20px; top:-14px; width:min(34vw, 300px); opacity:.55;
  filter:blur(1.2px);
}
.notte-ramo svg{ width:100%; height:auto; display:block; }

body.notte > *:not(.notte-sfondo){ position:relative; z-index:1; }

/* ---------- pannelli di carta sulla notte ----------------------------- */

body.notte .pannello{
  background:var(--carta);
  color:var(--inchiostro);
  border-radius:var(--raggio);
  box-shadow:0 1px 0 rgba(255,255,255,.06), 0 30px 70px -30px rgba(0,0,0,.85);
  position:relative;
}
body.notte .pannello::before{
  content:''; position:absolute; inset:0; border-radius:var(--raggio); pointer-events:none;
  background:linear-gradient(to top, rgba(255,150,50,.10), transparent 55%);
}

body.notte .occhiello{ color:#a99f89; }
body.notte a{ color:inherit; }
body.notte .btn-vuoto{ color:#ece4d2; border-color:rgba(236,228,210,.5); }
body.notte .btn-vuoto:hover{ background:rgba(236,228,210,.1); }
body.notte .btn{ box-shadow:0 2px 0 rgba(0,0,0,.4); }
