.home-hero { overflow: hidden; color: #fff; background: #344b51; }
.home-hero:after { background: linear-gradient(90deg, rgba(12, 23, 26, .57), rgba(12, 23, 26, .08) 74%), linear-gradient(0deg, rgba(12, 23, 26, .35), transparent 28%); pointer-events: none; }
.hero-scenes { position: absolute; inset: 0; z-index: -2; }
.hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease-in-out; }
.hero-slide.is-active { opacity: 1; }
.hero-slide img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 52%; transform: scale(1.12); }
.hero-slide:first-child img { object-position: center 58%; }
.hero-slide[data-scene="estate"] img { object-position: center 57%; }
.hero-slide[data-scene="hills"] img { object-position: center 25%; }
.home-hero .hero-content { position: relative; z-index: 1; }
.home-hero .hero-content .button { background: #fff; color: #202722; border-color: #fff; }
.home-hero .hero-content .button:hover { background: #edf2ef; }
.home-hero .hero-caption { align-items: center; min-height: 44px; pointer-events: none; right: 230px; }
.home-hero .hero-caption span { display: block; }
.hero-controls { position: absolute; z-index: 2; bottom: 18px; right: 48px; display: flex; align-items: center; gap: 4px; }
.hero-controls[hidden] { display: none; }
.hero-controls button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid transparent; border-radius: 0; background: rgba(15, 24, 26, .25); color: #fff; cursor: pointer; }
.hero-controls button:hover { background: rgba(15, 24, 26, .65); }
.hero-controls button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.hero-controls img { width: 20px; height: 20px; filter: invert(1); }
.hero-count { width: 54px; text-align: center; font-size: 11px; font-variant-numeric: tabular-nums; }
@media (max-width: 700px) {
  .hero-controls { right: 16px; bottom: 10px; gap: 0; }
  .hero-count { width: 40px; font-size: 10px; }
  .home-hero .hero-caption { left: 20px; right: 200px; bottom: 10px; line-height: 1.4; }
  .hero-slide img { object-position: 60% center; }
  .hero-slide[data-scene="hills"] img { object-position: 55% 25%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: none; }
  .hero-slide img { transform: none; }
}
