/* Mr Softy public hero full-width overrides
   Keeps hero image sections full bleed like the main landing page. */

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow-x: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

/* Hero sections that are already outside normal containers. */
.ms-home > .ms-hero,
.ms-event-page > .ms-hero,
.faq-hero,
.quote-hero,
.van-app-hero {
  width: 100% !important;
  max-width: none !important;
  border-radius: 0 !important;
}

/* Hero sections that may be placed inside a .container still need to break out. */
.container > .vf-hero,
.container > .ms-hero,
.container > .faq-hero,
.container > .quote-hero,
.container > .van-app-hero {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  border-radius: 0 !important;
}

/* Keep the content inside the full-width Find Open Public Vans hero aligned with the site grid. */
.vf-hero > .vf-hero-grid {
  width: min(100%, 1360px);
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 760px) {
  .container > .vf-hero,
  .container > .ms-hero,
  .container > .faq-hero,
  .container > .quote-hero,
  .container > .van-app-hero {
    border-radius: 0 !important;
  }
}