/* dx-homefit-2026-10 — Home hero on big screens (wide monitors, TVs, browser zoomed out to 75 % / 67 % / 50 %).
   Up to 2199 px wide nothing changes. From 2200 px (TVs, browser zoomed out to 75 %) the hero grows with the screen width (sizes in vw = the
   1440 px design scaled), so it keeps the same look instead of tiny text with a big empty middle. */

@media (min-width:2200px){
  .hero{
    min-height:min(100vh, 62vw) !important;
    padding:4.2vw 4.4vw 3.6vw !important;
  }
  .hero-grid{ gap:4vw !important; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); }

  /* left side */
  .hero .eyebrow{ font-size:.6vw; padding:.6em 1.1em; gap:.7em; }
  .hero .eyebrow .pulse{ width:.32vw; height:.32vw; }
  .hero h1{
    font-size:5.05vw !important;
    margin-top:1.6vw !important; margin-bottom:1.4vw !important;
  }
  .hero p.sub, .hero .sub{ font-size:1.12vw; max-width:38em; }
  .hero-ctas{ gap:.7vw; margin-top:1.7vw !important; }
  .hero-ctas .btn{ min-height:2.9vw; padding:.76vw 1.25vw; font-size:.9vw; border-radius:.55vw; }
  .hero-trustline{ gap:.55vw 1.1vw; margin-top:1.5vw; padding-top:1.1vw; font-size:.66vw; }
  .hero-trustline span{ padding-left:1em; }
  .hero .hero-location{ font-size:.94vw; margin-top:1.25vw; padding:.5vw 1vw .5vw .7vw; gap:.55vw; }
  .hero .hero-location svg{ width:1.1vw; height:1.1vw; }

  /* right side: the showreel box */
  .hero-showreel{ max-width:48.5vw; }
  .hero-showreel-frame{ min-height:37.5vw; border-radius:2vw; }
  .hero-showreel-topbar{ padding:1.4vw 1.5vw; font-size:.7vw; }
  .hero-showreel-live{ width:.5vw; height:.5vw; margin-right:.55vw; }
  .hero-showreel-copy{ left:3.3vw; right:4.9vw; bottom:8.5vw; }
  .hero-showreel-kicker{ font-size:.7vw; margin-bottom:1vw; }
  .hero-showreel-copy h2{ font-size:4vw; }
  .hero-showreel-copy p{ font-size:.94vw; max-width:36vw; }
  .hero-showreel-controls{ right:1.5vw; bottom:1.95vw; gap:.55vw; }
  .hero-showreel-button{ min-width:3.3vw; height:3.3vw; padding:0 1vw; font-size:.75vw; }
  .hero-showreel-progress{ left:1.5vw; right:1.5vw; bottom:.9vw; }
  .hero-showreel-caption{ min-height:4.4vw; margin:-1.1vw 1.5vw 0; padding:.85vw 1.25vw; width:calc(100% - 3vw); gap:.2vw 1.1vw; border-radius:1.1vw; }
  .hero-showreel-caption .mono{ font-size:.63vw; }
  .hero-showreel-caption strong{ font-size:.97vw; }
  .hero-showreel-caption small{ font-size:.76vw; }
}