/* socialnorms.org — styles for sn-widgets.js (replacement Elementor/Jet behaviour). */

/* Search filters */
.sn-hidden { display: none !important; }
.sn-no-results { margin: 1.5em 0; text-align: center; }

/* Accordion: keyboard focus */
.jet-toggle__control:focus-visible { outline: 2px solid #8dc63f; outline-offset: 2px; }

/* Desktop dropdowns (the theme hides .elementor-nav-menu ul until a script opens it) */
.elementor-nav-menu--main li.sn-open > ul.sub-menu { display: block !important; z-index: 1000; }
.elementor-nav-menu--main li.menu-item-has-children > a { cursor: pointer; }
/* Elementor's SmartMenus script sized the box to its longest item (min 12em); without it the fixed 12em box
   let nowrap labels such as "Research and Evaluation Resources" run past the background. */
.elementor-nav-menu--main .elementor-nav-menu ul.sub-menu { width: max-content; min-width: 12em; max-width: calc(100vw - 32px); }

/* Mobile menu button (inside the jet-mobile-menu widget, which the theme shows only below desktop) */
.sn-menu-button {
  display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 10px; border: 0; border-radius: 4px;
  background: transparent; cursor: pointer;
}
.sn-menu-button span { display: block; height: 3px; width: 100%; background: #0f1c1a; border-radius: 2px; }
.sn-menu-button:focus-visible, .sn-menu-close:focus-visible { outline: 2px solid #8dc63f; outline-offset: 2px; }

/* Mobile menu panel */
.sn-menu-panel {
  position: fixed; inset: 0; z-index: 100000; overflow-y: auto;
  background: #0f1c1a; color: #fff; padding: 64px 24px 32px;
}
.sn-menu-panel[hidden] { display: none; }
.sn-menu-close {
  position: absolute; top: 12px; right: 16px; width: 44px; height: 44px;
  border: 0; background: transparent; color: #fff; font-size: 34px; line-height: 1; cursor: pointer;
}
.sn-menu-panel ul { list-style: none; margin: 0; padding: 0; }
.sn-menu-panel li { margin: 0; }
.sn-menu-panel ul ul { padding-left: 16px; margin-bottom: 8px; }
.sn-menu-panel a, .sn-menu-panel .sn-menu-group {
  display: block; padding: 10px 0; color: #fff; font-size: 18px; text-decoration: none;
}
.sn-menu-panel .sn-menu-group { color: #8dc63f; font-weight: 600; }
.sn-menu-panel ul ul a { font-size: 16px; }
html.sn-menu-open, html.sn-menu-open body { overflow: hidden; }
/* /contact-us/ address card (staging check 2026-11-15): both Elementor rule sets space the icon (wrapper gap +
   icon margin), so the text column was 15px narrower than live. Live: gap only. */
.elementor-widget-icon-box.elementor-position-left .elementor-icon-box-wrapper > .elementor-icon-box-icon { margin-right: 0; }
/* /contact-us/ (re-check 2026-11-15): the form is removed on purpose (plan 2026-11-09 D7); without it the 360px
   min-height of the heading column leaves an empty area above the card on mobile. */
@media (max-width: 767px) { body .elementor-20 .elementor-element.elementor-element-402beca9 { --min-height: 0px; } }
/* /start-a-campaign/ (re-check 2026-11-15): same 360px heading column without the removed form (D7); the decorative
   arch spacer sits at right:-80px on mobile and made the page scroll sideways by 60px (live too): clip it. The arch
   column is empty on live too (its illustration nsnc-07.svg was never saved: not in the rip or the Wayback Machine),
   so on mobile it is hidden and the hero ends after the intro text. */
@media (max-width: 767px) {
	body .elementor-45 .elementor-element.elementor-element-bf22e74 { --min-height: 0px; }
	body .elementor-45 .elementor-element.elementor-element-745d301c { overflow-x: clip; }
	body .elementor-45 .elementor-element.elementor-element-745d301c > .e-con-inner { padding-bottom: 40px; }
	body .elementor-45 .elementor-element.elementor-element-7505ed8d, body .elementor-45 .elementor-element.elementor-element-606d9bbe { display: none; }
}