.hero-carousel { display: block; overflow: hidden; }
.hero-slide { position: absolute; inset: 0; display: grid; grid-template-columns: 43% 57%; opacity: 0; visibility: hidden; pointer-events: none; transform: translateX(2%); transition: opacity .55s ease, transform .65s ease, visibility .55s; }
.hero-slide.active { position: relative; opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.hero-slide .hero-copy, .hero-slide .hero-image { min-height: 650px; }
.hero-image.object-slide { background: #f1f2ee; }
.hero-image.object-slide img { object-fit: contain; padding: 6vw; }
.hero-image.light-object { background: #fff; }
.hero-image.video-slide video { width: 100%; height: 100%; object-fit: cover; background: #171717; }
.video-badge { position: absolute; top: 22px; left: 22px; padding: 9px 13px; color: #111; background: var(--yellow); font-size: 11px; font-weight: 800; }
.hero-carousel .slider-controls { z-index: 4; }
.slider-dots { display: flex; align-items: center; gap: 9px; }
.slider-dots button { width: 9px; height: 9px; padding: 0; border: 1px solid #111; border-radius: 50%; background: transparent; }
.slider-dots button.active { background: #111; }
.hero-carousel .slide-counter { width: auto; height: auto; border: 0; border-radius: 0; margin: 0 4px; font-size: 11px; letter-spacing: .08em; }
.hero-carousel .slide-counter b { font-size: 15px; }
@media (prefers-reduced-motion: reduce) { .hero-slide { transition: none; } }
@media (max-width: 900px) {
  .hero-slide { grid-template-columns: 1fr; }
  .hero-slide .hero-copy { min-height: 570px; }
  .hero-slide .hero-image { min-height: 380px; }
  .hero-image.object-slide img { padding: 35px; }
  .hero-image.video-slide video { min-height: 380px; }
  .hero-carousel .slider-controls { bottom: 405px; }
  .slider-dots { gap: 7px; }
  .slider-dots button { width: 8px; height: 8px; }
  .hero-carousel .slide-counter { display: none; }
}
@media (max-width: 480px) {
  .hero-slide .hero-image { min-height: 310px; }
  .hero-image.video-slide video { min-height: 310px; }
  .hero-carousel .slider-controls { bottom: 335px; gap: 8px; }
  .hero-carousel .slider-controls > button { width: 34px; height: 34px; }
}
