@font-face{font-family:Archivo;src:url(../fonts/archivo-var-latin.woff2) format("woff2");font-weight:400 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(../fonts/source-serif-4-var-latin.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(../fonts/source-serif-4-italic-var-latin.woff2) format("woff2");font-weight:400 600;font-style:italic;font-display:swap}

:root{--bg:#e8e5de;--ink:#171715;--mute:#625f57;--line:rgba(23,23,21,.16);--slate:#2e414e;--card:#f1efe9;
 --ar:Archivo,system-ui,sans-serif;--se:"Source Serif 4",Georgia,serif;--ease:cubic-bezier(.2,.7,.1,1);--pad:clamp(20px,4vw,56px)}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);color:var(--ink)}
body{margin:0;font-family:var(--se);font-size:17px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background .9s}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
::selection{background:var(--ink);color:var(--bg)}
.lab{font:500 10px var(--ar);letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}
.paper{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
 background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .42  0 0 0 0 .36  0 0 0 .22 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
main,header,footer{position:relative;z-index:2}
header{z-index:30} /* sopra il contenuto: le tendine del menu non devono finire sotto il titolo */
.atl-main{overflow-x:clip}

/* ticker */
.tick{border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;padding:9px 0;font:500 10px var(--ar);letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.tick div{display:inline-block;animation:tk 60s linear infinite}
.tick span{margin:0 28px}.tick span::before{content:"●";font-size:6px;margin-right:12px;vertical-align:middle;color:var(--slate)}
@keyframes tk{to{transform:translateX(-50%)}}

/* testata */
.bar{display:flex;align-items:center;justify-content:space-between;padding:22px var(--pad)}
.logo{font:700 13px/1.05 var(--ar);font-stretch:125%;letter-spacing:.08em;text-transform:uppercase}
.logo small{display:block;font:500 9px var(--ar);letter-spacing:.3em;color:var(--mute);margin-top:6px;font-stretch:100%}
.nav{display:flex;gap:clamp(14px,2.2vw,34px);font:500 11px var(--ar);letter-spacing:.16em;text-transform:uppercase}
.nav a{padding:6px 0;background:linear-gradient(var(--ink),var(--ink)) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease)}
.nav a:hover{background-size:100% 1px}
.srch{display:flex;align-items:center;gap:10px;padding:10px 16px;border:1px solid var(--line);border-radius:99px;font:500 10px var(--ar);letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
@media (max-width:900px){.nav,.srch span{display:none}}

/* HERO con scrubber temporale */
.hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);padding:clamp(20px,3.4vw,48px) var(--pad) 0;align-items:start}
.hero h1{margin:16px 0 0;font:300 clamp(28px,2.9vw,42px)/1.1 var(--se);letter-spacing:-.025em;max-width:16em;opacity:0;transform:translateY(24px);animation:up 1.2s .2s var(--ease) forwards}
.hero h1 em{font-style:italic;font-weight:400}
.hero h1 span{display:inline}
.hero h1 span{display:inline}
.lede{margin:20px 0 0;max-width:30em;color:#4a4943;font-size:16.5px;opacity:0;animation:up 1.2s .5s var(--ease) forwards}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px;opacity:0;animation:up 1.2s .7s var(--ease) forwards}
@keyframes up{to{opacity:1;transform:none}}
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:16px 26px;border:1px solid var(--ink);border-radius:99px;font:500 11px var(--ar);letter-spacing:.18em;text-transform:uppercase;overflow:hidden;transition:color .45s var(--ease);isolation:isolate;will-change:transform}
.btn::before{content:"";position:absolute;inset:0;background:var(--ink);transform:translateY(102%);border-radius:50% 50% 0 0/100% 100% 0 0;transition:transform .55s var(--ease),border-radius .55s;z-index:-1}
.btn:hover{color:var(--bg)}.btn:hover::before{transform:none;border-radius:0}
.btn.fill{background:var(--ink);color:var(--bg)}.btn.fill::before{background:var(--slate)}

.stage{position:relative}
.stage .frame{position:relative;aspect-ratio:2/1;background:var(--card);overflow:hidden;box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 30px 60px -30px rgba(23,23,21,.35)}
.stage .ph{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;clip-path:inset(0)}
.stage .ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.stage .ph.mul img{object-fit:contain;mix-blend-mode:multiply;padding:6%}
.stage .ph.on,.stage .ph.was{visibility:visible;opacity:1}
.stage .ph.was{z-index:1}.stage .ph.on{z-index:2}
.stage .ph.in{animation:wipe 1.1s var(--ease) both}
@keyframes wipe{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
.stage .ph.in img{animation:zoomout 1.6s var(--ease) both}
@keyframes zoomout{from{transform:scale(1.18)}to{transform:scale(1)}}
.hud{position:absolute;z-index:3;font:500 10px var(--ar);letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:rgba(232,229,222,.88);padding:5px 8px}
.hud.ha{left:16px;top:14px}.hud.hb{right:16px;top:14px;text-align:right}
.stage.dark .hud{background:rgba(23,23,21,.85);color:#e8e5de}
.cross{position:absolute;width:18px;height:18px;z-index:3}
.cross::before,.cross::after{content:"";position:absolute;background:var(--ink);opacity:.55}
.cross::before{left:8px;top:0;width:1px;height:18px}.cross::after{top:8px;left:0;height:1px;width:18px}
.cross.a{left:-9px;top:-9px}.cross.b{right:-9px;top:-9px}.cross.c{left:-9px;bottom:-9px}.cross.d{right:-9px;bottom:-9px}

.year{position:absolute;left:-6px;bottom:-1.12em;z-index:4;font:300 clamp(44px,5vw,72px)/1 var(--ar);font-stretch:125%;letter-spacing:-.06em;display:flex;color:var(--ink);mix-blend-mode:normal;pointer-events:none;height:1em;overflow:hidden}
.year .dg{height:1em;overflow:hidden;width:.66em}
.year .dg>div{transition:transform 1.3s var(--ease)}
.year .dg span{display:block;height:1em;line-height:1;text-align:center}
.cap{display:grid;margin:clamp(40px,4.4vw,64px) 0 0 clamp(60px,18vw,300px)}
.cap__i{grid-area:1/1;display:grid;grid-template-columns:1fr auto;gap:12px 30px;align-items:end;opacity:0;visibility:hidden;transition:opacity .5s,visibility 0s .5s}
.cap__i.on{opacity:1;visibility:visible;transition:opacity .6s .15s,visibility 0s}
.cap h2{margin:0;font:400 clamp(19px,1.7vw,24px)/1.2 var(--se);letter-spacing:-.02em}
.cap h2 a{background:linear-gradient(var(--ink),var(--ink)) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease)}
.cap h2 a:hover{background-size:100% 1px}
.cap p{margin:6px 0 0;font-size:15.5px;color:#55534c;max-width:34em}
.cap .more{font:500 10px var(--ar);letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:4px}
@media (max-width:900px){.cap{margin-left:0}.cap__i{grid-template-columns:1fr}}
.scrub{grid-column:1 / -1;margin:clamp(30px,4vw,54px) 0 0;padding:0 0 4px}
.scrub__row{display:flex;justify-content:space-between;margin-bottom:12px}
.scrub__track{position:relative;height:44px}
.scrub__ticks{position:absolute;left:0;right:0;top:20px;height:1px;background:var(--line)}
.scrub__fill{position:absolute;left:0;top:20px;height:1px;background:var(--ink);width:var(--f,0%)}
.scrub__ticks i{position:absolute;top:-5px;width:1px;height:11px;background:var(--ink);opacity:.5}
.scrub__ticks b{position:absolute;top:-30px;transform:translateX(-50%);font:500 10px var(--ar);letter-spacing:.14em;color:var(--mute);transition:color .4s}
.scrub__ticks b.on{color:var(--ink)}
.scrub input{position:absolute;inset:0;width:100%;margin:0;opacity:0;cursor:ew-resize}
.scrub__knob{position:absolute;top:8px;left:var(--f,0%);width:25px;height:25px;margin-left:-12px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 6px rgba(23,23,21,.08);pointer-events:none;transition:left .6s var(--ease),transform .3s}
.scrub:focus-within .scrub__knob{box-shadow:0 0 0 3px var(--bg),0 0 0 5px var(--slate)}
.scrub.drag .scrub__knob,.scrub.drag .scrub__fill{transition:none}
.scrub__fill{transition:width .6s var(--ease)}
.scrub .hint{display:flex;align-items:center;gap:10px}
.scrub .hint::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--slate);animation:pulse 1.6s infinite}
@keyframes pulse{50%{transform:scale(1.8);opacity:.3}}
@media (max-width:900px){.hero{grid-template-columns:1fr}.cap{margin-left:0;grid-template-columns:1fr}.year{left:0}}

/* testo che si legge scorrendo */
.say{padding:clamp(70px,9vw,130px) var(--pad) clamp(50px,6vw,90px);max-width:1000px}
.say p{margin:0;font:300 clamp(21px,2.3vw,32px)/1.35 var(--se);letter-spacing:-.015em}
.say .w{color:#5f5d55;transition:color .25s}
.say .w.on{color:var(--ink)}
.say em{font-style:italic}

/* registro numeri */
.reg{display:grid;grid-template-columns:repeat(4,1fr);margin:0 var(--pad);border-top:1px solid var(--ink)}
.reg div{padding:18px 0 40px;border-bottom:1px solid var(--line);position:relative}
.reg div+div{padding-left:clamp(14px,2vw,28px);border-left:1px solid var(--line)}
.reg b{display:block;margin-top:20px;font:300 clamp(28px,2.8vw,40px)/1 var(--se);letter-spacing:-.04em;font-variant-numeric:lining-nums tabular-nums}
.reg em{display:block;height:2px;background:var(--line);margin-top:22px;position:relative;overflow:hidden}
.reg em::after{content:"";position:absolute;inset:0;background:var(--slate);transform:scaleX(0);transform-origin:left;transition:transform 1.8s var(--ease)}
.reg .in em::after{transform:scaleX(var(--w))}
@media (max-width:900px){.reg{grid-template-columns:1fr 1fr}.reg div:nth-child(3){border-left:0;padding-left:0}}

/* sette ingressi: fisarmonica */
.acc{display:flex;height:min(62vh,470px);border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.pan{position:relative;flex:1 1 0;min-width:0;border-left:1px solid var(--line);overflow:hidden;cursor:pointer;transition:flex-grow .8s var(--ease),background .5s;outline-offset:-3px}
.pan:first-child{border-left:0}
.pan.on{flex-grow:6.5;background:var(--card);cursor:default}
.pan__rail{position:absolute;inset:0;padding:16px 14px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;transition:opacity .4s}
.pan__n{font:500 10px var(--ar);letter-spacing:.2em;color:var(--mute)}
.pan__t{writing-mode:vertical-rl;transform:rotate(180deg);font:400 clamp(17px,1.5vw,21px)/1 var(--se);letter-spacing:-.01em;margin:auto 0}
.pan__c{font:500 10px var(--ar);letter-spacing:.14em;color:var(--mute)}
.pan:hover:not(.on) .pan__t{text-decoration:underline;text-underline-offset:5px}
.pan.on .pan__rail{opacity:0;pointer-events:none}
.pan__body{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);opacity:0;transform:translateX(24px);visibility:hidden;transition:opacity .5s,transform .8s var(--ease),visibility 0s .5s;min-width:min(620px,60vw)}
.pan.on .pan__body{opacity:1;transform:none;visibility:visible;transition-delay:.25s,.25s,0s}
.pan__im{position:relative;overflow:hidden;background:#d9d6cd}
.pan__im img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.pan__im.mul{background:var(--card)}.pan__im.mul img{object-fit:contain;mix-blend-mode:multiply;padding:8%}
.pan__tx{padding:clamp(18px,2.2vw,30px);display:flex;flex-direction:column;justify-content:center}
.pan__tx h3{margin:10px 0 8px;font:400 clamp(20px,1.8vw,26px)/1.15 var(--se);letter-spacing:-.02em}
.pan__tx p{margin:0 0 6px;font-size:15px;color:#55534c}
.pan__tx .go{align-self:flex-start;margin-top:14px;display:inline-flex;align-items:center;gap:12px;font:500 11px var(--ar);letter-spacing:.2em;text-transform:uppercase}
.pan__tx .go::after{content:"";width:40px;height:1px;background:currentColor;transition:width .5s var(--ease)}
.pan__tx .go:hover::after{width:70px}
@media (max-width:900px){.acc{flex-direction:column;height:auto}.pan,.pan.on{flex:none;border-left:0;border-top:1px solid var(--line);cursor:default}.pan__rail{display:none}.pan__body{position:relative;opacity:1;transform:none;visibility:visible;grid-template-columns:1fr;min-width:0}.pan__im{aspect-ratio:16/9}}

/* ultimi: schede inclinabili */
.lat{padding:clamp(70px,8vw,120px) var(--pad) clamp(60px,7vw,110px)}
.lat__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,28px)}
.t{display:block;perspective:900px}
.t__in{position:relative;transform-style:preserve-3d;transition:transform .5s var(--ease);will-change:transform}
.t__img{aspect-ratio:4/5;background:var(--card);overflow:hidden;position:relative;clip-path:inset(100% 0 0 0);transition:clip-path 1.1s var(--ease)}
.t.in .t__img{clip-path:inset(0)}
.t__img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transform:scale(1.15);transition:transform 1.4s var(--ease)}
.t__img.mul img{object-fit:contain;mix-blend-mode:multiply;padding:10%}
.t:hover .t__img img{transform:scale(1)}
.t__img::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.55),transparent 55%);mix-blend-mode:soft-light;opacity:0;transition:opacity .4s}
.t:hover .t__img::after{opacity:1}
.t h3{margin:14px 0 4px;font:400 clamp(15.5px,1.2vw,18px)/1.28 var(--se);letter-spacing:-.01em}
.t .lab{display:block}
.lat__grid .t:nth-child(even){margin-top:clamp(20px,5vw,70px)}
@media (max-width:900px){.lat__grid{grid-template-columns:1fr 1fr}}


/* timeline orizzontale agganciata allo scroll */
.tl{position:relative;height:520vh;margin-top:clamp(50px,6vw,90px)}
.tl__pin{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;border-top:1px solid var(--line)}
.tl__head{display:flex;justify-content:space-between;align-items:baseline;padding:0 var(--pad);margin-bottom:28px}
.tl__head h2{margin:0}
.tl__track{display:flex;gap:clamp(24px,3.4vw,52px);padding:0 var(--pad);will-change:transform}
.era{flex:0 0 clamp(260px,23vw,330px)}
.era .y{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;font:500 11px var(--ar);letter-spacing:.2em;color:var(--mute)}
.era .y b{font:300 clamp(24px,2vw,30px)/1 var(--ar);font-stretch:115%;letter-spacing:-.03em;color:var(--ink)}
.era .y::after{content:"";flex:1;height:1px;background:var(--line);align-self:center}
.era .im{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--card)}
.era .im img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transform:scale(1.08);transition:transform 1.4s var(--ease)}
.era .im.mul img{object-fit:contain;mix-blend-mode:multiply;padding:7%}
.era:hover .im img{transform:scale(1)}
.era h3{margin:16px 0 6px;font:400 clamp(17px,1.4vw,20px)/1.25 var(--se);letter-spacing:-.01em}
.era p{margin:0;font-size:15px;color:#55534c;max-width:24em}
.stops{list-style:none;margin:12px 0 0;padding:0;font-size:14.5px}
.stops li{border-top:1px solid var(--line);padding:6px 0}
.stops a{display:block;background:linear-gradient(var(--ink),var(--ink)) 0 100%/0 1px no-repeat;transition:background-size .4s var(--ease)}.stops a:hover{background-size:100% 1px}
.era a.more{display:inline-block;margin-top:12px;font:500 10px var(--ar);letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:3px}
.tl__bar{position:absolute;left:var(--pad);right:var(--pad);bottom:7vh;height:1px;background:var(--line)}
.tl__bar i{position:absolute;left:0;top:-1px;height:3px;width:calc(var(--tp,0)*100%);background:var(--ink)}
.tl__bar span{position:absolute;right:0;top:12px}
@media (max-width:900px){.tl{height:auto}.tl__pin{position:static;height:auto;padding:50px 0}.tl__track{overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:20px}.era{scroll-snap-align:start}.tl__bar{display:none}}
@media (prefers-reduced-motion:reduce){.tl{height:auto}.tl__pin{position:static;height:auto;padding:50px 0}.tl__track{overflow-x:auto}.tl__bar{display:none}}

/* chiusura */
.end{background:var(--ink);color:#e8e5de;padding:clamp(60px,7vw,100px) var(--pad) 0;position:relative;z-index:2}
.end .row{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:end}
.end h2{margin:0;font:300 clamp(24px,2.6vw,36px)/1.15 var(--se);letter-spacing:-.02em}
.end h2 em{color:#9aa8b1;font-style:italic}
.end form{display:flex;border-bottom:1px solid #e8e5de}
.end input{flex:1;background:none;border:0;color:#e8e5de;font:300 22px var(--se);padding:18px 0;outline:0}
.end input::placeholder{color:#8a8880}
.end button{background:none;border:0;color:#e8e5de;font:500 11px var(--ar);letter-spacing:.2em;text-transform:uppercase;cursor:pointer}
.end .foot{display:flex;justify-content:space-between;gap:20px;margin-top:56px;padding-bottom:14px;font:500 10px var(--ar);letter-spacing:.2em;text-transform:uppercase;color:#8a8880}
.end .word::before{content:attr(data-t)}
.end .word{font:800 clamp(22px,4.4vw,70px)/.9 var(--ar);font-stretch:125%;letter-spacing:-.06em;text-transform:uppercase;color:#262624;white-space:nowrap;overflow:hidden;margin:0 calc(var(--pad)*-1);padding:0 calc(var(--pad) - 6px)}
@media (max-width:900px){.end .row{grid-template-columns:1fr}}

.js .rv{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s)} /* senza JS il testo resta visibile */
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .rv,.hero h1,.lede,.cta{opacity:1;transform:none}.say .w{color:var(--ink)}.t__img{clip-path:none}.door{position:relative;top:0}}

.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--ink);color:var(--bg);padding:12px 18px;font:600 13px var(--ar)}
.skip:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--slate);outline-offset:3px}
.menu-btn{display:none;min-height:44px;padding:0 18px;border:1px solid var(--line);border-radius:99px;background:none;color:var(--ink);font:500 11px var(--ar);letter-spacing:.18em;text-transform:uppercase;cursor:pointer}
.bar{flex-wrap:wrap;gap:12px 24px}
.bar .nav ul{display:flex;gap:clamp(14px,2.2vw,34px);list-style:none;margin:0;padding:0}
.srch{display:flex;align-items:center;gap:8px;padding:0 6px 0 16px;border:1px solid var(--line);border-radius:99px;min-height:44px}
.srch input{border:0;background:none;font:500 11px var(--ar);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);width:15em;outline:0}
.srch input::placeholder{color:var(--mute)}
.srch button{border:0;background:none;color:var(--mute);width:34px;height:34px;cursor:pointer;display:grid;place-items:center}
.tick a{color:inherit}.tick a:hover{color:var(--ink)}
@media (max-width:900px){.menu-btn{display:inline-flex;align-items:center}.bar .nav{display:none;order:5;flex-basis:100%}.bar .nav.is-open{display:block}.bar .nav ul{flex-direction:column;gap:0}.bar .nav a{display:block;padding:14px 0;border-bottom:1px solid var(--line)}.srch{flex:1 1 100%;order:4}.srch input{flex:1;width:auto}}
.end__form .mailpoet_form{background:none!important}
.end__form p,.end__form label{color:#c9c6bd!important}
.end .foot a{color:inherit}.end .foot a:hover{color:#fff}
.t{color:inherit}.pan a,.era a,.cap a{color:inherit}
.hero h1 a{color:inherit}
.stops a:focus-visible{outline-offset:2px}
.doors h2,.lat h2,.tl h2{margin:0 0 clamp(24px,3vw,40px);font:300 clamp(22px,2.2vw,30px)/1.15 var(--se);letter-spacing:-.02em}
.atl-main,.end{overflow-x:clip}
.doors{padding:clamp(60px,8vw,120px) var(--pad) 0}
.end .fcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:30px clamp(20px,4vw,60px);margin-top:56px;padding-top:34px;border-top:1px solid #34332f}
.end .fcol h2{margin:0 0 14px;font:500 10px var(--ar);letter-spacing:.22em;text-transform:uppercase;color:#8a8880}
.end .fcol ul{list-style:none;margin:0;padding:0}
.end .fcol li{margin:0}
.end .fcol a{display:inline-block;padding:5px 0;font:400 16px/1.3 var(--se);color:#e8e5de;transition:color .25s}
.end .fcol a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.end .foot{display:block;margin-top:44px;padding:20px 0 22px;border-top:1px solid #34332f;font:400 12px/1.6 var(--ar);letter-spacing:.02em;text-transform:none;color:#8a8880}
.end .foot p{margin:0 0 6px;max-width:60em}
.end .foot a{color:#b9b6ad;text-decoration:underline}

/* ---------- carosello a scatto, messa a fuoco (home, articoli, archivi) ---------- */
.snap{display:flex;gap:clamp(14px,2vw,26px);overflow-x:auto;scroll-snap-type:x mandatory;padding:6px var(--pad) 22px;margin:0 calc(var(--pad)*-1);scrollbar-width:thin;outline-offset:-2px}
.snap>*{flex:0 0 calc(clamp(240px,28vw,340px)*var(--ts,1));scroll-snap-align:center;margin-top:0!important}
.snap.js>*{transform:scale(.94);transition:transform .5s var(--ease)}
.snap.js>.on{transform:none}
.snap.js>*:not(.on) img{opacity:.72}
.snap img{transition:opacity .5s}
.focus-set .t{transition:filter .45s,opacity .45s}
@media (hover:hover){
.focus-set:has(.t:hover) .t:not(:hover),.focus-set:has(.t:focus-visible) .t:not(:focus-visible){filter:blur(1.5px) saturate(.5);opacity:.6}
}
/* ---------- effetti (si accendono dal pannello: classi fx-* sul body) ---------- */
@keyframes iris{from{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(80% at 50% 50%)}}
@keyframes expo{0%{color:var(--bg);text-shadow:0 0 26px rgba(255,255,255,.95)}55%{color:#9c9a92;text-shadow:0 0 14px rgba(255,255,255,.6)}100%{color:var(--ink);text-shadow:0 0 0 rgba(255,255,255,0)}}
@keyframes perf{to{background-position:-21px 0}}
body.fx-iris .stage .ph.in{animation:iris 1.3s var(--ease) both}
body.fx-exposure .reg b.exp{animation:expo 1.8s var(--ease) both}
body.fx-perf .tick{position:relative;padding:21px 0}
body.fx-perf .tick::before,body.fx-perf .tick::after{content:"";position:absolute;left:0;right:0;height:5px;background:repeating-linear-gradient(90deg,var(--line) 0 9px,transparent 9px 21px);animation:perf 1.4s linear infinite}
body.fx-perf .tick::before{top:7px}body.fx-perf .tick::after{bottom:7px}
html.js body.fx-develop .t:not(.in) .t__img img,html.js body.fx-develop .era:not(.in) .im img{filter:grayscale(1) brightness(1.9) contrast(.45)}
body.fx-develop .t__img img{transition:filter 1.8s var(--ease) .1s,transform 1.4s var(--ease)}
@media (hover:hover){
body.fx-darkroom .t__img img,body.fx-darkroom .era .im img,body.fx-darkroom .pan__im img,body.fx-darkroom .mt__img img,body.fx-darkroom .fr__img img,body.fx-darkroom .res__i img{transition:filter .7s var(--ease),transform 1.4s var(--ease)}
body.fx-darkroom .t:hover .t__img img,body.fx-darkroom .era:hover .im img,body.fx-darkroom .pan.on:hover .pan__im img,body.fx-darkroom .mt:hover .mt__img img,body.fx-darkroom .fr:hover .fr__img img,body.fx-darkroom .res a:hover .res__i img{filter:grayscale(0) contrast(1)}
body.fx-lock .t{position:relative}
body.fx-lock .t::before{content:"";position:absolute;inset:-9px;z-index:4;pointer-events:none;opacity:0;transition:inset .35s var(--ease),opacity .25s;background:
linear-gradient(var(--ink),var(--ink)) 0 0/16px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) 0 0/1px 16px no-repeat,
linear-gradient(var(--ink),var(--ink)) 100% 0/16px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) 100% 0/1px 16px no-repeat,
linear-gradient(var(--ink),var(--ink)) 0 100%/16px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) 0 100%/1px 16px no-repeat,
linear-gradient(var(--ink),var(--ink)) 100% 100%/16px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) 100% 100%/1px 16px no-repeat}
body.fx-lock .t:hover::before,body.fx-lock .t:focus-visible::before{inset:0;opacity:1}
}

/* sottomenu a tendina (menu di WordPress, due livelli) */
.bar .nav li{position:relative}
.bar .nav li.menu-item-has-children>a::after{content:"";display:inline-block;width:5px;height:5px;margin:0 0 2px 8px;border:solid currentColor;border-width:0 1px 1px 0;transform:rotate(45deg)}
.bar .nav .sub-menu{display:block;position:absolute;left:-16px;top:100%;z-index:50;min-width:240px;margin:0;padding:10px 0;list-style:none;background:var(--bg);border:1px solid var(--line);box-shadow:0 18px 30px -18px rgba(23,23,21,.35);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .25s,transform .35s var(--ease),visibility 0s .25s}
.bar .nav .sub-menu a{display:block;padding:9px 18px;font-size:11px;letter-spacing:.14em;white-space:nowrap;background:none}
.bar .nav .sub-menu a:hover{background:rgba(241,239,233,.9);color:var(--slate)}
.bar .nav li:hover>.sub-menu,.bar .nav li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .35s var(--ease)}
.bar .nav .sub-menu .sub-menu{display:none}
@media (max-width:900px){.bar .nav .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 16px;min-width:0;background:none}.bar .nav li.menu-item-has-children>a::after{display:none}.bar .nav .sub-menu a{white-space:normal;font-size:12px}}
@media (prefers-reduced-motion:reduce){.bar .nav .sub-menu{transition:none}}

.end__form .mailpoet_validate_error{color:#f0a496!important}.end__form .mailpoet_validate_success{color:#9bd3b0!important}
/* 4 tendina del menu con il tocco (tablet): la voce con sottovoci si apre al primo tocco */
.bar .nav li.sub-open>.sub-menu{opacity:1;visibility:visible;transform:none}

/* footer senza blocco newsletter: niente spazio vuoto sopra le colonne */
.end--bare{padding-top:clamp(36px,4vw,56px)}
.end--bare .fcols{margin-top:0;padding-top:0;border-top:0}
