/* App Toleo (prototipo) — mobile prima di tutto */
.app{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#eef8f9 0,var(--fondo) 280px)}
.testa{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;max-width:760px;width:100%;margin:0 auto}
.marchio{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--mar)}
.marchio img{height:40px;width:auto}
.marchio b{display:block;font:700 1.2rem/1 Fraunces,serif;letter-spacing:.04em}
.marchio small{display:block;font:500 .58rem Inter;letter-spacing:.22em;color:var(--agua);margin-top:.15rem}
.app .lingue{display:flex;gap:2px;background:#fff;border:1px solid rgba(18,50,74,.1);border-radius:99px;padding:3px}
.app .lingue button{font:600 .74rem Inter;border:0;background:none;color:var(--suave);border-radius:99px;padding:.3rem .55rem;cursor:pointer}
.app .lingue button[aria-pressed=true]{background:var(--mar);color:#fff}
.prova{font-size:.75rem;text-align:center;color:#8a5a12;background:#fdf1dc;padding:.35rem 16px}
.app main{flex:1;max-width:760px;width:100%;margin:0 auto;padding:18px 16px 28px}
.passo{display:none}.passo.attivo{display:block;animation:entra .25s ease-out}
@keyframes entra{from{opacity:0;transform:translateY(6px)}}
.app h1{font:700 clamp(1.9rem,6vw,2.6rem)/1.08 Fraunces,serif;color:var(--mar);letter-spacing:-.01em}
.app h2{font:700 1.5rem/1.15 Fraunces,serif;color:var(--mar);margin-bottom:.7rem}
.app h3{font:700 1.25rem Fraunces,serif;color:var(--mar);margin-bottom:.5rem}
.app h4{font:600 .95rem Inter;color:var(--mar);margin:1.1rem 0 .4rem}
.sotto{color:#3c4c57;margin:.8rem 0 1.2rem}
.cerca{display:flex;gap:8px;margin-bottom:10px}
.cerca input{flex:1;min-width:0;font:inherit;font-size:1rem;padding:.85rem 1rem;border:1px solid var(--bordo);border-radius:14px;background:#fff}
.bottone{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font:600 1rem Inter;background:var(--mar);color:#fff;border:0;border-radius:14px;padding:.85rem 1.2rem;cursor:pointer;text-decoration:none}
.bottone:disabled{opacity:.45;cursor:default}
.bottone.chiaro{background:#fff;color:var(--mar);border:1px solid rgba(18,50,74,.25)}
.bottone.oro{background:var(--sol);color:#1d2a33}
.bottone.grande{width:100%;padding:1rem;margin-top:14px}
.indietro{display:block;margin:14px auto 0;background:none;border:0;color:var(--suave);font:500 .9rem Inter;cursor:pointer}
.risultati{list-style:none;margin:12px 0}
.risultati li button{width:100%;text-align:left;background:#fff;border:1px solid var(--bordo);border-radius:12px;padding:.75rem .9rem;margin-bottom:6px;font:inherit;font-size:.9rem;cursor:pointer;color:var(--texto)}
.risultati li.msg{color:var(--suave);font-size:.9rem;padding:.4rem 0}
.mappa{height:min(58vh,440px);border-radius:18px;overflow:hidden;box-shadow:0 18px 40px -26px rgba(18,50,74,.6);background:#cfd8dc}
.dove{font-size:.82rem;color:var(--suave);margin:.5rem 0 .2rem;min-height:1.2em}
.scelte{display:grid;gap:12px;margin-top:10px;background:#fff;border:1px solid var(--bordo);border-radius:16px;padding:14px}
.scelte label{display:grid;gap:.35rem;font-weight:500;font-size:.92rem;color:var(--mar)}
.scelte output{font:700 1.1rem Inter;color:var(--mar);justify-self:start}
.scelte label:first-child{grid-template-columns:1fr auto}
.scelte label:first-child input,.scelte label:first-child small{grid-column:1/-1}
.scelte small{color:var(--suave);font-weight:400}
.scelte select{font:inherit;padding:.65rem .7rem;border:1px solid var(--bordo);border-radius:10px;background:#fff}
.scelte input[type=range]{accent-color:var(--agua);width:100%}
.scelte .spunta{display:flex;align-items:center;gap:.6rem}
.scelte .spunta input{width:20px;height:20px;accent-color:var(--agua)}
.cifre{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.cifre div{background:#fff;border:1px solid var(--bordo);border-radius:16px;padding:14px}
.cifre b{display:block;font:700 1.55rem/1.1 Fraunces,serif;color:var(--mar)}
.cifre small{color:var(--suave)}
.cifre .oro{background:var(--mar);border-color:var(--mar)}.cifre .oro b{color:var(--sol)}.cifre .oro small{color:#cfe3ea}
.grafico{display:flex;gap:4px;align-items:flex-end;height:110px;margin-top:16px;padding:10px 10px 0;background:#fff;border:1px solid var(--bordo);border-radius:16px 16px 0 0;border-bottom:0}
.grafico i{flex:1;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--sol),#f7c77d);transform-origin:bottom;animation:cresci .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes cresci{from{transform:scaleY(0)}}
.mesi{display:flex;gap:4px;padding:4px 10px 8px;background:#fff;border:1px solid var(--bordo);border-top:0;border-radius:0 0 16px 16px;font:500 .58rem 'JetBrains Mono',ui-monospace,monospace;color:var(--suave)}
.mesi span{flex:1;text-align:center}
.piscina-box{font-size:.92rem;background:#e9f7f8;border-color:#bfe6ea}
.premium{margin-top:18px;border-radius:20px;background:#fff;border:1px solid var(--bordo);padding:18px;box-shadow:0 18px 40px -30px rgba(18,50,74,.6)}
.lucchetto ul{list-style:none;margin:.4rem 0 .2rem;display:grid;gap:.45rem}
.lucchetto li{padding-left:1.6rem;position:relative;font-size:.95rem}
.lucchetto li::before{content:"🔒";position:absolute;left:0;font-size:.85rem}
.disegno{margin:0;border-radius:14px;overflow:hidden;position:relative}
.disegno img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.disegno figcaption{font-size:.8rem;color:var(--suave);padding:.5rem .2rem 0}
.aiuti{list-style:none;display:grid;gap:8px}
.aiuti li{background:var(--arena);border-radius:12px;padding:.7rem .85rem;font-size:.9rem}
.aiuti li b{color:var(--mar)}
.aiuti li small{display:block;color:var(--suave);margin-top:.2rem}
.sbloccato .bottone{margin:8px 8px 0 0}
.paga{margin:auto;width:calc(100% - 32px);border:0;border-radius:18px;padding:22px;max-width:360px;box-shadow:0 30px 60px -20px rgba(0,0,0,.4)}
.paga::backdrop{background:rgba(18,50,74,.45)}
.paga p{margin:.4rem 0 1rem;color:#3c4c57}
.app .piede{padding:16px;text-align:center;font-size:.78rem;color:var(--suave)}
.leaflet-container{font:inherit}
@media (min-width:640px){.cifre{grid-template-columns:repeat(4,1fr)}}
@media print{.testa,.prova,.indietro,.lucchetto,.piede,.sbloccato .bottone,#passo1,#passo2{display:none!important}.passo{display:block!important}}
@media (prefers-reduced-motion:reduce){.passo.attivo,.grafico i{animation:none}}
