@font-face{font-family:Inter;src:url(fonts/inter-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/inter-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url(fonts/grotesk-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Fraunces;src:url(fonts/fraunces-600.woff2) format("woff2");font-weight:600;font-display:swap}

body.ss-software{--ink:#f1fff8;--testo:#b4cdc2;--carta:#06120e;--alt:#0b1d17;--scuro:#030a07;--su-scuro:#b4cdc2;--accento:#3dffa2;--acc2:#19c8ff;--su-accento:#03231a;--segno:#3dffa2;--linea:rgba(255,255,255,.13);--card:rgba(255,255,255,.045);--display:"Space Grotesk",system-ui,sans-serif;--tit-spazio:-.03em;--raggio:8px}
body.ss-sitoweb{--ink:#fff;--testo:#d5cff3;--carta:#0d0628;--alt:#170a40;--scuro:#07021a;--su-scuro:#d5cff3;--accento:#ff4d8d;--acc2:#ffb800;--su-accento:#1c0418;--segno:#ffb800;--linea:rgba(255,255,255,.15);--card:rgba(255,255,255,.06);--display:Fraunces,Georgia,serif;--tit-spazio:-.02em;--raggio:18px}

html{scroll-behavior:smooth}
body{background:var(--carta);color:var(--testo);font:400 17px/1.65 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;margin:0}
.site.grid-container,.site-content,.content-area,.site-main,.inside-article,.entry-content,.site-footer,.site-info{max-width:none;width:100%;padding:0!important;margin:0!important;background:none;float:none}
.site-content{display:block}
.entry-header,.site-info{display:none}
.site-footer{background:none}
.largo{max-width:1180px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--display);color:var(--ink);letter-spacing:var(--tit-spazio);line-height:1.08;margin:0 0 .5em;font-weight:700}
.ss-sitoweb h1,.ss-sitoweb h2,.ss-sitoweb h3{font-weight:600}
h1{font-size:clamp(2.5rem,6vw,4.7rem)}
h2{font-size:clamp(1.9rem,3.8vw,3rem)}
h3{font-size:1.32rem;line-height:1.2}
p{margin:0 0 1em}
a{color:var(--segno)}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--segno);outline-offset:3px}

.btn{display:inline-block;padding:.85em 1.45em;border-radius:var(--raggio);font-weight:600;text-decoration:none;line-height:1.2;transition:transform .15s,background .15s;border:2px solid transparent}
.btn:hover{transform:translateY(-2px)}
.btn-p,.btn-p:visited,.btn-p:hover{background:var(--accento);color:var(--su-accento)}
.btn-s,.btn-s:visited{border-color:currentColor;color:var(--ink);background:none}
.bottoni{display:flex;flex-wrap:wrap;gap:12px;margin-top:1.7em}

.testata{background:var(--carta);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:50}
.testata-in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:78px}
.marchio{font-family:var(--display);font-size:1.32rem;font-weight:400;color:var(--ink);text-decoration:none;letter-spacing:var(--tit-spazio);line-height:1.1;white-space:nowrap}
.marchio b{font-weight:700;color:var(--segno)}
.ss-sitoweb .marchio b{font-weight:600}
.marchio small{display:block;font:400 .7rem Inter,sans-serif;letter-spacing:0;color:var(--testo);margin-top:3px}
#menu-ss>ul{display:flex;align-items:center;gap:22px}
#menu-ss a{color:var(--ink);text-decoration:none;font-size:.93rem}
#menu-ss a.attivo{font-weight:600;box-shadow:0 2px 0 var(--segno)}
#menu-ss a.btn{color:var(--su-accento);font-size:.9rem}
.con-sub{position:relative}
.con-sub>ul{position:absolute;top:100%;left:-16px;background:var(--alt);border:1px solid var(--linea);border-radius:8px;padding:8px;min-width:230px;display:none;box-shadow:0 14px 34px rgba(0,0,0,.1)}
.con-sub:hover>ul,.con-sub:focus-within>ul{display:block}
.con-sub>ul a{display:block;padding:8px 10px}
.apri-menu{display:none;background:none;border:0;padding:8px;color:var(--ink);cursor:pointer}
.apri-menu span{display:block;width:24px;height:2px;background:currentColor;margin:5px 0}
.apri-menu em{position:absolute;left:-9999px}

.hero{padding:clamp(56px,8vw,104px) 0;overflow:hidden}
.hero-in{display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:center}
.hero.corto{padding:clamp(44px,6vw,76px) 0;background:var(--alt)}
.hero.corto h1{font-size:clamp(2.1rem,4.8vw,3.6rem)}
.hero.corto .hero-in{grid-template-columns:minmax(0,800px)}
.occhiello{font:600 .78rem Inter,sans-serif;letter-spacing:.11em;text-transform:uppercase;color:var(--segno);margin-bottom:1.1em;display:block}
.lead{font-size:1.2rem;max-width:62ch}
.arte svg{width:100%;height:auto;display:block}

.sez{padding:clamp(56px,7vw,92px) 0}
.sez.alt{background:var(--alt)}
.sez.scura{background:var(--scuro);color:var(--su-scuro)}
.sez.scura h2,.sez.scura h3{color:#fff}
.sez.scura .btn-s{color:#fff}
.sez.scura a:not(.btn){color:var(--accento)}
.sez-testa{max-width:760px;margin-bottom:2.6em}
.sez-testa p{font-size:1.1rem}
.griglia{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:1px solid var(--linea);border-radius:var(--raggio);padding:28px;color:var(--testo);text-decoration:none;display:block}
.card p:last-child{margin:0}
a.card{transition:transform .15s,border-color .15s}
a.card:hover{transform:translateY(-3px);border-color:var(--segno)}
a.card h3::after{content:" →";color:var(--segno)}
.sez.scura .card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:var(--su-scuro)}

.confronto{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.colonna{padding:34px;border-radius:var(--raggio)}
.colonna.prima{background:#191c1e;color:#9aa19e}
.colonna.dopo{background:var(--scuro);color:var(--su-scuro)}
.colonna h3{font-size:1.5rem}
.colonna.prima h3{color:#c8cdca}
.colonna.dopo h3{color:#fff}
.colonna ol{counter-reset:n}
.colonna li{counter-increment:n;padding:.55em 0 .55em 2.4em;position:relative;border-top:1px solid rgba(128,128,128,.28)}
.colonna li::before{content:counter(n);position:absolute;left:0;font-family:var(--display);font-weight:700}
.colonna.dopo li::before{color:var(--accento)}

.passi{counter-reset:p;display:grid;gap:0}
.passi li{counter-increment:p;display:grid;grid-template-columns:82px 1fr;gap:12px;padding:26px 0;border-top:1px solid var(--linea)}
.passi li::before{content:counter(p,decimal-leading-zero);font:700 2rem var(--display);color:var(--segno)}
.passi h3{margin-bottom:.3em}
.passi p{margin:0}

.spettro{display:grid;grid-template-columns:repeat(6,1fr);align-items:end;gap:10px}
[id]{scroll-margin-top:100px}
.sez.scura .spettro a,.spettro a{display:flex;flex-direction:column;justify-content:flex-end;padding:18px 16px;color:var(--su-accento);background:var(--accento);border-radius:var(--raggio);text-decoration:none;font-weight:600;line-height:1.2}
.spettro a:nth-child(1){min-height:90px;opacity:.55}.spettro a:nth-child(2){min-height:140px;opacity:.65}.spettro a:nth-child(3){min-height:190px;opacity:.75}.spettro a:nth-child(4){min-height:240px;opacity:.85}.spettro a:nth-child(5){min-height:290px;opacity:.93}.spettro a:nth-child(6){min-height:340px}
.spettro-assi{display:flex;justify-content:space-between;margin-top:12px;font-size:.88rem}

.etichette{display:flex;flex-wrap:wrap;gap:10px}
.etichette li{border:1px solid currentColor;border-radius:99px;padding:.45em 1.05em;font-weight:600;font-size:.96rem}
.spunte li{padding:.42em 0 .42em 1.9em;position:relative}
.spunte li::before{content:"";position:absolute;left:2px;top:.85em;width:13px;height:7px;border-left:2.5px solid var(--segno);border-bottom:2.5px solid var(--segno);transform:rotate(-45deg)}
.sez.scura .spunte li::before{border-color:var(--accento)}
.due{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.nota-bozza{background:#fff3c7;color:#5d4600;border:1px dashed #b58b00;border-radius:6px;padding:12px 16px;font-size:.92rem;margin-top:1em}

.fascia-cta{background:var(--scuro);color:var(--su-scuro);padding:clamp(56px,7vw,88px) 0}
.fascia-cta h2{color:#fff;max-width:17em}
.fascia-cta p{font-size:1.15rem;max-width:60ch}
.fascia-cta .btn-s{color:#fff}

.faq{max-width:840px}
.faq details{border-top:1px solid var(--linea);padding:18px 0}
.faq summary{font:700 1.14rem var(--display);color:var(--ink);cursor:pointer}
.ss-sitoweb .faq summary{font-weight:600}
.faq p{margin:.7em 0 0}

.calc{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.calc form,.calc .esito{padding:32px;border-radius:var(--raggio)}
.calc form{background:var(--card);border:1px solid var(--linea)}
.calc label{display:block;font-weight:600;color:var(--ink);margin-bottom:18px}
.calc input{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:.65em .8em;border:1px solid var(--linea);border-radius:6px;font:inherit;background:var(--carta);color:var(--ink)}
.calc .esito{background:var(--scuro);color:var(--su-scuro);position:sticky;top:100px}
.calc .totale{font:700 clamp(2.6rem,6vw,4rem) var(--display);color:var(--accento);line-height:1;margin:.1em 0 .4em}
.calc dl{display:grid;grid-template-columns:1fr auto;gap:8px 18px;margin:0 0 1em}
.calc dt{margin:0}.calc dd{margin:0;font-weight:600;color:#fff}
.calc small{display:block;margin-bottom:1.2em}

.piede{background:var(--scuro);color:var(--su-scuro);padding:64px 0 26px;font-size:.95rem}
.fascia-cta+.piede,.sez.scura+.piede{border-top:1px solid rgba(255,255,255,.14)}
.piede-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:36px}
.piede .marchio,.piede .marchio small{color:#fff}
.piede .marchio b{color:var(--accento)}
.piede h2{font:600 .78rem Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-bottom:1em}
.piede a{color:var(--su-scuro);text-decoration:none}
.piede a:hover{color:#fff}
.piede li{margin-bottom:.45em}
.p-brand p{margin-top:1em;max-width:30ch}
.p-logo{display:inline-block;margin-top:14px}
.p-logo img{height:auto;max-width:140px}
.piede-fondo{margin-top:42px;padding-top:20px;font-size:.85rem;opacity:.75}

@media(max-width:1060px){
 .apri-menu{display:block}
 #menu-ss{display:none;position:absolute;left:0;right:0;top:100%;background:var(--carta);border-bottom:1px solid var(--linea);padding:10px 28px 24px;max-height:calc(100vh - 80px);overflow:auto}
 #menu-ss.aperto{display:block}
 #menu-ss>ul{display:block}
 #menu-ss li{padding:7px 0}
 #menu-ss a{font-size:1.05rem}
 .con-sub>ul{position:static;display:block;border:0;box-shadow:none;background:none;padding:4px 0 0 14px;min-width:0}
 .con-sub>ul a{padding:3px 0;font-size:.96rem!important}
 .voce-cta{margin-top:10px}
}
@media(max-width:860px){
 .hero-in,.confronto,.due,.calc,.g2,.g3{grid-template-columns:1fr}
 .hero-in{gap:34px}
 .arte{max-width:440px}
 .g4,.piede-in{grid-template-columns:1fr 1fr}
 .p-brand{grid-column:1/-1}
 .calc .esito{position:static}
 .spettro{grid-template-columns:1fr 1fr}
 .spettro a,.spettro a:nth-child(n){min-height:96px;opacity:1}
 .spettro-assi{display:none}
}
@media(max-width:520px){
 .largo{padding:0 16px}
 #menu-ss{padding:10px 16px 24px}
 body{font-size:16px}
 .g4,.piede-in{grid-template-columns:1fr}
 .card,.colonna,.calc form,.calc .esito{padding:22px}
 .passi li{grid-template-columns:54px 1fr}
 .passi li::before{font-size:1.5rem}
 .bottoni .btn{width:100%;text-align:center;box-sizing:border-box}
}
body{overflow-x:hidden;background:var(--carta)!important}
.site,.site-content,.content-area,.site-main,article,.inside-article,.entry-content,.site-footer{background:transparent!important}
.testata{background:color-mix(in srgb,var(--carta) 78%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.testata-in{transition:min-height .25s}
.testata.ridotta .testata-in{min-height:58px}
.btn-p,.btn-p:visited,.btn-p:hover{background:linear-gradient(100deg,var(--accento),var(--acc2));background-size:180% 100%;box-shadow:0 8px 34px color-mix(in srgb,var(--accento) 42%,transparent);transition:transform .15s,background-position .4s,box-shadow .2s}
.btn-p:hover{background-position:100% 0;box-shadow:0 12px 46px color-mix(in srgb,var(--accento) 65%,transparent)}
.hero,.fascia-cta{position:relative;overflow:hidden;isolation:isolate}
.hero::before,.hero::after,.fascia-cta::before{content:"";position:absolute;z-index:-1;border-radius:50%;filter:blur(80px);pointer-events:none}
.hero::before{width:620px;height:620px;right:-120px;top:-180px;background:var(--accento);opacity:.3;animation:aurora1 13s ease-in-out infinite alternate}
.hero::after{width:520px;height:520px;left:-160px;bottom:-260px;background:var(--acc2);opacity:.24;animation:aurora2 16s ease-in-out infinite alternate}
.fascia-cta::before{width:700px;height:420px;left:30%;top:-120px;background:var(--accento);opacity:.26;animation:aurora2 12s ease-in-out infinite alternate}
.ss-software .hero{background-image:linear-gradient(rgba(61,255,162,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(61,255,162,.06) 1px,transparent 1px);background-size:56px 56px;animation:griglia 9s linear infinite}
.ss-sitoweb .hero::before{background:#7c3dff;opacity:.62}
.ss-sitoweb .hero::after{background:var(--accento);opacity:.42}
.ss-sitoweb .hero.corto::before{opacity:.42}
.hero.corto{background-color:var(--alt)}
@keyframes aurora1{to{transform:translate(-170px,120px) scale(1.25)}}
@keyframes aurora2{to{transform:translate(190px,-80px) scale(1.2)}}
@keyframes griglia{to{background-position:56px 56px}}
.parola{display:inline-block;opacity:0;transform:translateY(.55em) rotate(3deg);animation:entra .7s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes entra{to{opacity:1;transform:none}}
.lampo{background:linear-gradient(95deg,var(--accento),var(--acc2),var(--accento));background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:entra .7s cubic-bezier(.2,.8,.2,1) forwards,scorri 5s linear infinite}
@keyframes scorri{to{background-position:220% 0}}
.riv{opacity:0;transform:translateY(34px);transition:opacity .7s,transform .7s cubic-bezier(.2,.8,.2,1)}
.riv.vis{opacity:1;transform:none}
.card{position:relative;overflow:hidden}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--accento) 26%,transparent),transparent 70%);opacity:0;transition:opacity .25s;pointer-events:none}
.card:hover::before{opacity:1}
.card>*{position:relative}
.card:hover{border-color:var(--accento)}
.sez.alt+.sez,.sez.scura{position:relative}
.nastro{overflow:hidden;border-block:1px solid var(--linea);padding:17px 0;background:var(--scuro)}
.nastro>div{display:flex;width:max-content;gap:48px;animation:nastro 32s linear infinite;font:700 1.25rem var(--display);color:var(--ink);white-space:nowrap}
.nastro span::after{content:"✦";color:var(--accento);margin-left:48px}
.nastro:hover>div{animation-play-state:paused}
@keyframes nastro{to{transform:translateX(-50%)}}
.confronto{position:relative}
.colonna.dopo{background:linear-gradient(160deg,color-mix(in srgb,var(--accento) 20%,var(--scuro)),var(--scuro));border:1px solid var(--accento);box-shadow:0 0 60px color-mix(in srgb,var(--accento) 22%,transparent)}
.colonna.prima{position:relative}
.colonna.prima::after{content:"";position:absolute;right:24px;top:calc(34px + var(--p,0)*(100% - 112px));width:32px;height:42px;background:#e8e6da;border-radius:2px;transform:rotate(calc(var(--p,0)*28deg - 10deg));box-shadow:inset 0 9px 0 -7px #999,inset 0 17px 0 -15px #999,inset 0 25px 0 -23px #999}
.sez.scura .spettro a{transform-origin:bottom;background:linear-gradient(180deg,var(--acc2),var(--accento));opacity:1!important}
.spettro a.riv{transform:scaleY(.08);opacity:0!important}
.spettro a.riv.vis{transform:none;opacity:1!important}
.arte{will-change:transform}
.vola{transform-box:fill-box;transform-origin:center;animation:vola 4.5s cubic-bezier(.5,0,.3,1) infinite}
.vola.d2{animation-delay:1.5s}.vola.d3{animation-delay:3s}
@keyframes vola{0%,8%{transform:none;opacity:1}60%{opacity:1}82%,100%{transform:translate(255px,-10px) scale(.22) rotate(14deg);opacity:0}}
.cresce{transform-box:fill-box;transform-origin:left;animation:cresce 4.5s ease-in-out infinite}
.cresce.d2{animation-delay:1.5s}.cresce.d3{animation-delay:3s}
@keyframes cresce{0%,25%{transform:scaleX(.08)}70%,100%{transform:none}}
.spunta{transform-box:fill-box;transform-origin:center;animation:spunta 4.5s ease-in-out infinite}
.spunta.d2{animation-delay:1.5s}.spunta.d3{animation-delay:3s}
@keyframes spunta{0%,62%{transform:scale(0)}72%,100%{transform:none}}
.flut{transform-box:fill-box;animation:flut 6s ease-in-out infinite alternate}
.flut.d2{animation-delay:-2s;animation-duration:5s}.flut.d3{animation-delay:-4s;animation-duration:7s}
@keyframes flut{from{transform:translateY(-12px)}to{transform:translateY(14px)}}
.pulsa{animation:pulsa 3s ease-in-out infinite}
.pulsa.d2{animation-delay:1s}.pulsa.d3{animation-delay:2s}
@keyframes pulsa{50%{opacity:.4}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.card{transition:none}.hero,.hero::before,.hero::after,.fascia-cta::before,.nastro>div,.vola,.cresce,.spunta,.flut,.pulsa,.lampo{animation:none}.parola{animation:none;opacity:1;transform:none}.riv,.spettro a.riv{opacity:1!important;transform:none;transition:none}.vola{opacity:1}}
