/* Full-width sections without relying on Elementor's JavaScript.
 *
 * Elementor marks these sections .elementor-section-stretched and widens them
 * at runtime by setting inline width/left. On a static copy that buys nothing
 * and costs everything: if the script fails, the section stays at container
 * width and a background-size:cover image crops to it, which reads as a hero
 * with its sides cut off.
 *
 * !important is deliberate, and needed. The script does run here, and it sets
 * an inline width of roughly the container width rather than the viewport -
 * which is the bug: the section ends up ~1180px wide and left-aligned with
 * white space beside it. Inline styles beat ordinary stylesheet rules, so
 * only !important can take it back. On a frozen copy there is nothing to lose
 * by overriding the runtime calculation outright.
 *
 * left/margin-left are the standard full-bleed pair: push the box half the
 * container across, then pull it back half the viewport. transform is reset
 * because the theme uses it elsewhere for centring and the two would stack. */
.elementor-section-stretched {
  position: relative !important;
  width: 100vw !important;
  max-width: 100vw !important;
  left: 50% !important;
  right: auto !important;
  margin-left: -50vw !important;
  margin-right: 0 !important;
  transform: none !important;
}

/* The same sections carry .elementor-invisible until the entrance animation
 * runs. If the animation never fires the content stays hidden, so make
 * visibility the default and let the animation re-apply if it does run. */
.elementor-invisible {
  visibility: visible;
}