/*
Theme Name: New B Dental One Page PRO
Theme URI: https://example.com/
Author: New B Dental
Description: Tema one-page professionale blu/bianco per laboratorio odontotecnico (Scheletrati digitali, CAD-Cast, Nylon) con galleria filtrabile, lightbox, WhatsApp e form contatti.
Version: 2.0.1
License: GPLv2 or later
Text Domain: new-b-dental
*/

:root {
  --nbd-blue:#0b5bd3;
  --nbd-blue-2:#0a3f94;
  --nbd-bg:#ffffff;
  --nbd-text:#0f172a;
  --nbd-muted:#475569;
  --nbd-card:#ffffff;
  --nbd-border:rgba(15, 23, 42, .10);
  --nbd-shadow: 0 12px 30px rgba(2, 6, 23, .10);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;color:var(--nbd-text);background:var(--nbd-bg);line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}

.container{width:min(1120px, calc(100% - 32px));margin:0 auto}

.header{position:sticky;top:0;z-index:999;background:rgba(255,255,255,.72);backdrop-filter: blur(10px);border-bottom:1px solid var(--nbd-border)}
.header__inner{display:flex;align-items:center;justify-content:center;gap:18px;padding:14px 0}
.brand{display:flex;align-items:center;justify-content:center;gap:12px}
.brand img{height:44px;width:auto}

.nav{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.nav a{font-size:14px;color:var(--nbd-muted);padding:8px 10px;border-radius:999px}
.nav a:hover{background:rgba(11,91,211,.08);color:var(--nbd-blue)}

.hero{position:relative;min-height:72vh;display:grid;place-items:center;overflow:hidden}
.hero__bg{position:absolute;inset:0;background-image:url('assets/img/hero/hero.jpg');background-size:cover;background-position:center;filter: blur(10px);transform:scale(1.08)}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(120deg, rgba(3,14,41,.82), rgba(11,91,211,.48))}
.hero__content{position:relative;padding:64px 0;text-align:center;color:#fff}
.kicker{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.08);font-size:13px}
.hero h1{margin:14px 0 10px;font-size:clamp(34px, 5vw, 52px);line-height:1.08}
.hero p{margin:0 auto 22px;max-width:820px;color:rgba(255,255,255,.88);font-size:clamp(16px, 2.2vw, 18px)}
.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.10);color:#fff;font-weight:600}
.btn--primary{background:#fff;color:var(--nbd-blue);border-color:#fff}
.btn:hover{transform:translateY(-1px)}
.trust{margin-top:18px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;color:rgba(255,255,255,.86);font-size:13px}
.badge{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18)}

.section{padding:72px 0}
.section h2{font-size:32px;margin:0 0 12px}
.section p.lead{margin:0 0 22px;color:var(--nbd-muted);max-width:860px}

.grid{display:grid;gap:18px}
.grid--3{grid-template-columns:repeat(3, minmax(0, 1fr))}
.grid--2{grid-template-columns:repeat(2, minmax(0, 1fr))}

.card{background:var(--nbd-card);border:1px solid var(--nbd-border);border-radius:18px;box-shadow: 0 8px 24px rgba(2,6,23,.06);padding:18px}
.card h3{margin:0 0 6px}
.card p{margin:0;color:var(--nbd-muted)}

.steps{counter-reset: step}
.step{display:flex;gap:14px;align-items:flex-start}
.step:before{counter-increment: step;content: counter(step);display:grid;place-items:center;width:34px;height:34px;border-radius:999px;background:rgba(11,91,211,.10);border:1px solid rgba(11,91,211,.22);color:var(--nbd-blue);font-weight:700;flex:0 0 auto}

.gallery-controls{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 18px}
.gbtn{border:1px solid var(--nbd-border);background:#fff;border-radius:999px;padding:10px 12px;font-weight:600;color:var(--nbd-muted);cursor:pointer}
.gbtn.is-active{border-color:rgba(11,91,211,.28);background:rgba(11,91,211,.08);color:var(--nbd-blue)}

.gallery{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:12px}
.gitem{border-radius:16px;overflow:hidden;border:1px solid var(--nbd-border);background:#fff;cursor:pointer}
.gitem img{width:100%;aspect-ratio: 4/3;object-fit:cover}

.faq details{border:1px solid var(--nbd-border);border-radius:14px;padding:14px 14px}
.faq details + details{margin-top:10px}
.faq summary{cursor:pointer;font-weight:700}
.faq p{margin:10px 0 0;color:var(--nbd-muted)}

.form-grid{display:grid;gap:12px}
.input{width:100%;padding:12px 12px;border-radius:12px;border:1px solid var(--nbd-border);font:inherit}
textarea.input{min-height:120px;resize:vertical}
.notice{padding:12px 14px;border-radius:14px;border:1px solid var(--nbd-border);background:rgba(11,91,211,.06);color:var(--nbd-blue);margin-bottom:12px}

.footer{padding:34px 0;border-top:1px solid var(--nbd-border);color:var(--nbd-muted)}
.footer__inner{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.footer img{height:34px}

.whatsapp{position:fixed;right:16px;bottom:16px;z-index:9999}
.whatsapp a{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:999px;background:#25D366;color:#fff;box-shadow: var(--nbd-shadow)}
.whatsapp svg{width:26px;height:26px}

.lightbox{position:fixed;inset:0;display:none;place-items:center;background:rgba(2,6,23,.72);z-index:10000;padding:24px}
.lightbox.is-open{display:grid}
.lightbox__img{max-width:min(1100px, 96vw);max-height:86vh;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.12)}
.lightbox__close{position:fixed;top:14px;right:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#fff;border-radius:999px;padding:10px 12px;cursor:pointer}

@media (max-width: 900px){
  .grid--3{grid-template-columns:1fr}
  .grid--2{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2, minmax(0,1fr))}
}
@media (max-width: 520px){
  .gallery{grid-template-columns:1fr}
  .brand img{height:40px}
}