/* ========================================================================
   GaliVue V5.2.1 — HERO R5 — MOBILE ROOT GUTTER FIX
   Stage-only, <=700px only.

   Root cause:
   - the public critical stylesheet reserves `scrollbar-gutter: stable` on
     the root element;
   - on real mobile WebKit this can expose the cream page background as a
     persistent strip beside the full-black hero while scrolling;
   - R4 removed hero borders/radii, but it did not remove that root gutter.

   Scope:
   - phone homepage only;
   - remove the root scrollbar gutter at phone widths;
   - make marketingView + hero own the full viewport width;
   - preserve clipping so reference art cannot create horizontal scroll;
   - desktop/tablet and every app/backend workflow remain untouched.
   ======================================================================== */

@media (max-width:700px){
  html{
    width:100%!important;
    max-width:100%!important;
    scrollbar-gutter:auto!important;
    overflow-x:hidden!important;
  }

  body.gvf-homepage-v5180{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow-x:hidden!important;
  }

  body.gvf-homepage-v5180 .marketing-page{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow-x:hidden!important;
  }

  /* Full-bleed owner. 100vw is intentional here: the root gutter is disabled
     above, so the hero paints the complete phone viewport rather than the
     reduced root content box that produced the cream side strip. */
  body.gvf-homepage-v5180 .gvf-hero-slider{
    box-sizing:border-box!important;
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    overflow-x:hidden!important;
  }

  body.gvf-homepage-v5180 .gvf-hero-slider .gvf-carousel-shell,
  body.gvf-homepage-v5180 .gvf-hero-slider .gvf-slide{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }

  @supports (overflow:clip){
    html,
    body.gvf-homepage-v5180,
    body.gvf-homepage-v5180 .marketing-page{
      overflow-x:clip!important;
    }
  }

  @supports (width:100dvw){
    body.gvf-homepage-v5180 .gvf-hero-slider{
      width:100dvw!important;
      max-width:100dvw!important;
      margin-left:calc(50% - 50dvw)!important;
      margin-right:calc(50% - 50dvw)!important;
    }
  }
}