/* PWD.Design static-site overrides */
.elementor-invisible { opacity:1 !important; visibility:visible !important; animation:none !important; transform:none !important; }

/* "Say Hello" contact row. The theme puts a 9em (144px) left margin on the
   wrapper and a 99.44% width, which pushed the block right AND overflowed the
   page horizontally (scrollWidth 1417 vs 1280 viewport). Its 4-column grid for
   3 items partly masked the offset. Zero the margin, keep it inside the page,
   and centre three content-sized columns. The margin has to go at every breakpoint: on phones it pushed
   the row right and clipped the email and phone number off the screen edge.
   Only the 3-up grid is desktop-specific; narrow screens still stack. */
.elementor-element.elementor-element-6fde501 {
  --margin-left: 0em !important;
  --margin-right: 0em !important;
  --width: 100% !important;
}
@media (min-width: 1025px) {
  .elementor-element.elementor-element-60462ce {
    --e-con-grid-template-columns: repeat(3, max-content) !important;
    justify-content: center !important;
    column-gap: 110px !important;
  }
}
.elementor-element.elementor-element-60462ce { justify-items: center; }
.elementor-element.elementor-element-60462ce .elementor-icon-box-wrapper { text-align: center; }

/* Header social icons: Elementor gives this widget margin-right:-12px and the
   icon list a further -8px, so both hang past the header's right edge and pad
   documentElement.scrollWidth. The item padding they were compensating for is
   0 here, so the negative margins buy nothing. The header can't just be
   clipped (that would cut off the nav dropdowns), so zero them instead. */
.elementor-location-header .elementor-element-b7a6bde .elementor-widget-container {
  margin-right: 0 !important;
}
.elementor-location-header .elementor-icon-list-items.elementor-inline-items {
  margin-right: 0 !important;
}

/* 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; }
}