/* DroneX v8.0 — viewport-filling homepage video.
   Intentionally separate from the v3 reference design: all inner pages retain it.
   No viewport-width tricks: 100% avoids scrollbar-induced horizontal overflow. */
.dx-theme .dx-home-screen {
  position: relative;
  isolation: isolate;
  flex: 0 0 auto;
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 0;
  background: #060b10;
}
@supports (height: 100dvh) {
  .dx-theme .dx-home-screen { height: 100dvh; }
}
.dx-theme.main_page .dx-home-screen > .dx-header {
  position: absolute;
  inset: 0 0 auto;
  width: 100%;
  background: linear-gradient(180deg,rgba(6,11,16,.97),rgba(6,11,16,.76));
  color: #fff;
}
.dx-theme .dx-home-screen .dx-searchbar { background: rgba(9,14,19,.9); }
.dx-theme .dx-home-screen .dx-topbar { padding-top: env(safe-area-inset-top,0px); }
.dx-theme .dx-home-screen .dx-hero--video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #060b10;
}
.dx-theme .dx-hero--video .dx-hero__poster,
.dx-theme .dx-hero--video .dx-hero__image,
.dx-theme .dx-hero--video .dx-hero__video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
}
.dx-theme .dx-hero--video .dx-hero__poster { z-index: 0; }
.dx-theme .dx-hero--video .dx-hero__video {
  z-index: 1;
  opacity: 0;
  transition: opacity .25s ease;
}
.dx-theme .dx-hero--video.dx-video-ready .dx-hero__video { opacity: 1; }
.dx-theme .dx-hero--video::after {
  z-index: 2;
  background: linear-gradient(90deg,rgba(2,8,17,.26),transparent 65%),
              linear-gradient(0deg,rgba(6,11,16,.66),transparent 34%);
}
.dx-theme .dx-hero--video .dx-hero__content {
  position: relative;
  z-index: 3;
  height: 100%;
  display: flex;
  align-items: flex-end;
  padding-top: 150px;
  padding-bottom: clamp(96px,17vh,200px);
  padding-bottom: clamp(96px,17svh,200px);
  pointer-events: none;
}
.dx-theme .dx-hero--video .dx-hero__title {
  margin: 0 0 0 6%;
  color: #fff;
  font-size: clamp(46px,6.2vw,106px);
  font-weight: 900;
  line-height: .98;
  letter-spacing: -.035em;
  text-shadow: 0 2px 24px rgba(0,0,0,.18);
}
.dx-theme .dx-hero--video .dx-hero__controls {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: max(26px,env(safe-area-inset-bottom,0px));
  max-width: none!important;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}
.dx-theme .dx-hero--video .dx-hero__controls::before,
.dx-theme .dx-hero--video .dx-hero__controls::after { display: none; content: none; }
.dx-theme .dx-hero--video .dx-hero__scroll {
  display: inline-flex;
  flex: 0 0 46px;
  width: 46px;
  height: 46px;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 50%;
  color: #fff;
  background: rgba(6,11,16,.7);
  line-height: 1;
  pointer-events: auto;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .18s,border-color .18s;
}
.dx-theme .dx-hero--video .dx-hero__scroll:hover {
  color: #fff;
  background: rgba(14,47,61,.92);
  border-color: var(--dx-cyan,#26afd6);
}
.dx-theme #dx-main { scroll-margin-top: 0; }
/* Full bleed on notched phones; content, not the video, respects the safe areas. */
@media (max-width: 767px) {
  .dx-theme .dx-hero--video .dx-hero__content {
    padding-top: 140px;
    padding-bottom: max(116px,18svh);
  }
  .dx-theme .dx-hero--video .dx-hero__title {
    margin-left: 0;
    font-size: clamp(43px,11.8vw,76px);
  }
  .dx-theme .dx-hero--video .dx-hero__controls {
    bottom: max(22px,env(safe-area-inset-bottom,0px));
    padding-left: max(18px,env(safe-area-inset-left,0px));
    padding-right: max(18px,env(safe-area-inset-right,0px));
  }
}
/* Shallow landscape screens still get one screen, not an arbitrary min-height. */
@media (max-height: 540px) and (orientation: landscape) {
  .dx-theme .dx-hero--video .dx-hero__content { padding-top: 116px; padding-bottom: 72px; }
  .dx-theme .dx-hero--video .dx-hero__title { font-size: clamp(38px,7vw,65px); }
  .dx-theme .dx-hero--video .dx-hero__controls { bottom: max(14px,env(safe-area-inset-bottom,0px)); }
  .dx-theme .dx-home-screen .dx-catalog-menu { max-height: calc(100dvh - 138px); }
}
@media (prefers-reduced-motion: reduce) {
  .dx-theme .dx-hero--video .dx-hero__video,
  .dx-theme .dx-hero--video .dx-hero__scroll { transition: none; }
}