/* PWD.Design static-site overrides */

/* Mobile nav dropdown. The panel is pinned across the viewport by
   js/pwd-static.js; these rules stop the theme squeezing its contents into
   the narrow width it inherited from the burger widget. */
@media (max-width: 1024px) {
  .elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-nav-menu { width: 100% !important; }
  .elementor-widget-nav-menu .elementor-nav-menu--dropdown li { width: 100% !important; float: none !important; }
  .elementor-widget-nav-menu .elementor-nav-menu--dropdown a {
    white-space: normal !important;
    width: auto !important;
    display: block !important;
  }
}

/* Child pages inside the mobile panel. Elementor's expand arrow is driven by
   its frontend JS, so on a static export tapping it does nothing and the
   child pages are unreachable (Hartford's four service pages). Show them
   inline and indented, and drop the dead arrow. */
@media (max-width: 1024px) {
  .elementor-nav-menu--dropdown.elementor-nav-menu__container ul.sub-menu {
    display: block !important;
    position: static !important;
    width: 100% !important;
    max-height: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  .elementor-nav-menu--dropdown.elementor-nav-menu__container ul.sub-menu a {
    padding-left: 34px !important;
    font-size: .95em !important;
    opacity: .92;
  }
  .elementor-nav-menu--dropdown.elementor-nav-menu__container .sub-arrow { display: none !important; }
}

/* Parents page, "CAER Eye Exams" image box (element d7ff746). On desktop
   Elementor sizes the image slot at 39% of the box (211px), but the OFA logo
   file is only 127px wide, so it sat at the left of that slot, 42px off
   centre. Centre it inside the slot. Tablet and phone already fill the slot,
   so this changes nothing there. Client request, Sep 14 2026. */
.elementor-element.elementor-element-d7ff746 .elementor-image-box-img img {
  margin-left: auto;
  margin-right: auto;
}
