/* Quiet white lockups directly on the existing hero background. */
.model-carousel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  align-items: center;
  width: min(800px, 100%);
  min-height: 76px;
  flex: none;
  margin: 0 auto;
  gap: 16px;
}
.model-carousel-track { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.model-logo-slot { position: relative; min-width: 0; height: 76px; overflow: hidden; }
.model-logo { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; }
.model-logo-lockup { display: flex; align-items: center; justify-content: center; gap: 8px; height: 30px; max-width: 100%; opacity: .68; transition: opacity .2s; }
.model-logo img { display: block; object-fit: contain; filter: brightness(0) invert(1); }
.model-logo-symbol { width: 28px; height: 28px; flex: none; }
.model-logo-wordmark { height: 24px; max-width: calc(100% - 36px); width: auto; }
.model-logo-wordmark:only-child { max-width: 100%; }
.model-logo-detail { min-height: 14px; font-size: 10px; line-height: 14px; letter-spacing: .015em; color: rgba(255,255,255,.5); }
.model-carousel:hover .model-logo-lockup { opacity: .9; }
.model-carousel-controls { display: flex; gap: 4px; visibility: hidden; }
.model-carousel.is-ready .model-carousel-controls { visibility: visible; }
.model-carousel-control { display: grid; place-items: center; flex: none; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: rgba(255,255,255,.52); cursor: pointer; transition: color .2s, background .2s, transform .2s; }
.model-carousel-control:hover { color: #fff; background: rgba(255,255,255,.08); }
.model-carousel-control:active { transform: scale(.92); }
.model-carousel-control:focus-visible { outline: 2px solid #fff; outline-offset: 3px; color: #fff; }
.model-carousel-control[hidden],.model-carousel [data-play-icon] { display: none; }
.model-carousel[data-paused="true"] [data-play-icon] { display: block; }
.model-carousel[data-paused="true"] [data-pause-icon] { display: none; }
@media (min-width:768px) and (max-width:1023px) {
  .model-carousel { max-width: 560px; }
  .model-carousel-track { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .model-logo-slot:nth-child(n+3) { display: none; }
}
@media (max-width:767px) {
  .model-carousel { width: min(300px, 100%); grid-template-columns: minmax(0,1fr) 72px; gap: 12px; min-height: 68px; }
  .model-carousel-track { grid-template-columns: minmax(0,1fr); }
  .model-logo-slot { height: 68px; }
  .model-logo-slot:nth-child(n+2) { display: none; }
}
@media (prefers-reduced-motion:reduce) {
  .model-carousel-control,.model-logo-lockup { transition: none; }
  .model-carousel-controls { justify-content: flex-end; }
}
