*{margin:0;padding:0;box-sizing:border-box}
:root{--tiffany: #48c7c4;
  --text-white: #fff; --text-black: #1a1a1a;--teal:#3AB7B6;--teal2:#2a9a99;
  --gold:#C9A84C;--dark:#080e0e;--bg:#fff;--bg2:#f9f9f9;
  --muted:#4a7070;--border:rgba(58,183,182,0.12); --grigietto: #e6e6e6d5;
  }
html{scroll-behavior:smooth;background:var(--bg)}
body{font-family:'Inter Tight',sans-serif;background:var(--bg);color:var(--dark);overflow-x:hidden}
#home{
    background-image: url(/assets/_images/_Xaux_Slide.jpg);
  background-size: cover; /* Stretches to fill container without distorting */
  background-position: center; /* Centers the image perfectly */
  background-repeat: no-repeat; /* Prevents the image from tiling */    
  color: var(--text-white);
}

#velo{
    width: 100%;
    height: 100vh;
    position: absolute;
    left: 0px;
    background: var(--tiffany);
    opacity: .12;
    z-index: 1;
}

.usecasetitle{color: var(--text-white); }
.usecase-title{ color: var(--tiffany) !important;font-size: 2em !important;}
.usecase-textitem{ color: var(--text-white) !important;  padding: 0px 0px 0px 40px; font-size: larger;}
.usecase-textitem b {font-weight: 800 !important;}
.footer-logo{font-size:24px;font-weight:700;color:white;letter-spacing:-0.5px;margin-bottom:8px}
.footer-logo > img { width: 150px;}
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:0 6%;height:64px;display:flex;align-items:center;justify-content:space-between;background:var(--text-black);backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
.nav-back{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted);text-decoration:none;transition:color .2s}
.nav-back:hover{color:var(--teal)}
.nav-back svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nav-links{display:flex;align-items:center;gap:24px}
.nav-links a{font-size:13px;font-weight:500;color:var(--text-white);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--tiffany)}
.nav-cta{background:var(--teal);color:white!important;padding:8px 20px;border-radius:100px;font-weight:700!important}
.nav-cta:hover{background:var(--teal2)!important}
.hero{min-height:100vh;display:flex;align-items:center;padding:100px 6% 80px;position:relative;overflow:hidden}
canvas#heroCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.hero-grid{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(58,183,182,0.07) 1px,transparent 1px);background-size:32px 32px;z-index:0}
.hero-glow{position:absolute;top:-10%;left:-5%;width:500px;height:500px;background:radial-gradient(circle,rgba(58,183,182,0.1) 0%,transparent 70%);pointer-events:none;z-index:0}
.hero-inner{max-width:1280px;margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative;z-index:2}
.hero-inner > div > h1 {color: var(--text-white);}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(58,183,182,0.08);border:1px solid rgba(58,183,182,0.2);border-radius:100px;padding:6px 14px;margin-bottom:24px}
.badge-dot{width:6px;height:6px;background:#22c55e;border-radius:50%;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.badge-text{font-size:12px;font-weight:600;color:var(--teal)}
h1{font-family:'Inter Tight',sans-serif;font-size:72px;font-weight:700;color:var(--dark);line-height:.97;letter-spacing:-3px;margin-bottom:24px}
h1 em{color:var(--text-black);font-style:normal;background-size:0% 3px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:2px;animation:uline .9s cubic-bezier(.16,1,.3,1) .5s forwards}
@keyframes uline{0%{background-size:0% 3px}100%{background-size:100% 3px}}
.hero-sub{font-size:18px;color:var(--text-white);line-height:1.8;margin-bottom:32px;max-width:480px;padding-top:20px;border-top:1px solid var(--border)}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:32px}
.btn-primary{display:inline-flex;align-items:center;gap:8px;padding:14px 28px;background:var(--text-black);color:white;border-radius:100px;font-size:14px;font-weight:700;text-decoration:none;transition:all .3s;box-shadow:0 4px 20px rgba(58,183,182,.25)}
.btn-primary:hover{background:var(--teal2);transform:translateY(-2px)}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border:1.5px solid var(--text-white);color:var(--text-black);border-radius:100px;font-size:14px;font-weight:600;text-decoration:none;transition:all .3s;background-color: var(--text-white);}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal)}
.trust-row{display:flex;gap:20px;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--text-white)}
.trust-check{color:var(--text-black);font-weight:700}
.price-card{background:white;border-radius:24px;padding:32px;border:1px solid var(--border);box-shadow:0 8px 40px rgba(58,183,182,.08)}
.pc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.pc-live{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.1em}
.pc-live-dot{width:6px;height:6px;background:#22c55e;border-radius:50%;animation:blink 2s infinite}
.pc-asset{font-size:12px;color:var(--muted)}
.pc-price{font-family:'Inter Tight',sans-serif;font-size:48px;font-weight:700;color:var(--dark);letter-spacing:-2px;line-height:1;margin-bottom:4px}
.pc-sub{font-size:12px;color:var(--muted);margin-bottom:20px}
.pc-row{background:var(--bg2);border-radius:14px;padding:16px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center}
.pc-row-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.pc-row-val{font-family:'Inter Tight',sans-serif;font-size:22px;font-weight:700;color:var(--teal);letter-spacing:-.5px}
.pc-row-sub{font-size:11px;color:var(--muted);margin-top:2px}
.pc-footer{display:flex;justify-content:space-between;align-items:center;padding-top:14px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}
.pc-spread{font-weight:700;color:var(--teal);background:rgba(58,183,182,.08);padding:4px 10px;border-radius:100px;font-size:12px}
section{padding:100px 6%;position:relative;overflow:hidden}
.si{max-width:1280px;margin:0 auto;position:relative;z-index:1}
.sp{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.55}
.ey{font-size:10px;font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.25em;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.ey::before{content:'';width:24px;height:1.5px;background:var(--teal);border-radius:2px}
h2{font-family:'Inter Tight',sans-serif;font-size:52px;font-weight:700;color:var(--dark);line-height:1.03;letter-spacing:-2px;margin-bottom:16px}
.sdesc{font-size:17px;color:var(--muted);line-height:1.8;max-width:520px}
.sh{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:52px}
/* STEPS */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:rgba(58,183,182,.08);border-radius:20px;overflow:hidden}
.sc{background:var(--bg);padding:36px 28px;transition:background .3s}
.sc:hover{background:rgba(58,183,182,.03)}
.sn{font-family:'Inter Tight',sans-serif;font-size:52px;font-weight:700;color:rgba(58,183,182,.1);letter-spacing:-3px;line-height:1;margin-bottom:14px}
.si2{width:44px;height:44px;border-radius:12px;background:rgba(58,183,182,.08);border:1px solid rgba(58,183,182,.15);display:flex;align-items:center;justify-content:center;margin-bottom:12px;transition:all .3s}
.sc:hover .si2{background:rgba(58,183,182,.15);border-color:var(--teal)}
.si2 svg{width:20px;height:20px;stroke:var(--teal);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.st{font-family:'Inter Tight',sans-serif;font-size:18px;font-weight:700;color:var(--dark);letter-spacing:-.3px;margin-bottom:8px}
.sd{font-size:13px;color:var(--muted);line-height:1.75}
/* FEATURES */
.fg{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fc{background:var(--bg2);border:1px solid var(--border);border-radius:20px;padding:32px;transition:all .3s}
.fc:hover{border-color:rgba(58,183,182,.3);transform:translateY(-3px);box-shadow:0 12px 40px rgba(58,183,182,.08)}
.fi{width:48px;height:48px;border-radius:14px;background:rgba(58,183,182,.08);border:1px solid rgba(58,183,182,.15);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.fi svg{width:22px;height:22px;stroke:var(--teal);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ft{font-family:'Inter Tight',sans-serif;font-size:20px;font-weight:700;color:var(--dark);letter-spacing:-.4px;margin-bottom:10px}
.fdesc{font-size:14px;color:var(--muted);line-height:1.75}
/* PRICING */
.pg{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:rgba(58,183,182,.08);border-radius:24px;overflow:hidden;margin-top:48px}
.ph{padding:52px 48px;background:var(--bg);display:flex;flex-direction:column;gap:20px}
.pv{font-family:'Inter Tight',sans-serif;font-size:72px;font-weight:700;color:var(--teal);letter-spacing:-4px;line-height:1}
.pu{font-size:16px;color:var(--muted);font-weight:500;align-self:flex-end;padding-bottom:10px;margin-left:6px}
.pl{font-family:'Inter Tight',sans-serif;font-size:22px;font-weight:700;color:var(--dark);letter-spacing:-.5px}
.ps{font-size:15px;color:var(--muted);line-height:1.7;max-width:360px}
.zf{padding:52px 48px;background:var(--bg)}
.zf-title{font-family:'Inter Tight',sans-serif;font-size:18px;font-weight:700;color:var(--dark);letter-spacing:-.4px;margin-bottom:20px}
.zr{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid rgba(58,183,182,.07)}
.zr:last-child{border-bottom:none}
.zr-name{font-size:15px;color:var(--dark)}
.zr-val{font-family:'Inter Tight',sans-serif;font-size:20px;font-weight:700;color:var(--teal);letter-spacing:-.5px}
/* VS */
.vg{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:rgba(58,183,182,.08);border-radius:24px;overflow:hidden;margin-top:48px}
.vc{background:var(--bg);padding:44px}
.vc.hi{background:rgba(58,183,182,.03)}
.vc-head{display:flex;align-items:center;gap:14px;margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.vc-name{font-family:'Inter Tight',sans-serif;font-size:22px;font-weight:700;letter-spacing:-.5px}
.vbadge{font-size:10px;font-weight:700;padding:4px 10px;border-radius:100px;text-transform:uppercase;letter-spacing:.1em}
.xbadge{background:rgba(58,183,182,.1);color:var(--teal)}
.ebadge{background:rgba(0,0,0,.05);color:var(--muted)}
.vr{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid rgba(58,183,182,.06)}
.vr:last-child{border-bottom:none}
.vr-label{font-size:14px;color:var(--muted)}
.vr-val{font-size:14px;font-weight:700;color:var(--dark)}
.good{color:#16a34a}.bad{color:#dc2626}
/* JOURNEY */
.jf{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;background:rgba(58,183,182,.08);border-radius:20px;overflow:hidden;margin-top:48px}
.js{background:var(--bg);padding:32px 22px;transition:background .3s}
.js:hover{background:rgba(58,183,182,.03)}
.jn{font-family:'Inter Tight',sans-serif;font-size:40px;font-weight:700;color:rgba(58,183,182,.1);letter-spacing:-2px;line-height:1;margin-bottom:12px}
.ji{width:40px;height:40px;border-radius:11px;background:rgba(58,183,182,.08);border:1px solid rgba(58,183,182,.15);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.ji svg{width:18px;height:18px;stroke:var(--teal);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.jt{font-family:'Inter Tight',sans-serif;font-size:16px;font-weight:700;color:var(--dark);letter-spacing:-.2px;margin-bottom:8px}
.jd{font-size:13px;color:var(--muted);line-height:1.65}
/* FAQ */
.fh{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:48px}
.fl{border:1px solid var(--border);border-radius:20px;overflow:hidden}
.faq-item{border-bottom:1px solid rgba(58,183,182,.07);transition:background .3s;cursor:pointer}
.faq-item:last-child{border-bottom:none}
.faq-item.open{background:rgba(58,183,182,.03)}
.faq-q{width:100%; border:0px; background-color: var(--text-black);display:flex;align-items:center;justify-content:space-between;padding:22px 28px;gap:20px;user-select:none; }
.faq-qa{width:100%; border:0px; background-color: var(--grigietto);display:flex;align-items:center;justify-content:space-between;padding:22px 28px;gap:20px;user-select:none; }
.faq-q span{font-family:'Inter Tight',sans-serif;font-size:16px;font-weight:700;color:var(--text-black);letter-spacing:-.3px;line-height:1.3}
.faq-qa span{font-family:'Inter Tight',sans-serif;font-size:16px;font-weight:700;color:var(--text-black);letter-spacing:-.3px;line-height:1.3}
.faq-chev{width:26px;height:26px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--teal);transition:all .3s}
.faq-item.open .faq-chev{transform:rotate(180deg);background:var(--teal);color:white;border-color:var(--teal)}
.faq-chev svg{width:13px;height:13px}
.faq-a{transition:max-height 0.4s ease}
.faq-aa{transition:max-height 0.4s ease}
.faq-item.open .faq-a{max-height:460px}
.faq-a p{padding:0 26px 20px;font-size:14px;color:var(--muted);line-height:1.8}
.faq-aa p{padding:0 26px 20px;font-size:14px;color:var(--muted);line-height:1.8}
/* CTA */
.cta-s{background:var(--dark);padding:100px 6%}
.cta-i{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.cta-ey{font-size:10px;font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.25em;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.cta-ey::before{content:'';width:24px;height:1.5px;background:var(--teal);border-radius:2px}
.cta-h{font-family:'Inter Tight',sans-serif;font-size:52px;font-weight:700;color:white;line-height:1.03;letter-spacing:-2px;margin-bottom:16px}
.cta-sub{font-size:16px;color:rgba(255,255,255,.4) !important;line-height:1.8}
.cf{display:flex;flex-direction:column;gap:14px}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fg2{display:flex;flex-direction:column;gap:7px}
.fg2 label{font-size:10px;font-weight:700;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.12em}
.fg2 input,.fg2 select{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 16px;font-size:14px;color:white;font-family:'Plus Jakarta Sans',sans-serif;outline:none;transition:border-color .2s}
.fg2 input:focus,.fg2 select:focus{border-color:rgba(58,183,182,.4)}
.fg2 input::placeholder{color:rgba(255,255,255,.2)}
.fg2 select option{background:var(--dark)}
.fsub{background:var(--teal);color:white;border:none;border-radius:100px;padding:15px 32px;font-size:14px;font-weight:700;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;transition:all .3s}
.fsub:hover{background:var(--teal2);transform:translateY(-2px)}
/* FOOTER */
.site-footer{background:var(--dark);padding:52px 6% 0}
.site-footer::before{content:'';display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(58,183,182,.25),transparent);margin-bottom:44px}
.fi2{max-width:1280px;margin:0 auto}
.ft2{display:grid;grid-template-columns:1.2fr 2fr;gap:64px;padding-bottom:36px}
.flogo{font-family:'Inter Tight',sans-serif;font-size:22px;font-weight:700;color:white;letter-spacing:-.5px;margin-bottom:6px}
.ftag{font-size:13px;color:rgba(255,255,255,.28);margin-bottom:18px}
.fsoc{display:flex;gap:8px}
.sb{width:32px;height:32px;border-radius:9px;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.28);transition:all .2s;text-decoration:none}
.sb:hover{border-color:rgba(58,183,182,.3);color:var(--teal)}
.sb svg{width:13px;height:13px}
.fcols{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.fct{font-size:10px;font-weight:700;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.18em;margin-bottom:14px}
.fcol a{display:block;font-size:13px;color:rgba(255,255,255,.32);text-decoration:none;transition:color .2s;margin-bottom:9px}
.fcol a:hover{color:white}
.fdiv{border:none;border-top:1px solid rgba(255,255,255,.05);margin-bottom:22px}
.fent{font-size:11px;color:rgba(255,255,255,.2);line-height:1.7;margin-bottom:10px}
.fent strong{color:rgba(255,255,255,.36)}
.frisk{font-size:10px;color:rgba(255,255,255,.13);line-height:1.7;border-top:1px solid rgba(255,255,255,.05);padding-top:12px;margin-bottom:10px}
.frisk strong{color:rgba(255,255,255,.24)}
.fcopy{font-size:10px;color:rgba(255,255,255,.11);padding-bottom:28px}
/* REVEAL */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1)}
.reveal.visible{opacity:1;transform:none}
.stagger>*{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}
.stagger.visible>*:nth-child(1){opacity:1;transform:none;transition-delay:0s}
.stagger.visible>*:nth-child(2){opacity:1;transform:none;transition-delay:.07s}
.stagger.visible>*:nth-child(3){opacity:1;transform:none;transition-delay:.14s}
.stagger.visible>*:nth-child(4){opacity:1;transform:none;transition-delay:.21s}
.stagger.visible>*:nth-child(5){opacity:1;transform:none;transition-delay:.28s}
.stagger.visible>*:nth-child(6){opacity:1;transform:none;transition-delay:.35s}


/* FOOTER */
.site-footer{background:var(--dark);padding:64px 6% 0}
.site-footer::before{content:'';display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(58,183,182,0.25),transparent);margin-bottom:56px}
.footer-inner{max-width:1280px;margin:0 auto}
.footer-top{display:grid;grid-template-columns:1.2fr 2fr;gap:64px;padding-bottom:48px}
.footer-logo{font-size:24px;font-weight:700;color:white;letter-spacing:-0.5px;margin-bottom:8px}
.footer-logo > img { width: 150px;}
.footer-tagline{font-size:13px;color:rgba(255,255,255,0.28);margin-bottom:24px}
.footer-social{display:flex;gap:8px}
.soc-btn{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.28);transition:all 0.2s;text-decoration:none}
.soc-btn:hover{border-color:rgba(58,183,182,0.3);color:var(--teal)}
.soc-btn svg{width:14px;height:14px}
.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.footer-col-title{font-size:10px;font-weight:700;color:rgba(255,255,255,0.3);text-transform:uppercase;letter-spacing:0.18em;margin-bottom:16px}
.footer-col a{display:block;font-size:13px;color:rgba(255,255,255,0.35);text-decoration:none;transition:color 0.2s;margin-bottom:10px}
.footer-col a:hover{color:white}
.footer-divider{border:none;border-top:1px solid rgba(255,255,255,0.05);margin-bottom:28px}
.footer-entity{font-size:11px;color:rgba(255,255,255,0.8) !important;line-height:1.7;margin-bottom:12px}
.footer-entity strong{color:rgba(255,255,255,0.8) !important;}
.footer-risk{font-size:10px;color:rgba(255,255,255,0.8) !important;line-height:1.7;border-top:1px solid rgba(255,255,255,0.05);padding-top:14px;margin-bottom:12px}
.footer-risk strong{color:rgba(255,255,255,0.8)}
.footer-copy{font-size:10px;color:rgba(255,255,255,0.12);padding-bottom:32px}

/* FIX CONTRAST */
.form-group label { color: rgba(255,255,255,0.9) !important; }
p { color: rgba(0,0,0,0.7) !important; }
.form-submit { background:#3AB7B6  !important; color:#0B1414 !important; }

/* SKIP CONTENT*/
.skip-link { position:absolute; left:-9999px; }
.skip-link:focus { left:1rem; top:1rem; z-index:1000; background:#fff;
color:#000; padding:.5rem 1rem; }

/* WCAG: 2.3.3 Animazione dalle interazioni */
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.001ms !important;
scroll-behavior: auto !important;
}
.reveal { opacity: 1 !important; transform: none !important; }
}
.faq-q :hover{
  cursor: pointer;
}
.faq-qa :hover{
  cursor: pointer;
}
.faq-a {
  display: none;
}

.faq-item.open .faq-a {
  display: block;
}

.faq-item .faq-chev {
  transition: transform 0.25s ease;
}

.faq-item.open .faq-chev {
  transform: rotate(180deg);
}
/* Nasconde di default l'elemento quando ha l'attributo hidden */
.faq-a[hidden] {
  display: none;
}

/* Mostra l'elemento quando l'attributo hidden viene rimosso */
.faq-a:not([hidden]) {
  display: block;
}
/* Mostra l'elemento quando l'attributo hidden viene rimosso */
.faq-aa:not([hidden]) {
  display: block;
  background-color: var(--grigietto);
}


