/* Levorato — valutatore, SCHERMATA UNICA (22/09/2026)
   Si carica solo col link di prova, sopra app.css. Tutte le regole stanno
   sotto .lsu (la classe che la schermata unica mette sul riquadro): il
   percorso a passi non viene toccato. */

.lsu .lsv-body{padding:22px 22px 26px;}
.lsu h2{font-size:21px;}

/* tipo di apparecchio: tre linguette in cima */
.lsu-tipo .lsu-scelte{grid-template-columns:repeat(3,1fr);margin-top:0;}
.lsu-tipo .lsu-sc{padding:11px 10px;text-align:center;}
.lsu-tipo .lsu-sc span{font-size:11.5px;}
.lsu .lsv-hint + .lsu-tipo{margin-top:16px;}

/* ogni domanda e' un blocco con numero, titolo e scelte */
.lsu-q{margin-top:22px;padding-top:20px;border-top:1px solid var(--lsv-line);
	transition:opacity .2s;scroll-margin-top:84px;}
.lsu-q__testa{display:flex;align-items:center;gap:10px;}
.lsu-q__testa h3{margin:0;font-size:17px;line-height:1.3;font-weight:750;letter-spacing:-.01em;color:var(--lsv-ink);}
.lsu-n{flex:none;width:26px;height:26px;border-radius:50%;background:var(--lsv-navy);color:#fff;
	font-size:13px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;}
.lsu-q.fatta .lsu-n{background:var(--lsv-ok);}
.lsu-aiuto{margin:6px 0 0 36px;font-size:12.5px;line-height:1.5;color:var(--lsv-ink3);}
.lsu-aiuto a{color:var(--lsv-brand-dk);font-weight:650;}
.lsu-aiuto--sotto{margin-left:0;margin-top:10px;}
.lsu-q .lsv-combo{margin-top:14px;}
.lsu-q.spento{opacity:.42;}
.lsu-q.spento .lsu-sc{cursor:default;}

/* la domanda saltata, quando si preme «Vedi quanto vale» */
@keyframes lsu-manca{0%,100%{background:transparent}20%,60%{background:#FDF3E6}}
.lsu-q.manca{animation:lsu-manca 1.6s ease;border-radius:10px;}
.lsu-q.manca .lsu-n{background:var(--lsv-amber);}

/* scelte compatte, due per riga */
.lsu-scelte{margin-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.lsu-sc{position:relative;width:100%;text-align:left;border:1.5px solid var(--lsv-line2);background:#fff;
	border-radius:10px;padding:11px 12px;font:inherit;color:var(--lsv-ink);cursor:pointer;
	transition:border-color .15s,background .15s;}
.lsu-sc:hover{border-color:var(--lsv-brand);}
.lsu-sc b{display:block;font-size:14.5px;font-weight:650;line-height:1.3;}
.lsu-sc span{display:block;margin-top:3px;font-size:12px;line-height:1.35;color:var(--lsv-ink3);}
.lsu-sc.on{border-color:var(--lsv-brand);background:#EAF6FB;box-shadow:inset 0 0 0 1px var(--lsv-brand);}
.lsu-sc.on b{color:var(--lsv-brand-dk);}
.lsu-scelte--due .lsu-sc{text-align:center;padding:13px 10px;}

/* sotto-domande (memoria, cosa e' rotto, cosa non va) */
.lsu-sub{margin-top:16px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--lsv-ink3);}
.lsu-sub i{font-style:normal;font-weight:500;text-transform:none;letter-spacing:0;}
.lsu-chips{margin-top:8px;display:flex;flex-wrap:wrap;gap:8px;}
.lsu .lsu-multi{margin-top:8px;gap:8px;}
.lsu .lsu-multi .lsv-box{padding:12px 14px;}
.lsu .lsu-multi .lsv-txt b{font-size:14px;}

/* contatti in fondo */
.lsu-dati .lsv-pronta{margin:12px 0 0;}
.lsu-dati .lsu-aiuto{margin-left:0;}
.lsu-campi{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;}
.lsu-dati .lsv-aiuto{margin-top:10px;}
.lsu-dati .lsv-btn.big{margin-top:18px;}

@media (max-width:480px){
	.lsu .lsv-body{padding:18px 15px 22px;}
	.lsu-scelte{gap:7px;}
	.lsu-sc{padding:10px 10px;}
	.lsu-sc b{font-size:14px;}
	.lsu-tipo .lsu-sc{padding:10px 6px;}
	.lsu-tipo .lsu-sc span{display:none;}
	.lsu-aiuto{margin-left:0;}
	.lsu-campi{grid-template-columns:1fr;}
}

/* Il tema colora di azzurro, col testo bianco, qualunque pulsante sotto il
   dito o col fuoco: sulle nostre scelte comandiamo noi. */
.lsu .lsu-sc:hover,.lsu .lsu-sc:focus,.lsu .lsu-sc:active{background:#fff !important;color:var(--lsv-ink) !important;}
.lsu .lsu-sc.on,.lsu .lsu-sc.on:hover,.lsu .lsu-sc.on:focus{background:#EAF6FB !important;}
.lsu .lsu-sc:hover span,.lsu .lsu-sc:focus span{color:var(--lsv-ink3) !important;}
.lsu .lsu-sc.on b{color:var(--lsv-brand-dk) !important;}
.lsu .lsv-chip:hover,.lsu .lsv-chip:focus{background:#fff !important;color:var(--lsv-ink2) !important;}
.lsu .lsv-chip.on,.lsu .lsv-chip.on:hover,.lsu .lsv-chip.on:focus{background:#EAF6FB !important;color:var(--lsv-brand-dk) !important;}
.lsu .lsu-sc:focus-visible,.lsu .lsv-chip:focus-visible{outline:2px solid var(--lsv-brand);outline-offset:2px;}

/* Home: la schermata unica e' piu' lunga del testo accanto. Su computer il
   testo di sinistra accompagna il modulo mentre si scorre, invece di
   lasciare una colonna vuota. */
@media (min-width:900px){
	.ls-primo__griglia:has(.lsu) .ls-primo__dire{position:sticky;top:110px;align-self:start;}
}

/* ------------------------------------------------------------------
 * HOME, link di prova (22/09/2026): il valutatore sale subito sotto la
 * foto, largo (80% della gabbia su computer), e le tre porte scendono
 * sotto. Il ritiro e' l'obiettivo numero uno.
 * ------------------------------------------------------------------ */
.ls-vgr{padding-top:clamp(26px,3.4vw,44px);padding-bottom:clamp(26px,3vw,40px);scroll-margin-top:90px;}
.ls-vgr__testa{text-align:center;max-width:760px;margin:0 auto 20px;}
.ls-vgr__testa h2{font-size:clamp(28px,3.8vw,42px);line-height:1.12;letter-spacing:-.02em;margin:6px 0 0;}
.ls-vgr__testa h2 em{font-style:normal;color:var(--brand-scuro,#0A6E96);}
.ls-vgr__prove{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;
	font-size:14.5px;color:var(--inchiostro-2,#4A5761);}
.ls-vgr__prove li{display:flex;align-items:center;gap:7px;}
.ls-vgr__prove li::before{content:"✓";width:18px;height:18px;border-radius:50%;background:#E7F4EE;color:#128057;
	font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;}
.ls-vgr__box{max-width:80%;margin:0 auto;}
.ls-vgr__box .lsv{max-width:none;margin:0;}
.ls-vgr__nota{margin:6px 0 0;text-align:center;font-size:13px;color:var(--inchiostro-3,#7E8D97);}
/* le porte non stanno piu' sopra la foto: niente margine negativo */
.ls-porte-gabbia--sotto{margin-top:0 !important;padding-bottom:clamp(30px,4vw,50px);}
/* nel riquadro largo le scelte stanno su piu' colonne: meno scorrimento */
@media (min-width:900px){
	.ls-vgr .lsu .lsv-body{padding:28px 34px 32px;}
	.ls-vgr .lsu-scelte{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));}
	.ls-vgr .lsu-scelte--due{grid-template-columns:1fr 1fr;}
	.ls-vgr .lsu-q .lsv-combo{max-width:none;}
	.ls-vgr #lsva-cb-marca,.ls-vgr .lsu-q:has(#lsva-cb-marca) .lsv-sotto{display:inline-block;width:calc(50% - 6px);vertical-align:top;}
	.ls-vgr .lsu-q:has(#lsva-cb-marca) .lsv-sotto{margin:0 0 0 8px;}
}
@media (max-width:900px){
	.ls-vgr__box{max-width:none;}
}
@media (max-width:560px){
	.ls-vgr{padding-top:22px;}
	.ls-vgr__testa{margin-bottom:14px;}
	.ls-vgr__prove{font-size:13px;gap:6px 14px;}
}

/* Home in prova: titolo sopra le due porte rimaste (Ripara, Acquista) */
.ls-porte-titolo{text-align:center;font-size:clamp(22px,2.6vw,30px);line-height:1.2;letter-spacing:-.015em;
	margin:clamp(8px,2vw,20px) 0 clamp(16px,2vw,24px);}
.ls-porte.ls-porte--due{grid-template-columns:repeat(2,1fr);max-width:80%;margin-inline:auto;}
@media (max-width:900px){.ls-porte.ls-porte--due{max-width:none;}}
@media (max-width:640px){.ls-porte.ls-porte--due{grid-template-columns:1fr;}}

/* Il marchio LS nella barra scura del valutatore, al posto della scritta */


/* Foto in cima al riquadro (proposta A, 22/09): sfuma nel bianco e la
   prima domanda ci sale sopra. Nascosta nel percorso PC e sul risultato. */
.lsu-foto{position:relative;height:230px;overflow:hidden;}
.lsu-foto img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 42%;}
.lsu-foto::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,0) 35%,#fff 100%);}
.lsu-foto__et{position:absolute;left:24px;top:18px;z-index:1;display:inline-flex;align-items:center;gap:8px;
	background:rgba(17,17,31,.82);color:#fff;font-size:12.5px;font-weight:650;padding:7px 13px;border-radius:30px;}
.lsu-foto__et i{width:8px;height:8px;border-radius:50%;background:#5BC2E7;}
.lsu .lsv-body{position:relative;margin-top:-46px;}
.lsv:not(.lsu) .lsu-foto,.lsv-done .lsu-foto{display:none;}
.lsv-done .lsv-body{margin-top:0;}
@media (max-width:560px){
	.lsu-foto{height:150px;}
	.lsu .lsv-body{margin-top:-34px;}
	.lsu-foto__et{left:15px;top:12px;font-size:12px;padding:6px 11px;}
}
.ls-porte-titolo em{font-style:normal;color:var(--brand-scuro,#0A6E96);}

/* Le foto di Ripara e Acquista sfumano nel bianco come quella del valutatore
   (coerenza con la proposta A, richiesta di Luca 22/09). */
.ls-porte--due .ls-porta__foto{-webkit-mask-image:linear-gradient(180deg,#000 50%,rgba(0,0,0,0) 100%);
	mask-image:linear-gradient(180deg,#000 50%,rgba(0,0,0,0) 100%);}
.ls-porte--due .ls-porta > b{position:relative;margin-top:-34px;}
@media (max-width:560px){.ls-porte--due .ls-porta > b{margin-top:-24px;}}

/* Hero della home (22/09, Luca): la foto dei ragazzi resta nitida in alto e
   sfuma nel bianco SOLO in basso, dall'altezza dei jeans. Prima c'era anche
   un velo bianco in cima che la faceva sembrare meno definita. */
.ls-home-nuova .ls-vetrina__foto .ls-vetrina__velo{display:block !important;
	background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0) 68%,rgba(255,255,255,.55) 86%,#fff 100%) !important;}

/* ------------------------------------------------------------------
 * Marchio LS (22/09, Luca): un quadrato scuro con gli angoli smussati e
 * la LS ciano dentro, uguale su tutte e tre le foto e nella barra del
 * valutatore. Sulle foto di Ripara e Acquista copre esattamente il
 * marchio stampato nel file (x 88,7-97,6%, y 88,5-95,7%), che dopo la
 * sfumatura si vedeva slavato e con un filo di banco intorno.
 * ------------------------------------------------------------------ */
.lsu-badge,.ls-porte--due .ls-porta::after,.lsu-foto::before{
	background:#11111F url(/wp-content/plugins/levorato-home/assets/img/marchio.svg) center/66% auto no-repeat;
	border-radius:22%;box-shadow:0 0 0 1.5px rgba(255,255,255,.9),0 6px 16px -4px rgba(0,0,0,.45);}
/* foto di Ripara e Acquista: margini in % = percentuali della larghezza */
.ls-porte--due .ls-porta{position:relative;}
.ls-porte--due .ls-porta::after{content:"";position:absolute;top:0;left:87.9%;width:10.5%;aspect-ratio:1;
	margin-top:46.55%;z-index:2;pointer-events:none;}
/* foto del valutatore: in alto a destra (il marchio del file li' resta fuori inquadratura) */
.lsu-foto::before{content:"";position:absolute;top:16px;right:20px;width:54px;height:54px;z-index:2;}
@media (max-width:560px){.lsu-foto::before{top:11px;right:14px;width:42px;height:42px;}}
/* barra del valutatore: marchio + nome scritto, al posto del logo sottile */
.lsu .lsv-logo{display:flex;align-items:center;gap:10px;}
.lsu-badge{display:inline-block;width:30px;height:30px;flex:none;box-shadow:0 0 0 1.5px rgba(255,255,255,.85);}
.lsu-nome{font-size:13.5px;font-weight:800;letter-spacing:.08em;color:#fff;white-space:nowrap;}
.lsu-nome b{color:var(--lsv-ciano);font-weight:800;}
.lsu .lsv-logo .lsu-nome{color:#fff !important;}
.lsu .lsv-logo .lsu-nome b{color:var(--lsv-ciano) !important;}
/* le schede Ripara e Acquista portano alle sezioni della home: la testata fissa non deve coprire il titolo */
#riparazioni,#vetrina{scroll-margin-top:92px;}
/* riparazioni (22/09, proposta A): stesso riquadro del valutatore */
#lsv-rip .lsu-q.spento .lsv-combo__campo{cursor:not-allowed;}
@media (max-width:480px){#lsv-rip .lsu-tipo .lsu-sc b{font-size:13px;letter-spacing:-.01em;}}
/* vetrina ricondizionati (22/09): stesso riquadro del valutatore e delle riparazioni */
.lsu-vet .lsu-foto img{object-position:center 38%;}
.lsu-vet .lsv-body > .ls-vt-home{margin-top:18px;}
.lsu-vet .ls-permuta{margin:22px 0 0;}
.lsu-vet__tutto{margin:16px 0 0;text-align:center;}
/* nella foto della vetrina a sinistra c'e' il volto di Alessandro: l'etichetta va a destra, accanto al marchio */
.lsu-vet .lsu-foto__et{left:auto;right:88px;}
@media (max-width:560px){.lsu-vet .lsu-foto__et{right:66px;}}
