/* Inter self-hosted (subset latin): niente richieste a Google pre-consenso, niente @import render-blocking */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/inter-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/inter-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url(fonts/inter-900-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  /* CLARITY light theme (cobalto/ciano/inchiostro) */
  --bg:#ffffff; --panel:#f5f7fb; --panel2:#eaf0fb; --line:#e3e8f0;
  --txt:#0b1220; --muted:#3f4b5b; --accent:#2563eb;
  --open:#16a34a; --prep:#d97706; --closed:#64748b; --danger:#dc2626;
  --gold:#f59e0b;
  --gold-txt:#8a5a00; /* oro per TESTO su fondo chiaro: contrasto WCAG AA (l'oro pieno resta per sfondi/bordi) */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.55;
  background:var(--bg);color:var(--txt);-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}

/* NAV */
nav{position:sticky;top:0;z-index:20;background:rgba(10,37,64,.9);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px;flex-shrink:0}
.logo img{width:30px;height:30px;border-radius:8px}
.logo img.brand{width:auto;height:40px;max-width:min(72vw,280px);object-fit:contain;border-radius:0;box-shadow:none}
.logo .pin{color:var(--accent)}
.nav-cta{display:flex;gap:10px;align-items:center}
.btn{cursor:pointer;border:none;border-radius:10px;padding:10px 16px;font-size:14px;
  font-weight:700;font-family:inherit}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{filter:brightness(1.08)}
.btn-ghost{background:transparent;color:var(--txt);border:1px solid var(--line)}
.btn-gold{background:var(--gold);color:#1a1206}
.btn-sm{padding:7px 12px;font-size:13px}

/* HERO */
.hero{padding:64px 0 40px;text-align:center;position:relative;overflow:hidden}
.hero h1{font-size:clamp(28px,5vw,46px);line-height:1.1;margin:0 0 16px;font-weight:850;
  letter-spacing:-.5px}
.hero h1 .hl{color:var(--accent)}
.hero p.sub{font-size:clamp(16px,2.2vw,19px);color:var(--muted);max-width:680px;margin:0 auto 28px}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.hero-note{margin-top:14px;font-size:13px;color:var(--muted)}
.hero-stats{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.hstat .n{font-size:30px;font-weight:850;color:var(--accent)}
.hstat .l{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}

/* SECTIONS */
section.block{padding:46px 0;border-top:1px solid var(--line)}
.h2{font-size:26px;font-weight:800;margin:0 0 6px;text-align:center}
.h2sub{color:var(--muted);text-align:center;margin:0 auto 30px;max-width:620px;font-size:16px}

/* PRICING */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:760px;margin:0 auto}
.plan{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px}
.plan.pro{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.plan h3{margin:0 0 4px;font-size:19px}
.plan .price{font-size:34px;font-weight:850;margin:10px 0}
.plan .price small{font-size:14px;color:var(--muted);font-weight:600}
.plan ul{list-style:none;padding:0;margin:14px 0 20px;font-size:15px;line-height:1.9}
.plan li:before{content:"✓ ";color:var(--open);font-weight:800}
.plan li.no{color:var(--muted)}
.plan li.no:before{content:"– ";color:var(--muted)}
.badge-pop{display:inline-block;background:var(--accent);color:#06151b;font-size:11px;
  font-weight:800;padding:3px 9px;border-radius:20px;margin-bottom:8px;text-transform:uppercase}
.plans.plans-3{max-width:1000px;grid-template-columns:1fr 1fr 1fr}
.plan.studio{border-color:var(--gold);box-shadow:0 0 0 1px rgba(245,158,11,.4) inset}
.badge-studio{display:inline-block;background:var(--gold);color:#1a1206;font-size:11px;
  font-weight:800;padding:3px 9px;border-radius:20px;margin-bottom:8px;text-transform:uppercase}
.plan .price-alt{font-size:12.5px;color:var(--muted);margin:-4px 0 2px}
.plan .plan-note{font-size:12.5px;color:var(--muted);margin-top:10px;text-align:center}

/* UNA TANTUM: Pass Gara + Dossier */
.oneoff{max-width:1000px;margin:30px auto 0}
.oneoff-hd{text-align:center;font-size:15px;font-weight:700;color:var(--txt);margin-bottom:16px}
.oneoff-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.oneoff-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;
  display:flex;flex-direction:column}
.oneoff-card.pass{border-color:var(--gold);box-shadow:0 0 0 1px rgba(245,158,11,.4) inset}
.oneoff-tag{font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);font-weight:700}
.oneoff-card h4{margin:6px 0 2px;font-size:17px}
.oneoff-price{font-size:28px;font-weight:850;margin:4px 0 8px}
.oneoff-price.oneoff-quote{font-size:18px;color:var(--gold-txt)}
.oneoff-card.pass .oneoff-price{color:var(--gold-txt)}
.oneoff-card p{font-size:13px;color:var(--muted);line-height:1.55;margin:0 0 16px;flex:1}
.oneoff-card .btn{width:100%;text-align:center}

@media(max-width:900px){
  .oneoff-grid{grid-template-columns:1fr}
}

/* PERCHÉ NOI */
.why{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;max-width:1000px;margin:0 auto}
.whycol{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px}
.whycol.good{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.whyhd{font-weight:800;font-size:15px;margin-bottom:12px}
.whylist{list-style:none;padding:0;margin:0;font-size:13.5px;line-height:1.7}
.whylist li{padding-left:22px;position:relative;margin-bottom:6px;color:var(--muted)}
.whylist.bad li:before{content:"✕";position:absolute;left:0;color:var(--closed);font-weight:800}
.whylist.good li{color:var(--txt)}
.whylist.good li:before{content:"✓";position:absolute;left:0;color:var(--open);font-weight:800}

/* CONSENSO form */
.consent{flex-basis:100%;font-size:12px;color:var(--muted);line-height:1.5;
  display:flex;gap:8px;align-items:flex-start;text-align:left;margin-top:4px}
.consent input{flex:none;width:auto;min-width:0;margin-top:2px}
.consent a{color:var(--accent)}

/* RADAR APP */
#radar{scroll-margin-top:70px}
.kpis{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:0 0 22px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 16px;min-width:110px;text-align:center}
.kpi .n{font-size:24px;font-weight:800}
.kpi .l{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.kpi.open .n{color:var(--open)} .kpi.prep .n{color:var(--prep)}
.kpi.closed .n{color:var(--closed)} .kpi.urgent .n{color:var(--danger)}

.controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center;
  margin-bottom:20px;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
input,select{background:var(--panel2);color:var(--txt);border:1px solid var(--line);
  border-radius:8px;padding:9px 12px;font-size:13px;font-family:inherit}
input#q{min-width:220px;flex:1}
.chip{cursor:pointer;user-select:none;padding:8px 13px;border-radius:20px;border:1px solid var(--line);
  font-size:12px;background:var(--panel2);color:var(--muted)}
.chip.on{color:#06151b;font-weight:700}
.chip.open.on{background:var(--open);border-color:var(--open)}
.chip.prep.on{background:var(--prep);border-color:var(--prep)}
.chip.closed.on{background:var(--closed);border-color:var(--closed);color:#fff}
.locked-ctrl{position:relative;opacity:.55;pointer-events:none}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;position:relative}
.card .stripe{height:5px}
.stripe.A{background:var(--open)} .stripe.P{background:var(--prep)} .stripe.C{background:var(--closed)}
.card .body{padding:15px 16px 16px;flex:1;display:flex;flex-direction:column;gap:9px}
.row1{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.comune{font-size:17px;font-weight:800;line-height:1.15}
.prov{color:var(--muted);font-size:12px}
.badges{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.badge{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:6px;white-space:nowrap;
  text-transform:uppercase;letter-spacing:.4px}
.badge.A{background:rgba(34,197,94,.15);color:var(--open);border:1px solid rgba(34,197,94,.4)}
.badge.P{background:rgba(245,158,11,.15);color:var(--prep);border:1px solid rgba(245,158,11,.4)}
.badge.C{background:rgba(100,116,139,.15);color:#9fb0c0;border:1px solid rgba(100,116,139,.4)}
.cd{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:6px;white-space:nowrap}
.cd.soon{background:var(--danger);color:#fff}
.cd.ok{background:rgba(56,189,248,.15);color:var(--accent);border:1px solid rgba(56,189,248,.35)}
.regione{color:var(--muted);font-size:12px}
.lotti{font-size:13px}
.facts{font-size:12.5px;line-height:1.5}
.facts b{color:var(--muted);font-weight:600}
.note{font-size:12px;background:rgba(56,189,248,.07);border-left:3px solid var(--accent);
  padding:7px 10px;border-radius:0 6px 6px 0;color:#cfe9e4}
.crit{font-size:12px;background:rgba(239,68,68,.08);border-left:3px solid var(--danger);
  padding:7px 10px;border-radius:0 6px 6px 0;color:#f3c3c3}
.links{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.links a{font-size:11.5px;background:var(--panel2);border:1px solid var(--line);padding:5px 10px;border-radius:7px}

/* LOCK overlay sui contenuti Pro */
.lock{filter:blur(5px);user-select:none;pointer-events:none}
.pro-tag{position:absolute;top:10px;right:10px;background:var(--gold);color:#1a1206;font-size:10px;
  font-weight:800;padding:3px 8px;border-radius:6px;z-index:2;text-transform:uppercase;letter-spacing:.4px}
.card .unlock-hint{font-size:11.5px;color:var(--gold-txt);display:flex;align-items:center;gap:6px}

.empty{padding:50px;text-align:center;color:var(--muted);grid-column:1/-1}

/* BANNER stato Pro */
.pro-banner{background:linear-gradient(90deg,rgba(251,191,36,.12),rgba(56,189,248,.08));
  border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-bottom:22px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pro-banner.active{border-color:var(--open)}
.pro-banner .txt{font-size:13.5px}
.pro-banner .txt b{color:var(--gold-txt)}
.pro-banner.active .txt b{color:var(--open)}

/* MODALE */
.modal{position:fixed;inset:0;background:rgba(4,10,16,.75);display:none;align-items:center;
  justify-content:center;z-index:50;padding:20px}
.modal.show{display:flex}
.modal-box{background:var(--panel);border:1px solid var(--line);border-radius:16px;max-width:440px;
  width:100%;padding:26px;position:relative}
.modal-box h3{margin:0 0 6px;font-size:20px}
.modal-box p{color:var(--muted);font-size:14px;margin:0 0 16px}
.modal-box input{width:100%;margin-bottom:12px}
.modal-x{position:absolute;top:14px;right:16px;cursor:pointer;color:var(--muted);font-size:22px;background:none;border:none}
.modal .err{color:var(--danger);font-size:13px;min-height:18px;margin-top:4px}
.modal .alt{font-size:12.5px;color:var(--muted);margin-top:14px;text-align:center}

/* A2HS hint */
.a2hs{font-size:12.5px;color:var(--muted);text-align:center;margin-top:10px}

footer{border-top:1px solid var(--line);padding:30px 0 50px;color:var(--muted);font-size:12.5px;text-align:center}
footer a{color:var(--muted)}

/* esempio reale in hero */
.example{display:inline-flex;align-items:center;gap:10px;background:var(--panel);
  border:1px solid var(--line);border-left:4px solid var(--open);border-radius:10px;
  padding:9px 14px;margin:0 auto 6px;font-size:13.5px;max-width:520px}
.example .lbl{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.5px}
.example b{color:var(--txt)} .example .gg{color:var(--danger);font-weight:800}
.updated{display:inline-flex;align-items:center;gap:7px;font-size:15px;font-weight:700;color:var(--txt);margin-top:14px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18)}
.updated .dot{color:var(--open);font-size:13px;animation:updPulse 2s ease-in-out infinite}
@keyframes updPulse{0%,100%{opacity:1}50%{opacity:.35}}

/* banner urgenza */
.urgency{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.35);color:#f3c3c3;
  border-radius:12px;padding:12px 16px;margin-bottom:14px;font-size:14px;text-align:center;font-weight:600}
.urgency b{color:#fff}

/* chip watchlist */
.chip.mine{border-color:var(--gold);color:var(--gold-txt)}
.chip.mine.on{background:var(--gold);color:#1a1206;font-weight:700}

/* stellina watchlist sulle card */
.star{position:absolute;top:9px;right:9px;z-index:3;cursor:pointer;background:rgba(12,22,32,.7);
  border:1px solid var(--line);border-radius:8px;width:30px;height:30px;display:flex;align-items:center;
  justify-content:center;font-size:15px;color:var(--muted);line-height:1}
.star:hover{color:var(--gold)}
.star.on{color:var(--gold);border-color:var(--gold)}
.card .pro-tag{right:46px}

/* form alert */
.alertform{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.alertform input{flex:1;min-width:200px}
.alertform .btn{white-space:nowrap}
.formmsg{flex-basis:100%;text-align:center;font-size:13px;margin-top:6px;min-height:18px}
.formmsg.ok{color:var(--open)} .formmsg.err{color:var(--danger)}

/* FAQ */
.faqlist details{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:14px 16px;margin-bottom:10px}
.faqlist summary{cursor:pointer;font-weight:700;font-size:15px;list-style:none}
.faqlist summary::-webkit-details-marker{display:none}
.faqlist summary:before{content:"+ ";color:var(--accent);font-weight:800}
.faqlist details[open] summary:before{content:"– "}
.faqlist p{color:var(--muted);font-size:14px;margin:10px 0 2px;line-height:1.6}

/* MAPPA */
.map-shell{position:relative;border-radius:14px}
#map{height:460px;border:1px solid var(--line);border-radius:14px;background:var(--panel);z-index:1}
/* free: mappa sfocata, pallini non leggibili, niente interazione */
.map-shell.locked #map{filter:blur(7px) saturate(.85);pointer-events:none;user-select:none}
.map-lock{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;
  border-radius:14px;background:radial-gradient(ellipse at center,rgba(12,22,32,.35),rgba(12,22,32,.72))}
/* FIX: l'attributo [hidden] da solo non basta perché .map-lock forza display:flex.
   Quando è nascosto (utente Pro) la regola sotto vince e l'overlay sparisce. */
.map-lock[hidden]{display:none}
.map-lock-card{max-width:420px;text-align:center;padding:22px 24px;border-radius:16px;
  background:rgba(15,25,36,.92);border:1px solid var(--line);box-shadow:0 18px 50px rgba(0,0,0,.45)}
.map-lock-ico{font-size:30px;margin-bottom:8px}
.map-lock-txt b{display:block;font-size:19px;color:#fff;margin-bottom:6px}
.map-lock-txt span{display:block;font-size:13.5px;color:var(--muted);line-height:1.5;margin-bottom:16px}
.leaflet-popup-content{font-size:13px;line-height:1.5}
.leaflet-popup-content a{color:#0a66c2;font-weight:700}
.map-legend{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:12px;font-size:12.5px;color:var(--muted)}
.map-legend i{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:6px;vertical-align:-1px;border:1px solid #0c1620}
.map-legend .dot-a{background:var(--open)} .map-legend .dot-p{background:var(--prep)} .map-legend .dot-c{background:var(--closed)}
@media(max-width:620px){ #map{height:360px} }

/* GARE APERTE ORA */
.aperte-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;max-width:1040px;margin:0 auto}
.aperta-card{display:block;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--open);
  border-radius:12px;padding:14px 16px;color:var(--txt)}
.aperta-card:hover{border-color:var(--open);text-decoration:none}
.aperta-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.aperta-com{font-size:17px;font-weight:800;line-height:1.15}
.aperta-reg{font-size:12px;color:var(--muted);margin-top:2px}
.aperta-lotti{font-size:12.5px;margin-top:7px;color:#cfe9e4}
/* card "gara aperta" oscurata per la versione gratuita: città + dettagli visibili come forma, ma illeggibili.
   La riga in alto (badge + countdown) resta FUORI dal blur: l'urgenza si deve vedere anche da non abbonati. */
.aperta-card.locked{position:relative;overflow:hidden;cursor:pointer}
.aperta-card.locked .aperta-top{position:relative;z-index:2}
.aperta-card.locked .ac-body{filter:blur(5px);user-select:none;pointer-events:none;opacity:.85}
.aperta-card.locked .ac-lock{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;
  background:rgba(12,22,32,.5);border-radius:inherit}
.aperta-card.locked .ac-lock span{font-weight:800;color:var(--gold-txt);font-size:14px;
  background:rgba(15,25,36,.92);border:1px solid var(--line);padding:7px 14px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.4)}
.aperta-card.locked:hover{border-color:var(--gold)}

/* TRUST strip */
.trust{font-size:13px;color:var(--muted);text-align:center;margin-bottom:14px}
.trust b{color:var(--txt)}

/* RICERCHE SALVATE */
.saved{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;margin:-8px 0 18px}
.chip.save{border-color:var(--accent);color:var(--accent)}
.chip.del{border-color:var(--danger);color:var(--danger)}
.saved select{font-size:12px}

/* PULSANTE DOCUMENTI nelle card */
.btn-docs{margin-top:6px;cursor:pointer;background:var(--panel2);color:var(--accent);
  border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:12px;font-weight:700;
  font-family:inherit;text-align:left}
.btn-docs:hover{border-color:var(--accent)}

/* MODALE DOCUMENTI */
.doclist{display:flex;flex-direction:column;gap:2px;max-height:48vh;overflow:auto;margin-top:4px}
.docitem{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--txt);
  padding:8px 6px;border-bottom:1px solid var(--line);cursor:pointer}
.docitem input{flex:none;width:auto;min-width:0;margin:2px 0 0}
.docitem input:checked+span{color:var(--muted);text-decoration:line-through}

/* SIMULATORE */
.sim{max-width:840px;margin:0 auto}
.sim-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.simq{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.simq-t{font-size:14px;font-weight:700;margin-bottom:10px}
.simq-opts{display:flex;flex-direction:column;gap:7px}
.simopt{cursor:pointer;text-align:left;background:var(--panel2);color:var(--muted);border:1px solid var(--line);
  border-radius:8px;padding:9px 12px;font-size:13px;font-family:inherit;font-weight:600}
.simopt:hover{border-color:var(--accent)}
.simopt.on{background:var(--accent);color:#06151b;border-color:var(--accent)}
.sim-res{display:none;margin-top:22px;background:var(--panel);border:1px solid var(--line);
  border-radius:14px;padding:22px;text-align:center}
.sim-score{display:flex;flex-direction:column;align-items:center;gap:2px}
.sim-num{font-size:46px;font-weight:850;line-height:1}
.sim-num small{font-size:18px;color:var(--muted);font-weight:700}
.sim-score.ok .sim-num{color:var(--open)} .sim-score.mid .sim-num{color:var(--prep)} .sim-score.low .sim-num{color:var(--danger)}
.sim-lbl{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.sim-bar{height:10px;background:var(--panel2);border:1px solid var(--line);border-radius:20px;
  overflow:hidden;margin:16px auto;max-width:420px}
.sim-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--danger),var(--prep),var(--open))}
.sim-weak{font-size:14px;color:#f3d9b8;background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.3);
  border-radius:10px;padding:10px 14px;max-width:560px;margin:0 auto}
.sim-weak.isok{color:#bfe8cf;background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.3)}
.sim-cta{margin-top:18px}
.sim-cta p{font-size:14px;color:var(--muted);max-width:520px;margin:0 auto 12px}
.sim-disc{font-size:11.5px;color:var(--muted);margin-top:16px;max-width:560px;margin-left:auto;margin-right:auto}

@media(max-width:900px){
  .plans.plans-3{grid-template-columns:1fr}
  .why{grid-template-columns:1fr}
}
@media(max-width:620px){
  .sim-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  nav .nav-cta a.btn-ghost:not([hreflang="en"]){display:none}   /* declutter su telefoni: nascondi i ghost (es. "Vai al radar"), MA tieni la bandiera EN accanto a Dossier PRO */
  .logo{font-size:15px} .logo img{width:26px;height:26px} .logo img.brand{width:auto;height:34px}
  .nav-cta{gap:8px}
}
@media(max-width:620px){
  .plans{grid-template-columns:1fr}
  .hero-stats{gap:20px}
  .controls{padding:12px 10px}
  input#q{min-width:140px}
  .alertform{flex-direction:column}
  .alertform input,.alertform .btn{width:100%}
}

/* ===== Hero versione 5 (navy -> sabbia) + ombrellone tondo (IT + EN) ===== */
.hero{background:linear-gradient(160deg,#0a2540 50%,#c7a86a 100%)}
.hero::after{content:"";position:absolute;right:10px;bottom:10px;width:140px;height:84px;
  background:url(icons/ombrellone.svg?v=9) no-repeat right bottom;background-size:contain;
  pointer-events:none;z-index:0;opacity:.85;filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}
.hero .wrap{position:relative;z-index:1}
.hero p.sub{color:#dbe6f0}
/* Testi hero BIANCHI con ombra scura: leggibili sia sulla parte navy sia su quella sabbia
   (su mobile il gradiente si comprime e i colori scuri di prima sparivano sul fondo) */
.hero .hstat .n{color:#fff;text-shadow:0 1px 10px rgba(7,24,40,.75)}
.hero .hstat .l{color:#eaf2f9;text-shadow:0 1px 8px rgba(7,24,40,.7)}
.hero .hero-note,.hero .a2hs,.hero .updated{color:#eaf2f9;text-shadow:0 1px 8px rgba(7,24,40,.7)}
@media(max-width:600px){
  .hero::after{width:100px;height:60px;right:6px;bottom:6px;opacity:.8}
  /* su schermi stretti la sabbia resta solo nell'angolo in basso: i testi poggiano sul navy */
  .hero{background:linear-gradient(160deg,#0a2540 68%,#c7a86a 128%)}
}

/* ===== Strip "mini-dossier Rimini" sotto le gare aperte ===== */
.rimini-strip{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;
  max-width:1040px;margin:16px auto 0;padding:12px 18px;border-radius:12px;font-size:14px;color:var(--txt);
  background:linear-gradient(90deg,rgba(251,191,36,.13),rgba(56,189,248,.08));border:1px solid var(--line)}
.rimini-strip b{color:var(--gold-txt)}
.rimini-strip span{color:var(--accent);font-weight:700;white-space:nowrap}
.rimini-strip:hover{text-decoration:none;border-color:var(--gold)}

/* ===== Metodo + chi c'è dietro ===== */
.method-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;max-width:1000px;margin:0 auto}
.method-col{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px}
.mlist{margin:0;padding-left:22px;font-size:14px;line-height:1.7;color:var(--muted)}
.mlist li{margin-bottom:10px}
.mlist b{color:var(--txt)}

/* =====================================================================
   CLARITY — correzioni tema chiaro (override in coda: rimuovere questo
   blocco per tornare al tema scuro precedente)
   ===================================================================== */
nav{background:rgba(255,255,255,.9);box-shadow:0 1px 0 rgba(11,18,32,.04)}
.btn-primary{color:#fff}
.btn-primary:hover{filter:brightness(1.05)}
.badge-pop{color:#fff}
.chip.on{color:#fff}
.simopt.on{color:#fff}
.badge.C{color:#475569}
.note{color:#33415a}
.crit{color:#b42318}
.urgency{color:#b42318}.urgency b{color:#7f1d1d}
.aperta-lotti{color:#475569}
.sim-weak{color:#92400e}
.sim-weak.isok{color:#166534}
.star{background:rgba(255,255,255,.9)}
.map-legend i{border-color:#dfe6f0}
/* lock overlay sulle gare aperte: velo chiaro invece che scuro */
.aperta-card.locked .ac-lock{background:rgba(255,255,255,.5)}
.aperta-card.locked .ac-lock span{background:#fff;box-shadow:0 6px 18px rgba(11,18,32,.12)}
/* badge "ultimo aggiornamento": pillola su fondo chiaro */
.updated{color:var(--txt);background:rgba(37,99,235,.07);border:1px solid rgba(37,99,235,.18)}

/* HERO CLARITY: chiaro, cobalto, con alone tenue (sostituisce il navy→sabbia) */
.hero{background:linear-gradient(180deg,#eef3ff 0%,#ffffff 62%)}
.hero::after{display:none}
.hero p.sub{color:#3a4861}
.hero .hstat .n{color:var(--accent);text-shadow:none}
.hero .hstat .l{color:#566377;text-shadow:none}
.hero .hero-note,.hero .a2hs,.hero .updated{color:#566377;text-shadow:none}
@media(max-width:600px){
  .hero{background:linear-gradient(180deg,#eef3ff 0%,#ffffff 70%)}
}

/* CLARITY — layout hero proposta (pill in alto, titolo gradiente, micro, anteprima prodotto, feature) */
.hero .updated{margin:0 0 22px}
.hero h1 .hl{background:linear-gradient(90deg,#2563eb,#06b6d4);-webkit-background-clip:text;background-clip:text;color:transparent}
.micro{margin-top:16px;font-size:13px;color:#566377}
.shot{max-width:880px;margin:42px auto 0;background:#f5f7fb;border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 30px 70px rgba(11,18,32,.10)}
.shot .bar{display:flex;gap:6px;padding:4px 4px 12px}
.shot .bar i{width:11px;height:11px;border-radius:50%;background:#cdd6e4;display:inline-block}
.shot .panelimg{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-align:left}
.rowi{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.rowi:last-child{border-bottom:none}
.tagi{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.tagi.a{background:#dcfce7;color:#15803d}.tagi.p{background:#fef3c7;color:#a16207}.tagi.c{background:#f1f5f9;color:#64748b}
.rowi .nm{font-weight:700;font-size:15px}.rowi .pv{color:#566377;font-size:13px}
.rowi .due{margin-left:auto;font-size:13px;color:#3a4861;font-weight:600;white-space:nowrap}
.cfeat{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1000px;margin:0 auto}
.cfc{padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff}
.cfc .ic{width:42px;height:42px;border-radius:11px;background:#eef3ff;color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:20px}
.cfc h4{margin:14px 0 6px;font-size:17px}.cfc p{margin:0;color:#566377;font-size:14px;line-height:1.6}
/* variante compatta della sezione feature (meno spazio verticale) */
.block--feat{padding:28px 0}
.block--feat .h2sub{margin-bottom:18px}
.block--feat .cfeat{gap:14px}
.block--feat .cfc{padding:16px 18px}
.block--feat .cfc .ic{width:34px;height:34px;font-size:17px;border-radius:9px}
.block--feat .cfc h4{margin:10px 0 4px;font-size:15.5px}
.block--feat .cfc p{font-size:13.5px;line-height:1.5}
@media(max-width:820px){.cfeat{grid-template-columns:1fr}}
/* menu di navigazione multi-pagina */
.nav-links{display:flex;gap:20px;font-size:14.5px;font-weight:600}
.nav-links a{color:#3a4861}
.nav-links a:hover{color:var(--accent);text-decoration:none}
@media(max-width:1100px){.nav-links{display:none}}
/* banda CTA tra le sezioni */
.ctaband{max-width:900px;margin:0 auto;background:linear-gradient(120deg,#eef3ff,#ffffff);border:1px solid var(--line);border-radius:18px;padding:34px;text-align:center}
.ctaband h3{margin:0 0 8px;font-size:24px}.ctaband p{margin:0 auto 20px;color:#566377;max-width:560px}
.ctaband .hero-cta{justify-content:center}
/* teaser: l'avviso sulla tua gara è Pro */
.proteaser{margin-top:18px;font-size:13.5px;color:#566377;background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.28);border-radius:12px;padding:12px 16px;text-align:center}
.proteaser b{color:var(--txt)}
/* menu mobile (hamburger) */
.nav-burger{display:none;align-items:center;justify-content:center;width:42px;height:38px;background:#fff;border:1px solid var(--line);border-radius:9px;font-size:19px;line-height:1;cursor:pointer;color:var(--txt);font-family:inherit}
.nav-mobile{display:none}
nav .wrap{position:relative}
@media(max-width:1100px){
  .nav-burger{display:inline-flex}
  .nav-mobile{display:block;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 16px 34px rgba(11,18,32,.10);max-height:0;overflow:hidden;transition:max-height .25s ease;z-index:30}
  .nav-mobile.open{max-height:420px}
  .nav-mobile a{display:block;padding:14px 22px;color:var(--ink);font-weight:600;font-size:16px;border-top:1px solid var(--line)}
  .nav-mobile a:first-child{border-top:none}
  .nav-mobile a:hover{background:#f5f7fb;text-decoration:none}
}
.mfoot{margin-top:14px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--line);padding-top:12px}
@media(max-width:820px){ .method-grid{grid-template-columns:1fr} }

/* ===== Esempio avviso (digest) ===== */
.mailcard{background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;
  box-shadow:0 14px 40px rgba(0,0,0,.3)}
.mail-head{background:var(--panel2);border-bottom:1px solid var(--line);padding:14px 18px;font-size:13px}
.mail-row{margin:2px 0;color:var(--txt)}
.mail-k{color:var(--muted);display:inline-block;min-width:64px}
.mail-body{padding:6px 18px}
.mail-item{padding:13px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.65;color:var(--muted)}
.mail-item:last-child{border-bottom:none}
.mail-item b{color:var(--txt)}
.mail-src{font-size:12px;color:var(--accent)}
.mail-tag{padding:10px 18px;background:rgba(56,189,248,.06);border-top:1px solid var(--line);
  font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;text-align:center}

/* ===================================================================
   MOBILE — impaginazione robusta (forza la colonna singola anche dove
   gli stili inline impongono 2/3 colonne; evita lo scroll orizzontale)
   =================================================================== */
img,svg,iframe{max-width:100%}
@media(max-width:760px){
  .wrap{padding:0 16px}
  section.block{padding:36px 0}
  .h2{font-size:22px;line-height:1.2}
  .h2sub{font-size:14px}
  /* TUTTE le griglie multi-colonna → 1 colonna (batte gli style="grid-template-columns:..." inline) */
  .plans,.plans.plans-3,.oneoff-grid,.oneoff-grid[style],.why,.cfeat,.feat,.feat3,.sim-grid,.method-grid,.brandgrid{grid-template-columns:1fr !important;max-width:540px !important}
  .plans[style],.why[style],.sim-grid[style]{grid-template-columns:1fr !important}
  /* HERO compatto + bottoni a tutta larghezza (tap facile) */
  .hero{padding:46px 0 30px}
  .hero h1{font-size:clamp(25px,7.4vw,34px) !important;letter-spacing:-.4px}
  .hero p.sub{font-size:16px}
  .hero-cta{flex-direction:column;align-items:stretch;gap:10px}
  .hero-cta .btn{width:100%;text-align:center}
  .ctaband{padding:24px 18px}.ctaband h3{font-size:20px}
  /* RADAR: ricerca a tutta riga, filtri sotto */
  .controls{padding:12px 10px;gap:8px}
  input#q{flex:1 1 100%;min-width:0}
  .controls select{flex:1 1 46%}
  /* schede e mappa */
  .grid{grid-template-columns:1fr}
  #map{height:340px}
  .modal-box{padding:22px 18px}
}
@media(max-width:430px){
  .hero h1{font-size:25px !important}
  .controls select{flex:1 1 100%}
  .nav-cta{gap:6px}
}

/* CONSENSO — il testo deve fluire come paragrafo: il display:flex spezzava
   testo+link in colonne strette (specie su mobile). Casella a sinistra, testo normale. */
.consent{display:block;position:relative;padding-left:26px;gap:0}
.consent input{position:absolute;left:0;top:2px;margin:0}

/* trust bar sotto l'hero */
.trustbar{display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:center;max-width:820px;margin:6px auto 0;padding:14px 16px;border-top:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.trustbar span{display:inline-flex;align-items:center;gap:7px}
.trustbar b{color:var(--txt)}
/* hub link interni (regioni / comuni) */
.reglinks{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:780px;margin:0 auto}
.reglinks a{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 15px;font-size:14px;font-weight:600;color:var(--txt)}
.reglinks a:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.reglabel{text-align:center;margin:32px 0 14px;font-size:13px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}

/* ===== HERO FOTO (solo home) — layout accattivante ===== */
.hero--photo{
  background:
    linear-gradient(180deg, rgba(5,18,38,.90) 0%, rgba(5,18,38,.82) 50%, rgba(5,18,38,.94) 100%),
    url(img/hero-beach.jpg) center 38% / cover no-repeat;
  padding:48px 0 38px;
}
.hero--photo h1{color:#fff;text-shadow:0 2px 18px rgba(2,8,18,.7)}
.hero--photo h1 .hl{
  background:linear-gradient(90deg,#8fd0ff,#c2f4fb);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.hero--photo p.sub{color:#f1f6fc;text-shadow:0 1px 12px rgba(2,8,18,.8)}
.hero--photo .micro,.hero--photo .updated,.hero--photo .a2hs{color:#dbe7f6;text-shadow:0 1px 8px rgba(4,14,30,.55)}
.hero--photo .hstat .n{color:#fff;font-size:clamp(32px,5vw,42px);text-shadow:0 2px 18px rgba(4,14,30,.6)}
.hero--photo .hstat .l{color:#dbe7f6;text-shadow:0 1px 8px rgba(4,14,30,.55)}
.hero--photo .trustbar{border-top-color:rgba(255,255,255,.30);color:#e7f0fa}
.hero--photo .trustbar b{color:#fff}
.hero--photo .btn-ghost{color:#fff;border-color:rgba(255,255,255,.65);background:rgba(255,255,255,.12)}
.hero--photo .btn-ghost:hover{background:rgba(255,255,255,.22)}
@media (max-width:640px){
  .hero--photo{padding:60px 0 38px;background-position:center 44%}
}


/* ====================================================================
   COASTAL COBALT — restyling (override in coda; rimuovere per tornare indietro)
   ==================================================================== */
:root{
  --bg:#ffffff;--panel:#ffffff;--panel2:#f6f8fc;--line:#e6ecf5;
  --txt:#0b1220;--muted:#5b6b82;--accent:#2563eb;--accent2:#0891b2;--accent-strong:#1e40af;
  --open:#15a34a;--prep:#ea8a0c;--closed:#7a8aa0;--danger:#dc2626;--gold:#f59e0b;
  --r:14px;--r-lg:18px;
  --sh-sm:0 1px 2px rgba(11,18,32,.06),0 1px 3px rgba(11,18,32,.05);
  --sh-md:0 10px 30px rgba(11,18,32,.08);--sh-lg:0 26px 60px rgba(11,18,32,.12);
}
body{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;background:#fff;color:var(--txt)}
h1,h2,h3,h4,.h2,.comune,.plan h3{letter-spacing:-.5px}

/* NAV */
nav{background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(12px);box-shadow:0 1px 0 rgba(11,18,32,.05)}
.nav-links a{color:#41506a;font-weight:600}
.nav-links a:hover{color:var(--accent)}

/* BUTTONS */
.btn{border-radius:12px;font-weight:700;transition:transform .2s,box-shadow .2s,filter .2s}
.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;box-shadow:0 6px 16px rgba(37,99,235,.28)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(37,99,235,.36);filter:none}
.btn-ghost{background:#fff;color:var(--txt);border:1px solid var(--line);box-shadow:var(--sh-sm)}
.btn-ghost:hover{transform:translateY(-1px);border-color:#cfd9ea}
.btn-gold{background:linear-gradient(135deg,#fbbf24,var(--gold));color:#3a2606;box-shadow:0 6px 16px rgba(245,158,11,.28)}
.btn-gold:hover{transform:translateY(-1px)}

/* HERO foto — overlay più pulito + tipografia */
.hero--photo{background:
   linear-gradient(180deg,rgba(7,20,42,.78) 0%,rgba(7,20,42,.66) 45%,rgba(7,20,42,.88) 100%),
   url(img/hero-beach.jpg) center 40% / cover no-repeat;
   background:
   linear-gradient(180deg,rgba(7,20,42,.78) 0%,rgba(7,20,42,.66) 45%,rgba(7,20,42,.88) 100%),
   image-set(url(img/hero-beach.avif) type("image/avif"), url(img/hero-beach.jpg) type("image/jpeg")) center 40% / cover no-repeat}
.hero h1{font-weight:900;letter-spacing:-1.4px}
.hero--photo h1 .hl{background:linear-gradient(100deg,#8fd0ff,#c2f4fb);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero-stats .hstat .n{font-size:38px;font-weight:900}
.hero--photo .hstat .n{color:#fff}
.updated{font-weight:600}

/* SECTIONS + titoli */
section.block{padding:60px 0}
.h2{font-size:clamp(25px,3.4vw,34px);font-weight:850}
.h2sub{font-size:16px;color:var(--muted)}

/* FEATURE CARDS */
.cfc{border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;box-shadow:var(--sh-sm);transition:transform .2s,box-shadow .2s;padding:26px}
.cfc:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.cfc .ic{width:48px;height:48px;border-radius:13px;background:linear-gradient(135deg,#eef4ff,#dce9ff);color:var(--accent);font-size:22px}
.cfc h4{font-size:18px;margin:16px 0 7px}
.block--feat .cfc{padding:22px}

/* PLAN CARDS (tre mosse + prezzi) */
.plan{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);padding:28px}
.plan.pro{border-color:transparent;box-shadow:0 0 0 2px var(--accent),var(--sh-md)}
.plan h3{font-size:19px}
.plan .price{font-weight:900;letter-spacing:-1.3px}
.badge-pop{background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff}

/* RADAR CARDS */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.stripe.A{background:linear-gradient(90deg,var(--open),#22c55e)}
.stripe.P{background:linear-gradient(90deg,var(--prep),#f59e0b)}
.badge.A{background:#dcfce7;color:#15803d;border:none}
.badge.P{background:#fef3c7;color:#a16207;border:none}

/* KPI */
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-sm)}

/* CTA BAND — cobalto pieno, alto contrasto */
.ctaband{background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;border:none;box-shadow:var(--sh-lg);border-radius:var(--r-lg)}
.ctaband h3{color:#fff}
.ctaband p{color:#dbe6ff}
.ctaband .btn-ghost{background:#fff;color:var(--accent);border:none}
.ctaband .btn-gold{background:#fff;color:var(--accent)}

/* TRUST BAR */
.trustbar b{color:var(--txt)}
.hero--photo .trustbar{border-top-color:rgba(255,255,255,.3)}

/* INPUTS / FORM */
input,select{border-radius:10px;background:var(--panel2);border:1px solid var(--line)}
.alertform .btn-ghost{background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;border:none}

/* PRO TEASER */
.proteaser{border-radius:12px}

/* MAP LOCK — card chiara elegante (radar.html) */
.map-lock-card{background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:var(--sh-lg);border-radius:var(--r-lg)}
.map-lock-txt b{color:var(--txt)}

footer{background:var(--panel2);border-top:1px solid var(--line)}

/* eyebrow + stepper compatto (sostituisce le 2 sezioni ridondanti) */
.eyebrow{text-align:center;font-size:12.5px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.steps{display:flex;gap:26px;max-width:980px;margin:8px auto 0;justify-content:center;position:relative}
.step{flex:1;text-align:center;position:relative}
.step .num{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 6px 16px rgba(37,99,235,.3);position:relative;z-index:2}
.step:not(:last-child)::after{content:"";position:absolute;top:22px;left:calc(50% + 34px);right:calc(-50% + 34px);height:2px;background:linear-gradient(90deg,#c9d6ef,#e6ecf5);z-index:1}
.step h4{font-size:17px;margin:0 0 6px;color:var(--txt)}
.step p{font-size:14px;color:var(--muted);margin:0 auto;max-width:280px;line-height:1.55}
.step p b{color:var(--txt)}
@media(max-width:760px){.steps{flex-direction:column;gap:22px}.step:not(:last-child)::after{display:none}}

/* CTA "cerca la tua spiaggia" affiancata alla mappa d'Italia */
.findrow{display:grid;grid-template-columns:1.35fr .9fr;gap:26px;align-items:center;max-width:1000px;margin:0 auto}
.findrow .ctaband{margin:0;text-align:left}
.findmap{text-align:center}
.findmap img{max-height:300px;width:auto;filter:drop-shadow(0 16px 32px rgba(37,99,235,.20))}
@media(max-width:760px){.findrow{grid-template-columns:1fr}.findmap{order:-1}.findmap img{max-height:210px}}

/* griglia 2 piani prezzi (regione / Italia) */
.plans.plans-2{grid-template-columns:1fr 1fr;max-width:760px}
.plan .setup{font-size:13px;color:var(--txt);font-weight:700;background:var(--tint);border:1px solid #dbe7fb;border-radius:9px;padding:6px 11px;display:inline-block;margin:4px 0 2px}
.plan .first{font-size:13px;color:var(--muted);margin-top:8px}
.plan .first b{color:var(--txt)}
@media(max-width:760px){.plans.plans-2{grid-template-columns:1fr;max-width:520px}}

/* ============================================================
   REGIONI (piano regionale) — selettore hero, griglia regioni,
   tendina nelle card prezzi, sezione metodo. Classi additive:
   condivise senza effetti con BeachStake (styles.css sincronizzato).
   ============================================================ */
/* selettore regione nel hero (su foto scura) */
.regionask{max-width:560px;margin:26px auto 0;background:rgba(10,25,45,.45);border:1px solid rgba(255,255,255,.28);
  border-radius:16px;padding:16px 18px;backdrop-filter:blur(6px)}
.regionask .q{font-size:14.5px;font-weight:700;color:#fff;margin-bottom:10px;text-shadow:0 1px 8px rgba(4,14,30,.55)}
.regionask .row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.regionask select{flex:1;min-width:220px;padding:11px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.4);
  font-size:14.5px;background:#fff;color:var(--txt)}
/* griglia delle regioni con i contatori */
.reggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;max-width:1020px;margin:0 auto;min-height:380px}
.regcard{display:block;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:15px 16px;color:var(--txt);
  transition:box-shadow .15s,transform .15s,border-color .15s}
.regcard:hover{text-decoration:none;box-shadow:0 10px 26px rgba(10,37,64,.12);transform:translateY(-2px);border-color:#c7d6ee}
.regcard.hot{border-color:#bfe6cc;background:#f4fbf6}
.regcard .nm{font-weight:800;font-size:15px;display:flex;align-items:center;gap:8px}
.regcard .nm .dotA{width:8px;height:8px;border-radius:50%;background:var(--open);box-shadow:0 0 0 3px rgba(22,163,74,.18);flex:none}
.regcard .st{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.5}
.regcard .st b.ra{color:#15803d}
.regcard .st b.rp{color:#b45309}
.regcard .go{font-size:12px;font-weight:700;color:var(--accent);margin-top:7px}
/* tendina regione dentro le card prezzi e nella modale */
select[data-regsel]{width:100%;padding:12px 13px;border-radius:10px;border:1px solid #c9d4e4;font-size:15px;
  font-family:inherit;background:#fff;margin:10px 0 2px;box-sizing:border-box}
select[data-regsel].need{border-color:var(--danger);box-shadow:0 0 0 3px rgba(220,38,38,.15)}
/* sezione "chi c'e' dietro" (metodo) */
.autor{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;max-width:960px;margin:0 auto}
.autor .acard{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px}
.autor h3{margin:0 0 10px;font-size:18px}
.autor p{font-size:14px;color:var(--muted);line-height:1.7;margin:0 0 12px}
.autor p b{color:var(--txt)}
.method{list-style:none;padding:0;margin:0;font-size:13.5px;line-height:2}
.method li{padding-left:24px;position:relative}
.method li:before{content:"\2713";position:absolute;left:0;color:var(--open);font-weight:800}
@media(max-width:820px){.autor{grid-template-columns:1fr}}
/* nota campo facoltativo nel form */
.optnote{flex-basis:100%;font-size:11.5px;color:var(--muted);text-align:left;margin-top:-4px}


/* ===== HERO NEUTRO (02/07/2026) — via la foto ombrelloni: fondo chiaro uniforme,
   testi scuri ad alto contrasto e spaziature verticali riviste (scelta Andrea) ===== */
.hero{background:linear-gradient(180deg,#eef3fa 0%,#f7fafd 55%,#ffffff 100%);padding:54px 0 40px}
.hero h1{color:#0b1220;text-shadow:none;margin:0 0 14px}
.hero h1 .hl{background:linear-gradient(90deg,#2563eb,#06b6d4);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero p.sub{color:#3a4861;text-shadow:none;max-width:660px;margin:0 auto 26px}
.hero .updated{background:#fff;border:1px solid var(--line);color:var(--txt);text-shadow:none;margin:0 0 22px}
.hero .updated:empty{display:none} /* prima che il JS la riempia niente pillola vuota */
.hero .example{margin:16px auto 0}
.hero .regionask{background:#ffffff;border:1px solid var(--line);box-shadow:var(--sh-md);backdrop-filter:none;margin:28px auto 0}
.hero .regionask .q{color:var(--txt);text-shadow:none}
.hero .regionask select{border:1px solid #cdd5e0}
/* selettore regione a tutta larghezza sotto l'hero (fuori dalla griglia a 2 colonne) */
.hero .regionask.hero-askwide{max-width:620px;margin:6px auto 2px;text-align:center}
.hero .hero-askwide .row{justify-content:center}
.hero .hero-askwide select{min-width:300px}
/* ---- HERO 2 colonne + 4 punti in fila (redesign 07/07 feedback Andrea) ---- */
.topbanner{background:linear-gradient(90deg,rgba(37,99,235,.10),rgba(8,145,178,.10));
  border-bottom:1px solid var(--line);color:var(--accent);text-align:center;
  font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:9px 16px}
/* scheda Rimini a destra, centrata rispetto al testo; visibile anche su mobile */
.hero-grid .hero-visual{display:flex!important;flex-direction:column;align-items:center;gap:0}
.hero-grid .hero-visual .hero-cta{justify-content:center;margin:16px 0 0}
/* 4 punti: orizzontali, in fila, su tutta la larghezza, sotto le due colonne */
.whatin-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;max-width:1040px;margin:30px auto 8px}
.whatin-row span{flex:1 1 0;min-width:210px;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:15px 16px;font-size:14.5px;font-weight:700;color:var(--txt);text-align:center;box-shadow:var(--sh-sm)}
.hero #heroExample{margin:22px auto 6px;text-align:center}
@media(max-width:600px){
  .whatin-row span{flex-basis:44%;font-size:13.5px;padding:13px 12px}
  .topbanner{font-size:10.5px;letter-spacing:.03em;padding:8px 12px}
}
/* ---- PER CHI È: 3 segmenti (nuova sezione) ---- */
.segs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:left;margin-top:8px}
.seg{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:var(--sh-sm)}
.seg .segic{width:46px;height:46px;border-radius:12px;background:var(--panel2);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:12px}
.seg h3{margin:0 0 6px;font-size:19px}
.seg p{color:var(--muted);font-size:14.5px;margin:0 0 12px}
.seg ul{margin:0;padding-left:18px;font-size:13.5px;color:var(--muted)}
.seg li{margin:4px 0}
@media(max-width:820px){.segs{grid-template-columns:1fr}}
/* ---- COSA VEDI DENTRO: anteprima scheda + vetrina (nuova sezione) ---- */
.pv{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start;text-align:left}
.pvcard{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--sh-sm)}
.pvcard h4{margin:0 0 4px;font-size:15px}
.pvtag{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);font-weight:800}
.pv .brow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.pv .brow b{color:var(--accent)}
.pv .chip{font-size:11px;font-weight:800;border-radius:6px;padding:2px 8px}
.pv .chip.a{background:rgba(21,136,75,.16);color:#0f6e34}
.pv .chip.p{background:rgba(245,158,11,.20);color:var(--gold-txt)}
.pv .chip.t{background:var(--panel2);color:var(--accent)}
.pvmask{filter:blur(4px);user-select:none}
@media(max-width:820px){.pv{grid-template-columns:1fr}}
.hero .hstat .n{color:var(--accent);text-shadow:none;font-size:clamp(30px,4.6vw,40px)}
.hero .hstat .l{color:#566377;text-shadow:none}
.hero .hero-note,.hero .a2hs{color:#566377;text-shadow:none}
.hero .trustbar{border-top-color:var(--line);color:var(--muted);margin-top:26px}
.hero .trustbar b{color:var(--txt)}
.hero .btn-ghost{color:var(--accent-strong);border-color:#c7d6ee;background:#fff}
.hero .btn-ghost:hover{background:#f2f6fc}
.hero-stats{margin-top:34px;row-gap:18px}


/* ===== HERO v2 — Claude Design (02/07/2026): due colonne con l'Italia fluida,
   glow decorativi tenui, statistiche a barra con divisori ===== */
.hero{position:relative;overflow:hidden;padding:58px 0 44px}
.hero::before{content:"";position:absolute;top:-240px;right:-180px;width:600px;height:600px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(37,99,235,.13),transparent 70%);pointer-events:none}
.hero::after{content:"";display:block;position:absolute;bottom:-280px;left:-220px;width:640px;height:640px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(8,145,178,.10),transparent 70%);pointer-events:none;
  border:none;box-shadow:none;opacity:1;right:auto}
.hero .wrap{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:38px;align-items:center;
  max-width:1040px;margin:0 auto;text-align:left}
.hero-copy .updated{margin:0 0 18px}
.hero-grid h1{margin:0 0 14px}
.hero-grid p.sub{margin:0 0 24px;max-width:560px}
.hero-grid .hero-cta{justify-content:flex-start}
.hero-grid .example{margin:16px 0 0}
.hero-grid .regionask{margin:26px 0 0;max-width:520px}
.hero-grid .regionask .row{justify-content:flex-start}
.hero-visual{display:flex;justify-content:center}
.hero-visual img{width:100%;max-width:320px;height:auto;filter:drop-shadow(0 26px 48px rgba(10,37,64,.20))}
@media (prefers-reduced-motion:no-preference){
  .hero-visual img{animation:heroFloat 7s ease-in-out infinite}
  @keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
}
.hero-stats{margin:40px auto 0;max-width:940px;display:flex;flex-wrap:wrap;justify-content:center;gap:0;
  background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh-sm);padding:16px 6px}
.hero .hstat{flex:1 1 150px;padding:4px 16px;border-right:1px solid var(--line);text-align:center;min-width:140px}
.hero .hstat:last-child{border-right:none}
.hero .trustbar{margin-top:24px}
@media (max-width:920px){
  .hero{padding:44px 0 34px}
  .hero-grid{grid-template-columns:1fr;gap:10px;text-align:center}
  .hero-grid .hero-cta{justify-content:center}
  .hero-grid .regionask{margin-left:auto;margin-right:auto}
  .hero-grid .regionask .row{justify-content:center}
  .hero-grid p.sub{margin-left:auto;margin-right:auto}
  .hero-visual{display:none}
  .hero .hstat{border-right:none;flex:1 1 45%;padding:8px 10px}
  .hero-stats{padding:10px 6px}
}


/* ===== Rifiniture Claude Design (02/07/2026 sera) ===== */
/* mock prodotto (home, sezione "Trova la tua gara") */
.mockwin{max-width:400px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 60px rgba(10,37,64,.16);overflow:hidden;text-align:left}
.mw-bar{display:flex;align-items:center;gap:6px;background:#f2f6fa;border-bottom:1px solid var(--line);padding:9px 12px}
.mw-bar span{width:9px;height:9px;border-radius:50%;background:#d7e0ec}
.mw-bar i{font-style:normal;font-size:11px;color:#8494ab;margin-left:8px;background:#fff;border:1px solid var(--line);
  border-radius:20px;padding:2px 10px}
.mw-kpis{display:flex;gap:8px;padding:10px 12px 2px;flex-wrap:wrap}
.mw-kpis b{font-size:11px;font-weight:700;background:#f2f6fa;border:1px solid var(--line);border-radius:20px;padding:3px 9px;color:#41506a}
.mw-kpis .g{color:#15803d;background:#ecfdf3;border-color:#c9ecd4}
.mw-kpis .o{color:#b45309;background:#fff8ec;border-color:#f3e2bd}
.mw-card{display:flex;align-items:center;gap:10px;margin:8px 12px;padding:10px 12px;border:1px solid var(--line);
  border-left:4px solid #f59e0b;border-radius:11px}
.mw-card.open{border-left-color:#22c55e}
.mw-card:last-child{margin-bottom:14px}
.mw-card .tag{font-size:9.5px;font-weight:800;letter-spacing:.04em;border-radius:20px;padding:3px 8px;white-space:nowrap}
.mw-card .tag.a{background:#e6f6ec;color:#1e7a46}
.mw-card .tag.p{background:#fff4e0;color:#9a6a13}
.mw-card b{font-size:13px;display:block}
.mw-card small{font-size:11px;color:#8494ab}
.mw-card .cd{margin-left:auto;font-size:12px;font-weight:800;color:#d97706}
/* mini-sagome nelle card regione della home */
.rmini{width:30px;height:30px;flex:none}
.rmini path{fill:rgba(37,99,235,.10);stroke:#2563eb;stroke-width:3;stroke-linejoin:round}
.regcard:hover .rmini path{fill:rgba(37,99,235,.22)}
/* card "gare aperte ora" bloccate: niente blur (i dati sono già mascherati dal server),
   chip Pro in basso su velo sfumato */
.aperta-card.locked .ac-body{filter:none;opacity:1;user-select:auto}
.aperta-card.locked .ac-lock{align-items:flex-end;justify-content:flex-end;padding:10px;
  background:linear-gradient(180deg,transparent 45%,rgba(255,255,255,.94) 88%)}
.aperta-card.locked .ac-lock span{background:#fff;border:1px solid #f3e2bd;border-radius:20px;padding:6px 12px;
  box-shadow:0 4px 14px rgba(11,18,32,.10)}
/* segnaposto elenco free (al posto del terzo banner) */
.empty-lock{max-width:560px;margin:8px auto 0;text-align:center;background:#fbfcfe;border:1px dashed #d9e2ef;
  border-radius:16px;padding:26px 22px}
.empty-lock .el-ico{font-size:30px}
.empty-lock .el-t{font-weight:800;font-size:16px;margin:6px 0 4px}
.empty-lock .el-s{font-size:13.5px;color:var(--muted);max-width:420px;margin:0 auto 14px;line-height:1.55}
/* prezzi: pari dignità visiva alla card "Una regione" */
.plans .plan:not(.pro){border:1px solid #d3e0f4}


/* ── Banner "oltre la spiaggia" (home) ── */
.tipo-teaser{background:#0b1220;border-radius:14px;overflow:hidden;position:relative;margin:8px 0 2px;box-shadow:0 10px 28px rgba(11,18,32,.14)}
.tipo-teaser::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#ef4444}
.tipo-teaser .wrap{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:22px 24px}
.tt-badge{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#fca5a5;background:rgba(239,68,68,.14);border:1px solid rgba(239,68,68,.4);padding:6px 12px;border-radius:20px}
.tt-body{display:flex;flex-direction:column;align-items:center;gap:11px;max-width:780px}
.tt-title{color:#e2e8f0;font-size:15.5px;line-height:1.45}
.tt-title b{color:#fff;font-weight:700}
.tt-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.tt-chip{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:5px 13px;font-size:12.5px;font-weight:600;color:#fff;white-space:nowrap}
a.tt-chip:hover{border-color:#8fd0ff;text-decoration:none;background:rgba(255,255,255,.12)}
.tt-note{color:#94a3b8;font-size:12.5px;line-height:1.4}
.tt-note b{color:#cbd5e1;font-weight:700}


/* ── CTA combo (hero): messaggio report + chip + mockup dossier + prezzo ── */
.whatin{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 4px}
.whatin span{background:#fff;border:1px solid var(--line);border-radius:20px;padding:6px 12px;font-size:12.5px;font-weight:600;color:var(--txt)}
.pricenote{margin-top:12px;font-size:13.5px;color:var(--txt);background:rgba(37,99,235,.08);border:1px solid rgba(37,99,235,.25);border-radius:12px;padding:10px 14px}
.pricenote b{color:var(--accent)}
.dossier-wrap{position:relative;max-width:320px;margin:0 auto}
.dossier{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 18px 40px rgba(11,18,32,.16);text-align:left;filter:blur(1.1px)}
.dossier .dh{background:linear-gradient(135deg,#0a2540,#2563eb);color:#fff;padding:16px 16px 20px}
.dossier .dh .k{font-size:10px;letter-spacing:.18em;opacity:.85;text-transform:uppercase}
.dossier .dh h4{margin:6px 0 0;font-size:18px;font-weight:800;line-height:1.15}
.dossier .db{padding:14px 16px}
.dossier .line{height:9px;border-radius:5px;background:#e8edf5;margin:8px 0}
.dossier .line.s{width:60%}.dossier .line.m{width:85%}
.dossier .grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.dossier .cell{background:#f7f9fc;border:1px solid var(--line);border-radius:8px;padding:8px}
.dossier .cell .cn{font-size:16px;font-weight:800;color:var(--accent)}
.dossier .cell .cl{font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.dossier .scorerow{display:flex;justify-content:space-between;align-items:center;font-size:12px;padding:6px 0;border-bottom:1px solid #eef2f8}
.dossier .scorerow span{color:#334155}
.dossier .scorerow b{color:var(--accent);font-weight:800;font-variant-numeric:tabular-nums}
.dlock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:linear-gradient(180deg,rgba(244,248,252,.30),rgba(244,248,252,.64))}
.dlock .ico{font-size:23px;background:#fff;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(11,18,32,.22);border:2px solid var(--accent)}
.dlock .cap{font-weight:700;color:var(--txt);font-size:13px;text-align:center;line-height:1.35;background:#fff;padding:9px 15px;border-radius:11px;box-shadow:0 8px 20px rgba(11,18,32,.12);max-width:230px}

/* guardia anti-overflow orizzontale (non rompe la nav sticky) */
html{overflow-x:clip}

/* ====================================================================================
   REFRESH 2026-07 · "AURORA" — layer additivo (staging _ricostruzione)
   Rinfresca il look restando nel DNA CLARITY/cobalto. Tutto qui in coda: per
   tornare indietro basta rimuovere questo blocco. Non tocca #map / .controls / Leaflet.
   ==================================================================================== */
:root{
  /* neutri con leggera polarizzazione cobalto (scelti, non grigi neutri) */
  --bg:#ffffff; --panel:#f7f9fd; --panel2:#eef3fb; --line:#e4eaf3; --line-strong:#d3dcea;
  --txt:#0a1324; --ink-2:#1c2942; --muted:#586882; --faint:#5e6d86;
  --accent:#2563eb; --accent-strong:#1b46c4; --accent-soft:#eaf1ff; --cyan:#0891b2; --cyan-2:#06b6d4;
  --open:#15a34a; --prep:#b45309; --closed:#5b6a82; --danger:#dc2626; --gold:#f59e0b;
  --navy:#0a2540; --navy-2:#0f2f52;
  /* raggi + ombre tinte cobalto (più morbide, meno "flat") */
  --r-sm:10px; --r:14px; --r-lg:18px; --r-xl:24px;
  --sh-sm:0 1px 2px rgba(16,32,64,.05), 0 2px 6px rgba(16,32,64,.05);
  --sh-md:0 8px 24px rgba(16,40,88,.09), 0 2px 8px rgba(16,40,88,.05);
  --sh-lg:0 24px 60px rgba(16,40,88,.14);
  --ring:0 0 0 3px rgba(37,99,235,.28);
}
body{font-family:Inter,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.num,.hstat .n,.kpi .n,.plan .price,.cd,.aperta-card .cd,.mw-card .cd{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
:where(a,button,input,select,.chip,.card,.cfc,.regcard,.plan) {transition:color .15s,background .15s,border-color .15s,box-shadow .2s,transform .2s}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:8px}
.skip-link{position:absolute;left:-9999px;top:auto;z-index:2000;background:#fff;color:var(--accent);padding:10px 16px;border-radius:8px;box-shadow:var(--sh-md);font-weight:700;text-decoration:none}
.skip-link:focus{left:12px;top:12px}
main:focus{outline:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* NAV — vetro più pulito, link con sottolineatura animata, stato attivo */
nav{background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid rgba(16,32,64,.06);box-shadow:none}
nav .wrap{height:72px}
.nav-links{gap:24px}
.nav-links a{position:relative;color:var(--ink-2);font-weight:600}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:2px;
  background:linear-gradient(90deg,var(--accent),var(--cyan-2));border-radius:2px;transition:right .22s ease}
.nav-links a:hover{color:var(--accent);text-decoration:none}
.nav-links a:hover::after{right:0}
.logo img.brand{height:40px}

/* BUTTONS — press tattile, ghost più nitido, focus coerente */
.btn{border-radius:12px;font-weight:700;letter-spacing:-.1px}
.btn-primary{background:linear-gradient(135deg,#2f6bf0,var(--accent-strong));color:#fff;
  box-shadow:0 6px 16px rgba(37,99,235,.26)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(37,99,235,.34);filter:none}
.btn-primary:active{transform:translateY(0);box-shadow:0 4px 12px rgba(37,99,235,.30)}
.btn-ghost{background:#fff;border:1px solid var(--line-strong);color:var(--ink-2);box-shadow:var(--sh-sm)}
.btn-ghost:hover{border-color:#b9c8e4;transform:translateY(-1px)}
.btn-gold{background:linear-gradient(135deg,#fbbf24,var(--gold));color:#3a2606;box-shadow:0 6px 16px rgba(245,158,11,.28)}
.btn-gold:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(245,158,11,.34)}

/* SEZIONI — ritmo verticale + eyebrow coerente, titoli più sicuri */
section.block{padding:64px 0}
.eyebrow{display:block;text-align:center;font-size:12px;font-weight:800;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.eyebrow::before{content:"";display:inline-block;width:18px;height:2px;vertical-align:middle;margin-right:9px;
  background:linear-gradient(90deg,transparent,var(--accent));border-radius:2px}
.eyebrow::after{content:"";display:inline-block;width:18px;height:2px;vertical-align:middle;margin-left:9px;
  background:linear-gradient(90deg,var(--accent),transparent);border-radius:2px}
.h2{font-size:clamp(25px,3.2vw,34px);font-weight:850;letter-spacing:-.7px;line-height:1.12;text-wrap:balance}
.h2sub{font-size:16px;color:var(--muted);max-width:640px;line-height:1.6;text-wrap:pretty}

/* HERO — aurora cobalto più profonda, tipografia decisa, glow tenui */
.hero{background:linear-gradient(180deg,#eaf1fe 0%,#f4f8fe 46%,#ffffff 100%)}
.hero::before{width:680px;height:680px;top:-280px;right:-200px;
  background:radial-gradient(closest-side,rgba(37,99,235,.16),transparent 70%)}
.hero::after{width:700px;height:700px;bottom:-320px;left:-240px;
  background:radial-gradient(closest-side,rgba(8,182,212,.12),transparent 70%)}
.hero h1{font-weight:900;letter-spacing:-1.4px;line-height:1.06}
.hero h1 .hl{background:linear-gradient(100deg,#2563eb 10%,#06b6d4 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero p.sub{font-size:clamp(16px,1.7vw,19px);color:#3a4a63}
.whatin span{background:#fff;border:1px solid var(--line);box-shadow:var(--sh-sm);border-radius:999px;font-weight:600}
.hero-stats{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-md);padding:18px 8px}
.hero .hstat .n{font-weight:900;letter-spacing:-1px;font-size:clamp(30px,4.4vw,40px)}
.hero .hstat .l{font-size:11.5px;letter-spacing:.6px}
.updated{border-radius:999px}
.updated .dot{color:var(--open)}

/* KPI + card prodotto */
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-sm)}
.kpi .n{font-weight:850;letter-spacing:-.5px}

/* CARD gara / feature / regione — bordo morbido, hover coerente, stripe a gradiente */
.card,.cfc,.aperta-card{border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm)}
.card:hover,.cfc:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:#cdd9ee}
.cfc .ic{border-radius:14px;background:linear-gradient(135deg,#eaf1ff,#dbe8ff);color:var(--accent);box-shadow:inset 0 0 0 1px rgba(37,99,235,.08)}
.stripe.A{background:linear-gradient(90deg,var(--open),#26c265)}
.stripe.P{background:linear-gradient(90deg,var(--prep),#f7a723)}
.stripe.C{background:linear-gradient(90deg,var(--closed),#8b99ae)}
.aperta-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md)}

/* STEPPER "come funziona" — numeri con anello, connettore netto */
.step .num{background:linear-gradient(135deg,var(--accent),var(--accent-strong));
  box-shadow:0 6px 16px rgba(37,99,235,.30),0 0 0 6px rgba(37,99,235,.08)}
.step h4{font-weight:800;letter-spacing:-.3px}

/* PIANI PREZZI — più aria, "popolare" col bordo cobalto pieno */
.plan{border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);padding:28px}
.plan.pro{border-color:transparent;box-shadow:0 0 0 2px var(--accent),var(--sh-md)}
.plan .price{font-weight:900;letter-spacing:-1.4px}
.badge-pop{background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;letter-spacing:.6px}

/* REGGRID — card regione più materiche */
.regcard{border-radius:var(--r-lg);box-shadow:var(--sh-sm)}
.regcard:hover{box-shadow:var(--sh-md);border-color:#cdd9ee}

/* CTA BAND — cobalto pieno ad alto contrasto, testo bianco */
.ctaband{background:linear-gradient(135deg,var(--accent),var(--accent-strong));border:none;
  box-shadow:var(--sh-lg);border-radius:var(--r-xl);color:#fff}
.ctaband h3{color:#fff;font-weight:850;letter-spacing:-.5px}
.ctaband p{color:#dce6ff}

/* TRUST BAR + teaser — hairline pulita */
.trustbar{border-top:1px solid var(--line)}
.trustbar b{color:var(--txt)}

/* FORM / INPUT — focus cobalto coerente */
input,select{border-radius:10px;border:1px solid var(--line-strong);background:#fff}
input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}

/* FOOTER — fondo pannello, link leggibili */
footer{background:var(--panel);border-top:1px solid var(--line);color:var(--muted)}
footer a{color:var(--muted)}
footer a:hover{color:var(--accent)}
footer p b{color:var(--ink-2)}

/* MODALE — vetro più elegante */
.modal{background:rgba(8,16,32,.55);backdrop-filter:blur(3px)}
.modal-box{border-radius:var(--r-xl);box-shadow:var(--sh-lg);border:1px solid var(--line)}

/* SIMULATORE — opzioni più tattili */
.simopt{border-radius:10px}
.simopt.on{background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;border-color:transparent}

/* dettaglio "radar": sottile motivo a righe sotto la nav su hero (istituzionale, discreto) */
.hero .wrap{position:relative;z-index:1}
/* fine REFRESH AURORA */


/* === MODULI SCHEDA RICCA (per pagine comune) === */
/* ===== MODULI SCHEDA RICCA — da APPENDERE a styles.css =====
   Oggi queste regole vivono inline in bando-rimini.html. Per generalizzare la scheda
   a TUTTI i comuni vanno spostate in styles.css, così ogni pagina comune le eredita.
   Usano i token Aurora (--line, --accent, --gold, --open, --prep, --danger...). */

.synth{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0 8px}
@media(max-width:720px){.synth{grid-template-columns:1fr}}
.stile{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-sm);
  padding:16px 17px;display:flex;flex-direction:column;gap:9px}
.stile .st-h{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);
  display:flex;align-items:center;gap:7px}

/* criteri bar bicolore */
.critbar{height:16px;border-radius:8px;overflow:hidden;display:flex;box-shadow:inset 0 0 0 1px rgba(16,32,64,.05)}
.critbar .tec{background:linear-gradient(90deg,#2f6bf0,var(--accent-strong))}
.critbar .eco{background:linear-gradient(90deg,#f6b93b,var(--gold))}
.critleg{display:flex;justify-content:space-between;font-size:12px;font-weight:700}
.critleg .l-tec{color:var(--accent-strong)} .critleg .l-eco{color:#a16207}
.st-verdict{font-size:13.5px;font-weight:800;color:var(--txt)}
.st-verdict small{display:block;font-weight:600;color:var(--muted);font-size:12px;margin-top:2px}

/* indice stabilita' — meter 3 segmenti (piu' tacche = piu' stabile) */
.stab-meter{display:flex;gap:5px}
.stab-meter i{height:8px;flex:1;border-radius:4px;background:#e6ecf5}
.stab-lv{font-size:19px;font-weight:900;letter-spacing:-.4px}
.stab.alto .stab-lv{color:var(--open)} .stab.alto .stab-meter i{background:var(--open)}
.stab.medio .stab-lv{color:var(--prep)} .stab.medio .stab-meter i:nth-child(-n+2){background:var(--prep)}
.stab.critico .stab-lv{color:var(--danger)} .stab.critico .stab-meter i:nth-child(-n+1){background:var(--danger)}
.stab.nd .stab-lv{color:var(--faint);font-size:15px} /* stato NEUTRO: dato non ancora validato */
.st-why{font-size:12px;color:var(--muted);line-height:1.45}

/* canone */
.canone-val{font-size:19px;font-weight:900;letter-spacing:-.5px;color:var(--txt)}
.canone-missing{font-size:13px;font-weight:800;color:#a16207;line-height:1.3}
.canone-note{font-size:11.5px;color:var(--muted);line-height:1.4}

/* documenti — repository in un click */
.doclist2{display:flex;flex-direction:column;gap:8px;margin:12px 0;list-style:none;padding:0}
.docitem2{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:11px;
  padding:11px 14px;font-size:14px;font-weight:600;color:var(--txt)}
.docitem2 .ic{width:32px;height:32px;border-radius:8px;background:var(--accent-soft);color:var(--accent-strong);
  display:grid;place-items:center;font-size:11px;font-weight:800;flex-shrink:0}
.docitem2 .sz{color:var(--faint);font-size:12px;font-weight:600}
.docitem2 .dl{margin-left:auto;color:var(--accent);font-weight:800;font-size:13px}

/* === FIX contrasto bottoni (06/07): dentro sezioni che colorano gli <a>
   (es. .guide a, colore accent) i .btn perdevano il testo bianco -> blu su blu = invisibile.
   Qui i .btn mantengono il testo giusto. Selettore a.btn-* (0,1,1) messo per ULTIMO:
   vince sulle regole ".sezione a" (0,1,1) ma NON sui contesti (0,2,0) come .ctaband/.hero--photo. === */
.btn.btn-primary{color:#fff}
.btn.btn-gold{color:#3a2606}

/* ===== FIX MOBILE 06/07/2026 (audit iPhone): header sforava a 429px su viewport 390
   -> burger fuori schermo, modali e banner cookie clippati. Root fix + guardrail. ===== */
html,body{overflow-x:hidden}
@media(max-width:480px){
  nav .wrap{height:60px;gap:8px}
  .logo img.brand{height:30px;max-width:42vw}
  .nav-cta{gap:6px}
  .nav-cta .btn-sm{padding:8px 10px;font-size:12.5px;min-height:36px}
}
/* modali lunghe: scrollabili invece che tagliate sotto la piega */
.modal-box{max-height:calc(100dvh - 40px);overflow-y:auto}