/* DEGRÉS viewport hero correction — 2026-11-07.
   The first fold ends at the bottom of the equipment marquee. */
#top.hero-v2 {
  display: flex;
  align-items: stretch;
  box-sizing: border-box;
  min-height: calc(100svh - var(--degres-nav-height, 90px) - var(--degres-marquee-height, 94px));
  min-height: calc(100dvh - var(--degres-nav-height, 90px) - var(--degres-marquee-height, 94px));
  padding: 0 !important;
}
#top.hero-v2 > .hero-v2-grid {
  flex: 1 1 auto;
  box-sizing: border-box;
  align-items: center;
}
@media(min-width:901px) {
  #top.hero-v2 > .hero-v2-grid {
    min-height: 0 !important;
    padding-top: clamp(20px, 4vh, 64px) !important;
    padding-bottom: clamp(22px, 4vh, 64px) !important;
  }
}
@media(max-width:900px) {
  #top.hero-v2 { min-height: calc(100svh - var(--degres-nav-height, 72px) - var(--degres-marquee-height, 100px)); }
}
/* Keep the marquee flush with the hero and prevent unintended extra top gaps. */
#top.hero-v2 + .equipment-strip { margin-top: 0 !important; }

/* DEGRÉS centered full-screen hero: constrain the interior, not the blue backdrop.
   The hero is a flex container, so flex-direction:row was stretching its grid
   across the entire screen and cancelling the .container side margins. */
#top.hero-v2 {
  flex-direction: column !important;
  align-items: center !important;
}
#top.hero-v2 > .hero-v2-grid {
  box-sizing: border-box;
  flex: 1 1 auto;
  width: min(1360px, calc(100% - clamp(48px, 11vw, 220px))) !important;
  max-width: 1360px;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 900px) {
  #top.hero-v2 > .hero-v2-grid {
    width: min(680px, calc(100% - 36px)) !important;
    max-width: 680px;
  }
}
