/*
 * Empower You – additions on top of the original Elementor styles.
 * Desktop rendering is unchanged: the only rules outside the mobile media
 * query keep promoted <h1> headings at their original size and hide the
 * anti-spam field.
 */

/* Headings promoted to <h1> for SEO keep the theme's default size of their
   original tag. Elementor's per-widget rules (higher specificity) still win. */
h1.ey-was-h2 { font-size: 2rem; }
h1.ey-was-h3 { font-size: 1.75rem; }
h1.ey-was-h4 { font-size: 1.5rem; }
h1.ey-was-h5 { font-size: 1.25rem; }
h1.ey-was-h6 { font-size: 1rem; }

/* Spam trap: invisible to people, filled in by bots. */
.ey-hp {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Poster frame shown while the hero background video loads. */
.elementor-background-video-container {
  background: #2a2a2a url(/wp-content/uploads/2024/12/empower-you-hero-poster.webp) center / cover no-repeat;
}

@media (max-width: 767px) {
  /* Stop entrance animations and wide elements from causing sideways scroll. */
  html, body { overflow-x: hidden; }
  @supports (overflow: clip) {
    html, body { overflow-x: clip; }
  }
  img, video, iframe { max-width: 100%; }

  /* Comfortable tap targets (WCAG 2.5.5 / Lighthouse). */
  .elementor-menu-toggle {
    min-width: 44px;
    min-height: 44px;
    justify-content: center;
  }
  .elementor-nav-menu--dropdown a.elementor-item,
  .elementor-nav-menu--dropdown a.elementor-sub-item {
    min-height: 48px;
    display: flex;
    align-items: center;
  }
  .elementor-icon-list-items .elementor-icon-list-item > a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
  .elementor-social-icon {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .elementor-button {
    min-height: 44px;
  }

  /* 16px inputs stop iOS Safari zooming the page when a field is focused. */
  .elementor-field-textual,
  .elementor-field-group .elementor-field {
    font-size: 16px !important;
  }

  /* Long words (emails, product names) wrap instead of overflowing. */
  .elementor-widget-text-editor,
  .elementor-heading-title,
  .elementor-icon-list-text {
    overflow-wrap: break-word;
  }
}