/* ============================================================
   KINETICA — sito multipagina · foglio di stile condiviso
   ============================================================ */
:root{
  --void:#050B12; --void-2:#0A1622; --void-3:#0F1E2E;
  --ink:#0E2438; --ink-60:#4A6076; --ink-40:#7C8FA3;
  --navy:#1B4F8F; --navy-dark:#123C6B;
  --teal:#2E9BB5; --teal-pale:#E4F3F7;
  --orange:#E5872B; --orange-pale:#FDF1E3;
  --paper:#F6F9FB; --white:#fff; --rule:#D9E2EA; --rule-soft:#EAF0F5;
  --glow:rgba(229,135,43,.15); --glow-hi:rgba(229,135,43,.24);
  --display:"Archivo",system-ui,sans-serif;
  --body:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --wrap:1280px; --r:4px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--paper);color:var(--ink);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}   /* proporzioni sempre conservate */
   /* mai deformato */
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;line-height:1.08}
h1{font-weight:300;font-stretch:106%;font-size:clamp(2.1rem,5.2vw,4.4rem)}
h2{font-weight:300;font-stretch:106%;font-size:clamp(1.7rem,3.5vw,2.85rem);letter-spacing:-.024em;line-height:1.12}
h2 b,h1 b{font-weight:600}
h3{font-weight:600;font-stretch:102%;font-size:1.16rem;letter-spacing:-.012em}

.eyebrow{font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  color:var(--teal);display:flex;align-items:center;gap:11px;margin-bottom:22px}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--orange)}
.eyebrow.center{justify-content:center}

/* ---------- pulsanti ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--body);font-weight:500;
  font-size:.95rem;background:var(--navy-dark);color:#fff;padding:15px 30px;border-radius:8px;border:none;cursor:pointer;
  text-decoration:none;box-shadow:0 6px 22px -8px rgba(18,60,107,.5);transition:transform .3s,box-shadow .3s,background .3s;will-change:transform}
.btn:hover{transform:scale(1.02);background:#0E3057;box-shadow:0 8px 28px -8px rgba(18,60,107,.7)}
.btn:active{transform:scale(.99)}
.btn:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.btn--orange{background:var(--orange);box-shadow:0 6px 24px 4px var(--glow)}
.btn--orange:hover{background:#D2761D;box-shadow:0 6px 30px 6px var(--glow-hi)}
.btn svg{width:15px;height:15px}
.btn--ghost{background:transparent;color:var(--navy);box-shadow:none;outline:1.5px solid var(--rule);outline-offset:-1px}
.btn--ghost:hover{background:var(--white);outline-color:var(--navy);box-shadow:none}
.btn--ghost-d{background:transparent;color:#B4C4D3;box-shadow:none;outline:1px solid rgba(255,255,255,.18);outline-offset:-1px}
.btn--ghost-d:hover{background:transparent;color:#fff;outline-color:rgba(255,255,255,.45);box-shadow:none}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:200;background:rgba(246,249,251,.85);backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid var(--rule)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:20px}
.nav-logo img{height:32px;width:auto}
.nav-links{display:flex;align-items:center;gap:6px;list-style:none}
.nav-links a{font-family:var(--body);font-size:.92rem;font-weight:500;color:var(--ink-60);text-decoration:none;
  padding:9px 13px;border-radius:6px;transition:color .2s,background .2s;position:relative}
.nav-links a:hover{color:var(--ink);background:rgba(18,60,107,.05)}
.nav-links a.on{color:var(--navy-dark)}
.nav-links a.on::after{content:"";position:absolute;left:13px;right:13px;bottom:3px;height:2px;background:var(--orange);border-radius:2px}
.nav-cta{display:flex;align-items:center;gap:14px}
.nav-cta .btn{padding:11px 22px;font-size:.88rem}
.burger{display:none;width:42px;height:42px;border:1px solid var(--rule);border-radius:8px;background:var(--white);
  cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .3s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:940px){
  .nav-links,.nav-cta .btn{display:none}
  .burger{display:flex}
  .mob{position:fixed;inset:72px 0 auto 0;z-index:190;background:var(--paper);border-bottom:1px solid var(--rule);
    padding:16px 24px 26px;transform:translateY(-140%);transition:transform .4s cubic-bezier(.3,.8,.3,1);box-shadow:0 24px 40px -24px rgba(14,36,56,.4)}
  .mob.open{transform:none}
  .mob a{display:block;font-family:var(--display);font-weight:500;font-size:1.15rem;color:var(--ink);text-decoration:none;
    padding:14px 4px;border-bottom:1px solid var(--rule-soft)}
  .mob a.on{color:var(--navy-dark)}
  .mob .btn{width:100%;margin-top:18px}
}
@media(min-width:941px){.mob{display:none}}

/* ---------- HERO ---------- */
.hero{position:relative;overflow:hidden;background:var(--void);color:#fff}
canvas.rib{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}
.hero-vig{position:absolute;inset:0;z-index:1;pointer-events:none}
.grain{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero-inner{position:relative;z-index:10}

/* home hero */
.hero-home{min-height:calc(100svh - 72px);display:flex;align-items:center}
.hero-home .hero-vig{background:radial-gradient(58% 50% at 50% 50%,rgba(5,11,18,.55) 0%,transparent 70%),
  radial-gradient(120% 80% at 50% 40%,transparent 30%,rgba(5,11,18,.8) 100%),
  linear-gradient(180deg,rgba(5,11,18,.6),transparent 30%,transparent 60%,var(--void))}
.hero-home .hero-inner{padding:70px 0 80px;text-align:center;max-width:940px;margin:0 auto}
.hero-home h1{margin-top:6px}
.h-grad{background:linear-gradient(90deg,#5C7086,#EAF1F7 50%,#5C7086);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  display:inline-block;animation:sheen 9s 1s ease-in-out infinite}
@keyframes sheen{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.hero-sub{font-size:clamp(1rem,2.2vw,1.2rem);color:#C2D2E0;max-width:40rem;margin:26px auto 0;line-height:1.55}
.hero-cta{margin-top:34px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero-fine{margin-top:28px;font-family:var(--mono);font-size:.72rem;color:#8DA2B6;letter-spacing:.02em;line-height:1.8}

/* inner page hero */
.hero-page .hero-vig{background:radial-gradient(70% 90% at 78% 10%,rgba(46,155,181,.16),transparent 60%),
  linear-gradient(180deg,rgba(5,11,18,.5),transparent 40%,var(--void))}
.hero-page .hero-inner{padding:64px 0 58px}
.hero-page .crumb{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#7E93A8;margin-bottom:18px}
.hero-page .crumb a{color:var(--teal);text-decoration:none}
.hero-page h1{font-size:clamp(2rem,4.6vw,3.6rem)}
.hero-page p{color:#B6C7D8;font-size:1.08rem;max-width:56ch;margin-top:20px;line-height:1.6}

/* ---------- SEZIONI ---------- */
.sec{padding:96px 0;border-bottom:1px solid var(--rule)}
@media(max-width:720px){.sec{padding:60px 0}}
.sec.dark{background:var(--void);color:#fff;border-bottom:none;position:relative;overflow:hidden}
.sec.dark h2{color:#fff}
.sec.dark .eyebrow{color:var(--teal)}
.sec-head{max-width:62ch;margin-bottom:52px}
.sec-head.center{margin:0 auto 52px;text-align:center}
.sec-head p{color:var(--ink-60);margin-top:18px;font-size:1.06rem}
.sec.dark .sec-head p{color:#9DB0C2}
.lead{font-size:1.14rem;line-height:1.7;color:var(--ink-60);max-width:64ch}
.sec.dark .lead{color:#B6C7D8}
.prose{max-width:70ch}
.prose p{margin:16px 0;color:var(--ink-60);line-height:1.75}
.prose p b{color:var(--ink)}
.sec.dark .prose p{color:#AFC2D3}.sec.dark .prose p b{color:#fff}

/* ---------- griglie generiche ---------- */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.g2.wide-l{grid-template-columns:1.1fr .9fr}
@media(max-width:900px){.g2,.g2.wide-l{grid-template-columns:1fr;gap:40px}}

/* ---------- trust strip ---------- */
.trust{background:var(--void);color:#fff;padding:26px 0;position:relative;z-index:2}
.trust .wrap{display:flex;flex-wrap:wrap;gap:14px 40px;justify-content:space-between}
.trust-i{font-family:var(--mono);font-size:.74rem;display:flex;align-items:center;gap:10px;color:#A0B4C6}
.trust-i b{color:#E4EDF5;font-weight:400}
.tick{width:14px;height:14px;flex:none;color:var(--teal)}

/* ---------- card ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:900px){.cards{grid-template-columns:1fr}}
.card{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);padding:32px;text-decoration:none;color:inherit;
  display:block;transition:border-color .25s,transform .25s,box-shadow .25s}
.card:hover{border-color:var(--teal);transform:translateY(-3px);box-shadow:0 20px 40px -28px rgba(14,36,56,.4)}
.card-k{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--orange);margin-bottom:16px}
.card h3{margin-bottom:11px}
.card p{font-size:.92rem;color:var(--ink-60);line-height:1.6}
.card-go{margin-top:18px;font-family:var(--mono);font-size:.78rem;color:var(--navy);display:inline-flex;align-items:center;gap:7px}
.card:hover .card-go{gap:11px}
.card-go svg{width:13px;height:13px;transition:transform .25s}

/* ---------- steps / procedura ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--rule);background:var(--white);border-radius:var(--r);overflow:hidden}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{padding:32px 26px;border-right:1px solid var(--rule)}
.step:last-child{border-right:none}
@media(max-width:900px){.step{border-bottom:1px solid var(--rule)}.step:nth-child(2n){border-right:none}}
@media(max-width:560px){.step{border-right:none}}
.step-n{font-family:var(--mono);font-size:.66rem;color:#fff;background:var(--navy-dark);width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.step h3{font-size:1rem;margin-bottom:10px}
.step p{font-size:.87rem;color:var(--ink-60);line-height:1.6}
.step code{font-family:var(--mono);font-size:.76rem;color:var(--navy);background:var(--teal-pale);padding:1px 5px;border-radius:2px}

/* procedura verticale (timeline) */
.flow{position:relative;max-width:820px;margin:0 auto}
.flow::before{content:"";position:absolute;left:23px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(var(--orange),var(--teal),var(--navy));border-radius:2px}
@media(max-width:560px){.flow::before{left:19px}}
.fl{position:relative;padding:0 0 44px 74px}
.fl:last-child{padding-bottom:0}
@media(max-width:560px){.fl{padding-left:60px}}
.fl-dot{position:absolute;left:0;top:0;width:48px;height:48px;border-radius:50%;background:var(--void);color:#fff;
  font-family:var(--display);font-weight:600;font-size:1.05rem;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--teal);z-index:1}
@media(max-width:560px){.fl-dot{width:40px;height:40px;font-size:.95rem}}
.fl-k{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin-bottom:8px}
.fl h3{margin-bottom:12px}
.fl p{color:var(--ink-60);font-size:.96rem;line-height:1.7;max-width:60ch}
.fl p+p{margin-top:12px}
.fl code{font-family:var(--mono);font-size:.82rem;color:var(--navy);background:var(--teal-pale);padding:2px 6px;border-radius:3px}
.fl-split{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
@media(max-width:620px){.fl-split{grid-template-columns:1fr}}
.fl-branch{background:var(--paper);border:1px solid var(--rule);border-radius:var(--r);padding:20px}
.fl-branch h4{font-family:var(--display);font-weight:600;font-size:.95rem;margin-bottom:8px;color:var(--ink)}
.fl-branch p{font-size:.86rem;margin:0}

/* requisiti (3 col) */
.req{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:820px){.req{grid-template-columns:1fr}}
.rq{border:1px solid var(--rule);border-top:3px solid var(--teal);border-radius:var(--r);padding:28px;background:var(--white)}
.rq-n{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:12px}
.rq h3{margin-bottom:10px}
.rq p{font-size:.9rem;color:var(--ink-60);line-height:1.65}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);overflow:hidden}
@media(max-width:760px){.stats{grid-template-columns:1fr 1fr}}
.stat{background:var(--void);padding:32px 26px}
.stat-v{font-family:var(--display);font-weight:200;font-size:clamp(2.2rem,4.4vw,3.1rem);letter-spacing:-.04em;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.stat-v em{font-style:normal;font-size:.4em;font-weight:400;color:var(--orange);margin-left:4px;letter-spacing:0}
.stat-k{font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;color:var(--teal);margin-top:12px}
.stat-s{font-size:.78rem;color:#8296A9;margin-top:7px;line-height:1.5}

/* ---------- cedolino ---------- */
.slip{border:1px solid var(--rule);border-top:3px solid var(--navy-dark);border-radius:var(--r);
  box-shadow:0 24px 60px -34px rgba(14,36,56,.4);font-family:var(--mono);overflow:hidden;background:var(--white);transition:box-shadow .8s}
.slip.lit{box-shadow:0 30px 70px -34px rgba(14,36,56,.5),0 0 0 1px rgba(46,155,181,.28)}
.slip-head{padding:15px 22px;border-bottom:1px dashed var(--rule);display:flex;justify-content:space-between;align-items:baseline;gap:12px;background:var(--paper)}
.slip-head span{font-size:.61rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-40)}
.slip-body{padding:6px 22px 22px}
.slip-top{padding:18px 0 14px;border-bottom:1px solid var(--ink)}
.slip-top-l{font-size:.61rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-60);margin-bottom:8px}
.slip-top-v{font-family:var(--display);font-weight:300;font-size:clamp(1.9rem,4vw,2.6rem);letter-spacing:-.035em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.slip-top-v small{font-size:.4em;font-weight:400;color:var(--ink-40);letter-spacing:0;margin-left:7px}
.slip-hl{font-size:.59rem;letter-spacing:.16em;text-transform:uppercase;color:var(--orange);padding:16px 0 8px;font-weight:600}
.srow{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:7px 0;font-size:.79rem;border-bottom:1px dotted var(--rule-soft);opacity:0;transform:translateY(-6px)}
.srow.in{animation:drop .42s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes drop{to{opacity:1;transform:none}}
.srow .n{color:var(--ink-60)} .srow .v{color:var(--orange);font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.slip-tot{margin-top:16px;padding-top:18px;border-top:1px solid var(--ink);display:flex;justify-content:space-between;align-items:flex-end;gap:14px;opacity:0}
.slip-tot.in{animation:drop .5s .1s cubic-bezier(.2,.7,.3,1) forwards}
.slip-tot-l{font-size:.61rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink);font-weight:600;max-width:11ch;line-height:1.35}
.slip-tot-v{font-family:var(--display);font-weight:400;font-size:clamp(2rem,4.2vw,2.8rem);letter-spacing:-.035em;line-height:.9;color:var(--navy-dark);font-variant-numeric:tabular-nums;text-align:right}
.slip-foot{background:var(--paper);border-top:1px solid var(--rule);padding:12px 22px;font-size:.61rem;color:var(--ink-40);line-height:1.6}

/* ---------- costi ---------- */
.costs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--rule);background:var(--white);border-radius:var(--r);overflow:hidden}
@media(max-width:820px){.costs{grid-template-columns:1fr}}
.cc{padding:36px}
.cc+.cc{border-left:1px solid var(--rule)}
@media(max-width:820px){.cc+.cc{border-left:none;border-top:1px solid var(--rule)}}
.cc-tag{font-family:var(--mono);font-size:.61rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:8px;display:block}
.cc--d .cc-tag{color:var(--ink-40)} .cc--i .cc-tag{color:var(--orange)}
.cc ul{list-style:none;margin-top:20px}
.cc li{font-family:var(--mono);font-size:.82rem;padding:9px 0;border-bottom:1px dotted var(--rule-soft);color:var(--ink-60);display:flex;gap:12px;opacity:0;transform:translateX(-8px);transition:opacity .5s,transform .5s}
.cc li.in{opacity:1;transform:none}
.cc li::before{content:"+";color:var(--orange);flex:none}
.cc--d li::before{color:var(--ink-40)}
.cc-note{margin-top:24px;font-size:.89rem;color:var(--ink-60);line-height:1.65}
.cc-note b{color:var(--ink)}

/* ---------- calcolatore ---------- */
.calc{background:var(--white);border:1px solid var(--rule);border-top:3px solid var(--orange);border-radius:var(--r);display:grid;grid-template-columns:1fr 1.05fr;box-shadow:0 24px 60px -36px rgba(14,36,56,.36)}
@media(max-width:860px){.calc{grid-template-columns:1fr}}
.calc-in{padding:40px;border-right:1px solid var(--rule)}
@media(max-width:860px){.calc-in{border-right:none;border-bottom:1px solid var(--rule)}}
.calc-out{padding:40px;background:var(--paper)}
.fld{margin-bottom:28px}
.fld label{display:block;font-family:var(--mono);font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60);margin-bottom:10px}
.fld-row{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.fld-v{font-family:var(--display);font-weight:300;font-size:2rem;color:var(--navy-dark);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.fld-u{font-family:var(--mono);font-size:.73rem;color:var(--ink-40)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:2px;background:var(--rule);border-radius:2px;outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--orange);cursor:pointer;border:3px solid var(--white);box-shadow:0 0 0 1px var(--orange),0 3px 10px rgba(229,135,43,.4);transition:transform .15s}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12)}
input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--orange);cursor:pointer;border:3px solid var(--white)}
input[type=range]:focus-visible{outline:2px solid var(--navy);outline-offset:6px}
.o-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:13px 0;border-bottom:1px dotted var(--rule)}
.o-l{font-family:var(--mono);font-size:.72rem;color:var(--ink-60);line-height:1.45}
.o-v{font-family:var(--mono);font-size:.97rem;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.o-hero{margin-top:24px;padding-top:22px;border-top:1px solid var(--ink)}
.o-hero-l{font-family:var(--mono);font-size:.61rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:600}
.o-hero-v{font-family:var(--display);font-weight:300;font-size:clamp(1.7rem,3.4vw,2.3rem);color:var(--navy-dark);letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1.15;margin-top:6px}
.o-hero-s{font-family:var(--mono);font-size:.69rem;color:var(--ink-40);margin-top:9px;line-height:1.6}
.calc-disc{margin-top:24px;padding:16px 18px;background:var(--teal-pale);border-radius:var(--r);font-size:.79rem;color:var(--ink-60);line-height:1.6;border-left:2px solid var(--teal)}
.calc-disc b{color:var(--ink)}

/* ---------- servizio block ---------- */
.svc{padding:52px 0;border-bottom:1px solid var(--rule)}
.svc:last-child{border-bottom:none}
.svc-grid{display:grid;grid-template-columns:.34fr .66fr;gap:44px;align-items:start}
@media(max-width:820px){.svc-grid{grid-template-columns:1fr;gap:24px}}
.svc-tag{font-family:var(--mono);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:var(--orange);margin-bottom:14px}
.svc h2{font-size:clamp(1.5rem,3vw,2.2rem)}
.svc p{color:var(--ink-60);line-height:1.75;margin:14px 0}
.svc p b{color:var(--ink)}
.svc ul{list-style:none;margin-top:18px}
.svc ul li{padding:10px 0;border-bottom:1px dotted var(--rule-soft);color:var(--ink-60);display:flex;gap:12px;font-size:.94rem}
.svc ul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);flex:none;margin-top:9px}

/* ---------- settori ---------- */
.sect-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:820px){.sect-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.sect-grid{grid-template-columns:1fr}}
.sect{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);padding:26px;transition:border-color .25s,transform .25s}
.sect:hover{border-color:var(--teal);transform:translateY(-3px)}
.sect-ic{width:38px;height:38px;margin-bottom:16px;color:var(--navy)}
.sect h3{font-size:1.02rem;margin-bottom:8px}
.sect p{font-size:.86rem;color:var(--ink-60);line-height:1.6}

/* ---------- "niente cambia" band ---------- */
.nc-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);overflow:hidden}
@media(max-width:800px){.nc-list{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.nc-list{grid-template-columns:1fr}}
.nc-i{background:var(--void);padding:26px 24px}
.nc-k{font-family:var(--mono);font-size:.61rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:9px}
.nc-v{font-family:var(--display);font-weight:400;font-stretch:104%;font-size:1.06rem;color:#fff;letter-spacing:-.01em}

/* ---------- verify / documenti ---------- */
.ver-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:900px){.ver-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.ver-grid{grid-template-columns:1fr}}
.ver{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);padding:28px;transition:border-color .25s,transform .25s}
.ver:hover{border-color:var(--teal);transform:translateY(-2px)}
.ver-k{font-family:var(--mono);font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:12px}
.ver h3{font-size:1rem;margin-bottom:9px}
.ver p{font-size:.88rem;color:var(--ink-60);line-height:1.65}
.ver code{font-family:var(--mono);font-size:.77rem;color:var(--navy)}

/* ---------- pannello immagine con fallback branding ---------- */
.shot{position:relative;border-radius:var(--r);overflow:hidden;background:var(--void);aspect-ratio:4/3;isolation:isolate;border:1px solid var(--rule)}
.shot--tall{aspect-ratio:3/4}
.shot--wide{aspect-ratio:16/9}
.shot canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.6;z-index:0}
.shot::after{content:"";position:absolute;inset:0;z-index:1;
  background:radial-gradient(120% 90% at 20% 15%,rgba(46,155,181,.22),transparent 55%),
             radial-gradient(120% 90% at 90% 95%,rgba(229,135,43,.16),transparent 55%),
             linear-gradient(150deg,rgba(5,11,18,.2),rgba(5,11,18,.55))}
.shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;
  mix-blend-mode:luminosity;opacity:.9;transition:opacity .5s,transform 6s ease-out}
.shot:hover img{transform:scale(1.05)}
.shot.empty img{display:none}
.shot-badge{position:absolute;left:16px;bottom:14px;z-index:4;font-family:var(--mono);font-size:.6rem;letter-spacing:.13em;
  text-transform:uppercase;color:#C2D2E0;background:rgba(9,18,28,.6);border:1px solid rgba(255,255,255,.14);
  border-radius:20px;padding:6px 13px;backdrop-filter:blur(4px)}
.shot-k{position:absolute;right:16px;top:14px;z-index:4;width:30px;height:30px;opacity:.7}

/* ---------- CTA band ---------- */
.cta-band{background:var(--void);color:#fff;border-bottom:none;position:relative;overflow:hidden;text-align:center}
.cta-band .hero-vig{background:radial-gradient(60% 80% at 50% 50%,rgba(46,155,181,.14),transparent 60%)}
.cta-band h2{color:#fff}
.cta-band p{color:#AFC2D3;max-width:52ch;margin:18px auto 0;font-size:1.06rem}
.cta-band .hero-cta{justify-content:center}

/* ---------- FAQ ---------- */
details{border-bottom:1px solid var(--rule);background:var(--white)}
details:first-of-type{border-top:1px solid var(--rule)}
summary{padding:22px 4px;cursor:pointer;list-style:none;font-family:var(--display);font-weight:500;font-stretch:102%;font-size:1.02rem;
  letter-spacing:-.012em;display:flex;justify-content:space-between;align-items:center;gap:20px}
summary::-webkit-details-marker{display:none}
summary::after{content:"";flex:none;width:10px;height:10px;border-right:1.5px solid var(--orange);border-bottom:1.5px solid var(--orange);transform:rotate(45deg) translate(-2px,-2px);transition:transform .25s}
details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.faq-a{padding:0 4px 22px;max-width:80ch}
.faq-a p{color:var(--ink-60);font-size:.93rem;line-height:1.7;margin-top:6px}

/* ---------- form ---------- */
.form-grid{display:grid;grid-template-columns:.85fr 1fr;gap:60px;align-items:start}
@media(max-width:880px){.form-grid{grid-template-columns:1fr;gap:40px}}
.promise{list-style:none;margin-top:6px}
.promise li{font-family:var(--mono);font-size:.83rem;padding:12px 0;border-bottom:1px dotted var(--rule);display:flex;gap:12px;align-items:center;color:var(--ink)}
.promise li::before{content:"";width:5px;height:5px;background:var(--orange);border-radius:50%;flex:none}
.promise li b{color:var(--navy-dark);font-weight:600}
.form-card{background:var(--paper);border:1px solid var(--rule);border-top:3px solid var(--teal);border-radius:var(--r);padding:36px}
.f{margin-bottom:18px}
.f label{display:block;font-family:var(--mono);font-size:.63rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-60);margin-bottom:8px}
.f input,.f select,.f textarea{width:100%;padding:13px 15px;border:1px solid var(--rule);border-radius:6px;font-family:var(--body);font-size:.96rem;background:var(--white);color:var(--ink);transition:border-color .2s,box-shadow .2s}
.f textarea{resize:vertical;min-height:96px}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-pale)}
.f-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:480px){.f-two{grid-template-columns:1fr}}
.consent{display:flex;gap:11px;align-items:flex-start;margin:22px 0;font-size:.78rem;color:var(--ink-60);line-height:1.55}
.consent input{margin-top:3px;flex:none;accent-color:var(--teal);width:16px;height:16px}
.form-card .btn{width:100%}
.form-fine{font-family:var(--mono);font-size:.64rem;color:var(--ink-40);margin-top:16px;text-align:center;line-height:1.6}
.hp{position:absolute;left:-9999px}
.contact-info{list-style:none;margin-top:30px}
.contact-info li{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--rule)}
.contact-info a{color:var(--navy);text-decoration:none;font-weight:500}
.contact-info a:hover{text-decoration:underline}
.ci-ic{width:20px;height:20px;color:var(--teal);flex:none}

/* ---------- footer ---------- */
.foot{background:var(--void);color:#93A7BA;padding:0 0 28px;font-size:.88rem;position:relative;overflow:hidden}
.foot::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--navy) 18%,var(--teal) 50%,var(--orange) 82%,transparent)}
.foot canvas.rib{opacity:.16}

/* fascia di richiamo dentro il footer */
.foot-cta{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:32px;
  flex-wrap:wrap;padding:44px 0 40px;border-bottom:1px solid rgba(255,255,255,.09)}
.foot-cta h3{font-family:var(--display);font-weight:300;font-stretch:106%;font-size:clamp(1.3rem,2.2vw,1.9rem);
  color:#fff;letter-spacing:-.022em;line-height:1.2}
.foot-cta h3 b{font-weight:600}
.foot-cta p{color:#8FA4B8;font-size:.9rem;margin-top:8px;max-width:46ch}

.foot-top{position:relative;z-index:2;display:grid;grid-template-columns:1.6fr .7fr .7fr 1.1fr;gap:48px;
  padding:52px 0 44px;border-bottom:1px solid rgba(255,255,255,.09)}
@media(max-width:1000px){.foot-top{grid-template-columns:1fr 1fr;gap:36px 32px}}
@media(max-width:600px){.foot-top{grid-template-columns:1fr;gap:32px}}
.foot .logo{height:36px;width:auto;margin-bottom:20px}
.foot-brand p{max-width:38ch;color:#8FA4B8;font-size:.88rem;line-height:1.75}
.foot-col h4{font-family:var(--mono);font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;
  color:#6E8399;margin-bottom:18px}
.foot-col a{display:block;color:#B4C6D6;text-decoration:none;padding:7px 0;font-size:.9rem;
  transition:color .2s,padding-left .2s;position:relative}
.foot-col a:hover{color:#fff;padding-left:8px}
.foot-col a::before{content:"";position:absolute;left:0;top:50%;width:3px;height:3px;border-radius:50%;
  background:var(--orange);opacity:0;transform:translateY(-50%);transition:opacity .2s}
.foot-col a:hover::before{opacity:1}

/* contatti con icona */
.foot-contact a{display:flex;align-items:center;gap:11px;padding:9px 0;color:#B4C6D6;text-decoration:none;font-size:.9rem;transition:color .2s}
.foot-contact a:hover{color:#fff;padding-left:0}
.foot-contact a::before{display:none}
.foot-contact svg{width:16px;height:16px;flex:none;color:var(--teal)}
.foot-badge{margin-top:20px;display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);
  font-size:.62rem;letter-spacing:.11em;text-transform:uppercase;color:#8FA4B8;
  border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:8px 14px}
.foot-badge i{width:6px;height:6px;border-radius:50%;background:var(--teal);flex:none}

/* note legali su due colonne */
.foot-legal{position:relative;z-index:2;padding:32px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:16px 48px;
  font-size:.72rem;line-height:1.8;color:#63788D}
@media(max-width:820px){.foot-legal{grid-template-columns:1fr}}
.foot-bottom{position:relative;z-index:2;margin-top:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.07);
  display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  font-size:.75rem;color:#63788D}
.foot-bottom nav{display:flex;gap:22px;flex-wrap:wrap}
.foot-bottom a{color:#8FA4B8;text-decoration:none}
.foot-bottom a:hover{color:#fff;text-decoration:underline}

/* ---------- reveal / tilt ---------- */
.rv{opacity:1;transform:none}
.js .rv{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.25,1),transform .8s cubic-bezier(.2,.7,.25,1)}
.js .rv.in{opacity:1;transform:none}
/* rete di sicurezza: se per qualsiasi motivo il reveal non parte, il contenuto torna visibile */
html.reveal-all .rv{opacity:1!important;transform:none!important}
.rv-d1{transition-delay:.08s}.rv-d2{transition-delay:.16s}.rv-d3{transition-delay:.24s}.rv-d4{transition-delay:.32s}.rv-d5{transition-delay:.4s}.rv-d6{transition-delay:.48s}
.tilt{transition:transform .4s cubic-bezier(.2,.7,.25,1),border-color .25s,box-shadow .25s}
.tilt:hover{transition:transform .1s linear,border-color .25s}
.progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:300;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--navy),var(--teal),var(--orange))}
.spot{position:relative;isolation:isolate}
.spot::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .4s;border-radius:inherit;background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(46,155,181,.1),transparent 65%)}
.spot:hover::before{opacity:1}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.tilt{transform:none!important}.progress,.grain{display:none}.cc li{opacity:1;transform:none}}

/* ============================================================
   DESKTOP: su schermi larghi il sito respira invece di allungarsi
   ============================================================ */
@media(min-width:1100px){
  body{font-size:17.5px}
  .sec{padding:112px 0}
  .sec-head{max-width:74ch;margin-bottom:60px}
  .g2{gap:72px}
  .g2.wide-l{grid-template-columns:1.15fr .85fr}
  .cards{gap:24px}
  .card{padding:36px}
  .step{padding:38px 30px}
  .lead{font-size:1.2rem}
  .hero-home .hero-inner{max-width:1060px}
  .hero-page .hero-inner{padding:88px 0 76px}
  .hero-page p{font-size:1.14rem;max-width:62ch}
  .flow{max-width:940px}
  .fl{padding-left:88px;padding-bottom:52px}
  .svc-grid{grid-template-columns:.32fr .68fr;gap:56px}
  .calc-in,.calc-out{padding:48px}
  .form-grid{gap:80px}
  .ver{padding:32px}
  .prose p{font-size:1.02rem}
}
@media(min-width:1500px){
  :root{--wrap:1380px}
  .sec{padding:128px 0}
  .sect-grid{grid-template-columns:repeat(3,1fr);gap:22px}
  .hero-home .hero-inner{max-width:1140px}
}
/* i settori usano meglio lo spazio su schermi medi e larghi */
@media(min-width:1100px){ .sect-grid{grid-template-columns:repeat(3,1fr)} .sect{padding:32px} }

/* ============================================================
   FX — livello effetti speciali (v5)
   Ogni effetto e' additivo: se il JS non parte, la pagina resta
   identica a prima. Tutto si spegne con prefers-reduced-motion.
   ============================================================ */

/* ---------- 1. foto nell'hero: duotone + ken burns + parallasse ---------- */
.hero-photo{position:absolute;inset:-8% -3%;z-index:0;overflow:hidden;pointer-events:none;
  transform:translate3d(var(--px,0px),var(--py,0px),0);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.hero-photo img{width:100%;height:100%;object-fit:cover;opacity:.62;
  filter:grayscale(1) contrast(1.12) brightness(.9);mix-blend-mode:luminosity;
  transform:scale(1.06);animation:kb 30s ease-in-out infinite alternate;will-change:transform}
.hero-photo::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(78% 62% at 24% 26%,rgba(46,155,181,.34),transparent 62%),
    radial-gradient(62% 58% at 84% 82%,rgba(229,135,43,.24),transparent 62%),
    linear-gradient(180deg,rgba(5,11,18,.5),rgba(5,11,18,.66) 46%,var(--void))}
.hero-page .hero-photo img{opacity:.44}
@keyframes kb{from{transform:scale(1.05) translate3d(0,0,0)}to{transform:scale(1.17) translate3d(-1.6%,-1.8%,0)}}

/* velo cinematografico in basso: la sezione dopo "sale" sull'hero */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;z-index:4;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(5,11,18,.85))}

/* parallasse verticale del contenuto hero, guidata dallo scroll */
.hero-inner{will-change:transform}
.js .hero-home .hero-inner{transform:translate3d(0,var(--sy,0px),0);opacity:var(--so,1)}

/* ---------- 2. rivelazione parola per parola dei titoli ---------- */
.wr .w{display:inline-block}
.wr .w>i{display:inline-block;font-style:inherit;font-weight:inherit;
  transform:translateY(.36em);opacity:0;filter:blur(7px);
  transition:transform .9s cubic-bezier(.16,.84,.24,1),opacity .65s ease,filter .65s ease;
  will-change:transform,opacity,filter}
.wr.in .w>i{transform:none;opacity:1;filter:none}
.reveal-all .wr .w>i{transform:none!important;opacity:1!important;filter:none!important}
/* il titolo con gradiente va rivelato in blocco: il clip del testo non sopporta lo split */
.wr .h-grad .w>i{filter:none}

/* ---------- 3. sheen: lama di luce che attraversa la card ---------- */
.sheen{position:relative;overflow:hidden}
.sheen::before{content:"";position:absolute;top:-30%;left:-70%;width:42%;height:160%;z-index:4;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-16deg);opacity:0}
.sheen:hover::before{animation:fxSheen .9s cubic-bezier(.3,.7,.3,1)}
.sec.dark .sheen::before,.cta-band .sheen::before{background:linear-gradient(100deg,transparent,rgba(111,197,214,.22),transparent)}
@keyframes fxSheen{0%{left:-70%;opacity:0}18%{opacity:1}100%{left:130%;opacity:0}}

/* ---------- 4. rail: linea che si riempie con lo scroll ---------- */
.rail{position:relative;height:2px;background:var(--rule-soft);border-radius:2px;margin-bottom:26px;overflow:hidden}
.rail::after{content:"";position:absolute;inset:0;transform-origin:left;transform:scaleX(var(--p,0));
  background:linear-gradient(90deg,var(--navy),var(--teal) 55%,var(--orange));
  box-shadow:0 0 14px rgba(229,135,43,.45);transition:transform .12s linear}
.sec.dark .rail{background:rgba(255,255,255,.12)}

/* ---------- 5. aurora: masse di colore sfocate dietro le sezioni chiare ---------- */
.sec{position:relative}
.sec>.wrap{position:relative;z-index:5}
.aurora{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.aurora i{position:absolute;display:block;border-radius:50%;filter:blur(80px);opacity:.32;will-change:transform}
.aurora i:nth-child(1){width:46vw;height:46vw;left:-12vw;top:-14vw;background:rgba(46,155,181,.30);animation:au1 26s ease-in-out infinite alternate}
.aurora i:nth-child(2){width:38vw;height:38vw;right:-10vw;bottom:-16vw;background:rgba(229,135,43,.22);animation:au2 32s ease-in-out infinite alternate}
.aurora i:nth-child(3){width:30vw;height:30vw;left:52%;top:30%;background:rgba(27,79,143,.18);animation:au1 38s ease-in-out infinite alternate-reverse}
@keyframes au1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(6vw,4vw,0) scale(1.18)}}
@keyframes au2{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-7vw,-3vw,0) scale(.9)}}

/* ---------- 6. nastro scorrevole ---------- */
.mq{position:relative;overflow:hidden;background:var(--void-2);border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);padding:16px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.mq-t{display:flex;width:max-content;animation:mq 46s linear infinite}
.mq:hover .mq-t{animation-play-state:paused}
.mq-t span{font-family:var(--mono);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;
  color:#8FA6BA;padding:0 30px;display:inline-flex;align-items:center;gap:30px;white-space:nowrap}
.mq-t span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange);opacity:.8;flex:none}
@keyframes mq{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* ---------- 7. cursore: anello che insegue ---------- */
.cur{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;width:30px;height:30px;border-radius:50%;
  border:1px solid rgba(229,135,43,.5);transform:translate3d(-100px,-100px,0) translate(-50%,-50%);
  transition:width .3s cubic-bezier(.2,.8,.2,1),height .3s cubic-bezier(.2,.8,.2,1),
             background .3s,border-color .3s,opacity .3s;opacity:0}
.cur.on{opacity:1}
.cur.hot{width:58px;height:58px;background:rgba(229,135,43,.12);border-color:rgba(229,135,43,.85)}
.cur-d{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;width:5px;height:5px;border-radius:50%;
  background:var(--orange);transform:translate3d(-100px,-100px,0) translate(-50%,-50%);opacity:0;transition:opacity .3s}
.cur-d.on{opacity:.9}
@media(hover:none),(max-width:940px){.cur,.cur-d{display:none}}

/* ---------- 8. immagini: sipario + parallasse interna ---------- */
.shot .curtain{position:absolute;inset:0;z-index:6;background:var(--void);transform-origin:100% 50%;
  transform:scaleX(1);transition:transform 1.05s cubic-bezier(.76,0,.18,1)}
.shot.seen .curtain{transform:scaleX(0)}
.js .shot:not(.seen) img{transform:scale(1.12)}
.shot.seen img{transform:scale(1.02);transition:transform 1.6s cubic-bezier(.2,.8,.2,1),opacity .5s}
.shot.seen:hover img{transform:scale(1.09)}
.shot .scan{position:absolute;left:0;right:0;top:0;height:2px;z-index:7;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent,var(--teal),transparent);box-shadow:0 0 22px rgba(46,155,181,.8)}
.shot.seen .scan{animation:scan 1.5s cubic-bezier(.4,0,.3,1) .15s}
@keyframes scan{0%{top:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:100%;opacity:0}}

/* ---------- 9. bande fotografiche a tutta larghezza ---------- */
.band{position:relative;overflow:hidden;background:var(--void);color:#fff;isolation:isolate}
.band-bg{position:absolute;inset:-10% 0;z-index:0;pointer-events:none}
.band-bg img{width:100%;height:100%;object-fit:cover;opacity:.34;filter:grayscale(1) contrast(1.1);
  mix-blend-mode:luminosity;transform:translate3d(0,var(--pv,0px),0) scale(1.14);will-change:transform}
.band-bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(70% 70% at 22% 30%,rgba(46,155,181,.3),transparent 62%),
             radial-gradient(60% 60% at 86% 76%,rgba(229,135,43,.2),transparent 62%),
             linear-gradient(90deg,rgba(5,11,18,.9),rgba(5,11,18,.6) 60%,rgba(5,11,18,.86))}
.band .wrap{position:relative;z-index:5}
.band h2{color:#fff}
.band p{color:#B6C7D8}
.band .eyebrow{color:var(--teal)}
.band-quote{max-width:60ch}
.band-quote h2{font-size:clamp(1.5rem,3.2vw,2.4rem);line-height:1.18}
.band-quote p{margin-top:20px;font-size:1.04rem;line-height:1.7}

/* ---------- 10. bordo luminoso reattivo sulle card ---------- */
.glow{position:relative}
.glow::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:5;opacity:0;
  transition:opacity .3s;
  background:radial-gradient(160px 160px at var(--mx,50%) var(--my,50%),rgba(229,135,43,.5),transparent 70%);
  -webkit-mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
          mask:linear-gradient(#000,#000) content-box,linear-gradient(#000,#000);
  -webkit-mask-composite:xor;mask-composite:exclude;padding:1px}
.glow:hover::after{opacity:1}

/* ---------- 11. FAQ / obiezioni ---------- */
.faq{border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule);background:var(--white);transition:background .25s}
.faq details[open]{background:var(--paper)}
.faq summary{padding:24px 22px;font-size:1.04rem;transition:color .2s;justify-content:flex-start;gap:0;align-items:flex-start}
.faq summary::after{margin-left:auto;margin-top:.42em;flex:none}
.faq summary>span{flex:1}
.faq summary:hover{color:var(--navy-dark)}
.faq summary::before{content:attr(data-n);font-family:var(--mono);font-size:.68rem;color:var(--orange);
  margin-right:18px;margin-top:.36em;letter-spacing:.1em;flex:none;width:20px}
.faq .faq-a{padding:0 44px 26px 60px;max-width:86ch}
.faq .faq-a p{color:var(--ink-60);font-size:.95rem;line-height:1.75}
.faq .faq-a p+p{margin-top:12px}
.faq .faq-a b{color:var(--ink)}
.faq details[open] .faq-a{animation:faqIn .45s cubic-bezier(.2,.8,.2,1)}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:640px){.faq summary{padding:20px 14px;font-size:.98rem}.faq .faq-a{padding:0 14px 22px 14px}}

/* ---------- 12. referenti (operativita') ---------- */
.ops{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
@media(max-width:820px){.ops{grid-template-columns:1fr}}
.op{background:var(--white);border:1px solid var(--rule);border-radius:var(--r);padding:26px;
  transition:border-color .25s,transform .25s,box-shadow .25s}
.op:hover{border-color:var(--teal);transform:translateY(-3px);box-shadow:0 20px 40px -30px rgba(14,36,56,.45)}
.op-k{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--orange);margin-bottom:12px}
.op h3{font-size:1.04rem;margin-bottom:8px}
.op-do{font-size:.87rem;color:var(--ink-60);line-height:1.65;margin-bottom:16px}
.op-l{display:flex;flex-direction:column;gap:8px}
.op-l a{font-family:var(--mono);font-size:.79rem;color:var(--navy);text-decoration:none;
  display:inline-flex;align-items:center;gap:9px;transition:color .2s,gap .2s;word-break:break-all}
.op-l a:hover{color:var(--orange);gap:12px}
.op-l svg{width:14px;height:14px;flex:none;color:var(--teal)}

/* ---------- 13. micro: glow sui numeri, link con sottolineatura animata ---------- */
.stat-v{position:relative}
.stat.lit .stat-v{text-shadow:0 0 34px rgba(229,135,43,.45)}
.ul{background-image:linear-gradient(var(--orange),var(--orange));background-size:0% 1.5px;
  background-repeat:no-repeat;background-position:0 100%;transition:background-size .4s cubic-bezier(.2,.8,.2,1);
  text-decoration:none;padding-bottom:2px}
.ul:hover{background-size:100% 1.5px}

/* ---------- 14. torna su ---------- */
.top{position:fixed;right:22px;bottom:22px;z-index:150;width:46px;height:46px;border-radius:50%;
  background:var(--navy-dark);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 30px -10px rgba(18,60,107,.7);opacity:0;transform:translateY(14px) scale(.9);
  transition:opacity .35s,transform .35s,background .25s;pointer-events:none}
.top.on{opacity:1;transform:none;pointer-events:auto}
.top:hover{background:var(--orange)}
.top svg{width:17px;height:17px}
@media(max-width:640px){.top{right:14px;bottom:14px;width:42px;height:42px}}

/* ---------- rispetto delle preferenze di movimento ---------- */
@media(prefers-reduced-motion:reduce){
  .hero-photo img,.aurora i,.mq-t{animation:none!important}
  .wr .w>i{transform:none!important;opacity:1!important;filter:none!important}
  .shot .curtain{display:none}
  .shot img{transform:none!important}
  .cur,.cur-d{display:none}
}

/* ---------- 15. nav compatta allo scroll + 7ª voce ---------- */
.nav{transition:height .3s,background .3s,box-shadow .3s}
.nav.stuck{background:rgba(246,249,251,.94);box-shadow:0 10px 30px -22px rgba(14,36,56,.5)}
.nav .wrap{transition:height .3s cubic-bezier(.2,.8,.2,1)}
.nav.stuck .wrap{height:62px}
.nav-logo img{transition:height .3s}
.nav.stuck .nav-logo img{height:27px}
@media(max-width:1060px){
  .nav-links,.nav-cta .btn{display:none}
  .burger{display:flex}
  .mob{position:fixed;inset:72px 0 auto 0;z-index:190;background:var(--paper);border-bottom:1px solid var(--rule);
    padding:16px 24px 26px;transform:translateY(-140%);transition:transform .4s cubic-bezier(.3,.8,.3,1);
    box-shadow:0 24px 40px -24px rgba(14,36,56,.4);max-height:calc(100svh - 72px);overflow-y:auto}
  .mob.open{transform:none}
}
@media(min-width:1061px){.nav-links{gap:2px}.nav-links a{padding:9px 11px;font-size:.89rem}}

/* ============================================================
   GIUSTIFICAZIONE — allineamento a bandiera doppia, come il
   materiale di formazione Kinetica.
   Sillabazione automatica attiva (l'italiano ha parole lunghe:
   senza la divisione in sillabe la giustificazione apre buchi
   bianchi in mezzo alla riga).
   ============================================================ */
body{
  hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;
  hyphenate-limit-chars:6 3 2;              /* parola >=6 lettere, 3 prima e 2 dopo */
  -webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:2;
  hyphenate-limit-lines:2;                  /* mai piu' di 2 sillabazioni di fila */
}

/* --- il testo di lettura --- */
p, li, dd, blockquote, .lead, .prose p, .faq-a p, .faq .faq-a p,
.card p, .step p, .sect p, .ver p, .rq p, .op-do, .nc-v,
.hero-sub, .hero-page p, .sec-head p, .band p, .band-quote p,
.cta-band p, .foot-legal p, .foot-brand p, .slip-foot, .foot-contact p,
.faq-a, .prose{
  text-align:justify;
  text-justify:inter-word;
}

/* Nei blocchi centrati la giustificazione resta, ma l'ultima riga
   torna al centro: altrimenti si perde l'impaginazione simmetrica. */
.hero-home .hero-inner p,
.sec-head.center p,
.cta-band p,
.hero-cta ~ p, .hero-fine{ text-align-last:center }

/* --- cosa NON va giustificato ---
   Etichette, pulsanti, voci di menu, righe in flex e numeri:
   sono elementi di interfaccia, non testo di lettura. Giustificarli
   li deforma e basta. */
.eyebrow, .btn, .nav-links a, .mob a, .crumb, .trust-i, .card-go,
.card-k, .ver-k, .op-k, .nc-k, .rq-n, .step-n, .shot-badge,
.stat-v, .stat-k, .stat-s, .promise li, .contact-info li,
.contact-info a, .consent, .form-fine, .mq-t span, .op-l a,
.foot-col a, .foot-contact a, .foot-badge, .foot-bottom,
.faq summary, .faq summary span, .srow, .slip-head, .slip-top,
.slip-tot, .slip-hl, .costs li, label, input, select, textarea,
option, code, h1, h2, h3, h4, .net-tip, .net-tip-t, .net-tip-s,
table, th, td{
  text-align:inherit;
  text-align:initial;
  hyphens:none;-webkit-hyphens:none;
}
.eyebrow.center{justify-content:center}
.sec-head.center h2, .cta-band h2, .hero-home h1, .hero-home .eyebrow{text-align:center}
.foot-bottom, .stat-k, .stat-s{text-align:left}
.hero-fine{text-align:center}

/* Su schermi stretti la colonna diventa troppo corta perche' la
   giustificazione regga: sotto i 560px torno a bandiera a sinistra,
   dove il testo resta piu' leggibile. */
@media(max-width:560px){
  p, li, .lead, .prose p, .faq-a p, .card p, .step p, .sect p,
  .ver p, .rq p, .op-do, .band p, .foot-legal p{ text-align:left }
  .hero-home .hero-inner p, .sec-head.center p, .cta-band p{ text-align:center }
}
