/* Photo slideshow (core/_slideshow.html + js/car_slideshow.js), shared by the
   car page and news articles. 560px, not
   the full column: at full width a 4:3 photo stood ~780px tall and pushed
   everything else below the fold. */
.car-slideshow { position: relative; max-width: 560px; margin: 4px 0 14px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line-soft); background: #000; }
.car-slides { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.car-slides::-webkit-scrollbar { display: none; }
.car-slide { flex: 0 0 100%; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; scroll-snap-align: center; display: block; }
.car-slide-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; border: none; background: rgba(0,0,0,.55); color: #fff; font-size: 22px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.car-slide-nav:hover { background: rgba(0,0,0,.75); }
.car-slide-nav[hidden] { display: none; }
.car-slide-nav.prev { left: 8px; }
.car-slide-nav.next { right: 8px; }
.car-slide-count { position: absolute; right: 10px; bottom: 10px; font-size: 11px; color: #fff; background: rgba(0,0,0,.55); padding: 2px 8px; border-radius: 999px; font-variant-numeric: tabular-nums; }