.err-a{display:flex;gap:9px;flex-wrap:wrap;margin-top:13px}

/* ---------- barra di navigazione del wizard ---------- */
.nav{margin-top:36px;padding-top:24px;gap:14px}
.nav .btn{flex:0 0 auto}
.nav #btnNext{min-width:200px}

/* il campo coinvolto nell'incompatibilità diventa rosso */
.cb-sel.bad{background:rgba(208,59,59,.09);border-color:rgba(208,59,59,.5);box-shadow:none}
.cb-sel.bad .cb-ic{color:var(--crit)}
.cb-alt{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.cb-sep{color:#4d4b47;font-size:12px}
select.bad{border-color:rgba(208,59,59,.6);background-color:rgba(208,59,59,.07)}
select.bad:focus{border-color:var(--crit);box-shadow:0 0 0 4px rgba(208,59,59,.18)}

/* ---------- riquadro "salva l'analisi" nel paywall ---------- */
.pw-alt{border-top:1px solid var(--line);padding-top:16px;margin-top:2px}
.pw-alt-t{font-size:13.5px;font-weight:650;color:var(--ink);margin-bottom:5px}
.pw-row{display:flex;gap:9px}
.pw-row input{flex:1;min-width:0}
.pw-row .btn{flex:none;white-space:nowrap}
@media(max-width:640px){.pw-row{flex-direction:column}.pw-row .btn{width:100%}}

/* ---------- ritorno al wizard dai risultati ---------- */
.res-edit{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:22px}
.res-hint{font-size:12.5px}

/* ---------- schede e risultati ---------- */
.card,.kpi,.score-card,.bottleneck,.hs{
  background:linear-gradient(180deg,rgba(255,255,255,.028),transparent 42%),var(--surface);
  border-color:rgba(255,255,255,.09);box-shadow:var(--shadow-1)}
.kpi,.hs{transition:transform .18s var(--ease),border-color .18s var(--ease)}
.kpi:hover,.hs:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.2)}
.kpi b,.hs b{font-variant-numeric:tabular-nums}
.kpi b{font-size:32px}
.kpi span,.hs span{letter-spacing:.005em;line-height:1.35;display:block;margin-top:4px}
.sec-t{color:#7e7c76;font-size:10.5px;letter-spacing:.18em}
.score-card{padding:28px 26px 24px}
.gauge .val b{font-size:56px;font-variant-numeric:tabular-nums}
.band{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.pot b{font-variant-numeric:tabular-nums}

/* elenco delle ottimizzazioni */
.f{transition:border-color .16s var(--ease),background .16s var(--ease),transform .16s var(--ease)}
.f:hover{border-color:rgba(255,255,255,.22);transform:translateX(2px)}
.f.free{box-shadow:0 0 0 1px rgba(181,0,181,.28),0 8px 22px -14px rgba(181,0,181,.8)}

/* riquadri informativi */
.okbox,.warnbox{border-radius:13px;line-height:1.55}

/* titoli */
h1{letter-spacing:-.03em}
h2{letter-spacing:-.025em;font-weight:750}
.hero .lead{line-height:1.55}
.kick{background:rgba(255,255,255,.03);padding:8px 16px}
.trust span{background:rgba(255,255,255,.02)}

/* Le sezioni usano .wrap ma poi ridichiarano padding, azzerando quello
   laterale: su telefono il contenuto finiva incollato ai bordi. */
.hero{padding:74px 20px 60px}
.wz{padding:34px 20px 80px}
.scan{padding-left:20px;padding-right:20px}

/* ---------- telefono ---------- */
@media(max-width:640px){
  .hero{padding:44px 20px 46px}
  .wz{padding:24px 20px 20px}
  #steps{padding-bottom:6px}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi b{font-size:27px}
  .res-hint{display:none}          /* il pulsante si spiega da solo */

  /* Le scelte diventano una colonna piena: bersagli grandi, niente righe
     sfilacciate con una voce sola a capo. */
  .chips{display:grid;grid-template-columns:1fr;gap:9px}
  .chips.dense{grid-template-columns:1fr 1fr}
  .chip{min-height:54px;font-size:14.5px}
  .step h2{font-size:23px}
  .step .sd{font-size:13.5px;margin-bottom:22px}
  .fg{margin-bottom:16px}
  header .hd{height:56px}
  .logo{font-size:12px}
  .pill{font-size:10.5px;padding:4px 9px}
  .cb-sel{padding:12px 13px}
  .cb-tx b{font-size:14px}
  .cb-x{padding:8px 12px}
  .errbox{padding:14px 15px}
  .err-a .btn{flex:1 1 100%}
  .mod{max-height:88vh;overflow-y:auto}
  .rail{margin:0 -20px 14px;padding:0 20px}
  .rl{padding:7px 12px 7px 7px;font-size:12px}
  .rl:not(.now) .rl-t{display:none}      /* su telefono restano solo i numeri, tranne il passo corrente */
  .fgroup{padding:16px 15px;border-radius:14px}
  .fgroup-h{font-size:13px;margin-bottom:13px}
  /* i link testuali erano alti 15px: impossibile centrarli col dito.
     L'aspetto resta lo stesso, cresce solo l'area sensibile. */
  .linkbtn{display:inline-flex;align-items:center;min-height:40px;padding:0 2px}
  .cb-alt{margin-top:2px}
  .fgroup-help{margin-top:10px;padding-top:8px}
  .score-card{padding:22px 18px 20px}
  .gauge{width:150px;height:150px}
  .gauge svg{width:150px;height:150px}
  .gauge .val b{font-size:46px}
  /* barra sempre raggiungibile col pollice, opaca: il contenuto non
     traspare da sotto mentre si scorre */
  .nav{position:sticky;bottom:0;background:rgba(11,12,14,.94);backdrop-filter:blur(14px);
       border-top:1px solid rgba(255,255,255,.12);box-shadow:0 -10px 24px -18px #000;
       margin:24px -20px 0;padding:13px 20px calc(13px + env(safe-area-inset-bottom));z-index:20}
  .nav .btn{flex:1 1 0;padding:15px 12px}
  .nav #btnNext{min-width:0}
  .btn{width:auto}
  .res-hint{flex-basis:100%}
}
/* =====================================================================
   MINIMAL BOOSTER 2.0 — PERFORMANCE REVEAL
   Direzione scelta: diagnosi premium, gerarchia netta, conversione integrata.
   ===================================================================== */
html{color-scheme:dark;scroll-behavior:smooth}
body{
  min-height:100vh;
  background:
    radial-gradient(circle at 84% -8%,rgba(68,0,246,.20),transparent 34rem),
    radial-gradient(circle at 4% 18%,rgba(181,0,181,.11),transparent 30rem),
    var(--bg);
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.22;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,#000,transparent 72%);
}
::selection{background:rgba(233,76,233,.28);color:#fff}
.wrap{max-width:1180px}
.hide{display:none!important}

/* header */
header{background:rgba(12,16,26,.86);border-color:rgba(255,255,255,.08);backdrop-filter:blur(20px) saturate(140%)}
.hd{height:88px}
.logo{gap:12px;font-size:13px;letter-spacing:.18em}
.logo img{width:218px;max-height:80px}
.logo .sub{color:var(--acc-soft)}
.pill{padding:7px 12px;border-radius:8px;background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.10);letter-spacing:.02em}
#hdAcc{color:#a7f0bd;border-color:rgba(57,207,112,.28);background:rgba(57,207,112,.07)}

/* azioni */
.btn{min-height:48px;border-radius:10px;font-weight:750;letter-spacing:-.01em}
.btn-a{
  color:#fff;background:var(--brand-gradient);
  box-shadow:0 10px 34px -14px rgba(181,0,181,.9),inset 0 1px rgba(255,255,255,.20);
}
.btn-a:hover{filter:brightness(1.10);box-shadow:0 16px 40px -14px rgba(181,0,181,.9),inset 0 1px rgba(255,255,255,.26)}
.btn-g{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.12);color:var(--ink-2)}
.btn-g:hover{background:rgba(255,255,255,.07);border-color:rgba(233,76,233,.42);color:#fff}
.btn:focus-visible,.chip:focus-visible,.tab:focus-visible,.linkbtn:focus-visible,.cb-x:focus-visible,.f-h:focus-visible{
  outline:2px solid var(--acc-soft);outline-offset:3px;
}

/* hero: copy a sinistra, profilo prestazionale a destra */
.hero{
  display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);
  grid-template-areas:"welcome welcome" "kick visual" "title visual" "lead visual" "cta visual" "trust visual" "demo demo";
  column-gap:64px;align-items:center;text-align:left;padding:96px 20px 88px;
}
#welcomeBox{grid-area:welcome;width:100%;max-width:none!important;margin:0 0 28px!important}
.hero .kick{grid-area:kick;justify-self:start;margin:0 0 24px;padding:8px 13px;border-radius:8px;background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.11)}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--acc-soft);box-shadow:0 0 0 5px rgba(233,76,233,.09),0 0 16px rgba(233,76,233,.60)}
.hero h1{grid-area:title;font-size:clamp(46px,5.5vw,76px);line-height:.99;letter-spacing:-.052em;margin:0 0 26px;max-width:760px}
.hero h1 .hl{color:transparent;background:var(--brand-gradient);background-clip:text;-webkit-background-clip:text}
.hero .lead{grid-area:lead;margin:0 0 30px;max-width:690px;color:#b7bbcb;font-size:17px;line-height:1.65}
.hero>.btn{grid-area:cta;justify-self:start;min-height:56px;padding:16px 25px;font-size:15px}
.hero .trust{grid-area:trust;justify-content:flex-start;margin-top:22px;gap:7px}
.hero .trust span{border:0;background:transparent;padding:4px 8px 4px 0;color:#8f94a7}
.hero .trust span::first-letter{color:var(--acc-soft)}
.hero .hero-strip{
  grid-area:visual;position:relative;align-self:stretch;display:grid;grid-template-columns:1fr 1fr;
  gap:1px;margin:0;padding:72px 18px 18px;border:1px solid rgba(255,255,255,.12);border-radius:18px;
  overflow:hidden;background:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px),
    radial-gradient(circle at 50% 8%,rgba(181,0,181,.24),transparent 50%),#111622;
  background-size:34px 34px,34px 34px,auto,auto;box-shadow:var(--shadow);
}
@media(min-width:901px){.hero .hero-strip{align-self:center;height:480px}}
.hero .hero-strip::before{content:"PERFORMANCE PROFILE";position:absolute;left:24px;top:22px;font-size:10px;font-weight:800;letter-spacing:.20em;color:#9095a8}
.hero .hero-strip::after{content:"ANALISI GRATUITA";position:absolute;right:22px;top:20px;border:1px solid rgba(233,76,233,.34);background:rgba(181,0,181,.08);border-radius:6px;padding:4px 8px;font-size:9px;font-weight:750;letter-spacing:.09em;color:#f19cf1}
.hero .hs{position:relative;min-height:145px;border:0;border-radius:0;padding:26px 20px;background:rgba(16,20,31,.80);box-shadow:none}
.hero .hs:nth-child(odd){border-right:1px solid rgba(255,255,255,.08)}
.hero .hs:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.08)}
.hero .hs:hover{transform:none;background:rgba(24,28,42,.94)}
.hero .hs b{font-size:34px;line-height:1;color:#fff}
.hero .hs:first-child b,.hero .hs:nth-child(3) b{color:var(--acc-soft)}
.hero .hs span{max-width:16ch;font-size:12px;line-height:1.4;color:#8e93a5;margin-top:10px}
.hero .demo-note{grid-area:demo;width:100%}

/* superfici e tipografia */
.card,.kpi,.score-card,.bottleneck,.chart,.f,.fgroup,.hs,.mod{
  background:linear-gradient(145deg,rgba(255,255,255,.035),transparent 36%),var(--surface);
  border-color:rgba(255,255,255,.10);box-shadow:none;
}
.sec-t{color:#9a9fb2;font-size:10px;letter-spacing:.20em}
h2{font-size:clamp(24px,3.2vw,34px)}
h3{font-weight:720}
.ink2{color:#b8bdcc}
.muted{color:#898fa2}

/* wizard */
.wz{max-width:1010px;padding:46px 20px 92px}
#scr-res.wz{max-width:1180px}
#scr-res{display:flex;flex-direction:column}
#ownedBox{order:0}
#scr-res>.res-edit{order:1}
#resHead{order:2}
#programmaBox{order:3}
#scr-res>div:has(#findTitle){order:4}
#paywall{order:5}
#resChart{order:6}
#unlocked{order:7}
.programma-box{
  margin:24px 0 0;padding:27px 28px;border:1px solid rgba(233,76,233,.42);border-radius:15px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,330px);gap:28px;align-items:center;
  background:radial-gradient(circle at 92% 18%,rgba(68,0,246,.22),transparent 42%),linear-gradient(120deg,rgba(181,0,181,.12),#151a25 48%);
}
.programma-box h2{margin:7px 0 9px;font-size:clamp(22px,3vw,30px)}
.programma-box p{margin:0;color:var(--ink-2);font-size:14px;line-height:1.65;max-width:690px}
.programma-cta{display:flex;flex-direction:column;align-items:stretch;gap:8px;text-align:center}
.programma-cta .btn{font-size:15px;padding:14px 20px;text-decoration:none}
.programma-cta span{font-size:11.5px;color:var(--ink-2)}
.programma-cta small{font-size:10.5px;line-height:1.45;color:var(--muted)}
@media(max-width:720px){
  .programma-box{grid-template-columns:1fr;padding:23px 20px;gap:20px}
}
.rail{gap:8px;margin-bottom:18px;overflow:visible}
.rl{flex:1;min-width:0;border-radius:9px;padding:9px;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.07)}
.rl .rl-t{overflow:hidden;text-overflow:ellipsis}
.rl-n{border-radius:6px;background:rgba(255,255,255,.055)}
.rl.done{color:#c8ccda;background:rgba(181,0,181,.045);border-color:rgba(181,0,181,.14)}
.rl.done .rl-n{background:rgba(181,0,181,.18);color:#f09cf0}
.rl.now{background:linear-gradient(120deg,rgba(181,0,181,.16),rgba(68,0,246,.12));border-color:rgba(233,76,233,.52)}
.rl.now .rl-n{color:#fff;background:var(--brand-gradient);box-shadow:0 0 20px rgba(181,0,181,.32)}
.prog{height:4px;background:rgba(255,255,255,.06);box-shadow:none}
.prog i{background:var(--brand-gradient);box-shadow:0 0 18px rgba(181,0,181,.45)}
.prog-l span:first-child{color:var(--acc-soft)}
.step h2{font-size:32px;margin-top:6px}
.step .sd{max-width:760px;color:#959bad;line-height:1.6}
.fgroup{padding:24px;border-radius:14px;margin-bottom:18px}
.fgroup-h{font-size:14px;margin-bottom:20px}
.fgroup-n{border-radius:7px;background:rgba(181,0,181,.16);color:#f09cf0}
.fgroup-help .linkbtn{color:#f09cf0}
.fg label{color:#eef0f6;font-weight:650}
select,input[type=text],input[type=email],input[type=number],textarea,.cb-in{
  min-height:48px;background:#1a202c;border-color:rgba(255,255,255,.12);border-radius:9px;color:#fff;
}
select:hover,input[type=text]:hover,.cb-in:hover,textarea:hover{border-color:rgba(233,76,233,.42)}
select:focus,input:focus,textarea:focus,.cb-in:focus{border-color:var(--acc-soft);box-shadow:0 0 0 4px rgba(181,0,181,.16)}
.chips{gap:10px}
.chip{min-height:56px;background:#1a202c;border-color:rgba(255,255,255,.11);border-radius:10px;color:#c2c6d3}
.chip:hover{background:#202737;border-color:rgba(233,76,233,.36)}
.chip.on{background:linear-gradient(120deg,rgba(181,0,181,.20),rgba(68,0,246,.12));border-color:var(--acc-soft);color:#fff;box-shadow:0 0 0 1px rgba(233,76,233,.12),0 12px 30px -20px rgba(181,0,181,.85)}
.chip.on::before{background:var(--brand-gradient);border-color:var(--acc-soft);box-shadow:0 0 14px rgba(181,0,181,.45)}
.cb-list{background:#1b2130;border-color:rgba(233,76,233,.24);box-shadow:0 24px 70px rgba(0,0,0,.55)}
.cb-op:hover{background:rgba(181,0,181,.13)}
.cb-sel{background:linear-gradient(120deg,rgba(181,0,181,.12),rgba(68,0,246,.06));border-color:rgba(233,76,233,.36)}
.cb-ic{background:#151a25;color:#f09cf0}
.nav{border-color:rgba(255,255,255,.08)}

/* scansione */
.scan{min-height:calc(100vh - 150px);display:grid;place-content:center;padding:80px 20px;text-align:center}
.ring{
  width:132px;height:132px;border:0;background:conic-gradient(from 0deg,var(--acc-soft),var(--acc-2),transparent 72%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0);
  box-shadow:0 0 70px rgba(181,0,181,.16);margin-bottom:34px;
}
.scan h2{font-size:32px;margin-bottom:10px}
.scan-log{color:#9fa4b7;letter-spacing:.01em}

/* risultato: reveal dominante */
.res-edit{margin-bottom:18px}
.res-top{grid-template-columns:minmax(330px,.72fr) minmax(0,1.5fr);gap:18px;align-items:stretch}
.score-card{
  position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:480px;padding:34px 28px 30px;border-radius:16px;
  background:
    radial-gradient(circle at 50% 35%,rgba(181,0,181,.18),transparent 42%),
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px),#121722;
  background-size:auto,30px 30px,30px 30px,auto;
  box-shadow:0 28px 80px -42px rgba(181,0,181,.72);
}
.score-card::after{content:"Il tuo PC ha ancora performance da sbloccare.";display:block;max-width:290px;margin:18px auto 0;font-size:20px;line-height:1.18;font-weight:780;letter-spacing:-.025em;color:#fff}
.score-card .sec-t{color:#a8adbe}
.gauge{width:224px;height:224px;margin:6px auto 2px;filter:drop-shadow(0 12px 34px rgba(181,0,181,.22))}
.gauge svg{width:224px;height:224px;overflow:visible}
.gauge circle:first-child{stroke:rgba(255,255,255,.07)}
.gauge circle:last-child{stroke:var(--acc-soft);filter:drop-shadow(0 0 7px rgba(233,76,233,.75))}
.gauge .val b{font-size:68px;text-shadow:0 4px 24px rgba(0,0,0,.4)}
.gauge .val i{font-size:12px;color:#9ea3b5}
.band{margin-top:3px;border-radius:7px;color:#f0b1f0;background:rgba(181,0,181,.08);border-color:rgba(233,76,233,.28)}
.band .dot{background:var(--acc-soft)!important}
.pot{width:100%;margin-top:18px;padding-top:17px;color:#a9aebe;border-color:rgba(255,255,255,.08)}
.pot b{display:inline-block;color:#fff;background:var(--brand-gradient);border-radius:6px;padding:3px 7px;margin-left:4px}
.res-top>div:last-child{display:flex;flex-direction:column;gap:18px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;background:#151a25;border:1px solid rgba(255,255,255,.10);border-radius:14px;overflow:hidden}
.kpi{position:relative;border:0;border-radius:0;padding:26px 22px;background:transparent}
.kpi+.kpi{border-left:1px solid rgba(255,255,255,.09)}
.kpi:hover{transform:none;border-color:transparent;background:rgba(255,255,255,.022)}
.kpi b{font-size:36px}
.kpi:nth-child(2) b{color:var(--good)!important}
.kpi span{font-size:12px;color:#9297a8;max-width:17ch}
.bottleneck{flex:1;border-radius:14px;padding:28px;background:linear-gradient(135deg,rgba(181,0,181,.075),transparent 34%),#151a25}
.bottleneck .sec-t{color:#eb82eb}
.bottleneck h3{font-size:21px;line-height:1.25;margin-bottom:12px!important}
.bottleneck .ink2{font-size:14px!important;line-height:1.65}

/* grafico e calibrazione */
.chart{border-radius:14px;padding:26px;background:#131823}
.chart .band{margin-top:0}
.legend{padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.07)}
.bar{border-radius:999px}
.barwrap:first-child .bar{background:var(--s2)!important}
.barwrap:nth-child(2) .bar{background:var(--s1)!important}
.axis{border-color:rgba(255,255,255,.07)}
#resChart>.card{border-color:rgba(233,76,233,.22)!important;background:linear-gradient(135deg,rgba(181,0,181,.07),transparent 38%),#151a25}
#resChart>.card .sec-t{color:#ee8fee!important}

/* valore prima del pagamento: una prova forte, poi anteprime leggibili */
#findTitle{font-size:31px}
#findSub{margin-top:5px;color:#8f95a7}
#findSub b{color:#f09cf0!important}
.fl{gap:9px}
.f{position:relative;border-radius:11px;background:#151a25}
.f:hover{transform:translateX(3px);border-color:rgba(233,76,233,.28)}
.f-h{min-height:82px;padding:17px 18px;align-items:center}
.f-n{width:29px;height:29px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.11);border-radius:50%;padding:0;color:#9fa4b5}
.f-t{font-size:15px;margin-bottom:7px}
.tag{border-radius:5px;background:rgba(255,255,255,.025)}
.tag.imp{color:#63dc89;border-color:rgba(57,207,112,.28);background:rgba(57,207,112,.055)}
.impbar{background:#242a38}
.impbar i{background:linear-gradient(90deg,var(--acc-soft),var(--acc-2))}
.f .lock{font-size:0;width:31px;height:31px;border:1px solid rgba(255,255,255,.12);border-radius:50%;display:grid;place-items:center;opacity:1}
.f .lock::after{content:"⌄";font-size:17px;color:#a6abbb;line-height:1}
.f.locked .lock::after{content:"●";font-size:9px;color:#d996d9;box-shadow:0 0 12px rgba(233,76,233,.5)}
.f.locked .f-t{filter:blur(3.7px);opacity:.70}
.f.locked{background:linear-gradient(90deg,rgba(181,0,181,.035),transparent 38%),#141923}
.f.free{border-color:rgba(233,76,233,.65);background:linear-gradient(100deg,rgba(181,0,181,.13),rgba(68,0,246,.07) 55%,#151a25);box-shadow:0 0 0 1px rgba(233,76,233,.10),0 20px 44px -32px rgba(181,0,181,.95)}
.f-free-tag{background:var(--brand-gradient);color:#fff;border-radius:4px}
body:has(#hdStatus:not(.hide)) #findList .f:nth-child(n+5){display:none}
body:has(#hdStatus:not(.hide)) #findList::after{
  content:"Le altre ottimizzazioni personalizzate sono già pronte nel piano completo";
  display:block;text-align:center;padding:16px 12px 5px;color:#9b70bc;font-size:12.5px;
}

/* acquisto: parte del report, non interruzione */
.pw{
  position:relative;overflow:hidden;margin-top:20px;padding:34px;border-radius:15px;text-align:left;
  display:grid;grid-template-columns:minmax(0,1.3fr) minmax(250px,.7fr);column-gap:34px;align-items:center;
  background:
    radial-gradient(circle at 88% 18%,rgba(68,0,246,.25),transparent 36%),
    linear-gradient(120deg,rgba(181,0,181,.16),rgba(20,24,35,.96) 42%);
  border:1px solid rgba(233,76,233,.58);box-shadow:0 30px 80px -48px rgba(181,0,181,.95);
}
.pw::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);opacity:.65}
.pw>.sec-t,.pw>h2,.pw>p,.pw>.pw-list{grid-column:1}
.pw>.sec-t{color:#f08ff0!important}
.pw h2{font-size:30px;margin-bottom:8px}
.pw p{margin-left:0!important;max-width:670px!important}
.pw .price{grid-column:2;grid-row:1/4;display:grid;grid-template-columns:auto auto;justify-content:start;align-items:end;gap:4px 10px;margin:0;padding-left:28px;border-left:1px solid rgba(255,255,255,.12)}
.pw .price s{grid-column:1;color:#8e93a5;font-size:14px}
.pw .price b{grid-column:1;font-size:60px}
.pw .price .once{grid-column:1/3;max-width:22ch;line-height:1.5}
.pw-list{grid-template-columns:1fr 1fr;margin:22px 0;font-size:13px;color:#d0d3de}
.pw-list .ck{color:#ef83ef}
.pw>.btn{grid-column:1/3;width:100%;min-height:58px;font-size:16px!important;margin-top:4px}
.pw>.gtee,.pw>.altlink{grid-column:1/3;text-align:center}
.pw .gtee{margin-top:14px}

/* modal e accesso */
.ov{background:rgba(4,6,11,.84);backdrop-filter:blur(12px);padding:18px}
.mod{max-width:500px;border-radius:16px;padding:30px;background:linear-gradient(145deg,rgba(181,0,181,.07),transparent 34%),#171c27;border-color:rgba(233,76,233,.24);box-shadow:0 34px 90px rgba(0,0,0,.58)}
.mod h3{font-size:24px}
.pw-alt{border-color:rgba(255,255,255,.09)}
.altlink,.linkbtn{color:#9aa0b2}
.altlink:hover,.linkbtn:hover{color:#f0a1f0}

/* report sbloccato */
.tabs{gap:8px;border:0;margin-top:22px;padding:7px;background:#131823;border:1px solid rgba(255,255,255,.09);border-radius:12px}
.tab{min-height:44px;border:0;border-radius:8px;padding:10px 13px}
.tab.on{color:#fff;border:0;background:linear-gradient(120deg,rgba(181,0,181,.22),rgba(68,0,246,.15));box-shadow:inset 0 0 0 1px rgba(233,76,233,.32)}
.upg{background:#181e2a}
.cert{border-color:var(--acc-soft);background:linear-gradient(145deg,rgba(181,0,181,.12),rgba(68,0,246,.07),transparent)}
.cert .big{color:#ee7fee}
footer{border-color:rgba(255,255,255,.07);color:#6f7588}

/* tablet */
@media(max-width:900px){
  .hero{grid-template-columns:1fr;grid-template-areas:"welcome" "kick" "title" "lead" "cta" "trust" "visual" "demo";row-gap:0;padding-top:62px}
  .hero .hero-strip{margin-top:46px;min-height:390px}
  .res-top{grid-template-columns:1fr}
  .score-card{min-height:440px}
  .pw{grid-template-columns:1fr}
  .pw>.sec-t,.pw>h2,.pw>p,.pw>.pw-list,.pw>.price,.pw>.btn,.pw>.gtee,.pw>.altlink{grid-column:1}
  .pw .price{grid-row:auto;display:flex;border:0;border-top:1px solid rgba(255,255,255,.10);padding:20px 0 0;margin-top:4px;align-items:baseline}
  .pw .price s,.pw .price b,.pw .price .once{grid-column:auto}
}

/* telefono */
@media(max-width:640px){
  body::before{background-size:32px 32px;opacity:.16}
  .wrap{padding-left:18px;padding-right:18px}
  header .hd{height:72px;padding-left:18px;padding-right:18px}
  .logo{gap:8px;font-size:11px;letter-spacing:.14em}
  .logo img{width:150px;max-height:62px}
  .logo .sub{display:none}
  .hd-r{gap:6px}
  .pill{padding:5px 7px;font-size:9px}
  .hero{display:block;padding:42px 18px 50px;text-align:left}
  .hero .kick{font-size:11px;margin-bottom:23px}
  .hero h1{font-size:43px;line-height:1.01;margin-bottom:22px}
  .hero .lead{font-size:15px;line-height:1.6;margin-bottom:25px}
  .hero>.btn{width:100%;min-height:55px;padding:14px 16px;font-size:14px}
  .hero .trust{justify-content:flex-start;margin:16px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:3px}
  .hero .trust span{font-size:10.5px;line-height:1.35}
  .hero .hero-strip{margin-top:34px;min-height:0;padding:62px 12px 12px;border-radius:14px}
  .hero .hero-strip::before{left:17px;top:20px}
  .hero .hero-strip::after{right:14px;top:17px}
  .hero .hs{min-height:120px;padding:20px 13px}
  .hero .hs b{font-size:28px}
  .hero .hs span{font-size:10.5px}

  .wz,#scr-res.wz{padding:24px 18px 38px}
  .rail{margin:0 0 14px;padding:0;gap:6px;overflow-x:auto}
  .rl{flex:none;min-width:auto;padding:7px 10px 7px 7px}
  .rl:not(.now) .rl-t{display:none}
  .step h2{font-size:26px;line-height:1.14}
  .step .sd{font-size:13px}
  .fgroup{padding:17px 15px;border-radius:12px}
  .chips,.chips.dense{grid-template-columns:1fr}
  .chip{min-height:56px;font-size:14px}
  .nav{margin:24px -18px 0;padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:rgba(12,16,26,.96);border-color:rgba(255,255,255,.10)}
  .nav .btn{min-height:49px}

  .scan{min-height:calc(100vh - 120px)}
  .ring{width:112px;height:112px}

  .res-edit{margin-bottom:14px}
  .res-edit .btn{width:100%}
  .score-card{min-height:0;padding:24px 17px 25px;border-radius:14px}
  .score-card::after{font-size:22px;max-width:300px;margin-top:15px}
  .gauge{width:188px;height:188px}
  .gauge svg{width:188px;height:188px}
  .gauge .val b{font-size:60px}
  .pot{font-size:12px}
  .kpis{grid-template-columns:repeat(3,1fr);border-radius:12px}
  .kpi{padding:18px 10px}
  .kpi b{font-size:27px}
  .kpi span{font-size:9.8px;line-height:1.25}
  .bottleneck{padding:21px 17px}
  .bottleneck h3{font-size:19px}
  .chart{padding:20px 15px}
  .legend{display:grid;grid-template-columns:1fr 1fr;gap:7px}
  .legend span:last-child{grid-column:1/3}
  .bars{padding-right:54px}

  #findTitle{font-size:26px;line-height:1.15}
  .f-h{min-height:92px;padding:14px 12px;gap:10px;align-items:flex-start}
  .f-n{width:25px;height:25px;font-size:10px}
  .f-t{font-size:13.5px;line-height:1.35}
  .f-m{gap:5px;font-size:9.5px}
  .tag{padding:2px 5px}
  .f-r{gap:6px}
  .impbar{display:none}
  .f .lock{width:28px;height:28px}
  .f-d{padding:14px 14px 16px;font-size:13px}

  .pw{display:block;padding:24px 18px;border-radius:14px}
  .pw h2{font-size:25px;line-height:1.15}
  .pw p{font-size:13.5px!important;line-height:1.55}
  .pw .price{display:flex;padding-top:18px;margin:18px 0 0;gap:9px;align-items:baseline}
  .pw .price b{font-size:48px}
  .pw .price s{font-size:14px}
  .pw .price .once{font-size:10.5px}
  .pw-list{grid-template-columns:1fr;gap:8px;margin:19px 0;font-size:12.5px}
  .pw>.btn{width:100%;min-height:56px;padding:14px 12px!important}

  .mod{padding:24px 19px;border-radius:14px;max-height:92vh}
  .mod h3{font-size:22px}
  .tabs{grid-template-columns:1fr 1fr;display:grid;overflow:visible;padding:6px}
  .tab{white-space:normal;text-align:left;font-size:12px}
  .tab:first-child{grid-column:1/3}
}

/* stampa: report pulito, senza navigazione o acquisto */
