/* ConduCodice · stile premium (v2)
   Si carica dopo style.css e ne raffina i token e i componenti: tipografia Inter, superfici scure stratificate,
   bordi sottili, giallo usato come accento e non come sfondo. Metafora NCC più sobria. */

@font-face{font-family:"Inter";src:url(../fonts/inter-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(../fonts/inter-tight-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}

:root{
  --asfalto:#07080a; --asfalto-2:#0b0c0f; --lamiera:#111216; --lamiera-2:#17191e; --linea:rgba(255,255,255,.075);
  --gesso:#ededef; --nebbia:#9a9ea7; --fumo:#686d76;
  --taxi:#ffc21a; --taxi-2:#ffd34d; --taxi-ink:#14110a;
  --stop:#ff5c50; --verde:#3ad27f;
  --f-display:"Inter Tight","Inter",system-ui,sans-serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --s-1:clamp(2.7rem,6vw,5.2rem); --s-2:clamp(2rem,3.9vw,3.25rem); --s-3:clamp(1.3rem,2vw,1.6rem);
  --r:16px; --ease:cubic-bezier(.2,.8,.2,1);
  --surf:linear-gradient(180deg,#14161a,#0f1013);
}
body{font-size:16px;line-height:1.65;font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  background:radial-gradient(1200px 600px at 80% -10%,rgba(255,194,26,.05),transparent 60%),var(--asfalto)}
::selection{background:rgba(255,194,26,.3);color:#fff}
h1,h2,h3,h4{font-weight:600;letter-spacing:-.035em;line-height:1.04}
h3{letter-spacing:-.02em;line-height:1.2}
h1,.sec-head h2,.phead h1{background:linear-gradient(180deg,#fff 20%,#b9bcc4 120%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hl,.hero h1 .l2{background:linear-gradient(180deg,#ffd75e 0%,#ffc21a 55%,#f0a800 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{color:var(--nebbia);font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6}
a{text-decoration-color:rgba(255,194,26,.4)}

/* Etichette di sezione: pillola con punto luminoso */
.eyebrow{font-family:var(--f-body);font-size:.78rem;letter-spacing:0;text-transform:none;font-weight:500;color:var(--gesso);
  border:1px solid var(--linea);background:rgba(255,255,255,.03);border-radius:99px;padding:.32rem .8rem .32rem .65rem;align-self:flex-start;width:max-content;max-width:100%}
.eyebrow::before{width:6px;height:6px;border-radius:50%;background:var(--taxi);box-shadow:0 0 10px var(--taxi)}
.band-paper .eyebrow{color:var(--gesso)}
.band-paper .eyebrow::before{background:var(--taxi)}

/* Testata */
.top{background:rgba(7,8,10,.72);backdrop-filter:saturate(160%) blur(18px);-webkit-backdrop-filter:saturate(160%) blur(18px);border-bottom:1px solid var(--linea)}
.top .wrap{min-height:64px}
.brand svg{width:34px;height:34px}
.brand b{font-family:var(--f-display);font-weight:650;font-size:1.12rem;letter-spacing:-.02em}
.brand small{font-family:var(--f-body);letter-spacing:.02em;text-transform:none;font-size:.68rem;color:var(--fumo)}
.nav a{font-size:.88rem;font-weight:500;border-radius:8px;padding:.42rem .62rem;transition:color .2s,background .2s}
.nav a:hover,.nav a[aria-current="page"]{background:rgba(255,255,255,.05)}
.nav a[aria-current="page"]{box-shadow:none;color:#fff}
.nav a.nav-area{color:var(--gesso);border:1px solid var(--linea);background:rgba(255,255,255,.03)}
.nav a.nav-area:hover{border-color:rgba(255,255,255,.18)}
.burger{border-radius:10px;font-family:var(--f-body);font-weight:600;letter-spacing:.04em}

/* Pulsanti */
.btn{font-family:var(--f-body);font-weight:600;font-size:.95rem;letter-spacing:-.005em;border-radius:12px;border-width:1px;padding:.82rem 1.25rem;transition:transform .2s var(--ease),background .2s,box-shadow .2s,border-color .2s}
.btn-taxi,.nav a.btn-taxi{background:linear-gradient(180deg,#ffd34d,#ffc21a 60%,#f5b400);color:var(--taxi-ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 0 0 1px rgba(255,194,26,.6),0 10px 30px -12px rgba(255,194,26,.7)}
.btn-taxi:hover,.nav a.btn-taxi:hover{background:linear-gradient(180deg,#ffdc6e,#ffc933 60%,#ffbb00);color:var(--taxi-ink);transform:translateY(-1px)}
.btn-ghost{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.12);color:var(--gesso)}
.btn-ghost:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22)}
.btn .k{font-family:var(--f-body);font-weight:500;background:rgba(20,17,10,.12);border-radius:99px;padding:.12rem .5rem;opacity:1;font-size:.74em}
.nav a.btn-taxi{border-radius:10px;padding:.48rem .85rem}

/* Fasce e sezioni */
.band-dark2{background:linear-gradient(180deg,#0a0b0e,#08090b);border-block:1px solid var(--linea)}
.band-paper{--carta:#0b0c0f;--carta-2:rgba(255,255,255,.08);--inchiostro:#ededef;--inchiostro-2:#9a9ea7;
  background:radial-gradient(900px 420px at 15% 0%,rgba(255,92,80,.06),transparent 60%),linear-gradient(180deg,#0b0c0f,#08090b);color:var(--gesso);border-block:1px solid var(--linea)}
.band-paper a{color:var(--taxi)}
.band-paper .explain{background:var(--surf);border-color:var(--linea)}
.band-paper .explain-tabs button[aria-selected="true"]{background:rgba(255,255,255,.04);border-bottom-color:var(--taxi)}
.band-paper .kpi{border-color:var(--taxi)}
/* il verbale resta un documento di carta, ma raffinato */
.verbale,.fine{--inchiostro:#17181a;--inchiostro-2:#55555a;--carta-2:#e6e1d4}
.verbale{border-radius:14px;background-color:#fbf9f3;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 40px 80px -30px rgba(0,0,0,.8);background-image:none}
.fine{background:#fbf9f3;border-radius:14px;color:var(--inchiostro)}
.fine .amt{color:#d0362b;letter-spacing:-.03em}
.hazard{height:1px;opacity:1;background:linear-gradient(90deg,transparent,rgba(255,194,26,.55) 50%,transparent)}
.lane{height:1px;opacity:1;background:linear-gradient(90deg,transparent,var(--linea),transparent)}

/* Hero */
.hero{border-bottom:1px solid var(--linea)}
.hero::after{background:linear-gradient(180deg,rgba(7,8,10,.25) 0%,rgba(7,8,10,0) 30%,rgba(7,8,10,.7) 80%,var(--asfalto) 100%),linear-gradient(90deg,rgba(7,8,10,.92) 0%,rgba(7,8,10,.45) 52%,rgba(7,8,10,.05) 100%)}
.motto{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.82rem;font-weight:500;border-radius:99px;background:rgba(255,255,255,.04);border:1px solid var(--linea);backdrop-filter:blur(8px)}
.hero .lead{color:#b8bcc4}
.meter{background:linear-gradient(180deg,rgba(22,24,29,.78),rgba(12,13,16,.78));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:1.1rem 1.15rem 1.15rem;box-shadow:0 40px 80px -40px #000,inset 0 1px 0 rgba(255,255,255,.06)}
.meter-top{font-family:var(--f-body)!important;letter-spacing:0!important;text-transform:none!important;font-size:.8rem!important}
.meter-top .free{border-radius:99px!important;font-weight:600}
.lcd{background:#08090b;color:var(--gesso);text-shadow:none;border:1px solid var(--linea);border-radius:14px;padding:1rem 1.05rem}
.lcd::after{display:none}
.lcd .big{font-family:var(--f-display);font-weight:600;letter-spacing:-.04em;font-size:2.7rem}
.lcd .row{font-family:var(--f-body);color:var(--nebbia);opacity:1}
.meter-keys button{border-radius:10px!important;font-family:var(--f-body)!important;letter-spacing:0!important;text-transform:none!important;font-size:.8rem!important}
.ticker{background:transparent;border-color:var(--linea);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker-in span{font-family:var(--f-body);font-size:.82rem;color:var(--fumo)}
.ticker-in b{color:var(--stop);font-size:.6rem}
.ticker-in em{color:var(--gesso)}

/* Superfici: card, schede, strumenti */
.card,.lane-card,.tier,.formula,.tool,.faq details,.channel,.explain,.term,.qbox,.crash,.choice,.ex,.sol-i{border-color:var(--linea)}
.card,.lane-card,.tier,.formula,.faq details,.channel,.ex{position:relative;border-radius:var(--r);
  background:radial-gradient(420px circle at var(--mx,-999px) var(--my,-999px),rgba(255,194,26,.065),transparent 45%),var(--surf);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 24px 48px -36px rgba(0,0,0,.9);transition:transform .35s var(--ease),border-color .35s}
a.card:hover,.channel:hover,.lane-card:hover,.tier:hover,.ex:hover{border-color:rgba(255,255,255,.14);transform:translateY(-2px)}
.card-ico{border-radius:12px!important;background:rgba(255,194,26,.08)!important;border:1px solid rgba(255,194,26,.18)!important;color:var(--taxi)}
.card .tag{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.78rem;color:var(--fumo);font-weight:500}
.tool{border-radius:20px;background:var(--surf)}
.tool-head{border-color:var(--linea)!important}
.choice{border-radius:14px;background:rgba(255,255,255,.025)}
.choice:hover{border-color:rgba(255,255,255,.18)}
.choice[aria-pressed="true"]{border-color:var(--taxi)!important;background:rgba(255,194,26,.07)!important}
.choice .ic{border-radius:10px;background:rgba(255,194,26,.08)}
.explain{border-radius:var(--r)}
.explain-tabs button{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.82rem;font-weight:500}
.term{border-radius:16px;background:#060709}
.term-bar{background:rgba(255,255,255,.025)}
.qbox,.crash{border-radius:var(--r)}
.pill{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.74rem;font-weight:500;background:rgba(255,255,255,.035)}
.pill.y{background:rgba(255,194,26,.1)}
.sol-i{border-radius:99px;background:rgba(255,255,255,.03);border:1px solid var(--linea)}
.metric .lab{font-family:var(--f-body)!important;letter-spacing:0!important;text-transform:none!important;font-size:.84rem!important;color:var(--nebbia)}
.metric .lab b{color:var(--gesso);font-weight:600}
.metric{display:grid;gap:.45rem}

/* Fasce di prezzo */
.tier{border-radius:20px;padding:1.5rem}
.tier .car{height:46px;color:var(--taxi);opacity:.95}
.tier .price{font-family:var(--f-display);font-weight:600;letter-spacing:-.035em}
.tier .price small{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.76rem;font-weight:500}
.tier ul li::before{content:"";width:14px;height:14px;margin-top:.3rem;border-radius:50%;background:rgba(255,194,26,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M4 7.2l2 2 4-4.2' fill='none' stroke='%23ffc21a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.tier.feat{border-color:rgba(255,194,26,.45);box-shadow:0 0 0 1px rgba(255,194,26,.15),0 30px 70px -40px rgba(255,194,26,.45)}
.tier .flag{border-radius:99px;font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.72rem;padding:.25rem .7rem;top:-12px}
.formula .big,.result .range,.kpi .n,.ex-price b,.fine .amt,.verbale-tot .n{font-family:var(--f-display);font-weight:600;letter-spacing:-.04em}
.ex-price{border-top-style:solid}
.ex-price small{font-family:var(--f-body);text-transform:none;letter-spacing:0}
table.cmp thead th{font-family:var(--f-display);font-weight:600;letter-spacing:-.02em}
.table-wrap{border-radius:var(--r)}

/* KPI e percorso */
.kpi{border-top:0;padding:1.3rem 1.3rem 1.2rem;border-radius:20px;background:var(--surf);border:1px solid var(--linea)}
.kpi .n{font-size:clamp(2.2rem,4vw,3.1rem)}
.ride-step::before{background:linear-gradient(180deg,rgba(255,194,26,.6),rgba(255,194,26,0));width:1px;opacity:1;left:35.5px}
.ride-pin{border-radius:16px;background:var(--surf);font-family:var(--f-body);font-size:.7rem}
.ride-pin b{font-family:var(--f-display);font-weight:600}

/* Il conducente: emblema sobrio al posto della mascotte */
.gino{border:1px solid var(--linea);border-style:solid;border-radius:20px;background:var(--surf);grid-template-columns:64px minmax(0,1fr)}
.gino svg{width:64px}
.gino .bubble{background:transparent;border:0;padding:0}
.gino .bubble small{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.78rem;font-weight:600}

/* Intestazioni di pagina */
.phead{border-bottom:1px solid var(--linea);background:radial-gradient(700px 300px at 85% 0%,rgba(255,194,26,.08),transparent 70%)}
.phead::before{inset:0;height:auto;background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/48px 48px;
  -webkit-mask-image:radial-gradient(ellipse 60% 90% at 80% 10%,#000,transparent 75%);mask-image:radial-gradient(ellipse 60% 90% at 80% 10%,#000,transparent 75%)}
.phead .road{display:none}
.crumbs{font-family:var(--f-body)!important;letter-spacing:0!important;text-transform:none!important;font-size:.82rem!important}

/* Invito finale: scuro con alone giallo */
.cta{background:radial-gradient(700px 320px at 85% 120%,rgba(255,194,26,.22),transparent 65%),radial-gradient(500px 260px at 0% 0%,rgba(255,194,26,.06),transparent 60%),#0b0c0f;color:var(--gesso);border-top:1px solid var(--linea)}
.cta::before{background:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px) 0 0/56px 56px;-webkit-mask-image:linear-gradient(90deg,transparent,#000);mask-image:linear-gradient(90deg,transparent,#000)}
.cta h2{color:var(--gesso);background:linear-gradient(180deg,#fff,#c3c6cd);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta p{color:var(--nebbia)}
.cta .btn-dark{background:linear-gradient(180deg,#ffd34d,#ffc21a 60%,#f5b400);color:var(--taxi-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 30px -12px rgba(255,194,26,.7)}
.cta .btn-dark:hover{background:linear-gradient(180deg,#ffdc6e,#ffc933);color:var(--taxi-ink)}
.cta .btn-line{border-color:rgba(255,255,255,.14);color:var(--gesso);background:rgba(255,255,255,.04)}
.cta .btn-line:hover{border-color:rgba(255,255,255,.28)}

/* Piede */
.foot{background:#060708}
.foot h4{font-family:var(--f-body);letter-spacing:0;text-transform:none;font-size:.82rem;color:var(--gesso);font-weight:600}
.foot a{color:var(--nebbia);text-decoration:none}
.foot a:hover{color:var(--gesso)}
.plate,.odo{display:none!important}

/* Moduli */
.form input,.form select,.form textarea{border-radius:12px;background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.1)}
.form label{font-family:var(--f-body)!important;letter-spacing:0!important;text-transform:none!important}

/* Bento delle infografiche: si integra con viz.css */
.bento .bc h3{font-size:1.05rem;letter-spacing:-.015em}
.bc .note{color:var(--fumo);font-size:.78rem}
.legend{display:flex;gap:1rem;flex-wrap:wrap;font-size:.78rem;color:var(--nebbia)}
.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.4rem;background:var(--c,var(--taxi))}
.duo{display:grid;gap:.9rem}
.duo .row{display:grid;grid-template-columns:7.5rem minmax(0,1fr) auto;gap:.8rem;align-items:center;font-size:.84rem;color:var(--nebbia)}
.duo .row b{color:var(--gesso);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:520px){.duo .row{grid-template-columns:minmax(0,1fr) auto}.duo .row .viz-stripes{grid-column:1/-1;grid-row:2}}

@media (prefers-reduced-motion:reduce){.card,.lane-card,.tier,.ex,.channel{transition:none}}
.srv-badge{display:inline-flex;align-items:center;gap:.45rem;align-self:flex-start;font-size:.76rem;font-weight:600;color:#5fe39a;background:rgba(58,210,127,.1);border:1px solid rgba(58,210,127,.25);border-radius:99px;padding:.22rem .65rem}
.srv-badge i{width:7px;height:7px;border-radius:50%;background:#3ad27f;box-shadow:0 0 8px #3ad27f;animation:srvpulse 2s ease-in-out infinite}
@keyframes srvpulse{50%{opacity:.35}}