/* ==========================================================================
   Spacer — Webflow code component styles (rendered inside its Shadow DOM)

   Empty block of a set height. Hiding uses viewport media queries on
   Webflow's own breakpoints, so it lines up with the rest of the site:
     Tablet  768px – 991px
     Mobile  767px and below (landscape and portrait)
   ========================================================================== */

:host {
  display: block;
}

.spacer {
  display: block;
  width: 100%;
  height: var(--spacer-h, 2.5rem);   /* set from the Height prop; 40px fallback */
}

@media (min-width: 768px) and (max-width: 991px) {
  .spacer--hide-tablet {
    display: none;
  }
}

@media (max-width: 767px) {
  .spacer--hide-mobile {
    display: none;
  }
}