.inventory.section {
  padding-left: 5vw;
  padding-right: 5vw;
}

.car-grid {
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 30px;
}

.car-grid .car-card:only-child {
  max-width: 760px;
}

.car-photo {
  height: clamp(300px, 28vw, 440px);
  background-size: cover;
  background-position: center;
}

.modal-panel.vehicle-panel {
  width: min(96vw, 1500px);
  overflow: hidden;
}

.vehicle-detail {
  grid-template-columns: minmax(0, 1.65fr) minmax(340px, .75fr);
  height: min(86vh, 900px);
}

.vehicle-detail > div {
  min-width: 0;
}

.vehicle-detail > div:first-child {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #111;
}

.detail-photo {
  position: relative;
  min-height: 0;
  height: auto;
  flex: 1;
  background-color: #111;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.gallery-arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  transform: translateY(-50%);
  width: 58px;
  height: 76px;
  border: 1px solid #fff8;
  border-radius: 6px;
  background: #0009;
  color: #fff;
  font: 400 58px/55px Arial, sans-serif;
  box-shadow: 0 5px 18px #0005;
}

.gallery-arrow:hover { background: #d8612c; }
.gallery-prev { left: 18px; }
.gallery-next { right: 18px; }
.photo-counter { position: absolute; right: 18px; bottom: 16px; padding: 7px 11px; border-radius: 20px; background: #000a; color: #fff; font-size: 12px; }

.photo-strip {
  width: 100%;
  max-width: 100%;
  flex: 0 0 auto;
  overflow-x: auto;
  overflow-y: hidden;
}

.detail-copy {
  overflow-y: auto;
  padding: 55px 42px;
  background: #fff;
}

@media (max-width: 900px) {
  .car-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
  .vehicle-detail { grid-template-columns: 1fr; height: auto; max-height: calc(100vh - 40px); overflow-y: auto; }
  .vehicle-detail > div:first-child { height: min(68vh, 650px); }
  .detail-copy { overflow: visible; }
  .modal-panel.vehicle-panel { overflow: auto; }
}

@media (max-width: 620px) {
  .car-grid { grid-template-columns: 1fr; }
  .car-grid .car-card:only-child { max-width: none; }
  .car-photo { height: 72vw; max-height: 390px; }
  .modal-panel.vehicle-panel { width: 100%; }
  .vehicle-detail > div:first-child { height: 55vh; min-height: 390px; }
  .detail-copy { padding: 30px 22px; }
  .gallery-arrow { width: 46px; height: 62px; font-size: 46px; line-height: 43px; }
  .gallery-prev { left: 8px; }
  .gallery-next { right: 8px; }
}