/* Hero slideshow — Figma 625:18117 (1920 × 992). */
.eva-hero-section { display: block; }

eva-hero.eva-hero,
.eva-hero {
  --eva-hero-h: min(51.6667vw, 992px);
  position: relative;
  display: block;
  height: var(--eva-hero-h);
  min-height: 520px;
  overflow: hidden;
  background: var(--eva-bosque);
  color: var(--eva-crema);
}

.eva-hero__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  height: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.eva-hero__track::-webkit-scrollbar { display: none; }

.eva-hero__slide {
  position: relative;
  height: 100%;
  min-width: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  overflow: hidden;
}

.eva-hero__media { position: absolute; inset: 0; }
.eva-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  /* Overlay colour + opacity per slide (gradient from bottom by default). */
  background: linear-gradient(180deg, transparent 35%, var(--eva-hero-overlay-color, #000) 100%);
  opacity: calc(var(--eva-hero-overlay, 0) / 100);
  pointer-events: none;
}
.eva-hero__slide--overlay-solid .eva-hero__media::after { background: var(--eva-hero-overlay-color, #000); }
.eva-hero__img,
.eva-hero__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
.eva-hero__img--mobile { display: none; }

/* Main_Hero_Content: x 60, 52px above the bottom edge, 820 wide, gap 24 */
.eva-hero__content {
  position: absolute;
  left: clamp(20px, 3.125vw, 60px);
  right: clamp(20px, 3.125vw, 60px);
  bottom: clamp(48px, 2.7083vw, 52px);
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(14px, 1.25vw, 24px);
  max-width: 820px;
  color: var(--eva-crema);
}
.eva-hero__slide--bosque .eva-hero__content { color: var(--eva-bosque); }
.eva-hero__slide--center .eva-hero__content {
  left: 50%;
  right: auto;
  width: min(820px, calc(100% - 40px));
  transform: translateX(-50%);
  align-items: center;
  text-align: center;
}
.eva-hero__heading { text-wrap: balance; }
.eva-hero__text {
  margin: 0;
  max-width: 803px;
  font-family: var(--eva-ui);
  font-weight: 500;
  font-size: clamp(17px, 1.25vw, 24px);
  line-height: 1.5;
  letter-spacing: 0;
}
.eva-hero__actions { display: flex; gap: 16px; padding-top: 16px; }
.eva-hero a.eva-hero__cta { min-width: 151px; }

/* Arrows (36 × 65 chevron, 79px from the right edge) */
.eva-hero__arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 85px;
  margin-top: -42px;
  padding: 0;
  border: 0;
  background: none;
  color: #fff;
  cursor: pointer;
  transition: opacity 0.2s, transform 0.25s var(--eva-ease);
}
.eva-hero__arrow svg { width: 36px; height: 65px; filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.25)); }
.eva-hero__arrow--next { right: clamp(16px, 3.6458vw, 70px); }
.eva-hero__arrow--next:hover { transform: translateX(4px); }
.eva-hero__arrow--prev { left: clamp(16px, 3.6458vw, 70px); display: none; }
.eva-hero__arrow--prev svg { transform: scaleX(-1); }
.eva-hero__arrow--prev:hover { transform: translateX(-4px); }
.eva-hero--prev .eva-hero__arrow--prev { display: inline-flex; }
.eva-hero__arrow[hidden] { display: none !important; }
.eva-hero__arrow { transition: opacity 0.3s var(--eva-ease), transform 0.25s var(--eva-ease); }
.eva-hero__arrow:disabled { opacity: 0.3; cursor: default; pointer-events: none; }

/* Pager: 120 × 4 bars, 10px gap, 16px from the bottom */
.eva-hero__pager {
  position: absolute;
  left: 50%;
  bottom: 10px;
  z-index: 2;
  display: flex;
  gap: 10px;
  transform: translateX(-50%);
}
.eva-hero__pager:empty { display: none; }
.eva-hero__bar {
  position: relative;
  display: block;
  width: clamp(48px, 6.25vw, 120px);
  height: 16px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.eva-hero__bar::before,
.eva-hero__bar-fill {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  height: 4px;
  background: #fff;
}
.eva-hero__bar::before { right: 0; opacity: 0.5; }
.eva-hero__bar-fill { width: 0; }
.eva-hero__bar.is-done .eva-hero__bar-fill { width: 100%; opacity: 0; }
.eva-hero__bar.is-active .eva-hero__bar-fill { width: 100%; opacity: 1; }
eva-hero[data-autoplay]:not([data-autoplay="0"]) .eva-hero__bar.is-active .eva-hero__bar-fill {
  width: 0;
  animation: evaHeroFill var(--eva-hero-delay, 6s) linear forwards;
}
eva-hero.is-paused .eva-hero__bar.is-active .eva-hero__bar-fill { animation-play-state: paused; }
@keyframes evaHeroFill { from { width: 0; } to { width: 100%; } }

@media (prefers-reduced-motion: reduce) {
  .eva-hero__track { scroll-behavior: auto; }
  eva-hero[data-autoplay] .eva-hero__bar.is-active .eva-hero__bar-fill { animation: none; width: 100%; }
}

@media (max-width: 959px) {
  eva-hero.eva-hero,
  .eva-hero {
    --eva-hero-h: min(150vw, 760px);
    min-height: 560px;
  }
  .eva-hero__media--has-mobile .eva-hero__img--desktop { display: none; }
  .eva-hero__img--mobile { display: block; }
  .eva-hero__content { bottom: 44px; }
  .eva-hero__actions { padding-top: 8px; }
  .eva-hero__arrow { width: 40px; height: 60px; margin-top: -30px; }
  .eva-hero__arrow svg { width: 20px; height: 36px; }
}
