/* Current NEW STYLE only: preserve its type, colors, content and destinations.
   Versioned separately from the published immutable artifact/overrides. */
.home-page .home-hero {
  padding-block: 0 1.25rem;
}

.home-page .home-hero .cinematic-page-hero__content {
  padding-block: clamp(10rem, 13vw, 11rem) clamp(2rem, 4vw, 3.5rem);
}

/* The landscape media frames the message, not the full height of the large
   product preview. This avoids enlarging a 16:9 image into a portrait crop. */
@media (min-width: 40.001rem) {
  .home-page .home-hero > .cinematic-solar-video,
  .home-page .home-hero > .home-hero__veil {
    bottom: auto;
    height: clamp(44rem, 56.25vw, 60rem);
    max-height: calc(100% - 7.75rem);
  }

  .home-page .home-hero > .home-hero__veil {
    background: linear-gradient(180deg, #01030766, #01030724 42%, #010307 100%);
  }
}

.kf-hero-video-control {
  position: absolute;
  z-index: 3;
  right: clamp(1rem, 3vw, 2.5rem);
  min-width: 44px;
  min-height: 44px;
  padding: .5rem .875rem;
  border: 1px solid #617583;
  border-radius: .5rem;
  background: #0a1720;
  color: #e8f4fa;
  font: 500 .75rem/1.3 "Instrument Sans Variable", "Instrument Sans", sans-serif;
  cursor: pointer;
}

.kf-hero-video-control[hidden] { display: none; }
.kf-hero-video-control--hero { top: max(6.25rem, calc(5.5rem + env(safe-area-inset-top))); }
.kf-hero-video-control--footer { bottom: 1rem; }
.kf-hero-video-control:hover:not(:disabled) { background: #172c39; }
.kf-hero-video-control:focus-visible { outline: 2px solid #b2f7f0; outline-offset: 3px; }
.kf-hero-video-control:disabled { cursor: default; color: #b1c1ca; }

@media (max-width: 40rem) {
  .home-page .home-hero { padding-block: 0 1rem; }
  .home-page .home-hero .cinematic-page-hero__content {
    padding-block: max(10rem, calc(8.75rem + env(safe-area-inset-top))) 1.5rem;
  }
  .home-page .home-hero__actions { grid-template-columns: minmax(0, 1fr); }
}