/* ANTEPRIMA SEPARATA · Na.Pa / Luce, materia, persone.
   Una base grafite, luce verde solo nei punti di interazione. */
body.app-clienti{--fondo:#0a0c0c;--inchiostro:#f5f6f3;--secondario:#b2b9b6;--bordo:#303735;--chiaro:#181e1b;--lime:#67f58e;--bosco:#0b100d;--verde:#67f58e;color-scheme:dark;background:#0a0c0c;color:var(--inchiostro);font-family:'Manrope',system-ui,sans-serif;font-size:16px;letter-spacing:-.015em}
.app-clienti a{color:#c1f6cf}.app-clienti a:hover{color:#fff}
.app-clienti h1,.app-clienti h2,.app-clienti h3{color:#f5f6f3;font-family:'Manrope',system-ui,sans-serif;font-weight:500;letter-spacing:-.055em}
.app-clienti h1{font-size:clamp(2.5rem,4.5vw,4.5rem);line-height:1.08}
.app-clienti h2{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.15}.app-clienti h3{font-size:1.3rem;letter-spacing:-.035em}
.app-clienti .testata{max-width:1360px;padding:20px 36px;min-height:88px;border-bottom:1px solid #29312e!important}
.app-clienti .marchio{color:#f5f6f3;font-size:26px;font-weight:700;letter-spacing:-.06em}.app-clienti .sottologo{color:#aeb9b3;font-size:9px;letter-spacing:.2em}
.app-clienti .simbolo-logo{mix-blend-mode:screen;border-radius:0;width:42px;height:42px}
.app-clienti .testata button{min-height:44px;padding:10px 20px;font-size:14px;border-radius:100px}
.app-clienti #stato-rete{display:flex;gap:8px;align-items:center;color:#bcc6bf;background:transparent;border:0;font-size:11px;letter-spacing:.04em}
.app-clienti #stato-rete::before{content:'';width:6px;height:6px;border-radius:50%;background:#67f58e}
.app-clienti .banner{color:#a7b0aa;background:#101512;font:10px/1.7 'Manrope',sans-serif;letter-spacing:.12em;border-bottom:1px solid #242b27;padding:7px 18px}
.app-clienti main{max-width:1288px;padding:0 28px;margin-top:26px;min-height:65vh}
.app-clienti .occhiello{color:#9caf9f;font:600 11px/1.6 'Manrope',sans-serif;letter-spacing:.16em}
.app-clienti .intro{font-size:17px;line-height:1.7;color:#b7bfba;max-width:650px;margin:20px 0 30px}
.app-clienti .nota,.app-clienti .scheda p,.app-clienti .voce p{color:#b2bbb5;font-size:14px;line-height:1.75}
.app-clienti section{margin-bottom:36px}.app-clienti .riga-titolo{margin:45px 0 24px;align-items:center}
.app-clienti .griglia{gap:18px}.app-clienti .scheda,.app-clienti .voce{background:#131716;border:1px solid #2d3531;border-radius:20px;padding:28px;color:#f0f4ef;box-shadow:none}
.app-clienti .scheda:hover{box-shadow:none;border-color:#48534b}.app-clienti .scheda h2::before,.app-clienti .scheda h3::before{display:none}
.app-clienti .griglia>.scheda{min-width:0}.app-clienti .griglia>.scheda>p{width:100%}
.app-clienti .chip,.app-clienti .etichetta{color:#c5d3c9;background:#202822;border:1px solid #3b4a3e;font-size:11px;letter-spacing:.04em;border-radius:6px;padding:5px 9px}
.app-clienti button,.app-clienti .pulsante{background:#67f58e;color:#092110;border:1px solid #67f58e;min-height:50px;padding:14px 23px;border-radius:12px;font-size:15px;font-weight:700;letter-spacing:-.025em;transition:transform .18s,background .18s,border-color .18s;box-shadow:none;filter:none}
.app-clienti button:hover,.app-clienti .pulsante:hover{background:#a1ffba;color:#0a2412;filter:none;box-shadow:none;transform:translateY(-2px)}
.app-clienti button:active,.app-clienti .pulsante:active{transform:translateY(0)}
.app-clienti button.secondario,.app-clienti .pulsante.secondario{background:#1a211d;color:#e1e9e3;border-color:#455248}
.app-clienti button.secondario:hover,.app-clienti .pulsante.secondario:hover{background:#29372c;color:#fff;border-color:#76ae84}
.app-clienti button.testo{background:transparent;border-color:transparent;color:#a9e9b7;padding:12px 4px}
.app-clienti button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.app-clienti button.pericolo{background:#301d1e;color:#ffd0ce;border-color:#774a49}
.app-clienti :focus-visible{outline:2px solid #9dffb8;outline-offset:4px}
.app-clienti label{color:#d0d8d2;font-size:15px;font-weight:500;letter-spacing:0}
.app-clienti input,.app-clienti select,.app-clienti textarea{background:#0e1210;color:#f1f5f1;border:1px solid #465249;border-radius:10px;min-height:50px;font-size:16px;padding:13px 14px;box-shadow:none}
.app-clienti input::placeholder,.app-clienti textarea::placeholder{color:#9ba89f;opacity:1}
.app-clienti input:focus,.app-clienti select:focus,.app-clienti textarea:focus{outline:2px solid #67f58e66;border-color:#67f58e;outline-offset:2px}
.app-clienti input[type=checkbox]{accent-color:#67f58e;width:21px;height:21px;min-height:21px;display:inline-block;vertical-align:middle;margin-right:8px;padding:0}
.app-clienti .check{display:block;font-size:15px;line-height:1.8;font-weight:400}
.app-clienti fieldset{border-color:#3d4b40;border-radius:14px}.app-clienti legend{color:#d4ded5}
.app-clienti option{color:#f1f5f1;background:#101612}.app-clienti textarea{line-height:1.7;resize:vertical}
.app-clienti .riquadro{background:#1b271f;color:#d4e1d7;border:1px solid #405b46;border-radius:12px;line-height:1.75}
.app-clienti hr{border:0;border-top:1px solid #344138;margin:26px 0}.app-clienti summary{color:#d1e3d5;padding:12px 0}
/* Copertina: la fotografia dà colore, il marchio respira senza riquadro nero. */
.app-clienti .eroe{position:relative;display:grid;grid-template-columns:1.15fr 1fr;min-height:560px;overflow:hidden;background:#101413;border:1px solid #343c37;border-radius:26px;box-shadow:none;isolation:isolate}
.app-clienti .eroe::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#9dffb8,transparent);opacity:.55;pointer-events:none}
.app-clienti .eroe-testo{padding:34px 42px 36px;align-self:center;position:relative;z-index:3}
.app-clienti .logo-pieno{width:184px;height:auto;margin:0 0 21px;mix-blend-mode:screen;filter:none}
.app-clienti .eroe .occhiello{font-size:10px;color:#b3c0b6;letter-spacing:.15em;margin-bottom:18px}
.app-clienti .eroe h1{font-size:clamp(2.8rem,4.6vw,4.5rem);line-height:1.04;letter-spacing:-.075em;font-weight:500;margin-bottom:0}
.app-clienti .eroe h1 em{font:inherit;color:#9dffb8}
.app-clienti .eroe .intro{font-size:15px;line-height:1.75;max-width:390px;margin:21px 0 24px;color:#b7c0b9}
.app-clienti .eroe .riga{gap:12px}.app-clienti .eroe .pulsante{font-size:14px;padding:14px 19px;white-space:nowrap}
.app-clienti .eroe .riga>.secondario{background:transparent;border-color:transparent;padding-left:0;padding-right:0;color:#d3ddd6;text-decoration:underline;text-underline-offset:6px}
.app-clienti .eroe .nota{font-size:11px;line-height:1.7;color:#a1b1a5;margin:24px 0 0;max-width:370px}
.app-clienti .paesaggio-centro{border-radius:0;min-height:560px;margin:0;background:#140909;position:relative}
.app-clienti .paesaggio-centro>img{object-position:52% 42%;animation:none;transform:none;width:100%;height:100%;object-fit:cover}
.app-clienti .paesaggio-centro::before{background:linear-gradient(90deg,#101413,transparent 26%);z-index:2}
.app-clienti .paesaggio-centro::after{background:linear-gradient(0deg,#070b09b3,transparent 28%);z-index:1}
.app-clienti .firma-centro{font-size:10px;font-weight:500;letter-spacing:.2em;color:#edf3ed;left:28px;bottom:30px;max-width:45%}
.app-clienti .controllo-movimento{background:#111a15dd!important;color:#dbe8de;border-color:#627369;font-size:10px;min-height:40px;padding:9px 12px;border-radius:100px;bottom:22px;right:20px}
/* Trattamenti: immagini grandi, titoli e prezzi leggibili. */
.app-clienti [data-macchina]{--neon-macchina:#67f58e}
.app-clienti .trattamento{background:#121615;position:relative;overflow:hidden;padding:24px;border-radius:20px;display:flex;flex-direction:column;border-color:#333e36}
.app-clienti .trattamento::before{display:none}.app-clienti .trattamento h3{font-size:1.9rem;min-height:0;margin:3px 0 0;color:#f4f5f1;line-height:1.2}
.app-clienti .trattamento .chip{order:0;align-self:flex-start;font-size:10px;background:transparent;border:0;padding:0;color:#b1c7b7;margin-bottom:10px!important;letter-spacing:.09em}
.app-clienti .foto-trattamento{width:100%;margin:20px 0 20px;border:0;border-radius:12px;background:#080a09;overflow:hidden}
.app-clienti .foto-trattamento img{width:100%;height:270px;object-fit:cover;object-position:center 40%;display:block;transition:transform .5s ease;filter:none}
.app-clienti .trattamento:hover .foto-trattamento img{transform:scale(1.025)}
.app-clienti [data-macchina=viso] .foto-trattamento img{object-position:44% center}
.app-clienti .trattamento .dettagli-trattamento{display:flex;justify-content:space-between;align-items:center;font-size:14px;gap:10px;margin-bottom:22px}
.app-clienti .dettagli-trattamento strong{font-size:26px;color:#f2f7f1;font-weight:500;letter-spacing:-.06em}
.app-clienti .trattamento .pulsante{width:100%;text-align:center;border-color:#4a5c4e;font-size:14px;margin-top:auto}
.app-clienti .trattamento:hover{border-color:#65836d}
.app-clienti #contenuto[data-pagina=benvenuto]>section:last-child{grid-template-columns:repeat(2,minmax(0,1fr));padding-top:10px}
.app-clienti #contenuto[data-pagina=benvenuto]>section:last-child .scheda{background:transparent;border:0;border-top:1px solid #303b34;border-radius:0;padding:28px 8px}
.app-clienti #contenuto[data-pagina=benvenuto]>section:last-child h3{font-size:1.45rem}
/* Prenotazioni e saldi. */
.app-clienti #form-prenota{align-self:start}.app-clienti #elenco-slot{gap:8px;padding:4px 3px 10px;margin:0 -3px;scrollbar-color:#55725d #101713}
.app-clienti .slot{background:#1b251e;color:#dce8de;border:1px solid #4b6452;border-radius:9px;min-width:67px;min-height:46px;padding:10px 12px;font-size:14px;box-shadow:none}
.app-clienti .slot[aria-pressed=true]{background:#67f58e;border-color:#67f58e;color:#082111;box-shadow:none}
.app-clienti #scelta-orario{padding:13px 16px;border-left:2px solid #67f58e;background:#1c2820;color:#d9ecde;border-radius:0 8px 8px 0;margin:20px 0}
.app-clienti .riepilogo-trattamento{background:#151c18;align-self:start}.app-clienti .riepilogo-trattamento h2{font-size:2.2rem}.app-clienti .riepilogo-trattamento .foto-trattamento img{height:330px}
.app-clienti .voce{border-left:3px solid #67f58e}.app-clienti .voce h3{font-size:1.45rem}.app-clienti .voce p{font-size:15px}
.app-clienti #contenuto[data-pagina=portafoglio] .griglia{grid-template-columns:repeat(2,minmax(0,1fr))}
.app-clienti .fedelta-viva{position:relative;background:linear-gradient(125deg,#34433a,#1d2921 50%,#101a13);border:1px solid #6d8274;box-shadow:inset 0 1px 0 #d7ffe338,0 22px 45px #0004;grid-column:1/-1;padding:34px!important;overflow:hidden;border-radius:22px;min-height:0}
.app-clienti .fedelta-viva::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(105deg,transparent 0 5px,#d5f8dd04 5px 6px);pointer-events:none}
.app-clienti .sigillo-tessera{position:absolute;right:25px;top:22px;width:65px;height:65px;background:url('/app/icone/grifone.svg') center/contain no-repeat;mix-blend-mode:screen;font-size:0!important;opacity:.6}
.app-clienti .fedelta-viva .occhiello{color:#d5efdd;font-size:12px;letter-spacing:.22em;margin-bottom:28px}
.app-clienti .timbri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin:16px 0 30px;position:relative}
.app-clienti .colonna-timbri b{font-size:16px;color:#eff8ef;font-weight:500}.app-clienti .colonna-timbri small{color:#c6d9cb;font-size:12px}
.app-clienti .caselle{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;max-width:260px;margin:12px 0}
.app-clienti .casella{width:100%;height:auto;aspect-ratio:1;max-height:42px;border:1px solid #849e8c;border-radius:50%;color:#a8c0b0;opacity:1;background:#07120c44}
.app-clienti .casella.piena{background:#a2f7b8;color:#12301c;border-color:#a2f7b8;box-shadow:inset 0 0 0 3px #23492f33}
.app-clienti .fedelta-viva p{color:#d1dfd4;max-width:680px}.app-clienti .codice-grande{background:#0c1710;color:#dcf9e3;border-color:#779d82;font-size:1.25rem;padding:9px 14px;border-radius:8px}
.app-clienti .saldo-vivo{background:#181f1a;min-height:210px}.app-clienti .saldo-vivo .numero{font-size:3.1rem;color:#e5f7e9;margin:18px 0}
.app-clienti .prezzo{font-size:3rem;color:#f0f8f1}.app-clienti code{color:#c8fbd6;background:#102217;border:1px solid #486d52;border-radius:7px;padding:7px 11px;display:inline-block;max-width:100%;overflow-wrap:anywhere}
/* Navigazione stabile e accesso. */
.app-clienti .navigazione{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);width:min(560px,calc(100% - 32px));margin:0;padding:8px;border-radius:22px;background:#171e1b;border:1px solid #4b5b50;box-shadow:0 12px 45px #0008;z-index:25;backdrop-filter:none}
.app-clienti .navigazione a{color:#bcc9c0;font-size:22px;gap:5px;min-height:57px;padding:9px 5px;border-radius:14px;transition:background .2s,color .2s}
.app-clienti .navigazione a svg{width:22px;height:22px}.app-clienti .navigazione span{font-size:11px;font-weight:600;letter-spacing:0;white-space:nowrap;margin:0}
.app-clienti .navigazione a[aria-current=page]{background:#9dffb8;color:#092814}.app-clienti .navigazione a:hover{background:#2b4132;color:#fff}
.app-clienti footer{padding:30px 24px 125px;font-size:12px;line-height:1.8;color:#a2afa7;max-width:1000px;margin:auto;border-top:1px solid #2b3730}
.app-clienti #dialogo-accesso{background:#151c17;color:#f2f6f1;border:1px solid #526859;width:min(500px,calc(100vw - 30px));border-radius:22px;padding:30px;box-shadow:0 30px 90px #000a}
.app-clienti #dialogo-accesso::backdrop{background:#000b;backdrop-filter:blur(4px)}
.app-clienti .chiudi{float:right;width:40px;height:40px;min-height:40px;border-radius:50%;padding:0;background:#2b382e;color:#e4f5e8;border:1px solid #607666;font-size:26px}
.app-clienti #titolo-accesso{font-size:2.1rem}.app-clienti #cambia-accesso{font-size:14px;width:100%;line-height:1.5}
.app-clienti .errore{color:#ffb4af}.app-clienti #messaggio{background:#d9f5e1;color:#112b19;border:1px solid #8ec89f;box-shadow:0 10px 45px #0005;font-size:15px}
.app-clienti .testo-legale{max-width:860px}.app-clienti .testo-legale p{color:#c2cec5;font-size:16px;line-height:1.85}.app-clienti .testo-legale h2{font-size:1.4rem}
.app-clienti .vuoto h1{font-size:2.7rem}.app-clienti .vuoto .intro{margin-left:auto;margin-right:auto}
.app-clienti .barra-anteprima{background:#17211a;color:#c8d8cc;border-color:#415748;font-size:12px}
@media(min-width:1450px){.app-clienti main{max-width:1380px}.app-clienti .eroe-testo{padding-left:54px}.app-clienti .eroe h1{font-size:4.8rem}.app-clienti .eroe{min-height:590px}}
@media(max-width:1000px) and (min-width:741px){.app-clienti .eroe-testo{padding:30px}.app-clienti .eroe h1{font-size:3.1rem}.app-clienti .eroe .pulsante{font-size:13px;padding:12px 15px}.app-clienti .trattamento{padding:18px}.app-clienti .foto-trattamento img{height:230px}.app-clienti .trattamento .pulsante{font-size:12px;padding:12px}.app-clienti .griglia:has(.trattamento){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:740px){
 .app-clienti .testata{padding:16px 20px;min-height:76px}.app-clienti .testata .marchio{font-size:24px}.app-clienti #stato-rete{display:none}
 .app-clienti main{padding:0 16px;margin-top:18px}.app-clienti .banner{font-size:8px;letter-spacing:.06em}.app-clienti h1{font-size:2.75rem}
 .app-clienti .eroe{display:block;min-height:0;border-radius:22px}.app-clienti .eroe-testo{padding:27px 24px 26px}.app-clienti .logo-pieno{width:144px;margin:0 0 22px}
 .app-clienti .eroe h1{font-size:clamp(2.6rem,10.5vw,4rem);line-height:1.07}.app-clienti .eroe .occhiello{font-size:9px;margin-bottom:17px;letter-spacing:.09em}
 .app-clienti .eroe .intro{font-size:14px;line-height:1.7;margin:19px 0 21px;max-width:360px}.app-clienti .eroe .riga{gap:8px 16px}
 .app-clienti .eroe .pulsante{font-size:14px;padding:13px 17px;min-height:48px}.app-clienti .eroe .riga>.secondario{font-size:12px;min-height:42px}
 .app-clienti .eroe .nota{font-size:10px;margin-top:18px}.app-clienti .paesaggio-centro{height:280px;min-height:280px;margin:0;border-radius:0}
 .app-clienti .paesaggio-centro>img{object-position:center 36%}.app-clienti .paesaggio-centro::before{background:linear-gradient(#101413,transparent 22%)}
 .app-clienti .firma-centro{font-size:9px;left:24px;bottom:26px}.app-clienti .controllo-movimento{font-size:9px;min-height:44px}
 .app-clienti .riga-titolo{align-items:flex-start;flex-direction:column;gap:10px;margin-top:36px}.app-clienti .riga-titolo h2{font-size:1.85rem}.app-clienti .riga-titolo .nota{font-size:12px}
 .app-clienti .griglia,.app-clienti #contenuto[data-pagina=benvenuto]>section:last-child,.app-clienti #contenuto[data-pagina=portafoglio] .griglia{grid-template-columns:1fr}
 .app-clienti .trattamento{padding:22px}.app-clienti .trattamento h3{font-size:1.95rem}.app-clienti .foto-trattamento img{height:300px;aspect-ratio:auto;max-height:none}.app-clienti .trattamento .pulsante{font-size:15px}
 .app-clienti .scheda,.app-clienti .voce{padding:24px}.app-clienti .colonne{grid-template-columns:1fr}.app-clienti label{font-size:15px}
 .app-clienti #form-prenota>.colonne{grid-template-columns:1fr 1fr;gap:12px}.app-clienti #form-prenota>.colonne>*{min-width:0}.app-clienti #form-prenota select,.app-clienti #form-prenota input{min-width:0}
 .app-clienti .fedelta-viva{padding:26px!important}.app-clienti .timbri{grid-template-columns:1fr;gap:20px}.app-clienti .caselle{max-width:none;grid-template-columns:repeat(10,1fr);gap:5px}.app-clienti .casella{max-height:31px;font-size:12px}
 .app-clienti .fedelta-viva .occhiello{margin-bottom:30px}.app-clienti .sigillo-tessera{width:50px;height:50px}.app-clienti .navigazione{bottom:max(10px,env(safe-area-inset-bottom));width:calc(100% - 24px);padding:6px;border-radius:20px}.app-clienti .navigazione span{font-size:10px}.app-clienti .navigazione a{min-height:56px;padding:9px 3px}
 .app-clienti footer{font-size:11px;padding:24px 20px 120px;overflow-wrap:anywhere}.app-clienti #dialogo-accesso{padding:26px 22px}.app-clienti .testo-legale p{font-size:15px}.app-clienti .testo-legale{padding:25px 22px}
}
@media(max-width:380px){.app-clienti .eroe-testo{padding:25px 21px}.app-clienti .eroe .riga{display:block}.app-clienti .eroe .pulsante{display:block;text-align:center}.app-clienti .eroe .nota{margin-top:12px}.app-clienti #form-prenota>.colonne{grid-template-columns:1fr}.app-clienti .caselle{gap:4px}}
@media(prefers-reduced-motion:reduce){.app-clienti *,.app-clienti *::before,.app-clienti *::after{animation:none!important;transition:none!important}}
/* Una lama di luce sulla cornice, senza filtri o animazioni continue della foto. */
@media(prefers-reduced-motion:no-preference){.app-clienti .eroe::after{animation:bagliore-bordo 8s ease-in-out infinite alternate}@keyframes bagliore-bordo{from{opacity:.2;transform:scaleX(.55)}to{opacity:.8;transform:scaleX(1)}}}
/* Copertina da telefono: fotografia immersiva e comandi sul fondale scuro. */
@media(max-width:740px){
 .app-clienti .eroe{isolation:isolate;min-height:650px;background:#0c110e}
 .app-clienti .eroe-testo{padding:260px 24px 27px}
 .app-clienti .eroe .logo-pieno{position:absolute;left:24px;top:24px;width:142px;filter:drop-shadow(0 2px 8px #07110d);margin:0}
 .app-clienti .eroe .occhiello{font-size:9px;letter-spacing:.1em;margin-bottom:16px;color:#bfe9ce}
 .app-clienti .eroe h1{font-size:clamp(2.6rem,10vw,4rem);letter-spacing:-.06em}
 .app-clienti .eroe .intro{font-size:14px;line-height:1.65;margin:18px 0 20px;color:#c0d3c6}
 .app-clienti .eroe .riga{gap:8px 14px}.app-clienti .eroe .nota{font-size:10px;color:#abc2b4;margin-top:14px}
 .app-clienti .paesaggio-centro{position:absolute;inset:0;z-index:0;height:100%;min-height:0;overflow:hidden}
 .app-clienti .paesaggio-centro>img{object-position:57% 0;object-fit:cover}
 .app-clienti .paesaggio-centro::before{background:linear-gradient(180deg,#08110d77 0,transparent 20%,#0c110eaa 34%,#0c110ef5 47%,#0c110e 70%);z-index:2}
 .app-clienti .paesaggio-centro::after{background:linear-gradient(90deg,#08110d77,transparent 65%)}
 .app-clienti .firma-centro{display:none}.app-clienti .paesaggio-centro .controllo-movimento{top:16px;right:14px;bottom:auto;font-size:8px;min-height:40px;padding:8px 10px;z-index:4}
}