/* =====================================================================
   Qublo · scorrimento.css — piani notte con gli angoli tondi (v2)
   Il fondo scuro delle .sezione--notte passa su ::before e diventa un piano
   rientrato con gli angoli tondi: non c'è più una fascia dura a tutta
   larghezza tra la lavanda e l'indaco profondo. scorrimento.js lo allarga
   mentre lo guardi; senza JS o con «riduci movimento» resta così.
   ===================================================================== */
@property --ni { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --nrt { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --nrb { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --luce { syntax: "<number>"; inherits: false; initial-value: 1; }
html .sezione--notte::before { --ni: inherit; --nrt: inherit; --nrb: inherit; --luce: inherit; }
html .sezione--notte {
  --ni: clamp(0.375rem, 0.8vw, 0.875rem);
  --nrt: clamp(18px, 1.6vw, 24px);
  --nrb: clamp(18px, 1.6vw, 24px);
  position: relative; isolation: isolate;
  background: transparent;
}
html .sezione--notte::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--software, #23254D);
  opacity: var(--luce, 1);
  -webkit-clip-path: inset(0 var(--ni) round var(--nrt) var(--nrt) var(--nrb) var(--nrb));
  clip-path: inset(0 var(--ni) round var(--nrt) var(--nrt) var(--nrb) var(--nrb));
}
/* più sezioni notte di fila: un piano solo (senza JS con :has) */
html .sezione--notte + .sezione--notte { --nrt: 0px; border-top: 0; }
html .sezione--notte + .sezione--notte::before { top: -1px; }
html .sezione--notte:has(+ .sezione--notte) { --nrb: 0px; }
/* elementi sfocati dalla velocità: l'origine dello stiramento è il centro; mentre scorri
   scorrimento.js la sposta sul bordo da cui arriva il moto (Otturatore, MOTION.md § 15) */
[data-vel] { transform-origin: 50% 50%; }
/* Otturatore: con «più contrasto» e in stampa il piano scuro è subito pieno (niente velo 0,85) */
@media (prefers-contrast: more) { html .sezione--notte::before { opacity: 1; } }
@media print { html .sezione--notte::before { opacity: 1; } }
