:root{
  --dark:#101827;
  --muted:#64748b;
  --light:#f4f6fa;
  --white:#ffffff;
  --red:#d71920;
  --red-dark:#a80f16;
  --green:#22c55e;
  --border:#e5eaf1;
  --shadow:0 24px 70px rgba(16,24,39,.16);
}
*{box-sizing:border-box}
img,svg,video{max-width:100%}
.navbar > *, .filters > *, .cars-grid > *, .detail-grid > *, .social-grid > *, .contact > *{min-width:0}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:
    linear-gradient(rgba(244,246,250,.94),rgba(244,246,250,.94)),
    url('assets/logo_vb.webp') center 120px/42% no-repeat fixed;
  color:var(--dark);
}
a{color:inherit}
.navbar{
  height:82px;
  padding:0 6%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,255,255,.94);
  position:sticky;
  top:0;
  z-index:30;
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(12px);
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}
.brand img{
  width:54px;
  height:54px;
  object-fit:contain;
  border-radius:14px;
}
.brand > div{display:flex;flex-direction:column;justify-content:center;min-width:230px}
.brand strong{display:block;font-size:19px;line-height:1.2;letter-spacing:.1px}
.brand small{display:block;color:var(--muted);margin-top:5px;line-height:1.35;white-space:normal}
.nav-links{display:flex;gap:24px;font-weight:900}
.nav-links a{text-decoration:none;color:#263244}
.nav-cta{
  margin-left:28px;
  background:var(--green);
  color:white;
  text-decoration:none;
  font-weight:900;
  padding:12px 18px;
  border-radius:999px;
}
.hero{
  position:relative;
  min-height:720px;
  display:flex;
  align-items:center;
  padding:90px 6%;
  color:white;
  background:linear-gradient(90deg,rgba(0,0,0,.70),rgba(0,0,0,.20)),var(--hero-image) center/cover;
}
.hero-shade{
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 75% 25%,rgba(215,25,32,.16),transparent 36%);
}
.hero-content{position:relative;max-width:900px}
.hero-logo{
  width:145px;
  height:auto;
  background:rgba(255,255,255,.93);
  padding:16px;
  border-radius:28px;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  margin-bottom:24px;
}
.label{
  text-transform:uppercase;
  letter-spacing:2px;
  color:#ffb6ba;
  font-size:13px;
  font-weight:900;
}
.red{color:var(--red)}
h1{
  font-size:clamp(40px,6vw,70px);
  line-height:.97;
  margin:12px 0 18px;
  letter-spacing:-2px;
}
.hero-subtitle{
  font-size:21px;
  line-height:1.55;
  color:#e5e7eb;
  max-width:750px;
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  border-radius:999px;
  padding:0 22px;
  text-decoration:none;
  font-weight:900;
  border:0;
  cursor:pointer;
}
.primary{background:var(--red);color:white}
.primary:hover{background:var(--red-dark)}
.secondary{background:white;color:#111827}
.ghost{color:white;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28)}
.dark{background:#111827;color:white}
.hero-stats{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-top:38px;
}
.hero-stats div{
  min-width:170px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(8px);
  border-radius:20px;
  padding:18px;
}
.hero-stats strong{display:block;font-size:24px}
.hero-stats span{color:#d1d5db;font-size:14px}
.trust-strip{
  width:min(1240px,90%);
  margin:-52px auto 30px;
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.trust-strip article{
  background:white;
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  border-radius:24px;
  padding:22px;
}
.trust-strip strong{display:block;font-size:20px}
.trust-strip span{display:block;color:var(--muted);margin-top:6px}
.filters-panel{
  width:min(1240px,90%);
  margin:30px auto;
  background:white;
  border-radius:28px;
  padding:28px;
  box-shadow:var(--shadow);
  border:1px solid var(--border);
}
.filters-heading{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:flex-start;
}
.filters-panel h2{margin:4px 0 8px;font-size:36px}
.filters-panel p{margin:0 0 22px;color:var(--muted);line-height:1.45}
.ghost-btn{
  border:1px solid var(--border);
  background:#f8fafc;
  border-radius:999px;
  min-height:42px;
  padding:0 16px;
  font-weight:900;
  cursor:pointer;
}
.filters{
  display:grid;
  grid-template-columns:1.5fr repeat(6,1fr);
  gap:12px;
}
input,select{
  height:52px;
  border:1px solid var(--border);
  border-radius:15px;
  padding:0 14px;
  font-size:15px;
  background:white;
}
.inline-detail{
  width:min(1240px,90%);
  margin:0 auto 32px;
  display:none;
}
.inline-detail.open{
  display:block;
  background:white;
  border:1px solid var(--border);
  border-radius:30px;
  padding:30px;
  box-shadow:var(--shadow);
}
.inline-title-row{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:18px;
}
.inline-title-row h2{margin:0;font-size:36px;letter-spacing:-1px}
.close-inline{
  border:1px solid var(--border);
  background:#f8fafc;
  border-radius:999px;
  height:42px;
  padding:0 16px;
  font-weight:900;
  cursor:pointer;
}
.cars-grid{
  width:min(1240px,90%);
  margin:0 auto 80px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.card{
  background:white;
  border-radius:26px;
  overflow:hidden;
  border:1px solid var(--red);
  outline:4px solid rgba(215,25,32,.22);
  box-shadow:0 10px 32px rgba(16,24,39,.09);
}
.card.selected{
  outline:4px solid rgba(215,25,32,.22);
  border-color:var(--red);
}
.photo{height:220px;position:relative;overflow:hidden;background:#d8dee8}
.photo img{width:100%;height:100%;object-fit:cover;transition:.35s}
.card:hover img{transform:scale(1.06)}
.badge{
  position:absolute;
  top:12px;
  left:12px;
  background:rgba(0,0,0,.72);
  color:white;
  border-radius:999px;
  padding:7px 10px;
  font-size:12px;
  font-weight:900;
}
.no-photo{
  height:100%;
  display:grid;
  place-items:center;
  text-align:center;
  background:linear-gradient(135deg,#182235,#334155);
  color:white;
  font-weight:900;
}
.content{padding:20px}
.content h3{font-size:20px;margin:0 0 10px}
.meta{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.meta span{
  font-size:13px;
  color:#445064;
  background:#f1f4f8;
  border-radius:999px;
  padding:7px 9px;
}
.price{font-size:29px;font-weight:900;color:var(--red);margin:8px 0}
.desc{color:#4b5563;line-height:1.45;min-height:82px}
.actions{display:flex;gap:8px;margin-top:16px}
.actions a,.actions button{
  flex:1;
  text-align:center;
  border-radius:12px;
  padding:12px 8px;
  text-decoration:none;
  font-weight:900;
  font-size:14px;
  border:0;
  cursor:pointer;
}
.wa{background:var(--green);color:white}
.info{background:#eef2f7;color:#111827}
.empty{
  grid-column:1/-1;
  background:white;
  padding:28px;
  border-radius:20px;
  text-align:center;
  color:var(--muted);
}
.detail-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:30px;
}
.main-image{
  width:100%;
  height:520px;
  object-fit:cover;
  border-radius:24px;
  background:#e5e7eb;
}
.thumbs{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:10px;
  margin-top:12px;
}
.thumbs img{
  width:100%;
  height:78px;
  object-fit:cover;
  border-radius:12px;
  cursor:pointer;
  border:3px solid transparent;
}
.thumbs img.active{border-color:var(--red)}
.specs{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin:18px 0;
}
.specs div{
  background:#f8fafc;
  border:1px solid var(--border);
  border-radius:16px;
  padding:12px;
}
.specs span{display:block;color:var(--muted);font-size:13px;margin-bottom:3px}
.detail-description{color:#374151;line-height:1.62;white-space:pre-line}
.options{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  padding:0;
  list-style:none;
}
.options li{
  background:#f8fafc;
  border:1px solid var(--border);
  padding:10px;
  border-radius:12px;
}
.social{
  background:#111827;
  color:white;
  padding:80px 6%;
  text-align:center;
}
.social h2,.contact h2{font-size:40px;margin:0 0 28px;letter-spacing:-1px}
.social-grid{
  width:min(1000px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.social-grid a{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  border-radius:24px;
  padding:28px;
  text-decoration:none;
}
.social-grid strong{display:block;font-size:25px}
.social-grid span{display:block;color:#d6dbe4;margin-top:8px}
.contact{
  width:min(1240px,90%);
  margin:80px auto;
  background:white;
  border-radius:30px;
  padding:36px;
  box-shadow:var(--shadow);
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:30px;
  align-items:center;
  border:1px solid var(--border);
}
.contact p{color:#4b5563;line-height:1.5}
.contact-card{
  background:#f8fafc;
  border:1px solid var(--border);
  border-radius:24px;
  padding:24px;
}
.contact-card img{
  width:110px;
  margin-bottom:14px;
}
.contact-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:42px}
footer{
  text-align:center;
  background:#080d18;
  color:#cbd5e1;
  padding:30px;
}
footer img{width:82px;background:white;border-radius:18px;padding:10px;margin-bottom:8px}
@media(max-width:1150px){
  .navbar{padding-left:3%;padding-right:3%}
  .nav-links{gap:14px;font-size:14px}
  .nav-cta{margin-left:14px;padding-left:15px;padding-right:15px}
  .brand > div{min-width:190px}
  .cars-grid{grid-template-columns:repeat(2,1fr)}
  .filters{grid-template-columns:1fr 1fr}
  .contact,.social-grid,.detail-grid,.trust-strip{grid-template-columns:1fr}
  .main-image{height:380px}
  .options{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:980px){
  .navbar{height:auto;min-height:78px;padding:12px 5%}
  .nav-links,.nav-cta{display:none}
  .brand > div{min-width:0}
}
@media(max-width:700px){
  body{background-size:85%}
  .navbar{height:auto;min-height:78px;padding:12px 5%}
  .nav-links,.nav-cta{display:none}
  .brand img{width:48px;height:48px}
  .brand > div{min-width:0}
  .brand strong{font-size:17px}
  .brand small{font-size:12px;line-height:1.3;margin-top:4px}
  .hero{min-height:660px;padding:60px 5%}
  .hero-logo{width:120px}
  h1{font-size:38px}
  .hero-subtitle{font-size:18px}
  .filters,.cars-grid,.specs,.options{grid-template-columns:1fr}
  .filters-heading,.inline-title-row{flex-direction:column}
  .photo{height:230px}
  .thumbs{grid-template-columns:repeat(3,1fr)}
}
.card{transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;overflow:hidden}
.card:hover{transform:translateY(-8px);box-shadow:0 28px 70px rgba(16,24,39,.22);border-color:rgba(215,25,32,.35)}
.photo img{transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .5s ease}
.card:hover .photo img{transform:scale(1.055);filter:saturate(1.08) contrast(1.03)}
.main-image{transition:opacity .25s ease,transform .45s ease;cursor:zoom-in}
.main-image:hover{transform:scale(1.012)}
.thumbs img{transition:transform .2s ease,opacity .2s ease}
.thumbs img:hover{transform:translateY(-3px);opacity:1}
.card.reveal{animation:cardReveal .7s both}
@keyframes cardReveal{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}

.footer-social{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:12px}.footer-social a{color:#fff;text-decoration:none;font-weight:700}.footer-social a:hover{text-decoration:underline}


/* Stato vettura venduta */
.card .photo{position:relative}
.sold-badge{position:absolute;top:14px;left:14px;z-index:2;background:#b00020;color:#fff;font-weight:900;letter-spacing:.08em;padding:9px 14px;border-radius:999px;box-shadow:0 5px 18px rgba(0,0,0,.25)}
.sold-price{color:#b00020!important;font-weight:900;letter-spacing:.06em}

/* Nastro diagonale per le vetture vendute */
.sold-ribbon{
  position:absolute;
  z-index:3;
  top:24px;
  right:-48px;
  width:190px;
  padding:10px 0;
  background:#c5161d;
  color:#fff;
  text-align:center;
  font-size:15px;
  font-weight:900;
  letter-spacing:.12em;
  transform:rotate(38deg);
  box-shadow:0 5px 18px rgba(0,0,0,.3);
  pointer-events:none;
}

/* Form di richiesta informazioni della singola vettura */
.vehicle-enquiry{
  margin-top:34px;
  padding:28px;
  border:1px solid var(--border);
  border-radius:24px;
  background:#f8fafc;
}
.enquiry-heading h3{font-size:28px;margin:4px 0 8px}
.enquiry-heading p{color:var(--muted);line-height:1.5;margin:0 0 20px}
.enquiry-form{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.enquiry-form label{display:flex;flex-direction:column;gap:7px;font-weight:800;color:#263245}
.enquiry-form input,.enquiry-form textarea{
  width:100%;
  border:1px solid var(--border);
  border-radius:14px;
  background:#fff;
  padding:13px 14px;
  font:inherit;
  color:#111827;
  box-sizing:border-box;
}
.enquiry-form textarea{height:auto;resize:vertical;line-height:1.5}
.enquiry-form .full-field{grid-column:1/-1}
.privacy-check{flex-direction:row!important;align-items:flex-start;font-weight:600!important;line-height:1.4}
.privacy-check input{width:18px;height:18px;min-width:18px;margin-top:2px;padding:0}
.enquiry-submit{grid-column:1/-1;border:0;cursor:pointer;justify-self:start}
.form-note{margin:0;color:var(--muted);font-size:13px;font-weight:500!important}
@media(max-width:800px){
  .enquiry-form{grid-template-columns:1fr}
  .vehicle-enquiry{padding:20px}
}


/* Form contatti sempre visibile con selezione multipla delle vetture */
.general-enquiry{
  grid-column:1/-1;
  margin-top:8px;
  padding:30px;
  border:1px solid var(--border);
  border-radius:24px;
  background:#f8fafc;
  box-shadow:0 18px 50px rgba(16,24,39,.08);
}
.vehicle-picker{
  margin:0;
  padding:16px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
}
.vehicle-picker legend{padding:0 8px;font-weight:900;color:#263245}
.vehicle-choices{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  max-height:330px;
  overflow:auto;
  padding:4px;
}
.vehicle-choice{
  display:flex!important;
  flex-direction:row!important;
  align-items:flex-start;
  gap:10px!important;
  padding:12px;
  border:1px solid var(--border);
  border-radius:14px;
  cursor:pointer;
  background:#fff;
}
.vehicle-choice:hover{border-color:rgba(215,25,32,.45);background:#fffafa}
.vehicle-choice input{width:18px!important;height:18px;min-width:18px;padding:0!important;margin-top:2px}
.vehicle-choice span{display:flex;flex-direction:column;gap:4px}
.vehicle-choice small{font-weight:600;color:var(--muted)}
.enquiry-actions{display:flex;flex-wrap:wrap;gap:12px}
.enquiry-actions .btn{border:0;cursor:pointer}
@media(max-width:800px){
  .general-enquiry{padding:20px}
  .vehicle-choices{grid-template-columns:1fr;max-height:380px}
  .enquiry-actions{flex-direction:column}
  .enquiry-actions .btn{width:100%;text-align:center;justify-content:center}
}


/* Effetti galleria vettura */
.main-image.gallery-photo-exit {
  opacity: 0;
  transform: scale(.965) translateX(-10px);
  filter: blur(5px) saturate(.85);
}
.main-image.gallery-photo-enter {
  animation: galleryPhotoEnter .55s cubic-bezier(.2,.8,.2,1) both;
}
.main-image.gallery-photo-flash {
  box-shadow: 0 0 0 1px rgba(255,255,255,.8), 0 24px 65px rgba(16,24,39,.28);
}
@keyframes galleryPhotoEnter {
  0% { opacity:0; transform:scale(1.035) translateX(14px); filter:blur(5px) brightness(1.08); }
  55% { opacity:1; filter:blur(0) brightness(1.04); }
  100% { opacity:1; transform:scale(1); filter:none; }
}
.thumbs img.active {
  border-color:var(--red);
  transform:translateY(-4px) scale(1.03);
  box-shadow:0 10px 24px rgba(215,25,32,.25);
}
@media (prefers-reduced-motion: reduce) {
  .main-image.gallery-photo-enter { animation:none; }
  .main-image.gallery-photo-exit { transform:none; filter:none; }
}

/* Dati legali e fiscali a fine pagina */
.site-footer { padding:36px 20px; }
.footer-business-data {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  max-width:850px;
  margin:4px auto 18px;
  line-height:1.45;
  color:#fff;
}
.footer-business-data strong { font-size:18px; }
.footer-business-data span { color:#f2f2f2; }
@media(max-width:700px){
  .footer-business-data { font-size:14px; }
}