/* ============================================================
   LUCE — foglio unico
   squadrato, hairline da 1px, tre accenti (quanto · simbolo ·
   meccanismo), fondo quasi nero con una punta di viola.
   ============================================================ */

@font-face{font-family:"Cormorant";src:url("/static/fonts/cormorant.woff2") format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant";src:url("/static/fonts/cormorant-corsivo.woff2") format("woff2");font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:"Grotesk";src:url("/static/fonts/grotesk.woff2") format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"PlexMono";src:url("/static/fonts/plexmono.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Cinzel";src:url("/static/fonts/cinzel.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}

:root{
  --fondo:#06060a;
  --fondo-2:#0b0b12;
  --fondo-3:#101018;
  --ink:#ece9f4;
  --tenue:#a49db6;
  --tenue-2:#6d6780;
  --quanto:#78dcff;
  --simbolo:#ff7a45;
  --meccanismo:#d9d2bf;
  --regola:rgba(236,233,244,.13);
  --regola-forte:rgba(236,233,244,.24);
  --serif:"Cormorant",Georgia,"Times New Roman",serif;
  --sans:"Grotesk","Helvetica Neue",Arial,sans-serif;
  --mono:"PlexMono",ui-monospace,"SFMono-Regular",monospace;
  --iscrizione:"Cinzel",Georgia,serif;
  --lettura:40rem;
  --largo:84rem;
  --testata:66px;
}

*,*::before,*::after{box-sizing:border-box}
html{font-size:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--testata) + 20px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--ink);
  font-family:var(--sans);font-weight:370;font-size:1.1875rem;line-height:1.68;
  letter-spacing:.004em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
[hidden]{display:none !important}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;border-bottom:1px solid var(--regola)}
a:hover{border-bottom-color:var(--regola-forte)}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
::selection{background:rgba(120,220,255,.28);color:#fff}
:focus-visible{outline:2px solid var(--quanto);outline-offset:3px}

.salta{position:absolute;left:-9999px;top:0;z-index:99;background:var(--ink);color:var(--fondo);padding:.7rem 1rem}
.salta:focus{left:1rem;top:1rem}

/* ---------------------------------------------------------- testata */
.testata{position:sticky;top:0;z-index:40;background:rgba(6,6,10,.78);
  backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid var(--regola)}
.testata-interno{max-width:var(--largo);margin:0 auto;padding:0 clamp(1rem,3vw,2.2rem);
  height:var(--testata);display:flex;align-items:center;gap:2rem}
.marchio{display:flex;align-items:center;gap:.6rem;border:0;color:var(--ink);min-width:0;flex-shrink:1}
.sole{flex-shrink:0;color:var(--simbolo);opacity:.95;transition:transform .6s ease,color .3s}
.marchio:hover .sole{transform:rotate(45deg);color:#ffd9a0}
.marchio-nome{font-family:var(--iscrizione);font-weight:600;font-size:.95rem;
  letter-spacing:.34em;text-transform:uppercase;white-space:nowrap}
.menu{margin-left:auto;display:flex;align-items:center;gap:clamp(.7rem,1.6vw,1.6rem)}
.menu a{display:flex;align-items:baseline;gap:.42rem;border:0;padding:.35rem 0;
  font-size:.82rem;letter-spacing:.03em;color:var(--tenue);white-space:nowrap;position:relative}
.menu a .num{font-family:var(--mono);font-size:.62rem;color:var(--tenue-2);letter-spacing:.06em}
.menu a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.menu a:hover{color:var(--ink)}
.menu a:hover::after,.menu a[aria-current]::after{transform:scaleX(1)}
.menu a[aria-current]{color:var(--ink)}
.menu a[aria-current] .num{color:var(--quanto)}
.menu-pulsante{display:none;margin-left:auto;width:42px;height:42px;
  border:1px solid var(--regola);flex-direction:column;align-items:center;justify-content:center;gap:5px}
.menu-pulsante span{display:block;width:17px;height:1px;background:var(--ink);transition:transform .3s,opacity .3s}
.menu-pulsante[aria-expanded="true"] span:first-child{transform:translateY(3px) rotate(45deg)}
.menu-pulsante[aria-expanded="true"] span:last-child{transform:translateY(-3px) rotate(-45deg)}

/* ---------------------------------------------------------- occhielli */
.occhiello{margin:0;font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--tenue-2)}
.num{font-family:var(--mono);font-feature-settings:"tnum"}

/* ---------------------------------------------------------- eroe */
.eroe{position:relative;min-height:min(94vh,900px);display:flex;align-items:center;
  overflow:hidden;border-bottom:1px solid var(--regola);isolation:isolate}
#scena{position:absolute;inset:0;width:100%;height:100%;z-index:-2;display:block}
.eroe-velo{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(60% 55% at 22% 48%,rgba(6,6,10,.86) 0%,rgba(6,6,10,.35) 55%,rgba(6,6,10,0) 100%),
    linear-gradient(180deg,rgba(6,6,10,.55) 0%,rgba(6,6,10,0) 30%,rgba(6,6,10,.75) 100%)}
.eroe-interno{max-width:var(--largo);margin:0 auto;padding:0 clamp(1rem,3vw,2.2rem);width:100%}
.eroe h1{margin:1.1rem 0 0;font-family:var(--serif);font-weight:300;
  font-size:clamp(2.9rem,7.6vw,6.4rem);line-height:.97;letter-spacing:-.018em;max-width:20ch}
.eroe h1 em{font-style:italic;font-weight:300;
  background:linear-gradient(96deg,#ffd3a8 0%,#fff3e0 32%,#cfe6ff 62%,#8fc6ff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.eroe-sommario{margin:1.9rem 0 0;max-width:34rem;font-size:1.06rem;line-height:1.62;color:var(--tenue)}
.eroe-firma{margin:2.6rem 0 0;display:flex;align-items:center;gap:1rem}
.scendi{display:inline-flex;align-items:center;gap:.7rem;border:0;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--tenue)}
.scendi::after{content:"";width:44px;height:1px;background:linear-gradient(90deg,var(--tenue-2),transparent);transition:width .35s}
.scendi:hover{color:var(--ink)}
.scendi:hover::after{width:70px}

/* ---------------------------------------------------------- registri */
.registri{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--regola);
  border-bottom:1px solid var(--regola)}
.registro{position:relative;display:flex;flex-direction:column;gap:.85rem;border:0;
  background:var(--fondo-2);padding:clamp(1.7rem,3.4vw,3rem) clamp(1.2rem,2.4vw,2.2rem) clamp(1.5rem,2.6vw,2.2rem);
  transition:background .35s ease}
.registro:hover{background:var(--fondo-3)}
.registro::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--acc,var(--tenue-2));opacity:.85}
.registro-quanto{--acc:var(--quanto)}
.registro-simbolo{--acc:var(--simbolo)}
.registro-meccanismo{--acc:var(--meccanismo)}
.registro-num{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;color:var(--acc)}
.registro h2{margin:0;font-family:var(--serif);font-weight:300;font-size:clamp(1.85rem,3.2vw,2.6rem);
  line-height:1.05;letter-spacing:-.01em}
.registro p{margin:0;font-size:.99rem;line-height:1.62;color:var(--tenue)}
.registro-vai{margin-top:auto;padding-top:1rem;display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--mono);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--acc)}
.freccia{display:inline-block;width:7px;height:7px;border-top:1px solid currentColor;
  border-right:1px solid currentColor;transform:rotate(45deg);transition:transform .3s}
.registro:hover .freccia,.rimando:hover .freccia{transform:rotate(45deg) translate(2px,-2px)}

/* ---------------------------------------------------------- striscia */
.striscia{max-width:var(--largo);margin:0 auto;padding:clamp(3.4rem,7vw,6rem) clamp(1rem,3vw,2.2rem)}
.striscia-testa{display:flex;align-items:baseline;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;margin-bottom:1.6rem;border-bottom:1px solid var(--regola);padding-bottom:1rem}
.striscia-testa h2{margin:0;font-family:var(--serif);font-weight:300;font-size:clamp(1.7rem,3vw,2.3rem)}
.rimando{display:inline-flex;align-items:center;gap:.55rem;border:0;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--tenue)}
.rimando:hover{color:var(--ink)}
.striscia{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(.6rem,1.6vw,1.1rem);align-items:start}
.striscia-testa{grid-column:1 / -1}
.striscia-voce{width:auto;margin:0;float:none}
.striscia-img{display:block;position:relative;overflow:hidden;background:var(--fondo-2);
  border:1px solid var(--regola);aspect-ratio:4/3}
.striscia-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease,opacity .4s}
.striscia-voce:hover .striscia-img img{transform:scale(1.05);opacity:.92}
.striscia-titolo{display:flex;gap:.5rem;align-items:baseline;margin-top:.7rem;
  font-size:.86rem;color:var(--tenue)}
.striscia-voce:hover .striscia-titolo{color:var(--ink)}
.striscia-titolo .num{font-size:.66rem;color:var(--tenue-2)}

/* ---------------------------------------------------------- prosa */
.apertura,main>p,main>h2,main>h3,main>ul,main>ol,main>blockquote,main>dl.dati,main>.triade,main>.firma{
  width:min(100% - 2.6rem,var(--lettura));margin-inline:auto}
main>p{margin:1.15rem auto 0}
main>h2{margin:clamp(2.6rem,5vw,4rem) auto 0;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.75rem,3vw,2.5rem);line-height:1.12;letter-spacing:-.008em}
main>h3{margin:2.2rem auto 0;font-weight:600;font-size:1.02rem;letter-spacing:.01em}
main>p:first-of-type{margin-top:1.9rem}
main a[href^="/"]:not(.bottone){color:var(--quanto);border-bottom-color:rgba(120,220,255,.35)}
main a[href^="/"]:not(.bottone):hover{border-bottom-color:var(--quanto)}
code{font-family:var(--mono);font-size:.84em;color:#cfe8f7;
  background:rgba(120,220,255,.06);padding:.06em .3em}
strong{font-weight:600;color:#fff}
em{font-style:italic}

.apertura{padding:clamp(3.2rem,7vw,5.6rem) 0 clamp(1.6rem,3vw,2.4rem);
  border-bottom:1px solid var(--regola);margin-bottom:.4rem}
.apertura h1{margin:.9rem 0 0;font-family:var(--serif);font-weight:300;
  font-size:clamp(2.5rem,5.6vw,4.4rem);line-height:1;letter-spacing:-.015em}
.apertura-sommario{margin:1.4rem 0 0;font-family:var(--serif);font-style:italic;
  font-size:clamp(1.25rem,2vw,1.5rem);line-height:1.42;color:var(--tenue)}
.apertura-nota{margin:1.6rem 0 0;font-family:var(--mono);font-size:.68rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--tenue-2)}
.apertura-nota .num{color:var(--tenue)}

blockquote{margin:2.2rem auto;padding:1.4rem 0 1.4rem 1.5rem;border-left:2px solid var(--simbolo)}
.formula-centro{position:relative;width:min(100% - 2.6rem,var(--lettura));margin:1.9rem auto;
  padding:.15rem 0 .15rem 1.1rem;
  font-family:var(--mono);font-size:1rem;line-height:1.7;color:var(--ink);letter-spacing:.01em}
.formula-centro::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--simbolo),rgba(236,233,244,.4) 55%,var(--quanto))}
blockquote p{margin:0;font-family:var(--serif);font-style:italic;
  font-size:clamp(1.3rem,2.3vw,1.62rem);line-height:1.44;color:#f4efe6}
blockquote cite{display:block;margin-top:.9rem;font-family:var(--mono);font-style:normal;
  font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tenue-2)}

ul,ol{margin:1.15rem auto 0;padding-left:1.2rem}
li{margin:.35rem 0}
li::marker{color:var(--tenue-2)}
main>ul li{padding-left:.2rem}

/* ---------------------------------------------------------- dati */
.dati{margin:1.9rem auto;border-top:1px solid var(--regola)}
.dati dt,.dati dd{margin:0;padding:.62rem 0;border-bottom:1px solid var(--regola);
  display:flex;align-items:baseline}
.dati{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:1.2rem}
.dati dt{font-size:.88rem;color:var(--tenue);letter-spacing:.01em}
.dati dd{font-family:var(--mono);font-size:.82rem;color:var(--ink);text-align:right;
  justify-content:flex-end;white-space:normal;overflow-wrap:anywhere}
.dati dt,.dati dd{grid-row:auto}

/* ---------------------------------------------------------- figure */
.figura{margin:clamp(2.4rem,5vw,3.6rem) auto;width:min(100% - 1.4rem,var(--largo))}
.figura-lastra{border:1px solid var(--regola);background:var(--fondo-2);overflow:hidden}
.figura-lastra img{width:100%}
.figura figcaption{display:flex;flex-direction:column;gap:.5rem;margin-top:.9rem;
  max-width:var(--lettura);font-size:.92rem;line-height:1.55;color:var(--tenue)}
.figura figcaption .occhiello{color:var(--tenue-2)}

/* ---------------------------------------------------------- triade */
.triade{width:min(100% - 2.6rem,56rem);margin:clamp(1.8rem,4vw,2.8rem) auto;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--regola);border:1px solid var(--regola)}
.voce{background:var(--fondo-2);padding:1.15rem 1.15rem 1.3rem;border-top:2px solid var(--acc)}
.voce-quanto{--acc:var(--quanto)}
.voce-simbolo{--acc:var(--simbolo)}
.voce-meccanismo{--acc:var(--meccanismo)}
.voce .et{display:block;font-family:var(--mono);font-size:.63rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--acc)}
.voce p{margin:.55rem 0 0;font-size:.92rem;line-height:1.55;color:var(--tenue)}

.firma{margin:clamp(3rem,6vw,4.5rem) auto;text-align:center;color:var(--tenue-2);
  font-family:var(--serif);font-size:1.4rem}

/* ---------------------------------------------------------- galleria */
.galleria{border-top:1px solid var(--regola);margin-top:clamp(2.4rem,5vw,3.6rem)}
.tavola{max-width:var(--largo);margin:0 auto;padding:clamp(2.8rem,6vw,4.6rem) clamp(1rem,3vw,2.2rem);
  border-bottom:1px solid var(--regola)}
.tavola-testa{display:flex;flex-direction:column;gap:.55rem;margin-bottom:1.4rem}
.tavola-testa h2{margin:0;font-family:var(--serif);font-weight:300;
  font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.05;letter-spacing:-.01em}
.tavola-lastra{margin:0;border:1px solid var(--regola);background:var(--fondo-2)}
.tavola-lastra img{width:100%}
.tavola-corpo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(1.4rem,3vw,3rem);margin-top:1.5rem;align-items:start}
.formula{margin:0;font-family:var(--mono);font-size:.92rem;line-height:1.7;color:var(--quanto);
  border-left:2px solid rgba(120,220,255,.35);padding-left:1rem}
.tavola-corpo .dati{margin:0;grid-template-columns:1fr}
.tavola-corpo .dati dt{padding-bottom:.15rem;border-bottom:0}
.tavola-corpo .dati dd{padding-top:0;text-align:left;justify-content:flex-start;
  font-size:.8rem;line-height:1.5;padding-bottom:.7rem}
.tavola .triade{margin-top:1.6rem}

/* ---------------------------------------------------------- laboratorio */
.lab{width:min(100% - 1.8rem,var(--largo));margin:clamp(2.2rem,4vw,3.2rem) auto 0;
  border:1px solid var(--regola);background:var(--fondo-2)}
.lab-barra{display:flex;border-bottom:1px solid var(--regola)}
.lab-scheda{padding:.95rem 1.4rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tenue-2);border-right:1px solid var(--regola);
  border-bottom:2px solid transparent;transition:color .25s,background .25s}
.lab-scheda:hover{color:var(--ink);background:var(--fondo-3)}
.lab-scheda.attiva{color:var(--ink);border-bottom-color:var(--quanto);background:var(--fondo-3)}
.lab-pannello{padding:0 0 1.2rem}
.lab-scena{display:block;width:100%;height:auto;background:#04040a;border-bottom:1px solid var(--regola)}
.lab-comandi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem 2rem;padding:1.4rem clamp(1rem,2.4vw,1.8rem)}
.cursore{display:grid;grid-template-columns:1fr auto;gap:.4rem .8rem;align-items:center}
.cursore-nome{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tenue-2)}
.cursore-valore{font-family:var(--mono);font-size:.82rem;color:var(--quanto);text-align:right}
.cursore input[type=range]{grid-column:1 / -1;width:100%;-webkit-appearance:none;appearance:none;
  height:22px;background:transparent;cursor:ew-resize}
.cursore input[type=range]::-webkit-slider-runnable-track{height:1px;background:var(--regola-forte)}
.cursore input[type=range]::-moz-range-track{height:1px;background:var(--regola-forte)}
.cursore input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
  width:11px;height:22px;margin-top:-11px;background:var(--ink);border-radius:0}
.cursore input[type=range]::-moz-range-thumb{width:11px;height:22px;border:0;border-radius:0;background:var(--ink)}
.cursore input[type=range]:focus-visible::-webkit-slider-thumb{background:var(--quanto)}
.lab-campione{display:flex;align-items:center;gap:.9rem;justify-content:flex-start}
.campione{display:block;width:66px;height:34px;border:1px solid var(--regola-forte);background:#fff}
.lab-misure{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--regola);
  margin:0;border-top:1px solid var(--regola)}
.lab-misure>div{background:var(--fondo-2);padding:1rem clamp(1rem,2.4vw,1.8rem)}
.lab-misure dt{margin:0;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tenue-2)}
.lab-misure dd{margin:.4rem 0 0;font-family:var(--mono);font-size:1rem;color:var(--ink)}
.lab-nota{margin:0;padding:.9rem clamp(1rem,2.4vw,1.8rem);border-top:1px solid var(--regola);
  font-family:var(--mono);font-size:.65rem;letter-spacing:.1em;color:var(--tenue-2)}

.bottone{display:inline-block;padding:.75rem 1.3rem;border:1px solid var(--regola-forte)!important;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
.bottone:hover{background:var(--fondo-3);border-color:var(--ink)!important}

/* ---------------------------------------------------------- errore */
.errore{max-width:var(--lettura);margin:0 auto;padding:clamp(4rem,12vw,9rem) 1.3rem}
.errore h1{margin:.8rem 0 0;font-family:var(--serif);font-weight:300;
  font-size:clamp(2.4rem,5vw,4rem);line-height:1}
.errore .apertura-sommario{margin-bottom:2rem}

/* ---------------------------------------------------------- piede */
.piede{border-top:1px solid var(--regola);margin-top:clamp(3rem,7vw,6rem);background:var(--fondo-2)}
.piede-interno{max-width:var(--largo);margin:0 auto;padding:clamp(2.4rem,5vw,3.6rem) clamp(1rem,3vw,2.2rem);
  display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:start}
.piede-marchio{margin:0;font-family:var(--iscrizione);font-weight:600;font-size:.9rem;
  letter-spacing:.34em;text-transform:uppercase}
.piede-nota{margin:.8rem 0 0;font-size:.84rem;line-height:1.55;color:var(--tenue-2);max-width:26rem}
.piede-nav{display:flex;flex-direction:column;gap:.5rem;font-size:.85rem}
.piede-nav a{border:0;color:var(--tenue)}
.piede-nav a:hover{color:var(--ink)}
.piede-destra{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem}
.misura{display:flex;align-items:center;gap:.3rem}
.misura-etichetta{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tenue-2);margin-right:.5rem}
.misura button{width:34px;height:28px;border:1px solid var(--regola);font-family:var(--mono);
  font-size:.7rem;color:var(--tenue);transition:color .2s,border-color .2s,background .2s}
.misura button:hover{color:var(--ink);border-color:var(--regola-forte)}
.misura button[aria-pressed="true"]{color:var(--fondo);background:var(--ink);border-color:var(--ink)}
.copyright{margin:0;font-family:var(--mono);font-size:.63rem;letter-spacing:.08em;color:var(--tenue-2)}
.copyright a{color:var(--tenue);border-bottom-color:var(--regola)}
.copyright a:hover{color:var(--ink)}

/* ---------------------------------------------------------- adattivo */
@media (max-width:1180px){
  .striscia{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:980px){
  :root{--testata:60px}
  .registri{grid-template-columns:1fr}
  .triade{grid-template-columns:1fr}
  .tavola-corpo{grid-template-columns:1fr}
  .piede-interno{grid-template-columns:1fr 1fr}
  .piede-destra{grid-column:1 / -1}
}
@media (max-width:880px){
  .menu-pulsante{display:flex}
  .menu{position:static;order:3;flex-basis:100%;flex-direction:column;align-items:stretch;
    gap:0;margin:0;padding:0;max-height:0;overflow:hidden}
  .menu a{padding:.75rem .2rem;border-top:1px solid var(--regola);font-size:.95rem;gap:.7rem}
  .menu a::after{display:none}
  .menu a[aria-current]{color:var(--quanto)}
  .testata-interno{flex-wrap:wrap;height:var(--testata);align-items:center}
  .testata.aperta .testata-interno{height:auto}
  .testata.aperta .menu{max-height:60vh;padding-bottom:.6rem}
  .testata.aperta{align-items:stretch}
  html.no-js .menu{max-height:none;width:100%}
}
@media (max-width:700px){
  body{font-size:1.0625rem}
  .eroe{min-height:auto;padding:4.4rem 0 3.6rem}
  .eroe-sommario{font-size:.98rem}
  .striscia{grid-template-columns:repeat(2,1fr)}
  .lab-scena{height:200px}
  .lab-comandi{grid-template-columns:1fr}
  .lab-misure{grid-template-columns:1fr}
  .lab-misure>div{border-top:1px solid var(--regola)}
  .lab-pannello{padding-bottom:.6rem}
  .dati dd{white-space:normal;text-align:right}
  .piede-interno{grid-template-columns:1fr}
  .apertura-sommario{font-size:1.12rem}
}
@media (max-width:420px){
  .striscia{grid-template-columns:1fr}
  .dati{grid-template-columns:1fr}
  .dati dd{text-align:left;justify-content:flex-start;padding-top:0;border-bottom:1px solid var(--regola)}
  .marchio-nome{letter-spacing:.24em}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}