.hero-slideshow {
  position: relative;
  min-height: clamp(460px, 64vh, 620px);
  overflow: hidden;
  background: #6e655c;
}

.hero-slides {
  position: absolute;
  inset: 0;
}

.hero-slide {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--photo-position, 50% 16%);
  opacity: 0;
  transition: opacity 1.6s ease-in-out;
}

.hero-slide.is-active { opacity: 1; }

/* The main hero fills the space behind the floating navigation. */
html:not([data-hero-layout]) .hero-slideshow[data-hero-autoplay] {
  margin-top: 0;
  min-height: clamp(760px, 90svh, 940px);
}
html:not([data-hero-layout]) [data-hero-autoplay] .hero-content {
  min-height: clamp(760px, 90svh, 940px) !important;
}
html:not([data-hero-layout]) [data-hero-autoplay] .hero-slide { display: none; }
html:not([data-hero-layout]) [data-hero-autoplay] .hero-cover-reel .hero-gallery-photo {
  flex-basis: clamp(500px, 62svh, 640px);
  width: clamp(500px, 62svh, 640px);
}
html:not([data-hero-layout]) [data-hero-autoplay] .hero-copy {
  box-sizing: border-box;
  padding-top: calc(var(--nav-bottom, 86px) + 100px) !important;
  padding-bottom: 88px !important;
  background: none !important;
}
html:not([data-hero-layout]) [data-hero-autoplay] .hero-overlay {
  background: linear-gradient(90deg, rgba(27, 22, 20, .58), rgba(27, 22, 20, .28) 52%, rgba(27, 22, 20, .06)), linear-gradient(0deg, rgba(27, 22, 20, .22), transparent 65%) !important;
}
html:not([data-hero-layout]) [data-hero-autoplay] :is(.hero-title, .hero-description, .hero-eyebrow, .hero-contact) {
  text-shadow: 0 2px 12px #1b161e45;
}
.hero-socials { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.hero-socials a {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: #d6246b;
  background: #fff7faeb;
  border: 1px solid #f4a9c480;
  border-radius: 50%;
  transition: background-color .2s, transform .2s;
}
.hero-socials a:hover { color: #b71e59; background: #fce7ee; transform: translateY(-2px); }
.hero-socials a:focus-visible { outline: 3px solid #f0578f; outline-offset: 4px; }

@media (max-width: 700px) {
  html:not([data-hero-layout]) .hero-slideshow[data-hero-autoplay],
  html:not([data-hero-layout]) [data-hero-autoplay] .hero-content {
    min-height: max(760px, 92svh) !important;
  }
  html:not([data-hero-layout]) [data-hero-autoplay] .hero-copy {
    padding-top: calc(var(--nav-bottom, 120px) + 110px) !important;
    padding-bottom: 56px !important;
  }
  [data-hero-autoplay] .hero-contact { overflow-wrap: anywhere; }
  html:not([data-hero-layout]) [data-hero-autoplay] .hero-cover-reel .hero-gallery-photo {
    flex-basis: 100vw;
    width: 100vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-socials a { transition: none; }
  .hero-socials a:hover { transform: none; }
}

.hero-slideshow .hero-copy { padding-bottom: 94px !important; }

.hero-controls {
  position: absolute;
  z-index: 2;
  right: clamp(20px, 3.4vw, 40px);
  bottom: 22px;
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 3px 5px;
  background: rgba(61, 56, 51, .36);
  border: 1px solid rgba(245, 241, 235, .4);
  border-radius: 100px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.hero-controls button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font: 20px/1 'Figtree', sans-serif;
}

.hero-controls button:hover { background: rgba(255, 255, 255, .15); }
.hero-controls button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.hero-dots { display: flex; align-items: center; }
.hero-dots button { width: 24px; height: 40px; }
.hero-dots button::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .45); }
.hero-dots button[aria-current="true"]::before { width: 8px; height: 8px; background: #fff; }
.hero-controls .hero-pause { font-size: 15px; }
.hero-count { display: none; font-size: 12px; letter-spacing: .08em; padding: 0 10px; }
.hero-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
  .hero-slide { transition: none; }
}

@media (max-width: 700px) {
  .hero-controls .hero-dots { display: none; }
  .hero-count { display: block; }
}