/* The hero background video is cropped to the bounding box of svg-mask.svg,
   so the element *is* the flower rather than a 16:9 frame masked down to it.

   The mask covers 52.478% of a full-frame element's width (mask-size: contain,
   429.312x460.347 inside a 16:9 box) and all of its height. So every width
   input the old full-frame element had is scaled by that factor to keep the
   flower the same size on screen: 150vw -> 78.72vw, 1030px -> 540.5px, and
   preflight's max-width: 100% -> 52.48%. */

.hero-mask-video {
  min-width: 78.72vw;
  max-width: 52.48%;
}

@media (min-width: 480px) {
  .hero-mask-video {
    min-width: 0;
    width: 540.5px;
  }
}