/* PumPIX — minisito di presentazione (pumpix.videoled.it)
   Palette e brand: fondo #0F1115, testo #E6E9EF, ciano #00C8FF (chiaro #0096C7) */
:root{
  --bg:#0F1115; --panel:#141a21; --panel2:#10151b; --line:#1f2832; --line2:#1c242d;
  --txt:#E6E9EF; --muted:#aab6c2; --muted2:#8795a3;
  --cyan:#00C8FF; --cyan-2:#6FE0FF; --cyan-d:#0096C7;
  --ok:#4cd137; --diesel:#ffd400; --verde:#4cd137;
  --maxw:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--txt);
  font-family:'Inter',-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--cyan);text-decoration:none}
a:hover{color:var(--cyan-2)}
img{max-width:100%}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-0.5px;line-height:1.1}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:2px;color:var(--cyan);text-transform:uppercase}
.muted{color:var(--muted)}
.section{padding:80px 0}
.section.alt{background:var(--panel2)}
.section h2{font-size:clamp(28px,4vw,44px)}
.lead{font-size:19px;color:var(--muted);max-width:640px}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(15,17,21,.86);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line2)}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:10px}
.logo .wm{font-weight:800;font-size:24px;letter-spacing:-0.5px;color:var(--txt)}
.logo .wm span{color:var(--cyan)}
.nav{display:flex;align-items:center;gap:26px}
.nav-links{display:flex;align-items:center;gap:26px}
.nav-links .only-m{display:none}
.nav a.link{color:#c9d3dc;font-size:16px;font-weight:500}
.nav a.link:hover{color:var(--txt)}
.langsel{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;font-size:13px;font-weight:700}
.langsel a{padding:7px 12px;color:#c9d3dc}
.langsel a.on{background:var(--cyan);color:#0F1115}
.btn{display:inline-block;padding:12px 22px;border-radius:10px;font-weight:700;font-size:16px;cursor:pointer}
.btn-primary{background:var(--cyan);color:#0F1115;border:none}
.btn-primary:hover{background:var(--cyan-2);color:#06222b}
.btn-ghost{border:1px solid var(--line);color:var(--txt)}
.btn-outline{border:1px solid var(--cyan);color:var(--cyan)}
.nav-toggle{display:none;background:none;border:0;color:var(--txt);font-size:26px;cursor:pointer}

/* hero */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;padding:72px 0 84px}
.hero h1{font-size:clamp(34px,5vw,58px)}
.hero .cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px}
.totem{width:100%;max-width:400px;margin:0 auto;background:#000;border:1px solid var(--line2);
  border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:16px}
.prow{display:flex;justify-content:space-between;align-items:baseline;padding:14px 18px;border-radius:10px}
.prow .lab{font-size:26px;font-weight:700}
.prow .val{font-size:clamp(40px,6vw,58px);font-weight:800;line-height:1}
.prow .val sup{font-size:.55em;vertical-align:top;position:relative;top:.04em}
.tbar{display:flex;justify-content:space-between;align-items:center;padding:12px 6px 0;border-top:1px solid #232c36;
  font-weight:700;font-variant-numeric:tabular-nums}
.tbar .t{color:#fff;font-size:26px}
.wx{display:flex;gap:16px;align-items:center}
.wxd{display:flex;align-items:center;gap:6px;color:#fff;font-size:22px;font-weight:800;line-height:1}
.wxd small{display:block;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--cyan);margin-bottom:3px}
.wxi{width:28px;height:28px;flex:0 0 auto}
@media(max-width:400px){.wx{gap:10px}.wxd{font-size:18px}.wxi{width:22px;height:22px}}
.cap{font-size:13px;color:var(--muted2);text-align:center}

/* cards grid */
.grid{display:grid;gap:22px}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:12px}
.card h3{font-size:21px;font-weight:700}
.card p{margin:0;font-size:16px;color:var(--muted)}
.card .ico{color:var(--cyan)}
.badge{display:inline-block;padding:4px 10px;border:1px solid var(--cyan);border-radius:999px;font-size:12px;font-weight:700;color:var(--cyan)}
.ph{border:1px dashed #3a4654;border-radius:16px;min-height:300px;display:flex;align-items:center;justify-content:center;color:var(--muted2);text-align:center;padding:20px}

/* widget preview boxes (3:2 ~384x256) */
.wbox{width:100%;aspect-ratio:3/2;background:#000;border:1px solid var(--line2);border-radius:12px;
  display:flex;align-items:center;justify-content:center;gap:20px;padding:16px;text-align:center}
.wclock{font-size:clamp(40px,7vw,72px);font-weight:800;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.wclock small{font-size:.45em;color:var(--cyan)}

/* widget previews */
.wgroup{font-size:15px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin:40px 0 16px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.card .badge{align-self:flex-start}
.g4 .pv-mid{font-size:19px}
.g4 .pv-big{font-size:36px}
.pv-txt b.warn{font-size:34px}
.badge-eval{border-color:var(--muted2);color:var(--muted)}
.wbox .ok{color:var(--verde)} .wbox .warn{color:var(--diesel)} .wbox .err{color:#ff6b6b}
.pv-col{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}
.pv-big{font-size:clamp(40px,5vw,56px);font-weight:800;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.pv-big small{font-size:.38em;margin-left:4px;font-weight:700}
.pv-mid{font-size:clamp(20px,2.2vw,26px);font-weight:800;color:#fff;line-height:1.15}
.pv-sub{font-size:14px;color:var(--muted)}
.pv-avg{display:flex;flex-direction:column;align-items:center;gap:8px}
.spark{width:88%;height:auto}
.pv-list,.pv-svc{display:flex;flex-direction:column;gap:8px;width:84%;font-weight:700;color:#fff}
.pv-list div,.pv-svc div{display:flex;justify-content:space-between;gap:10px}
.pv-list span,.pv-svc span{color:var(--muted);font-weight:600}
.pv-svc b{font-size:14px;white-space:nowrap}
.pv-row{display:flex;align-items:center;gap:16px;text-align:left}
.pv-txt{display:flex;flex-direction:column;gap:4px}
.pv-txt b{font-size:22px;font-weight:800;color:#fff;line-height:1.1}
.pv-txt span{font-size:14px;color:var(--muted)}
.pv-cross{font-size:48px;line-height:1;color:var(--verde)}
.pv-wx{display:flex;gap:26px}
.pv-wx>div{display:flex;align-items:center;gap:8px;color:#fff;font-size:30px;font-weight:800;line-height:1}
.pv-wx small{display:block;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--cyan);margin-bottom:4px}
.wxi-l{width:40px;height:40px;flex:0 0 auto}
.qr{width:74px;height:74px;flex:0 0 auto;border-radius:4px}

/* modalita' di visualizzazione: schermi LED dimostrativi */
.modes{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:22px;align-items:start;margin-bottom:8px}
.mode h3{font-size:19px;font-weight:700;margin:14px 0 6px}
.mode p{margin:0;font-size:15px}
.led{position:relative;aspect-ratio:3/2;background:#000;border:1px solid var(--line2);border-radius:10px;overflow:hidden;
  container-type:inline-size;color:#fff;font-weight:800;line-height:1}
.led.wide{aspect-ratio:16/9}
.rot{position:absolute;inset:0}
.rot>.sl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .8s ease}
.rot>.sl.on{opacity:1}
@media (prefers-reduced-motion:reduce){.rot>.sl{transition:none}}
/* schermo intero */
.fs-wx{display:flex;gap:9cqw}
.fs-wx>div{display:flex;align-items:center;gap:3cqw;font-size:13cqw}
.fs-wx .wxi-l{width:15cqw;height:15cqw}
.fs-wx small,.fs-lab{display:block;font-size:3.6cqw;letter-spacing:.3cqw;text-transform:uppercase;color:var(--cyan);margin-bottom:1.5cqw;font-weight:700}
.fs-col{display:flex;flex-direction:column;align-items:center;gap:2.5cqw;text-align:center}
.fs-row{display:flex;align-items:center;gap:5cqw}
.fs-row .wxi-l{width:20cqw;height:20cqw}
.fs-big{font-size:17cqw}
.fs-big small{font-size:.4em}
.fs-mid{font-size:7.5cqw}
.fs-sub{font-size:4.6cqw;font-weight:600;color:var(--muted)}
/* blocco prezzi fisso */
.lp{position:absolute;display:flex;flex-direction:column;justify-content:space-evenly}
.lp-row{display:flex;justify-content:space-between;align-items:baseline}
.lp-v sup{font-size:.55em;vertical-align:top;position:relative;top:.06em}
.lp-top{left:0;right:0;top:0;height:76%;padding:1.5cqw 6cqw}
.lp-top .lp-l{font-size:7.2cqw;font-weight:700}
.lp-top .lp-v{font-size:13cqw}
.lp-side{left:0;top:0;bottom:0;width:60%;padding:2cqw 4cqw}
.lp-side .lp-l{font-size:4.6cqw;font-weight:700}
.lp-side .lp-v{font-size:8.6cqw}
/* fascia in basso */
.band{position:absolute;left:0;right:0;bottom:0;height:24%;background:#06090d;border-top:1px solid #1d2630}
.bd{display:flex;align-items:center;gap:2.4cqw;font-size:6cqw;white-space:nowrap}
.bd .wxi-l{width:7cqw;height:7cqw}
.bd-t small{display:block;font-size:2.5cqw;letter-spacing:.2cqw;text-transform:uppercase;color:var(--cyan);margin-bottom:.6cqw}
.bd-dim{font-size:4.2cqw;font-weight:600;color:var(--muted)}
.bd-sep{width:1px;height:6cqw;background:#2a3440;margin:0 1cqw}
/* pannello laterale */
.panel{position:absolute;right:0;top:0;bottom:0;width:40%;background:#06090d;border-left:1px solid #1d2630}
.pn-col{display:flex;flex-direction:column;align-items:center;gap:1.6cqw;text-align:center;padding:0 2cqw}
.pn-clock{font-size:8cqw;font-variant-numeric:tabular-nums}
.pn-wx{display:flex;align-items:center;gap:1.4cqw;font-size:4.6cqw}
.pn-wx .wxi-l{width:5.4cqw;height:5.4cqw}
.pn-lab{font-size:2.2cqw;letter-spacing:.2cqw;text-transform:uppercase;color:var(--cyan);font-weight:700}
.pn-mid{font-size:3.6cqw}
.pn-big{font-size:8cqw}
.pn-sub{font-size:2.6cqw;font-weight:600;color:var(--muted)}
.pn-cross{font-size:9cqw;color:var(--verde)}
.qr-led{width:15cqw;height:15cqw;border-radius:3px}
@media(max-width:960px){.modes{grid-template-columns:1fr 1fr}.modes .mode:last-child{grid-column:1/-1}}
@media(max-width:680px){.modes{grid-template-columns:1fr}}

/* frecce confronto media / tendenza */
.arr{display:inline-block;width:.34em;height:.3em;margin-right:.16em;vertical-align:.12em}
.arr.dn{background:#4cd137;clip-path:polygon(0 0,100% 0,50% 100%)}
.arr.up{background:#ff6b6b;clip-path:polygon(50% 0,100% 100%,0 100%)}
.prow .arr{width:.26em;height:.22em;vertical-align:.5em;margin-right:.14em}
.lp-v .arr{width:.26em;height:.22em;vertical-align:.5em;margin-right:.12em}
.pv-arr b{font-variant-numeric:tabular-nums}
.pv-arr .arr{width:11px;height:9px;vertical-align:1px;margin-right:5px}
.pv-arr em{font-style:normal;font-size:13px;margin-left:4px}
.pv-sub .arr{width:10px;height:8px;vertical-align:1px}
/* ultima cifra del prezzo in apice (anteprime widget) */
.wbox sup{font-size:.62em;vertical-align:top;position:relative;top:-.05em}
/* tempi di percorrenza */
.led .ok{color:#4cd137} .led .warn{color:#ffd400}
.fs-tt,.pn-tt{display:flex;flex-direction:column;width:100%}
.fs-tt{gap:3cqw}
.fs-tt div,.pn-tt div{display:flex;justify-content:space-between;align-items:baseline}
.fs-tt span{font-size:7cqw;font-weight:700;color:#E6E9EF}
.fs-tt b{font-size:9cqw}
.pn-tt{gap:1.6cqw;padding:0 3cqw}
.pn-tt span{font-size:3cqw;font-weight:700;color:#E6E9EF}
.pn-tt b{font-size:3.8cqw}
/* pronto soccorso: livello di affollamento a 3 tacche */
.lv{display:inline-block;width:22px;height:10px;margin-left:6px;vertical-align:0;border-radius:2px;
  background:linear-gradient(90deg,currentColor 0 30%,transparent 30% 35%,#2a3440 35% 65%,transparent 65% 70%,#2a3440 70%)}
.lv.lv2{background:linear-gradient(90deg,currentColor 0 30%,transparent 30% 35%,currentColor 35% 65%,transparent 65% 70%,#2a3440 70%)}
.lv.lv3{background:linear-gradient(90deg,currentColor 0 30%,transparent 30% 35%,currentColor 35% 65%,transparent 65% 70%,currentColor 70%)}
.pv-ps b{font-variant-numeric:tabular-nums}
.ps-ico,.pk-ico{width:42px;height:42px;flex:0 0 auto}
.g4 .pv-ps span{font-size:13px}
.g4 .pv-ps b{font-size:14px}
.g4 .pv-list{width:94%;font-size:14px;gap:4px}
.g4 .pv-sub{font-size:12px}
.g4 .wbox{padding:10px}
.g4 .pv-col{gap:6px}
.g4 .ps-ico,.g4 .pk-ico{width:28px;height:28px}
.pv-ps{gap:6px;width:100%}
.pv-ps span{white-space:nowrap;font-size:14px;text-align:left}
.pv-ps b{white-space:nowrap;font-size:15px}
/* gia' disponibili: pannello testo, promo */
.badge-ok{border-color:var(--verde);color:var(--verde)}
.txp{display:flex;flex-direction:column;gap:7px;width:82%;color:#fff}
.txp>div{display:flex;justify-content:space-between;gap:10px;font-size:15px}
.txp>div span{color:var(--muted);font-weight:600}
.txp>div b{font-variant-numeric:tabular-nums}
.txp-h{align-self:center;font-size:26px;letter-spacing:4px;color:var(--cyan);margin-bottom:2px}
.txp-c{align-items:center;text-align:center;gap:8px}
.txp-big{font-size:24px;line-height:1.1}
.txp-sub{font-size:15px;color:var(--diesel);font-weight:700}
.wbox .promo{position:relative;width:100%;height:100%;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  background:radial-gradient(120% 90% at 20% 10%,#0b6f8f 0%,#0a2a3a 55%,#050a0e 100%);color:#fff}
.promo-k{font-size:15px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--cyan-2)}
.promo-v{font-size:52px;font-weight:800;line-height:1}
.promo-s{font-size:13px;color:#cfe9f2}
.promo-dots{position:absolute;bottom:8px;display:flex;gap:5px}
.promo-dots i{width:6px;height:6px;border-radius:50%;background:#3a4654}
.promo-dots i.on{background:#fff}
/* illustrazioni schermi */
.illu{background:radial-gradient(90% 70% at 50% 35%,#15202b 0%,#0d1218 70%);border:1px solid var(--line);border-radius:12px;
  display:flex;align-items:flex-end;justify-content:center;height:240px;padding-top:8px;overflow:hidden}
.illu-svg{height:100%;width:auto;font-family:Inter,Arial,sans-serif}
/* carte accettate (etichette neutre, non loghi ufficiali) */
.cards{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:4px;max-width:300px}
.cards img{display:block;height:26px;border-radius:5px;object-fit:cover}
.cards i{font-style:normal;font-size:10.5px;font-weight:800;color:#0F1115;background:#E6E9EF;border-radius:4px;padding:3px 6px;line-height:1}
/* banner consenso cookie */
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:50;max-width:980px;margin:0 auto;display:flex;align-items:center;gap:20px;
  background:#141a21;border:1px solid var(--line);border-radius:14px;padding:18px 48px 18px 22px;box-shadow:0 12px 40px rgba(0,0,0,.55)}
.ck[hidden]{display:none}
.ck-txt{flex:1;display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--muted)}
.ck-txt b{color:var(--txt);font-size:15px}
.ck-btns{display:flex;gap:10px;flex:0 0 auto}
.ck-btns .btn{padding:10px 20px;font-size:15px;font-family:inherit;font-weight:700;border-radius:10px;min-width:110px}
.ck-btns .btn-ghost{background:#2a3440;color:#fff;border:1px solid #3a4654}
.ck-btns .btn-ghost:hover{background:#33404e}
.ck-x{position:absolute;top:8px;right:10px;background:none;border:0;color:var(--muted);font-size:18px;cursor:pointer;padding:4px}
@media(max-width:680px){.ck{flex-direction:column;align-items:stretch;padding:18px 18px 16px}.ck-btns .btn{flex:1;text-align:center}}
/* steps */
.step{padding-top:22px;border-top:2px solid var(--line)}
.step.first{border-top-color:var(--cyan)}
.step .n{font-size:38px;font-weight:800;color:var(--cyan)}
.step h3{font-size:20px;font-weight:700;margin-top:8px}

/* form */
.form{display:grid;grid-template-columns:1fr 1fr;gap:18px;background:var(--panel);
  border:1px solid var(--line);border-radius:16px;padding:30px}
.form .full{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
input,textarea{font:inherit;font-size:16px;color:var(--txt);background:#0b0e12;
  border:1px solid #2a3440;border-radius:10px;padding:12px 14px;width:100%}
input:focus,textarea:focus{outline:2px solid var(--cyan);outline-offset:1px}
.check{flex-direction:row;align-items:flex-start;gap:10px;font-size:14px;color:var(--muted)}
.check input{width:18px;height:18px;margin-top:2px;flex:0 0 auto}
.alert{padding:14px 16px;border-radius:10px;margin-bottom:18px;font-weight:600}
.alert.ok{background:rgba(76,209,55,.12);border:1px solid rgba(76,209,55,.4);color:#8be9a0}
.alert.err{background:rgba(255,85,85,.12);border:1px solid rgba(255,85,85,.4);color:#ffa0a0}

/* footer */
.site-footer{border-top:1px solid var(--line2);padding:34px 0}
.site-footer .row{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  font-size:14px;color:var(--muted2)}
.site-footer a{color:var(--muted)}

/* content pages (privacy/cookie) */
.doc{max-width:820px;padding:56px 0}
.doc h1{font-size:34px;margin-bottom:8px}
.doc h2{font-size:22px;margin:28px 0 8px}
.doc p,.doc li{color:var(--muted);font-size:16px}

@media(max-width:1100px){
  .nav,.nav-links{gap:16px}
  .nav a.link{font-size:15px}
}
@media(max-width:900px){
  .nav{gap:12px}
  .nav-toggle{display:block;padding:4px 6px;line-height:1}
  .nav-links{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:#0F1115;border-bottom:1px solid var(--line2);padding:6px 24px 14px;box-shadow:0 12px 24px rgba(0,0,0,.5);z-index:30}
  .site-header.open .nav-links{display:flex}
  .nav-links a.link{padding:12px 0;border-bottom:1px solid var(--line2);font-size:17px}
  .nav-links a.link:last-child{border-bottom:0}
}
@media(max-width:960px){
  .hero{grid-template-columns:1fr;gap:36px}
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:680px){
  .nav .btn-outline{display:none}
  .nav-links a.link.only-m{display:block;color:var(--cyan)}
  .g4,.g3,.g2,.form{grid-template-columns:1fr}
  .section{padding:56px 0}
}
/* widget 20/10/2026: prezzi medi, migliori prezzi in zona, marchio, testo in sovraimpressione */
.pv-cap{color:var(--cyan);text-transform:uppercase;letter-spacing:1px;font-weight:700;font-size:12px}
.pv-media b{font-variant-numeric:tabular-nums;letter-spacing:.5px}
.pv-zona span{display:flex;flex-direction:column;text-align:left;line-height:1.15}
.pv-zona small{font-size:11px;font-weight:600;color:var(--muted2)}
.pv-zona div{align-items:center}
.wbox .mk{width:100%;height:100%;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:linear-gradient(135deg,#0b3d91 0%,#0a2a5c 100%);color:#fff}
.mk b{font-size:22px;letter-spacing:3px;text-transform:uppercase}
.mk span{font-size:12px;color:#cdd8ea;letter-spacing:1px;text-transform:uppercase}
.wbox .ov{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.ov .pv-list{width:84%}
.ov-strip{position:absolute;left:0;right:0;bottom:12%;background:rgba(0,200,255,.92);color:#04121a;font-weight:800;font-size:15px;
  padding:6px 0;overflow:hidden;white-space:nowrap}
.ov-strip span{display:inline-block;padding-left:100%;animation:ovScroll 9s linear infinite}
@keyframes ovScroll{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.ov-strip span{animation:none;padding-left:0}}
.g4 .txp{width:90%;gap:5px}
.g4 .txp>div{font-size:12px;white-space:nowrap}
.g4 .txp-h{font-size:20px;letter-spacing:3px}
.g4 .promo-v{font-size:40px}
.g4 .promo-k{font-size:12px}
.g4 .mk b{font-size:17px}
.g4 .ov .pv-list{width:90%;font-size:14px;margin-bottom:26%}
.g4 .ov-strip{bottom:8%;font-size:13px;padding:5px 0}
.g4 .pv-arr b{white-space:nowrap}
.g4 .pv-arr em{font-size:11px;margin-left:2px}
.pv-zona small{white-space:nowrap}