/* Numeritelefonici.it — Concept 2 "Il configuratore" (dark charcoal + magenta + cyan) */
:root{
 --bg:#101019;--bg2:#16161f;--surface:#1a1a26;--surface2:#1f1f2e;--ink:#F1EEF6;--mut:#8d8aa0;--faint:#6a677d;--line:#2a2a3a;
 --mag:#FF3D81;--mag2:#FF6FA3;--mag-deep:#C42462;--cyan:#39E1D8;--cyan-ink:#1BB9B0;
 --shadow:0 20px 50px rgba(0,0,0,.5);--radius:16px;--maxw:1180px;
 --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,Helvetica,Arial,sans-serif;
 --mono:ui-monospace,"SF Mono","Cascadia Code",Menlo,Consolas,monospace}
.nt *{box-sizing:border-box}
.nt{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;margin:0;overflow-x:hidden}
.nt h1,.nt h2,.nt h3{margin:0;line-height:1.04;letter-spacing:-.022em;font-weight:800;text-wrap:balance}
.nt p{margin:0}.nt a{color:inherit;text-decoration:none}.nt img{max-width:100%}
.nt .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.nt .eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mag2);font-weight:600}
.nt :focus-visible{outline:2.5px solid var(--mag);outline-offset:3px;border-radius:6px}
.nt .btn{display:inline-flex;align-items:center;gap:.5em;font-weight:700;font-size:15px;padding:13px 22px;border-radius:11px;border:1.5px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s;white-space:nowrap}
.nt .btn:hover{transform:translateY(-2px)}
.nt .btn-primary{background:var(--mag);color:#fff;box-shadow:0 8px 22px rgba(255,61,129,.34)}
.nt .btn-primary:hover{box-shadow:0 12px 30px rgba(255,61,129,.46)}
.nt .btn-ghost{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.16);color:var(--ink)}
.nt .btn-ghost:hover{background:rgba(255,255,255,.1)}
/* header */
.nt header.nth{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nt .nav{display:flex;align-items:center;gap:24px;height:66px}
.nt .brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:19px}
.nt .brand .bname{white-space:nowrap}.nt .brand .b{color:var(--mag)}
.nt .dot{width:10px;height:10px;border-radius:50%;background:var(--mag);box-shadow:0 0 0 4px rgba(255,61,129,.22)}
.nt .nav-links{display:flex;gap:22px;margin-left:auto;font-size:14.5px;color:var(--mut);font-weight:500}
.nt .nav-links a:hover{color:var(--ink)}
.nt .nav-tel{font-family:var(--mono);font-weight:600;font-size:14.5px;white-space:nowrap;margin-left:auto}
.nt .nav .btn{padding:9px 17px;white-space:nowrap}
.nt .mtoggle{display:none}.nt .burger{display:none}
.nt .nav-links .mtel,.nt .nav-links .mcta{display:none}
@media(max-width:960px){
 .nt .nav{position:relative}
 .nt .burger{display:block;margin-left:auto;cursor:pointer;padding:8px 6px}
 .nt .burger span{display:block;width:23px;height:2px;background:var(--ink);border-radius:2px}.nt .burger span+span{margin-top:5px}
 .nt .nav-tel{display:none}
 .nt .nav-links{display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;background:var(--surface);flex-direction:column;align-items:stretch;gap:0;margin:0;padding:6px 0;border-top:1px solid var(--line);box-shadow:0 20px 44px rgba(0,0,0,.5)}
 .nt .nav-links a{padding:13px 24px;font-size:16px;color:var(--ink)}.nt .nav-links a:hover{background:var(--surface2)}
 .nt .nav-links .mtel{display:block;font-family:var(--mono);color:var(--mut);border-top:1px solid var(--line);margin-top:4px}
 .nt .nav-links .mcta{display:block;color:var(--mag2);font-weight:700}
 .nt .mtoggle:checked ~ .nav-links{display:flex}
}
@media(max-width:600px){.nt .nav{gap:12px;height:60px}.nt .brand{font-size:18px}}
/* hero */
.nt .hero{position:relative;background:radial-gradient(120% 90% at 86% -10%,#1d1a2e 0%,var(--bg) 58%);border-bottom:1px solid var(--line);overflow:hidden}
.nt .hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;padding-top:64px;padding-bottom:70px}
@media(max-width:860px){.nt .hero .wrap{grid-template-columns:1fr;gap:34px;padding-top:44px;padding-bottom:48px}}
.nt .hero h1{font-size:clamp(36px,5.6vw,58px);color:var(--ink)}
.nt .hero h1 .u{color:var(--mag)}
.nt .hero .sub{margin-top:18px;font-size:clamp(17px,1.6vw,20px);color:var(--mut);max-width:34ch}
.nt .hero .cta{display:flex;gap:13px;margin-top:28px;flex-wrap:wrap}
.nt .chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px;font-family:var(--mono);font-size:11.5px}
.nt .chips span{padding:6px 12px;border-radius:999px;border:1px solid var(--line);color:var(--mut);background:rgba(255,255,255,.03)}
.nt .chips b{color:var(--cyan)}
/* configuratore */
.nt .conf{background:linear-gradient(160deg,var(--surface),#141420);border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:var(--shadow)}
.nt .conf .step{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin:16px 0 9px}
.nt .conf .step:first-child{margin-top:0}
.nt .opts{display:flex;gap:8px;flex-wrap:wrap}
.nt .opt{padding:9px 15px;border-radius:10px;border:1px solid #33334a;font-size:13.5px;color:var(--ink);cursor:pointer;background:transparent;transition:.15s;font-family:inherit}
.nt .opt:hover{border-color:var(--mag2)}
.nt .opt.on{background:var(--mag);border-color:var(--mag);color:#fff;font-weight:700}
.nt .conf .numwrap{margin-top:18px;background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:12px;padding:16px}
.nt .conf .numlbl{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.nt .conf .num{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700;font-size:clamp(26px,5vw,38px);letter-spacing:.05em;color:var(--ink);margin-top:6px}
.nt .conf .num em{color:var(--cyan);font-style:normal}
.nt .conf .price{display:flex;justify-content:space-between;align-items:center;margin-top:16px;border-top:1px solid var(--line);padding-top:16px}
.nt .conf .price .p{font-family:var(--mono)}.nt .conf .price .p b{font-size:24px;color:var(--cyan)}.nt .conf .price .p small{color:var(--mut);font-size:12px}
/* strip */
.nt .strip{background:var(--bg2);border-bottom:1px solid var(--line)}
.nt .strip .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.nt .stat{padding:24px 22px;border-right:1px solid var(--line)}.nt .stat:last-child{border-right:none}
.nt .stat .k{font-family:var(--mono);font-weight:700;font-size:22px;color:var(--ink)}.nt .stat .k em{color:var(--cyan);font-style:normal}
.nt .stat .d{color:var(--mut);font-size:13.5px;margin-top:3px}
@media(max-width:760px){.nt .strip .wrap{grid-template-columns:1fr 1fr}.nt .stat:nth-child(2){border-right:none}.nt .stat:nth-child(1),.nt .stat:nth-child(2){border-bottom:1px solid var(--line)}}
/* sections */
.nt section{padding:84px 0}
.nt .sec-head{max-width:54ch;margin-bottom:40px}
.nt .sec-head h2{font-size:clamp(28px,3.6vw,42px);margin-top:13px;color:var(--ink)}
.nt .sec-head p{color:var(--mut);margin-top:14px;font-size:18px}
/* catalog product cards */
.nt .catalog{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:820px){.nt .catalog{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.nt .catalog{grid-template-columns:1fr}}
.nt .pc{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;transition:transform .18s,border-color .18s;position:relative}
.nt .pc:hover{transform:translateY(-3px);border-color:var(--mag)}
.nt .pc .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mag2)}
.nt .pc h3{font-size:20px;margin-top:8px}
.nt .pc .d{color:var(--mut);font-size:14.5px;margin-top:8px;flex:1}
.nt .pc .pr{font-family:var(--mono);font-weight:800;font-size:26px;color:var(--cyan);margin-top:16px}
.nt .pc .pr small{font-size:12px;color:var(--mut);font-weight:600}
.nt .pc .add{margin-top:16px;text-align:center;background:rgba(255,61,129,.12);border:1px solid var(--mag);color:var(--mag2);border-radius:10px;padding:11px;font-weight:700;font-size:14px;cursor:pointer}
.nt .pc .add:hover{background:var(--mag);color:#fff}
/* value / steps grid */
.nt .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:760px){.nt .grid3{grid-template-columns:1fr}}
.nt .vp{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px}
.nt .vp .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;margin-bottom:16px;background:rgba(57,225,216,.1);color:var(--cyan)}
.nt .vp .ic svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.nt .vp h3{font-size:18px}.nt .vp p{color:var(--mut);font-size:15px;margin-top:8px}
.nt .step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px}
.nt .step .n{font-family:var(--mono);font-weight:700;font-size:14px;color:#fff;background:var(--mag);width:36px;height:36px;border-radius:10px;display:grid;place-items:center;margin-bottom:16px}
.nt .step h3{font-size:19px}.nt .step p{color:var(--mut);font-size:15px;margin-top:9px}
/* CTA band */
.nt .band{background:linear-gradient(120deg,var(--mag-deep),var(--mag));border-radius:24px;padding:clamp(36px,5vw,56px);text-align:center;position:relative;overflow:hidden}
.nt .band .eyebrow{color:#ffd9e7}
.nt .band h2{font-size:clamp(28px,4vw,44px);color:#fff;margin-top:12px;max-width:22ch;margin-left:auto;margin-right:auto}
.nt .band p{color:#ffe3ee;margin-top:14px;font-size:18px;max-width:50ch;margin-left:auto;margin-right:auto}
.nt .band .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.nt .band .btn-primary{background:#fff;color:var(--mag-deep)}
.nt .band .btn-ghost{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5);color:#fff}
@media(max-width:600px){.nt .band{padding:32px 20px}.nt .band .row{flex-direction:column;align-items:stretch}.nt .band .btn{width:100%;justify-content:center}}
/* network */
.nt .net{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:30px 34px}
.nt .net h3{font-size:22px}.nt .net p{color:var(--mut);margin-top:6px}
.nt .net .links{display:flex;gap:22px;flex-wrap:wrap;font-weight:700;color:var(--cyan)}
/* contact */
.nt .contact{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:clamp(28px,4vw,46px);text-align:center;max-width:760px;margin:0 auto}
.nt .contact h2{font-size:clamp(26px,3.4vw,36px)}
.nt .contact p{color:var(--mut);margin-top:12px;font-size:17px}
.nt .contact .row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.nt .contact .tel{font-family:var(--mono);font-size:20px;color:var(--cyan);font-weight:700}
@media(max-width:600px){.nt .contact .row{flex-direction:column;align-items:stretch}.nt .contact .btn{width:100%;justify-content:center}}
/* faq */
.nt .faq{max-width:820px;margin:0 auto;display:grid;gap:12px}
.nt details{background:var(--surface);border:1px solid var(--line);border-radius:14px}
.nt summary{cursor:pointer;list-style:none;padding:18px 20px;font-weight:700;font-size:17px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.nt summary::-webkit-details-marker{display:none}
.nt summary .pm{font-family:var(--mono);color:var(--mag);font-size:22px;transition:transform .2s;flex:none}
.nt details[open] summary .pm{transform:rotate(45deg)}
.nt details p{color:var(--mut);padding:0 20px 20px;font-size:15.5px;max-width:66ch}
/* footer */
.nt footer.ntf{background:var(--bg2);color:var(--mut);padding:64px 0 40px;margin-top:20px;border-top:1px solid var(--line)}
.nt .f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
@media(max-width:760px){.nt .f-grid{grid-template-columns:1fr}}
.nt footer .brand{color:var(--ink);margin-bottom:14px}
.nt footer h4{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);margin:0 0 14px}
.nt footer a{color:var(--mut)}.nt footer a:hover{color:var(--ink)}
.nt .id{font-size:14px;line-height:1.9}
.nt .f-links{display:grid;gap:10px;font-size:14.5px}.nt .f-links a{display:block}
.nt .f-bottom{border-top:1px solid var(--line);margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13px}
.nt .f-legal{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.nt .f-legal a,.nt .f-legal .bc-settings-button{color:var(--mut)!important;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;background:none!important;border:none!important;padding:0!important;cursor:pointer;font-family:inherit}
.nt .f-legal a:hover,.nt .f-legal .bc-settings-button:hover{color:var(--ink)!important}
.nt .f-legal .bc-settings-button svg{width:14px;height:14px;fill:currentColor}
.nt .recaptcha-note{font-size:11px;color:var(--faint);margin-top:10px}.nt .recaptcha-note a{color:var(--cyan)}
.grecaptcha-badge{visibility:hidden!important;opacity:0!important;pointer-events:none!important}
@media(prefers-reduced-motion:reduce){.nt *{transition:none!important;animation:none!important}}
