/* ══════════════════════════════════════════════════
   ELE Event Planner — sito cinematografico allo scroll
   Linguaggio visivo ispirato a landonorris.com, adattato al brand ELE
   ══════════════════════════════════════════════════ */
:root{
  --plum-950:#110b16;
  --plum-900:#170f1e;
  --plum-800:#211729;
  --plum-700:#2d2138;
  --ivory:#f5eee5;
  --ivory-2:#ebe1d4;
  --paper:#fffaf4;
  --ink:#1c1423;
  --ink-dim:#5d5163;
  --on-dark:#f5eee5;
  --on-dark-dim:rgba(245,238,229,.72);
  --on-dark-faint:rgba(245,238,229,.46);
  --rasp:#e95482;
  --rasp-btn:#c8386a;
  --rasp-hover:#ad2c58;
  --gold:#d9ae63;
  --line-dark:rgba(245,238,229,.14);
  --line-light:rgba(28,20,35,.13);
  --f-sans:"Mona Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-serif:"Instrument Serif","Times New Roman",Georgia,serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.77,0,.18,1);
  --gutter:clamp(1.25rem,4vw,4.5rem);
  --header-h:4.75rem;
}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--plum-900);scrollbar-gutter:stable;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ivory);color:var(--ink);font:400 1.0625rem/1.6 var(--f-sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
body.is-locked,body.menu-open{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,p,figure{margin:0}
::selection{background:var(--rasp);color:#fff}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:200;top:.75rem;left:.75rem;padding:.7rem 1rem;border-radius:.5rem;background:var(--paper);color:var(--ink);transform:translateY(-200%);transition:transform .3s}
.skip-link:focus{transform:none}
.wrap{width:100%;max-width:92rem;margin-inline:auto;padding-inline:var(--gutter)}

/* ── Tipografia ─────────────────────────────────── */
.caps{font-family:var(--f-sans);font-weight:720;font-stretch:78%;text-transform:uppercase;letter-spacing:-.012em;line-height:.86}
.serif{font-family:var(--f-serif);font-style:italic;font-weight:400;letter-spacing:-.012em;line-height:.98}
.h-display .caps{font-size:clamp(3.1rem,8.6vw,9.6rem)}
.h-display .serif{font-size:clamp(2.5rem,6.6vw,7.4rem);color:var(--rasp-btn)}
[data-theme="dark"] .h-display .serif{color:var(--gold)}
.eyebrow{display:flex;align-items:center;gap:.7rem;margin:0 0 1.6rem;font:600 .72rem/1.3 var(--f-sans);letter-spacing:.16em;text-transform:uppercase}
.eyebrow--dot::before{content:"";flex:none;width:.45rem;height:.45rem;border-radius:50%;background:var(--rasp)}
.eyebrow b{font-weight:700;color:var(--rasp)}
.lead{max-width:36rem;font-size:clamp(1.05rem,1.3vw,1.2rem);line-height:1.55;color:var(--ink-dim)}
[data-theme="dark"] .lead{color:var(--on-dark-dim)}
.note{max-width:30rem;margin-top:1rem;font-size:.78rem;line-height:1.5;color:var(--on-dark-faint)}

/* ── Rivelazioni: riga che entra dietro una barra di colore ── */
.ln{position:relative;display:block;width:fit-content}
.rv .ln::after{content:none}
.motion .rv .ln{clip-path:inset(-.3em calc(100% + .3em) -.35em -.3em);transition:clip-path .8s var(--ease-io) calc(var(--d,0s) + var(--i,0) * .11s)}
.motion .rv .ln::after{content:"";position:absolute;inset:.04em -.06em;background:var(--bar,var(--rasp));transform-origin:right center;transition:transform .75s var(--ease-io) calc(var(--d,0s) + var(--i,0) * .11s + .62s);pointer-events:none}
.motion .rv .ln.caps{--bar:currentColor}
.motion .rv.is-in .ln{clip-path:inset(-.3em -.3em -.35em -.3em)}
.motion .rv.is-in .ln::after{transform:scaleX(0)}
.motion .fade{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease) var(--d,0s),transform 1.1s var(--ease) var(--d,0s)}
.motion .fade.is-in{opacity:1;transform:none}

/* ── Testo che rotola al passaggio del mouse ────── */
.roll{position:relative;display:inline-flex;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.roll-a,.roll-b{display:inline-flex;white-space:nowrap}
.roll-b{position:absolute;top:0;left:0}
.roll .ch{display:inline-block;transition:transform .6s var(--ease) calc(var(--i) * .014s)}
.roll-b .ch{transform:translateY(118%)}
@media (hover:hover){
  a:hover .roll-a .ch,button:hover .roll-a .ch{transform:translateY(-118%)}
  a:hover .roll-b .ch,button:hover .roll-b .ch{transform:none}
}

/* ── Bottoni ────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.9rem;min-height:3.4rem;padding:.9rem 1.55rem;border:1px solid transparent;border-radius:99rem;font:600 .92rem/1.1 var(--f-sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;transition:background .35s,color .35s,border-color .35s}
.btn-sm{min-height:2.75rem;padding:.6rem 1.1rem;font-size:.8rem}
.btn-ico{font-style:normal;transition:transform .5s var(--ease)}
.btn:hover .btn-ico{transform:translateX(.25rem)}
.btn-accent{background:var(--rasp-btn);color:#fff}
.btn-accent:hover{background:var(--rasp-hover)}
.btn-ghost{border-color:rgba(245,238,229,.38);color:var(--on-dark)}
.btn-ghost:hover{border-color:var(--on-dark);background:rgba(245,238,229,.08)}
.btn-dark{background:var(--ink);color:var(--paper)}
.btn-dark:hover{background:var(--plum-700)}
.btn-line{border-color:var(--line-light);color:var(--ink);background:transparent}
.btn-line:hover{border-color:var(--ink)}
.link-arrow{display:inline-flex;align-items:center;gap:1rem;padding-bottom:.4rem;border-bottom:1px solid currentColor;font-weight:600;text-decoration:none}
.link-arrow i{font-style:normal;transition:transform .5s var(--ease)}
.link-arrow:hover i{transform:translateX(.35rem)}
.text-btn{padding:0;border:0;background:none;text-decoration:underline;cursor:pointer}

/* ── Logo rifinito: PNG già scontornato e ritagliato ── */
.logo-crop{display:block;overflow:visible;aspect-ratio:1100/508}
.logo-crop img{display:block;width:100%;max-width:none;height:auto;margin:0}

/* ── Preloader ──────────────────────────────────── */
.loader{position:fixed;z-index:150;inset:0;display:grid;place-items:center;background:var(--plum-950);color:var(--on-dark);clip-path:inset(0);animation:loaderFailsafe 0s linear 5s forwards}
.intro-seen .loader,.no-anim .loader{display:none}
.loader-inner{display:grid;justify-items:center;gap:2rem}
.loader-logo{width:clamp(13rem,25vw,20rem)}
.loader-meta{display:flex;align-items:center;gap:1rem;width:clamp(13rem,25vw,20rem)}
.loader-count{font:600 .78rem/1 var(--f-sans);letter-spacing:.14em;font-variant-numeric:tabular-nums;color:var(--on-dark-dim)}
.loader-bar{flex:1;height:1px;background:var(--line-dark);overflow:hidden}
.loader-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--rasp),var(--gold));transform:scaleX(0);transform-origin:left}
@keyframes loaderFailsafe{to{visibility:hidden;pointer-events:none}}

/* ── Grana ──────────────────────────────────────── */
.grain{position:fixed;z-index:120;inset:-50%;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 8s steps(8) infinite}
@keyframes grain{0%,100%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}

/* ── Header ─────────────────────────────────────── */
.header{position:fixed;z-index:90;top:0;left:0;right:0;height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0 var(--gutter);color:var(--on-dark);transition:transform .7s var(--ease)}
.header::before{content:"";position:absolute;inset:0;background:rgba(23,15,30,.86);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line-dark);opacity:0;transition:opacity .45s}
.header.is-solid::before{opacity:1}
.header.is-hidden{transform:translateY(-105%)}
.menu-open .header::before{opacity:0}
.header>*{position:relative}
.header-logo{width:9.2rem}
.header-actions{display:flex;align-items:center;gap:.6rem}
.menu-btn{display:flex;align-items:center;gap:.8rem;height:2.75rem;padding:0 .55rem 0 1rem;border:1px solid rgba(245,238,229,.3);border-radius:99rem;background:transparent;cursor:pointer;font:600 .8rem/1 var(--f-sans);letter-spacing:.04em}
.menu-btn:hover{border-color:var(--on-dark)}
.menu-btn .when-open,.menu-btn[aria-expanded="true"] .when-closed{display:none}
.menu-btn[aria-expanded="true"] .when-open{display:inline}
.menu-btn-icon{position:relative;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--on-dark)}
.menu-btn-icon i{position:absolute;left:.5rem;right:.5rem;height:1.5px;background:var(--plum-900);transition:transform .5s var(--ease),top .5s var(--ease)}
.menu-btn-icon i:first-child{top:.72rem}
.menu-btn-icon i:last-child{top:1.02rem}
.menu-btn[aria-expanded="true"] .menu-btn-icon i{top:.87rem}
.menu-btn[aria-expanded="true"] .menu-btn-icon i:first-child{transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] .menu-btn-icon i:last-child{transform:rotate(-45deg)}

/* ── Menu a tutto schermo ───────────────────────── */
.menu{position:fixed;z-index:80;inset:0;background:var(--plum-900);color:var(--on-dark);visibility:hidden;clip-path:circle(0 at var(--cx,95%) var(--cy,2.4rem));transition:clip-path .9s var(--ease-io),visibility 0s .9s}
.menu.is-open{visibility:visible;clip-path:circle(150vmax at var(--cx,95%) var(--cy,2.4rem));transition:clip-path .9s var(--ease-io),visibility 0s}
.menu-inner{height:100%;overflow:auto;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(16rem,.5fr);align-items:end;gap:3rem 5vw;padding:calc(var(--header-h) + 5vh) var(--gutter) 6vh}
.menu-nav{display:grid}
.menu-link{display:flex;align-items:baseline;gap:1.2rem;padding:.12em 0;border-bottom:1px solid var(--line-dark);font:720 clamp(2.4rem,6.4vw,6rem)/.98 var(--f-sans);font-stretch:78%;text-transform:uppercase;text-decoration:none;opacity:0;transform:translateY(2.5rem);transition:opacity .5s,transform .9s var(--ease)}
.menu-link small{font:600 .72rem/1 var(--f-sans);letter-spacing:.14em;color:var(--rasp)}
.menu-link:nth-child(2){--k:1}.menu-link:nth-child(3){--k:2}.menu-link:nth-child(4){--k:3}.menu-link:nth-child(5){--k:4}
.menu.is-open .menu-link{opacity:1;transform:none;transition-delay:calc(.3s + var(--k,0) * .06s)}
.menu-side{display:grid;gap:2.2rem;opacity:0;transition:opacity .6s .55s}
.menu.is-open .menu-side{opacity:1}
.menu-block{display:grid;gap:.45rem;justify-items:start}
.menu-block .eyebrow{margin-bottom:.4rem;color:var(--on-dark-faint)}
.menu-block a{text-decoration:none;color:var(--on-dark-dim)}
.menu-block a:hover{color:var(--on-dark)}
.lang{display:flex;gap:.4rem}
.lang button,.motion-btn{padding:.55rem .95rem;border:1px solid var(--line-dark);border-radius:99rem;background:transparent;cursor:pointer;font-size:.85rem}
.lang button[aria-pressed="true"]{background:var(--on-dark);color:var(--plum-900);border-color:var(--on-dark)}
.motion-btn[aria-pressed="true"]{border-color:var(--gold);color:var(--gold)}

/* ── Contatore di scena ─────────────────────────── */
.hud{position:fixed;z-index:70;right:var(--gutter);bottom:1.6rem;display:flex;align-items:center;gap:.8rem;color:#fff;mix-blend-mode:difference;font:600 .68rem/1 var(--f-sans);letter-spacing:.16em;text-transform:uppercase;pointer-events:none;transition:opacity .4s}
.hud.is-hidden{opacity:0}
.hud-line{position:relative;width:3.5rem;height:1px;background:rgba(255,255,255,.3);overflow:hidden}
.hud-line i{position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}

/* ── 01 · Hero ──────────────────────────────────── */
.hero{position:relative;height:100svh;min-height:36rem;background:var(--plum-950);color:var(--on-dark)}
.hero-sticky{position:sticky;top:0;height:100svh;min-height:36rem;overflow:hidden}
.hero-media{position:absolute;inset:0;transform-origin:62% 55%}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center}
.hero-img--base{display:none}
.motion .hero-img--base{display:block;filter:grayscale(1) brightness(.33) contrast(1.06)}
.motion .hero-img--lit{-webkit-mask-image:radial-gradient(circle max(var(--r,0px),1px) at var(--mx,72%) var(--my,62%),#000 0%,#000 40%,rgba(0,0,0,.55) 68%,transparent 100%);mask-image:radial-gradient(circle max(var(--r,0px),1px) at var(--mx,72%) var(--my,62%),#000 0%,#000 40%,rgba(0,0,0,.55) 68%,transparent 100%)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,11,22,.9) 0%,rgba(17,11,22,.55) 34%,rgba(17,11,22,0) 64%),linear-gradient(0deg,rgba(17,11,22,.8) 0%,rgba(17,11,22,0) 45%),radial-gradient(ellipse at center,transparent 55%,rgba(17,11,22,.55) 100%)}
.hero-content{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(3.5rem,9vh,6.5rem);max-width:64rem}
.hero-title{margin-bottom:1.6rem}
.hero-title .caps{font-size:clamp(3.4rem,10.4vw,11.5rem)}
.hero-title .serif{margin-top:.12em;font-size:clamp(2.1rem,5vw,5.6rem);color:var(--gold)}
.hero-title .ln:nth-child(1){--d:.1s}.hero-title .ln:nth-child(2){--d:.1s}.hero-title .ln:nth-child(3){--d:.1s}
.hero-lead{max-width:37rem;margin-bottom:1.8rem;font-size:clamp(1rem,1.25vw,1.15rem);color:var(--on-dark-dim)}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.hero-micro{margin-top:1rem;font-size:.75rem;letter-spacing:.04em;color:var(--on-dark-faint)}
.scroll-cue{position:absolute;z-index:2;left:50%;bottom:1.4rem;display:grid;justify-items:center;gap:.6rem;color:var(--on-dark-faint);font:600 .64rem/1 var(--f-sans);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;transform:translateX(-50%)}
.scroll-cue i{width:1px;height:2.6rem;background:linear-gradient(var(--on-dark) 50%,transparent 50%) 0 0/100% 200%;animation:cue 1.8s var(--ease-io) infinite}
@keyframes cue{from{background-position:0 100%}to{background-position:0 -100%}}

/* ── Marquee ────────────────────────────────────── */
.marquee{position:relative;overflow:hidden;padding:clamp(1.6rem,4vh,2.6rem) 0;background:var(--plum-950);color:var(--on-dark);border-block:1px solid var(--line-dark)}
.marquee-track{display:flex;width:max-content;will-change:transform}
.marquee-group{display:flex;align-items:center;gap:clamp(1.2rem,2.4vw,2.6rem);padding-right:clamp(1.2rem,2.4vw,2.6rem);white-space:nowrap}
.marquee span{font:720 clamp(2.2rem,5.2vw,5.4rem)/1 var(--f-sans);font-stretch:78%;text-transform:uppercase}
.marquee em{font:italic 400 clamp(2.2rem,5.2vw,5.4rem)/1 var(--f-serif);color:var(--gold)}
.marquee i{font-style:normal;font-size:clamp(1rem,2vw,1.8rem);color:var(--rasp)}

/* ── 02 · Promessa ──────────────────────────────── */
.promise{position:relative;overflow:hidden;padding:clamp(7rem,20vh,13rem) 0;background:var(--plum-950);color:var(--on-dark)}
.contours{position:absolute;inset:-10%;width:120%;height:120%;pointer-events:none}
.contours path{fill:none;stroke:rgba(217,174,99,.13);stroke-width:1;vector-effect:non-scaling-stroke}
.promise-wrap{position:relative}
.statement{max-width:23ch;font:500 clamp(2.2rem,5vw,5.2rem)/1.08 var(--f-sans);font-stretch:92%;letter-spacing:-.025em}
.statement em,.statement .em{font-family:var(--f-serif);font-style:italic;font-weight:400;font-stretch:100%;color:var(--gold);letter-spacing:0}
.wd{display:inline}

/* ── 03 · Servizi ───────────────────────────────── */
.services{position:relative;padding:clamp(6rem,16vh,11rem) 0 clamp(3rem,8vh,6rem);background:var(--ivory)}
.section-head{margin-bottom:clamp(3rem,8vh,6rem)}
.service{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(1rem,2vw,2rem);row-gap:clamp(2rem,5vh,3.5rem);align-items:end;padding-block:clamp(4rem,10vh,7rem);border-top:1px solid var(--line-light)}
.service-title{grid-column:1/-1}
.service-title .caps{font-size:clamp(3.6rem,11.5vw,12.5rem)}
.service-title .serif{margin:.02em 0 0 12vw;font-size:clamp(2.6rem,7.4vw,8rem);color:var(--rasp-btn)}
.service-media{position:relative;grid-column:1/8;aspect-ratio:16/11;overflow:hidden;border-radius:.75rem;background:var(--plum-800)}
.service-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12)}
.service-body{grid-column:9/13;padding-bottom:.5rem}
.service-body>p{margin-bottom:1.6rem;font-size:clamp(1.05rem,1.3vw,1.18rem);color:var(--ink-dim)}
.ticks{margin:0 0 2.2rem;padding:0;list-style:none;border-top:1px solid var(--line-light)}
.ticks li{display:flex;gap:.8rem;padding:.8rem 0;border-bottom:1px solid var(--line-light);font-size:.95rem}
.ticks li::before{content:"✦";color:var(--rasp-btn);font-size:.7rem;line-height:2}
.service--alt .service-title .ln{margin-left:auto;text-align:right}
.service--alt .service-title .serif{margin-right:12vw}
.service--alt .service-media{grid-column:6/13;grid-row:2;aspect-ratio:4/3}
.service--alt .service-body{grid-column:1/5;grid-row:2}

/* ── 04 · Mondi (orizzontale su desktop) ────────── */
.worlds{position:relative;background:var(--plum-950);color:var(--on-dark)}
.worlds-pin{position:relative;overflow:hidden}
.worlds-track{display:grid;gap:4.5rem;padding:clamp(6rem,14vh,9rem) var(--gutter)}
.worlds-intro .h-display{margin-bottom:1.6rem}
.worlds-hint{display:none}
.world{display:grid;gap:1.4rem}
.world-media{position:relative;overflow:hidden;aspect-ratio:4/3;border-radius:.6rem;background:var(--plum-800)}
.world-media img{width:114%;max-width:none;height:100%;margin-left:-7%;object-fit:cover}
.world-caption .eyebrow{margin-bottom:.9rem;color:var(--on-dark-dim)}
.world-title{margin-bottom:.6rem}
.world-title .serif{font-size:clamp(2.4rem,3.6vw,3.9rem);color:var(--on-dark)}
.world-caption>p:last-child{max-width:25rem;color:var(--on-dark-dim);font-size:.98rem}
.worlds-end{display:grid;gap:2rem;justify-items:start}
.worlds-progress{display:none}

@media (min-width:900px){
  .motion .hero{height:170svh}
  .motion .worlds-pin{height:100svh;display:flex;align-items:center}
  .motion .worlds-track{display:flex;align-items:center;gap:clamp(3rem,6vw,7rem);width:max-content;padding:var(--header-h) var(--gutter) 0;will-change:transform}
  .motion .worlds-intro{flex:0 0 min(40rem,42vw)}
  .motion .worlds-hint{display:inline-flex;gap:.6rem;margin-top:2.4rem;font:600 .7rem/1 var(--f-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-faint)}
  .motion .worlds-hint i{font-style:normal;color:var(--rasp)}
  .motion .world{flex:0 0 auto;align-self:center}
  .motion .world-media{aspect-ratio:auto}
  .motion .world--1 .world-media{height:min(50svh,30vw);width:calc(min(50svh,30vw) * 1.33)}
  .motion .world--2{align-self:flex-start;margin-top:4svh}
  .motion .world--2 .world-media{height:min(58svh,34vw);width:calc(min(58svh,34vw) * .78)}
  .motion .world--3{align-self:flex-end;margin-bottom:6svh}
  .motion .world--3 .world-media{height:min(44svh,28vw);width:calc(min(44svh,28vw) * 1.45)}
  .motion .world--4 .world-media{height:min(54svh,32vw);width:calc(min(54svh,32vw) * .85)}
  .motion .worlds-end{flex:0 0 min(38rem,40vw);padding-right:6vw}
  .motion .worlds-progress{display:block;position:absolute;left:var(--gutter);right:var(--gutter);bottom:2.2rem;height:1px;background:var(--line-dark)}
  .motion .worlds-progress i{display:block;height:100%;background:var(--rasp);transform:scaleX(0);transform-origin:left}
}

/* ── 05 · Come funziona ─────────────────────────── */
.method{padding:clamp(6rem,16vh,11rem) 0;background:var(--ivory)}
.method-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:6vw;align-items:start}
.method-head{position:sticky;top:calc(var(--header-h) + 3rem)}
.method-head .h-display{margin-bottom:1.6rem}
.steps{position:relative;margin:0;padding:0 0 0 3.2rem;list-style:none}
.steps::before,.steps::after{content:"";position:absolute;left:.6rem;top:.6rem;bottom:.6rem;width:1px;background:var(--line-light)}
.steps::after{background:var(--rasp-btn);transform:scaleY(var(--p,0));transform-origin:top}
.no-anim .steps::after{transform:none}
.step{display:grid;grid-template-columns:5.5rem 1fr;gap:1rem;padding:2.2rem 0;border-bottom:1px solid var(--line-light)}
.step:first-child{padding-top:0}
.step-num{font:italic 400 clamp(2.8rem,4.4vw,4.2rem)/.9 var(--f-serif);color:var(--rasp-btn)}
.step h3{margin-bottom:.5rem;font:720 clamp(1.5rem,2.3vw,2.2rem)/1 var(--f-sans);font-stretch:82%;text-transform:uppercase}
.step p{color:var(--ink-dim)}

/* ── 06 · Domande ───────────────────────────────── */
.faq{padding:clamp(6rem,16vh,11rem) 0;background:var(--plum-900);color:var(--on-dark)}
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:6vw;align-items:start}
.faq-head{position:sticky;top:calc(var(--header-h) + 3rem)}
.faq-list{border-bottom:1px solid var(--line-dark)}
.faq-item{border-top:1px solid var(--line-dark)}
.faq-item summary{display:flex;justify-content:space-between;gap:2rem;padding:1.6rem 0;cursor:pointer;list-style:none;font:600 clamp(1.1rem,1.6vw,1.4rem)/1.3 var(--f-sans)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:#fff}
.faq-item summary i{position:relative;flex:none;width:1.1rem;height:1.1rem;margin-top:.2rem}
.faq-item summary i::before,.faq-item summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:var(--gold);transition:transform .5s var(--ease)}
.faq-item summary i::after{transform:rotate(90deg)}
.faq-item[open] summary i::after{transform:rotate(0)}
.faq-a{overflow:hidden}
.faq-a p{max-width:44rem;padding:0 3rem 1.8rem 0;color:var(--on-dark-dim)}

/* ── 07 · Preventivo ────────────────────────────── */
.quote{padding:clamp(6rem,16vh,11rem) 0;background:var(--ivory)}
.quote-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:5vw;align-items:start}
.quote-intro{position:sticky;top:calc(var(--header-h) + 3rem)}
.quote-intro .h-display{margin-bottom:1.6rem}
.quote-direct{display:grid;gap:.3rem;margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid var(--line-light);font-size:.95rem}
.quote-direct p{color:var(--ink-dim)}
.quote-direct a{width:fit-content;text-underline-offset:.2em}
.wizard{padding:clamp(1.3rem,3vw,2.8rem);border-radius:1.25rem;background:var(--paper);box-shadow:0 2.5rem 6rem rgba(28,20,35,.1),0 0 0 1px var(--line-light)}
.wizard-steps{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 2.4rem;padding:0;list-style:none;border-bottom:1px solid var(--line-light)}
.wizard-steps li{position:relative;display:flex;align-items:center;gap:.6rem;padding-bottom:1rem;color:#9b919d;font-size:.78rem}
.wizard-steps li::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--rasp-btn);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.wizard-steps li.is-active{color:var(--ink)}
.wizard-steps li.is-active::after{transform:none}
.wizard-steps span{font-weight:700;letter-spacing:.08em}
.wz-title{margin-bottom:1.6rem;font:italic 400 clamp(2rem,3.4vw,3.2rem)/1 var(--f-serif);outline:none}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:0 0 1.2rem;padding:0;border:0}
.choice legend{margin-bottom:.6rem;font:600 .7rem/1 var(--f-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim)}
.choice label{position:relative;display:block;padding:1rem 1.1rem;border:1px solid var(--line-light);border-radius:.7rem;cursor:pointer;transition:border-color .25s,background .25s}
.choice label:hover{border-color:rgba(28,20,35,.35)}
.choice label:has(input:checked){border-color:var(--rasp-btn);background:rgba(200,56,106,.06);box-shadow:inset 0 0 0 1px var(--rasp-btn)}
.choice label:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice b{display:block;font-size:.95rem}
.choice small{display:block;margin-top:.2rem;font-size:.78rem;color:var(--ink-dim)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{display:grid;gap:.4rem;align-content:start}
.field--full{grid-column:1/-1}
.field>span{font:600 .7rem/1.2 var(--f-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-dim)}
.field small{font-weight:400;letter-spacing:0;text-transform:none}
.field input,.field select,.field textarea{width:100%;min-height:3.2rem;padding:.8rem .9rem;border:1px solid var(--line-light);border-radius:.55rem;background:#fff;color:var(--ink);font-size:1rem;outline:none;transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:7rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--rasp-btn);box-shadow:0 0 0 3px rgba(200,56,106,.14)}
.check{display:flex;align-items:flex-start;gap:.7rem;margin-top:1.2rem;font-size:.9rem;cursor:pointer}
.check input{width:1.1rem;height:1.1rem;margin-top:.2rem;accent-color:var(--rasp-btn)}
.check a{color:var(--rasp-btn)}
.form-error{min-height:1.4rem;margin-top:.9rem;font-size:.85rem;font-weight:600;color:#a4284f}
.wz-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.7rem;margin-top:.8rem}
.wz-actions--end{justify-content:flex-end}
.wz-actions--start{justify-content:flex-start}
.submit-note{margin-top:1rem;font-size:.8rem;color:var(--ink-dim)}
.calendar{padding:1rem;border:1px solid var(--line-light);border-radius:.8rem;background:#fff}
.calendar-head{display:grid;grid-template-columns:2.6rem 1fr 2.6rem;align-items:center;margin-bottom:.8rem}
.calendar-head p{text-align:center;font-weight:600;text-transform:capitalize}
.calendar-head button{width:2.6rem;height:2.6rem;border:1px solid var(--line-light);border-radius:50%;background:transparent;cursor:pointer}
.calendar-head button:disabled{opacity:.3;cursor:not-allowed}
.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.2rem;text-align:center}
.calendar-weekdays{margin-bottom:.3rem;font:600 .66rem/1.6 var(--f-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim)}
.calendar-grid button,.calendar-grid span{aspect-ratio:1;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;font-size:.88rem}
.calendar-grid button{cursor:pointer}
.calendar-grid button:hover:not(:disabled){background:var(--ivory-2)}
.calendar-grid button.is-today{box-shadow:inset 0 0 0 1px var(--rasp-btn)}
.calendar-grid button[aria-pressed="true"]{background:var(--rasp-btn);color:#fff}
.calendar-grid button:disabled{opacity:.28;cursor:not-allowed}
.picked{display:flex;justify-content:space-between;gap:1rem;margin-top:.8rem;padding:.85rem 1rem;border-radius:.55rem;background:var(--ink);color:var(--paper);font-size:.88rem}
.wz-result{padding:1rem 0}
.wz-result-star{display:grid;place-items:center;width:3.6rem;height:3.6rem;margin-bottom:1.4rem;border-radius:50%;background:var(--rasp-btn);color:#fff;font-size:1.3rem}
.wz-result>p{max-width:34rem;margin-bottom:1.4rem;color:var(--ink-dim)}

/* ── Footer che si svela come un sipario ────────── */
.footer{position:relative;overflow:hidden;padding:clamp(5rem,13vh,9rem) 0 1.6rem;background:var(--plum-950);color:var(--on-dark)}
.curtain .footer-clip{position:relative;height:var(--fh,100svh);clip-path:inset(0)}
.curtain .footer{position:fixed;left:0;right:0;bottom:0}
.footer .wrap{position:relative}
.footer-top{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:clamp(3.5rem,9vh,6rem)}
.footer-claim .caps,.footer-claim .serif{display:block}
.footer-claim .caps{font-size:clamp(3.2rem,9.6vw,10.5rem)}
.footer-claim .serif{margin-left:7vw;font-size:clamp(2.5rem,7vw,7.6rem);color:var(--gold)}
.footer-ribbon{flex:none;width:clamp(12rem,28vw,26rem);overflow:visible}
.ribbon-path{fill:none;stroke:url(#ribbonGrad);stroke-width:9;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.4s var(--ease-io)}
.ribbon-star{fill:var(--gold);transform-box:fill-box;transform-origin:center;transform:scale(0) rotate(-90deg);transition:transform 1s var(--ease) 2s}
.footer.is-drawn .ribbon-path,.no-anim .ribbon-path{stroke-dashoffset:0}
.footer.is-drawn .ribbon-star,.no-anim .ribbon-star{transform:none}
.footer-cols{display:grid;grid-template-columns:1.2fr .8fr auto;gap:2rem;align-items:end;padding-block:2.2rem;border-top:1px solid var(--line-dark)}
.footer-col{display:grid;gap:.35rem;justify-items:start}
.footer-col .eyebrow{margin-bottom:.5rem;color:var(--on-dark-faint)}
.footer-link{font:600 clamp(1.2rem,2vw,1.8rem)/1.25 var(--f-sans);text-decoration:none}
.footer-text{font-size:clamp(1.1rem,1.6vw,1.4rem)}
.footer-col--end{justify-items:end}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 2rem;padding-top:1.4rem;border-top:1px solid var(--line-dark);font-size:.78rem;color:var(--on-dark-faint)}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:1.2rem}
.footer-bottom a{text-decoration:none}
.footer-bottom a:hover{color:var(--on-dark)}

/* ── CTA fissa su mobile ────────────────────────── */
.sticky-cta{display:none}

/* ══ Tablet e mobile ═════════════════════════════ */
@media (max-width:899px){
  :root{--header-h:4.2rem}
  .grain,.hud,.header-cta{display:none}
  .header-logo{width:7.4rem}
  .menu-btn{padding-left:.85rem}
  .menu-inner{grid-template-columns:1fr;align-content:end}
  .hero-content{bottom:4.6rem}
  .hero-shade{background:linear-gradient(0deg,rgba(17,11,22,.94) 0%,rgba(17,11,22,.55) 55%,rgba(17,11,22,.15) 100%)}
  .hero-img{object-position:66% center}
  .scroll-cue{display:none}
  .service{grid-template-columns:1fr;row-gap:1.8rem}
  .service-title,.service-media,.service-body,.service--alt .service-media,.service--alt .service-body{grid-column:1;grid-row:auto}
  .service-title .serif{margin-left:10vw}
  .service--alt .service-title .serif{margin-right:6vw}
  .service-media,.service--alt .service-media{aspect-ratio:4/3}
  .method-grid,.faq-grid,.quote-grid{grid-template-columns:1fr;gap:3rem}
  .method-head,.faq-head,.quote-intro{position:static}
  .footer-top{flex-direction:column;align-items:flex-start}
  .footer-ribbon{width:min(16rem,70vw);align-self:flex-end}
  .footer-cols{grid-template-columns:1fr 1fr}
  .footer-col--end{grid-column:1/-1;justify-items:start}
  .footer{padding-bottom:6.6rem}
  .sticky-cta{position:fixed;z-index:60;left:max(.8rem,env(safe-area-inset-left));right:max(.8rem,env(safe-area-inset-right));bottom:max(.8rem,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;min-height:3.4rem;padding:.8rem 1.3rem;border-radius:99rem;background:var(--rasp-btn);color:#fff;font-weight:600;font-size:.92rem;text-decoration:none;box-shadow:0 1rem 2.5rem rgba(17,11,22,.3);transform:translateY(140%);transition:transform .6s var(--ease)}
  .sticky-cta i{font-style:normal}
  .sticky-cta.is-visible{transform:none}
}
@media (max-width:560px){
  .hero-actions .btn{flex:1 1 100%}
  .hero-actions .btn-ghost{display:none}
  .choice,.fields{grid-template-columns:1fr}
  .field--full{grid-column:1}
  .wizard-steps b{display:none}
  .wz-actions{flex-direction:column-reverse}
  .wz-actions .btn{width:100%}
  .picked{flex-direction:column;gap:.2rem}
  .step{grid-template-columns:3.8rem 1fr}
  .steps{padding-left:2.2rem}
  .footer-cols{grid-template-columns:1fr}
}

/* ══ Movimento ridotto: il sito resta completo, solo fermo ══ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
}
.no-anim .grain,.no-anim .scroll-cue i{animation:none}
