/* Pagina ModulLamp: scura, la luce della lampada colora tutta la pagina */
@property --gr{syntax:"<number>";inherits:true;initial-value:255}
@property --gg{syntax:"<number>";inherits:true;initial-value:255}
@property --gb{syntax:"<number>";inherits:true;initial-value:255}
:root{--gr:255;--gg:214;--gb:150;--night:#07100d;transition:--gr 1s ease,--gg 1s ease,--gb 1s ease}
body.ml{background:var(--night);color:var(--crema)}
.ml-aura{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(60vmax 50vmax at 72% 30%,rgb(var(--gr) var(--gg) var(--gb)/.20),transparent 62%),radial-gradient(50vmax 40vmax at 10% 100%,rgb(var(--gr) var(--gg) var(--gb)/.10),transparent 60%)}
.ml main{position:relative;z-index:1}
.ml .site-header.scrolled{background:rgba(7,16,13,.78)}
.ml .nav__links{background:rgba(243,241,234,.96)}
.ml footer{position:relative;z-index:1;background:#0c1a15}
.ml-label{color:var(--lime)}
.ml-h2{font-size:clamp(2.3rem,6vw,5rem);line-height:1;margin:14px 0 22px}
.ml-h2 em{font-style:normal;color:rgb(var(--gr) var(--gg) var(--gb));text-shadow:0 0 .6em rgb(var(--gr) var(--gg) var(--gb)/.55)}
.ml-p{color:#cdd8d1;font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:44ch}
.ml-btn-ghost{color:var(--crema);border-color:rgba(243,241,234,.7)}
.ml-btn-ghost:hover{background:var(--crema);color:var(--ink)}
.ml-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}

/* 1. Apertura */
.ml-hero{position:relative;min-height:100svh;display:flex;align-items:center;padding-block:120px 70px;overflow:hidden}
.ml-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,5vw,80px);align-items:center;width:100%}
.ml-title{font-size:clamp(3.6rem,11.5vw,10.5rem);line-height:.95;margin:14px 0 22px;color:var(--crema);white-space:nowrap}
.ml-title span{display:inline-block;opacity:0;transform:translateY(.5em) scale(.9);filter:blur(10px);animation:ml-in 1.1s var(--ease) forwards;animation-delay:calc(.15s + var(--i)*70ms)}
.ml-title.lit span{animation:ml-in 1.1s var(--ease) forwards,ml-flick 5s ease-in-out infinite;animation-delay:calc(.15s + var(--i)*70ms),calc(1.6s + var(--i)*120ms)}
.ml-title.lit{text-shadow:0 0 .35em rgb(var(--gr) var(--gg) var(--gb)/.55),0 0 1.2em rgb(var(--gr) var(--gg) var(--gb)/.35)}
@keyframes ml-in{to{opacity:1;transform:none;filter:none}}
@keyframes ml-flick{0%,100%{opacity:1}48%{opacity:1}50%{opacity:.86}52%{opacity:1}}
.ml-lead{font-size:clamp(1.15rem,1.9vw,1.55rem);max-width:30ch;color:#e4ebe6;line-height:1.35}
.ml-lead strong{color:rgb(var(--gr) var(--gg) var(--gb));font-weight:700}
.ml-hand{margin-top:34px;color:var(--lime);transform:rotate(-3deg);display:inline-block}

.ml-stage{position:relative;aspect-ratio:300/470;width:min(100%,calc(62svh*.638),400px);justify-self:center;margin-bottom:130px}
.ml-stage__glow{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(closest-side,rgb(var(--gr) var(--gg) var(--gb)/.55),transparent 70%);filter:blur(30px);animation:ml-pulse 5s ease-in-out infinite;pointer-events:none}
@keyframes ml-pulse{0%,100%{transform:scale(.94);opacity:.8}50%{transform:scale(1.06);opacity:1}}
.ml-scroll{position:absolute;bottom:26px;left:var(--gutter);color:var(--lime)}
.ml-scroll::after{content:"";display:block;width:2px;height:40px;background:var(--lime);margin:8px 0 0 6px;transform-origin:top;animation:scroll 2s var(--ease) infinite}

.ml-marquee{overflow:hidden;border-block:1px solid rgba(255,255,255,.12);padding:18px 0;background:rgba(7,16,13,.6)}
.ml-marquee__track{display:flex;gap:34px;width:max-content;animation:ml-marq 34s linear infinite;font:400 clamp(1.4rem,3vw,2.4rem) var(--font-display);text-transform:uppercase;white-space:nowrap}
.ml-marquee i{font-style:normal;color:rgb(var(--gr) var(--gg) var(--gb))}
@keyframes ml-marq{to{transform:translateX(-50%)}}

/* 2. La luce (scorrimento) */
.ml-story{height:420vh;position:relative}
.ml-story__pin{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.ml-story__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,100px);align-items:center;width:100%}
.ml-story__frame{position:relative;aspect-ratio:300/470;width:min(100%,calc(70svh*.638),440px);justify-self:center}
.ml-captions{display:grid;margin-top:6px}
.ml-captions p{grid-area:1/1;font-size:clamp(1.2rem,2.2vw,1.8rem);color:#dbe5de;opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s var(--ease)}
.ml-captions p.on{opacity:1;transform:none}
.ml-captions b{display:block;font:400 clamp(2.4rem,6vw,4.6rem)/1 var(--font-display);color:rgb(var(--gr) var(--gg) var(--gb));text-shadow:0 0 .5em rgb(var(--gr) var(--gg) var(--gb)/.6);margin-bottom:6px}
.ml-bar{height:4px;background:rgba(255,255,255,.14);border-radius:4px;overflow:hidden;max-width:360px;margin-top:20px}
.ml-bar i{display:block;height:100%;width:calc(var(--p,0)*100%);background:rgb(var(--gr) var(--gg) var(--gb));box-shadow:0 0 12px rgb(var(--gr) var(--gg) var(--gb))}

/* 3. Stampa strato dopo strato */
.ml-print{height:360vh;position:relative}
.ml-print__pin{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden}
.ml-print__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,100px);align-items:center;width:100%}
.ml-pct{font:400 clamp(4rem,12vw,9rem)/1 var(--font-display);color:rgb(var(--gr) var(--gg) var(--gb));text-shadow:0 0 .4em rgb(var(--gr) var(--gg) var(--gb)/.5);margin-top:24px}
.ml-pct small{font-size:.4em;margin-left:4px}
.ml-print__art{display:flex;justify-content:center}
.ml-print__art svg{width:min(100%,360px);max-height:72svh;height:auto;overflow:visible}
.ml-ghost path{fill:none;stroke:rgba(243,241,234,.35);stroke-width:1.5;stroke-dasharray:5 6}
.ml-shade{fill:rgb(255 244 224/.92)}.ml-ring{fill:#2b3a34;stroke:var(--lime);stroke-width:1.5}.ml-pbase{fill:var(--lime)}
.ml-scan{stroke:rgb(var(--gr) var(--gg) var(--gb));stroke-width:2;filter:drop-shadow(0 0 6px rgb(var(--gr) var(--gg) var(--gb)))}
.ml-nozzle{fill:var(--lime);filter:drop-shadow(0 0 8px var(--lime))}

/* 4. Il sistema */
.ml-gal{padding-block:clamp(70px,10vw,140px)}
.ml-ph-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.ml-ph{margin:0;aspect-ratio:4/5;border:2px dashed rgba(243,241,234,.3);border-radius:22px;display:grid;place-content:center;text-align:center;gap:6px;position:relative;overflow:hidden;background:linear-gradient(110deg,transparent 30%,rgb(var(--gr) var(--gg) var(--gb)/.10) 50%,transparent 70%) 200% 0/250% 100% no-repeat}
.ml-ph{animation:ml-shim 3.6s linear infinite}
@keyframes ml-shim{to{background-position:-100% 0}}
.ml-ph span{font:400 1.5rem var(--font-display)}
.ml-ph small{font:500 .72rem var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--lime)}

/* Lampada illustrata */
.ml-lamp{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ml-lamp .part{transition:transform .55s cubic-bezier(.34,1.56,.64,1),opacity .35s}
.ml-lamp .part.out{transform:translateY(-46px);opacity:0;transition:transform .3s ease-in,opacity .3s}
.ml-lamp .part.pre{transform:translateY(-60px);opacity:0;transition:none}
.ml-lamp .shade{fill:url(#sg);stroke:rgb(255 255 255/.55);stroke-width:1.5}
.ml-lamp .ring{fill:#2b3a34;stroke:var(--lime);stroke-width:1.5}
.ml-lamp.click .ring{animation:ml-click .7s ease-out}
@keyframes ml-click{0%{stroke-width:1.5;filter:drop-shadow(0 0 0 var(--lime))}35%{stroke-width:4;filter:drop-shadow(0 0 12px var(--lime))}100%{stroke-width:1.5;filter:none}}
.ml-lamp .lit-halo{fill:rgb(var(--gr) var(--gg) var(--gb)/.45);filter:blur(22px);transition:opacity .6s}
.ml-picker{position:absolute;left:-40%;right:-40%;bottom:-84px;display:flex;justify-content:center;gap:22px;flex-wrap:wrap}
.ml-pick{display:grid;gap:6px;justify-items:center;background:rgba(7,16,13,.8);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:8px 12px}
.ml-pick>div{display:flex;gap:8px}
.ml-pb{width:46px;height:46px;border-radius:12px;border:2px solid rgba(255,255,255,.25);background:transparent;cursor:pointer;padding:6px;transition:transform .3s var(--ease),border-color .3s,background .3s}
.ml-pb svg{width:100%;height:100%;fill:rgba(243,241,234,.55)}
.ml-pb:hover{transform:translateY(-3px)}
.ml-pb.on{border-color:var(--lime);background:rgb(var(--gr) var(--gg) var(--gb)/.16)}
.ml-pb.on svg{fill:var(--lime)}
.ml-note{position:absolute;left:0;right:0;bottom:-128px;text-align:center;font:500 .7rem var(--font-mono);letter-spacing:.07em;text-transform:uppercase;color:#8fa59a}

/* 6. Chiusura */
.ml-end{padding-block:clamp(90px,12vw,170px);text-align:center;position:relative}
.ml-end__t{font-size:clamp(2.6rem,8vw,7rem);margin-inline:auto}

@media(max-width:900px){
  .ml-hero__grid,.ml-story__grid,.ml-print__grid{grid-template-columns:1fr}
  .ml-hero{padding-top:100px}
  .ml-stage{width:min(70%,calc(46svh*.638));margin-top:10px;margin-bottom:120px}
  .ml-title{white-space:normal}
  .ml-story__grid,.ml-print__grid{gap:14px;align-content:center}
  .ml-story__frame{width:min(70%,calc(44svh*.638))}
  .ml-story__text .ml-h2,.ml-print__text .ml-h2{font-size:clamp(1.8rem,8vw,2.6rem);margin-bottom:10px}
  .ml-print__art svg{width:min(70%,calc(42svh*.638));max-height:none}.ml-picker{left:-25%;right:-25%;gap:10px;bottom:-78px}.ml-pb{width:42px;height:42px}.ml-note{bottom:-112px}
  .ml-print .ml-p{display:none}
  .ml-pct{font-size:3.4rem;margin-top:6px}
  .ml-ph-grid{grid-template-columns:1fr}
  .ml-ph{aspect-ratio:16/10}
}
@media(prefers-reduced-motion:reduce){
  .ml-title span{opacity:1;transform:none;filter:none;animation:none}
  .ml-stage__glow,.ml-marquee__track,.ml-ph{animation:none}
  .ml-story,.ml-print{height:auto}
  .ml-story__pin,.ml-print__pin{position:static;height:auto;padding-block:70px}
}
.ml-lamp.ring-hi .ring{stroke-width:4;filter:drop-shadow(0 0 14px var(--lime));animation:ml-ringp 1.2s ease-in-out infinite}
@keyframes ml-ringp{50%{filter:drop-shadow(0 0 4px var(--lime))}}
.ml-lamp .lit-halo{opacity:.25}
.ml .nav__links,.ml .nav__links a{color:var(--ink)}
.ml .burger{color:var(--crema)}
.ml .nav__links.open{background:var(--surface)}
.ml .nav__links.open{border-radius:0 0 24px 24px}