/* Nordwest Automobile – Fahrzeugverwaltung V1.6 */
.vehicles-page,
.vehicle-detail-page{
  padding-top:82px;
  min-height:70vh;
}

.vehicles-hero,
.vehicle-detail-head{
  padding:90px max(28px,calc((100vw - 1320px)/2)) 55px;
  background:linear-gradient(120deg,#0c0d0f,#191612);
  border-bottom:1px solid var(--line);
}

.vehicles-hero h1,
.vehicle-detail-head h1{
  margin:0;
  font:400 clamp(2.8rem,5.5vw,5rem)/1.04 Georgia,serif;
}

.vehicles-hero>p:last-child{
  max-width:760px;
  color:var(--muted);
}

.vehicle-controls{
  max-width:1320px;
  margin:0 auto;
  padding:34px 28px 0;
  display:grid;
  grid-template-columns:1fr 260px auto;
  gap:18px;
  align-items:end;
}

.vehicle-controls label{
  color:#d8d5cf;
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.vehicle-controls input,
.vehicle-controls select{
  display:block;
  width:100%;
  margin-top:8px;
  min-height:48px;
  padding:0 14px;
  border:1px solid var(--line);
  background:#111315;
  color:white;
}

.vehicle-count{
  padding-bottom:13px;
  color:var(--muted);
  white-space:nowrap;
}

.vehicle-list-wrap{
  max-width:1320px;
  margin:0 auto;
  padding:32px 28px 90px;
}

.vehicle-grid-full{
  grid-template-columns:repeat(3,1fr);
}

.vehicle-card-dynamic .vehicle-image-link{
  display:block;
  position:relative;
  overflow:hidden;
  background:#15171a;
}

.vehicle-card-dynamic .vehicle-image{
  width:100%;
  aspect-ratio:4/3;
  object-fit:contain;
  object-position:center center;
  background:#08090a;
  transition:none;
}

.vehicle-card-dynamic:hover .vehicle-image{
  transform:none;
}

.vehicle-status{
  position:absolute;
  top:13px;
  left:13px;
  padding:7px 10px;
  background:rgba(7,8,10,.88);
  border:1px solid rgba(255,255,255,.16);
  font-size:.62rem;
  text-transform:uppercase;
  letter-spacing:.1em;
}

.vehicle-status-reserviert{
  color:#e2c47f;
  border-color:rgba(200,167,90,.55);
}

.vehicle-card-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.vehicle-card-actions a{
  margin:0;
}

.vehicle-empty{
  grid-column:1/-1;
  padding:70px 25px;
  text-align:center;
  background:#111315;
  border:1px solid var(--line);
}

.vehicle-empty h3{
  margin:0 0 8px;
  font:400 2rem Georgia,serif;
}

.vehicle-empty p{
  color:var(--muted);
}

.vehicle-detail-head{
  display:flex;
  flex-direction:column;
  gap:45px;
}

.vehicle-back{
  color:var(--gold2);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.09em;
}

.vehicle-detail-price{
  margin:18px 0 0;
  color:var(--gold2);
  font-size:1.6rem;
  font-weight:800;
}

.vehicle-gallery-wrap{
  max-width:1320px;
  margin:0 auto;
  padding:32px 28px 8px;
}

.vehicle-gallery{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  grid-template-rows:repeat(2,minmax(190px,215px));
  gap:12px;
  overflow:hidden;
  border-radius:14px;
}

.vehicle-gallery-item{
  position:relative;
  display:block;
  min-width:0;
  overflow:hidden;
  background:#111315;
  color:#fff;
  text-decoration:none;
}

.vehicle-gallery .main-image{
  grid-row:span 2;
}

.vehicle-gallery-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease,filter .35s ease;
}

.vehicle-gallery-item:hover img{
  transform:scale(1.025);
}

.vehicle-gallery-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:16px;
  text-align:center;
  background:rgba(6,8,9,.64);
  backdrop-filter:blur(1px);
}

.vehicle-gallery-overlay strong{
  font-size:clamp(1.7rem,3vw,2.7rem);
  line-height:1;
}

.vehicle-gallery-overlay span{
  margin-top:5px;
  font-size:.82rem;
  font-weight:700;
}

.vehicle-gallery-overlay small{
  margin-top:9px;
  color:#ddd9d1;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.vehicle-gallery-overlay-mobile{
  display:none;
}

.vehicle-gallery-action{
  margin-top:14px;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:#111315;
  border:1px solid var(--line);
  border-radius:10px;
}

.vehicle-gallery-action>div{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.vehicle-gallery-action strong{
  font-size:1rem;
}

.vehicle-gallery-action span{
  color:var(--muted);
  font-size:.83rem;
  line-height:1.45;
}

.vehicle-gallery-action .btn{
  flex:0 0 auto;
  margin:0;
  white-space:nowrap;
}

.vehicle-detail-content{
  max-width:1320px;
  margin:0 auto;
  padding:32px 28px 90px;
  display:grid;
  grid-template-columns:1fr 380px;
  gap:55px;
  align-items:start;
}

.vehicle-detail-content h2{
  margin:45px 0 20px;
  font:400 2rem Georgia,serif;
}

.vehicle-detail-content h2:first-child{
  margin-top:0;
}

.vehicle-specs{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line);
}

.vehicle-specs div{
  padding:17px 12px 17px 0;
  border-bottom:1px solid var(--line);
}

.vehicle-specs dt{
  color:var(--muted);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.vehicle-specs dd{
  margin:4px 0 0;
}

.vehicle-description{
  color:#d3d0ca;
  line-height:1.85;
}

.vehicle-equipment{
  columns:2;
  padding-left:18px;
  color:#d3d0ca;
}

.vehicle-contact-box{
  position:sticky;
  top:105px;
  padding:30px;
  background:#111315;
  border:1px solid var(--line);
}

.vehicle-contact-box h2{
  margin:0 0 12px;
}

.vehicle-contact-box p{
  color:var(--muted);
}

.vehicle-contact-box .btn{
  width:100%;
  margin-top:10px;
}

.vehicle-not-found,
.vehicle-detail-loading{
  max-width:900px;
  margin:0 auto;
  padding:170px 28px 100px;
  text-align:center;
}

@media(max-width:980px){
  .vehicle-grid-full{
    grid-template-columns:repeat(2,1fr);
  }

  .vehicle-detail-content{
    grid-template-columns:1fr;
  }

  .vehicle-contact-box{
    position:static;
  }
}

@media(max-width:720px){
  .vehicles-page,
  .vehicle-detail-page{
    padding-top:82px;
  }

  .vehicle-controls{
    grid-template-columns:1fr;
  }

  .vehicle-count{
    padding:0;
  }

  .vehicle-grid-full{
    grid-template-columns:1fr;
  }

  .vehicle-gallery-wrap{
    padding:22px 16px 4px;
  }

  .vehicle-gallery{
    grid-template-columns:1fr 1fr;
    grid-template-rows:minmax(250px,56vw) minmax(120px,28vw);
    gap:8px;
    border-radius:10px;
  }

  .vehicle-gallery .main-image{
    grid-column:1/-1;
    grid-row:auto;
  }

  .vehicle-gallery-item:nth-child(n+4){
    display:none;
  }

  .vehicle-gallery-overlay-desktop{
    display:none;
  }

  .vehicle-gallery-overlay-mobile{
    display:flex;
  }

  .vehicle-gallery-action{
    margin-top:10px;
    padding:16px;
    flex-direction:column;
    align-items:stretch;
    gap:14px;
  }

  .vehicle-gallery-action .btn{
    width:100%;
    white-space:normal;
    text-align:center;
  }

  .vehicle-specs{
    grid-template-columns:1fr;
  }

  .vehicle-equipment{
    columns:1;
  }
}


/* Mobile-Fix: Fahrzeugbilder niemals beschneiden */
@media(max-width:720px){
  .vehicle-card-dynamic .vehicle-image-link{
    aspect-ratio:4/3;
    background:#08090a;
  }

  .vehicle-card-dynamic .vehicle-image{
    width:100% !important;
    height:100% !important;
    aspect-ratio:auto !important;
    object-fit:contain !important;
    object-position:center center !important;
    transform:none !important;
  }
}