#details {
  padding-top: clamp(42px, 4.8vw, 72px);
}

#details .section-head {
  margin-bottom: 18px;
}

.detail-stack {
  gap: 20px;
}

.vehicle-detail {
  gap: 16px;
  padding: 14px;
}

.gallery {
  gap: 8px;
}

.gallery-main {
  aspect-ratio: 16 / 9;
}

.gallery-thumbs {
  gap: 8px;
}

.detail-copy {
  gap: 12px;
  padding: 6px 4px 4px;
}

.detail-copy h3 {
  font-size: clamp(1.55rem, 2.35vw, 2.65rem);
}

.detail-price {
  font-size: 1.7rem;
}

.detail-list {
  gap: 8px;
}

.detail-list div {
  padding-bottom: 6px;
}

.detail-list span {
  font-size: .7rem;
}

.feature-list {
  gap: 6px;
}

.feature-list span {
  padding: 5px 8px;
  font-size: .78rem;
}

.note {
  padding: 12px;
}

@media (max-width: 980px) {
  .vehicle-detail {
    gap: 12px;
  }

  .detail-copy {
    gap: 10px;
  }
}

.autoboerse-hero {
  position: relative;
  min-height: clamp(520px, 58vh, 760px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(5, 6, 8, .9) 0%, rgba(5, 6, 8, .72) 43%, rgba(5, 6, 8, .24) 100%),
    url("../hero-finazzer-main.webp") center center / cover no-repeat;
}

.autoboerse-hero .hero-grid {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - 40px));
}

@media (max-width: 760px) {
  .autoboerse-hero {
    min-height: 560px;
    background:
      linear-gradient(180deg, rgba(5, 6, 8, .5) 0%, rgba(5, 6, 8, .86) 68%, rgba(5, 6, 8, .94) 100%),
      url("../hero-finazzer-main.webp") center center / cover no-repeat;
  }
}
