/*
Theme Name: Computer Repair Elementor
Theme URI: https://webxthemes.com/product/free-computer-repair-wordpress-theme/
Author: patrickoslo
Author URI: https://webxthemes.com
Description: Our free computer repair theme is expertly designed and high-performing, making it ideal for new or upgraded websites. With a clean, attractive layout, it creates a strong first impression and effectively highlights your services. Optimized for speed, it ensures a smooth browsing experience that keeps visitors engaged. Featuring a blog, high-converting landing page, and more, this theme is built to drive business growth.
Version: 4.15
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: computer-repair-elementor
Tags: blog, custom-background, custom-logo, custom-menu
*/

/* ========== Reset and Basic Styles ========== */
body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    margin-bottom: 1rem;
}

p {
    margin-bottom: 1rem;
}

a {
    color: #007bff;
    text-decoration: underline;
}

a:hover {
    color: #0056b3;
    text-decoration: none;
}

img {
    max-width: 100%;
    height: auto;
}

.container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 15px;
}

.main-header {
    display: flex;
    justify-content: space-between;
}

.pce-home-page {
	overflow: hidden;
}

/* Style for WordPress image captions */
.wp-caption {
    max-width: 100%;
    margin-bottom: 1em;
    text-align: center;
    background: #f9f9f9;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.wp-caption img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

.wp-caption-text {
    font-size: 14px;
    color: #555;
    margin-top: 5px;
}

/* Gallery Caption */
.gallery-caption {
    font-size: 14px;
    color: #777;
    text-align: center;
    margin-top: 5px;
}

/* Author Comments */
.bypostauthor {
    border-left: 3px solid #0073aa;
    padding-left: 10px;
}

/* Image Alignments */
.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 10px;
}

.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 10px;
}

.aligncenter {
    display: block;
    margin: 0 auto;
}

/* Post Pagination*/
.pagination {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 20px;
}

/* Remove extra empty boxes */
.pagination .page-numbers {
    display: inline-block;
    padding: 8px 12px;
    font-size: 16px;
    color: #000;
    background-color: #fff;
    border: 1px solid #007bff;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease-in-out;
}

/* Active Page (Current Page) */
.pagination .page-numbers.current {
    background-color: #007bff;
    color: #fff;
    font-weight: bold;
}

/* Hover Effects */
.pagination .page-numbers:not(.current):hover {
    background-color: #007bff;
    color: #fff;
}

/* Hide "Next" and "Previous" Placeholder Boxes */
.pagination .prev,
.pagination .next {
    display: none;
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    word-wrap: normal !important;
}
.screen-reader-text:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    clip: auto;
    overflow: visible;
}

/* Navigation
--------------------------------------------- */
#masthead {
    position: relative;
    z-index: 10;
    border-bottom: 1px solid #ececec;
}

#masthead .container {
    position: relative;
}

#masthead a {
    text-decoration: none;
}

.site-branding {
    padding: 10px 30px 10px 0;
    min-height: 90px;
}

.site-branding .site-logo,
.site-branding .site-details {
    display: inline-block;
    vertical-align: middle;
}

.site-branding .site-logo {
    margin-right: 15px;
}

.site-branding img {
    height: 80px;
    object-fit: cover;
    width: auto;
}

.site-branding .site-title {
    margin-bottom: 0;
    font-size: 26px;
    font-weight: 500;
}

.site-description {
    margin: 0;
}

.nav-menu {
    margin: 0;
    list-style: none;
}

.nav-menu li {
    list-style: none;
    -webkit-transition: background .3s ease;
    -ms-transition: background .3s ease;
    transition: background .3s ease;
}

.nav-menu li.menu-item-has-children>a {
    position: relative;
}

.nav-menu li a {
    display: block;
    color: #232323;
}

.nav-menu>li {
    display: inline-block;
    vertical-align: middle;
}

.nav-menu>li.menu-item-has-children {
    padding-right: 13px;
}

.nav-menu>li>a {
    position: relative;
    display: block;
    font-weight: 600;
    padding: 21px 0.5rem;
    color: #232323;
    letter-spacing: 0.5px;
    text-transform: capitalize;
}

.nav-menu li.current-menu-item>a,
.nav-menu li a:focus {
    color: #007bff;
}
.nav-menu li a:hover{
    color: #007bff;
}

.main-navigation>ul>li.menu-item-has-children>a:after {
    content: "";
    border-style: solid;
    border-width: 0 1px 1px 0;
    display: block;
    height: 6px;
    transform: rotate(45deg);
    width: 6px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}

.main-navigation>ul>li.current-menu-item>a:after {
    border-color: transparent #000 #000 transparent;
}

.nav-menu ul {
    position: absolute;
    left: -9999px;
}

.main-navigation ul ul li {
    -webkit-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all .25s ease;
    margin-bottom: 12px;
    padding: 0 20px;
    display: block;
}

.main-navigation ul ul li:last-child {
    margin-bottom: 0;
}

.main-navigation ul ul li.active>a {
    color: #cfac9f;
}

.nav-menu li>ul {
    padding: 15px 0;
    margin: 0 0 0 10px;
    background: #fff;
    min-width: 225px;
    z-index: 1;
    -webkit-box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
    -ms-box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
    box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
}

.nav-menu li:hover>ul,
.nav-menu li.focus>ul {
    left: auto;
}

.nav-menu>li.menu-item-has-children>ul {
    opacity: 0;
    margin-top: 10px;
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.nav-menu>li.menu-item-has-children:hover>ul,
.nav-menu>li.menu-item-has-children.focus>ul {
    margin-top: 0;
    opacity: 1;
}

.nav-menu>li.menu-item-has-children:last-child:hover ul {
    left: inherit;
    right: 0;
}

.main-navigation li>ul ul {
    margin-top: -39px;
    margin-left: 200px;
    min-width: 200px;
}

.main-navigation li>ul ul ul {
    margin-left: 175px;
    min-width: 130px;
}

.main-navigation ul ul li:last-child>a,.main-navigation ul ul li.last-item>a {
    border-bottom: 0;
}

.main-navigation ul ul li.menu-item-has-children>a:after {
    content: "";
    position: absolute;
    top: 14px;
    right: -3px;
    width: 8px;
    height: 2px;
    display: block;
    background: #9d9d9d;
}

.main-navigation ul ul li.menu-item-has-children>a:before {
    position: absolute;
    top: 11px;
    right: 0;
    display: block;
    width: 2px;
    height: 8px;
    background: #9d9d9d;
    content: '';
    -webkit-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all 0.25s ease;
}

.main-navigation ul ul>li.menu-item-has-children:hover>a:before {
    top: 17px;
    height: 0;
}

.attr-nav {
    float: right;
}

.attr-nav .submenu-button:after {
    content: none;
}

.attr-nav>ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: inline-block;
    vertical-align: top;
}

.attr-nav>ul:last-child {
    margin-left: 25px;
}

/* Pagination
--------------------------------------------- */
.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
    margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
    display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
    flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
    text-align: end;
    flex: 1 0 50%;
}

/* Responsive
--------------------------------------------- */
@media screen and (min-width: 992px) {
 
    .main-navigation {
        float: right;
        margin: 15px 0;
    }

    .nav-menu {
        display: block !important;
    }

    .submenu-button,
    .main-navigation-toggle {
        display: none;
    }
}

@media screen and (min-width: 1024px) {
    .columns-5 article {
        width: 20%;
    }

    .customize-support.menu-sticky #masthead {
        top: 32px;
    }
    
    .menu-sticky #masthead {
        position: sticky;
        top: 0;
    }

    .blog-archive .entry-title {
        font-size: 32px;
    }

    .single .entry-title {
        font-size: 62px;
    }
}

@media screen and (max-width: 992px) {
    .nav-menu li>ul {
        -webkit-box-shadow: none;
        -ms-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .main-navigation li>ul ul {
        margin: 0;
        min-width: auto;
    }

    .nav-menu>li.menu-item-has-children>ul {
        opacity: 1;
        margin: 0;
        -webkit-box-shadow: none;
        -ms-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        -webkit-transition: all 0s ease;
        -ms-transition: all 0s ease;
        -moz-transition: all 0s ease;
        -o-transition: all 0s ease;
        transition: all 0s ease;
    }

    .nav-menu>li.menu-item-has-children {
        padding-right: 0;
    }

    .nav-menu>li>a {
        padding: 12px 20px;
        color: #232323;
    }

    .nav-menu>li>a:hover {
        opacity: 1;
    }

    .nav-menu li.menu-item-has-children a:hover {
        color: #232323;
    }

    .main-navigation ul ul li.active>a {
        color: #000;
    }

    .main-navigation .sub-title {
        color: #232323;
    }

    .nav-menu {
        padding: 0;
        background: #fff;
        -webkit-box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
        -ms-box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
        -moz-box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
        box-shadow: 0 10px 25px rgb(0 0 0 / 15%);
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        width: 100%;
        margin: 0;
        display: none;
        transition: none;
        -ms-transition: none;
        -moz-transition: none;
        -webkit-transition: none;
        -o-transition: none;
    }

    .nav-menu ul {
        width: 100%;
        display: none;
        transition: none;
        -ms-transition: none;
        -moz-transition: none;
        -webkit-transition: none;
        -o-transition: none;
    }

    .nav-menu li.active>a {
        opacity: 1;
        color: #000;
    }

    .nav-menu li {
        width: 100%;
        border-top: 1px solid #e6e6e6;
        position: relative;
        padding: 0;
        margin: 0;
    }

    .nav-menu li:hover>ul>li {
        height: auto;
    }

    .main-navigation ul li a {
        width: 100%;
    }

    .nav-menu ul li:hover {
        background: #f5f5f5;
    }

    .nav-menu ul ul li {
        height: auto;
    }

    .main-navigation ul ul {
        position: relative;
        left: 0;
        width: 100%;
        margin: 0;
        text-align: left;
        padding: 0;
    }

    .main-navigation ul ul li {
        margin-bottom: 0;
        padding: 0;
        border-color: #e6e6e6;
    }

    .main-navigation ul ul li a {
        width: 100%;
        border-bottom: 0;
        color: #232323;
        background: none;
        padding: 8px 30px;
    }

    .main-navigation ul ul ul li a {
        padding-left: 45px;
    }

    .main-navigation>ul>li {
        float: none;
    }

    .nav-menu ul ul {
        position: relative;
        left: 0;
        width: 100%;
        margin: 0;
        text-align: left;
        padding: 0;
    }

    .main-navigation>ul>li.menu-item-has-children>a:after,
    .main-navigation>ul>li.menu-item-has-children>a:before {
        display: none;
    }

    .main-navigation ul ul>li.menu-item-has-children>a:after,
    .main-navigation ul ul>li.menu-item-has-children>a:before {
        display: none;
    }

    .nav-menu ul ul ul li.active a {
        border-left: none;
    }

    .nav-menu>ul>li.menu-item-has-children>ul>li.active>a,.nav-menu>ul ul>li.menu-item-has-children>ul>li.active>a {
        border-top: none;
    }

    .main-navigation ul ul ul ul li a {
        padding-left: 55px;
    }

    .main-navigation li>ul ul ul {
        margin-left: 0;
        background: #fff;
    }

    .nav-menu .menu-item-has-children .menu-item-has-children .submenu-button {
        height: 47px;
    }

    .nav-menu .menu-item-has-children .menu-item-has-children .submenu-button:after {
        top: 21px;
    }

    .nav-menu .menu-item-has-children .menu-item-has-children .submenu-button:before {
        top: 18px;
    }

    .main-navigation-toggle {
        background: #007bff;
        width: 40px;
        height: 35px;
        padding: 0;
        border-radius: 0;
        position: absolute;
        right: 15px;
        top: 30px;
        cursor: pointer;
        z-index: 1;
        border: none;
    }

    .main-navigation-toggle:hover,
    .main-navigation-toggle:focus {
        background-color: #000;
    }

    .main-navigation-toggle:after {
        content: "";
        position: absolute;
        top: 17px;
        right: 10px;
        display: block;
        height: 8px;
        width: 20px;
        border-top: 2px solid #fff;
        border-bottom: 2px solid #fff;
    }

    .main-navigation-toggle:before {
        content: "";
        -webkit-transition: all .3s ease;
        -ms-transition: all .3s ease;
        transition: all .3s ease;
        position: absolute;
        top: 11px;
        right: 10px;
        display: block;
        height: 2px;
        width: 20px;
        background: #fff;
    }

    .main-navigation-toggle.menu-opened:after {
        -webkit-transition: all .3s ease;
        -ms-transition: all .3s ease;
        transition: all .3s ease;
        top: 17px;
        border: 0;
        height: 2px;
        width: 19px;
        background: #fff;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .main-navigation-toggle.menu-opened:before {
        top: 17px;
        background: #fff;
        width: 19px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .nav-menu .submenu-button {
        position: absolute;
        z-index: 99;
        right: 0;
        top: 0;
        padding: 0;
        display: block;
        width: 45px;
        height: 50px;
        cursor: pointer;
        background-color: transparent;
        border: none;
    }

    .nav-menu .submenu-button:after {
        content: "";
        position: absolute;
        top: 24px;
        right: 17px;
        width: 8px;
        height: 2px;
        display: block;
        background: #232323;
    }

    .nav-menu .submenu-button:before {
        content: "";
        position: absolute;
        top: 21px;
        right: 20px;
        display: block;
        width: 2px;
        height: 8px;
        background: #232323;
    }

    .nav-menu .menu-item-has-children.active>.submenu-button:before {
        display: none;
    }
}
/* ============================
   WAI Header — three-part flex row (logo / centered nav / donate),
   matching real WWP structure: utility bar (message left, links
   right), primary navbar 80px min-height, uppercase bold nav.
   ============================ */

.wai-utility-bar {
  background-color: #003161;
}

.wai-utility-bar-inner {
  max-width: 1400px !important;
  margin: 0 auto;
  padding: 10px 40px;
  min-height: 42px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

.wai-utility-message {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.wai-utility-message span {
  color: #ffffff;
  font-size: 13px;
}

.wai-utility-learnmore {
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 700;
  text-decoration: underline;
  white-space: nowrap;
}

.wai-utility-links {
  display: flex;
  align-items: center;
  gap: 20px;
}

.wai-utility-links a {
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 400;
  text-decoration: none;
  white-space: nowrap;
}

.wai-utility-links a:hover {
  text-decoration: underline;
}

.wai-utility-search {
  display: inline-flex !important;
  align-items: center;
}

.wai-utility-search:hover {
  text-decoration: none !important;
  opacity: 0.8;
}

.wai-header {
  background-color: #ffffff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12);
}

.wai-header-inner {
  max-width: 1400px !important;
  margin: 0 auto;
  padding: 8px 40px;
  min-height: 64px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 20px;
}

.wai-site-branding {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.wai-site-logo a {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.wai-header-logo-img {
  width: 50px;
  height: 50px;
  display: block;
}

.wai-header-wordmark {
  color: #003161;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.15;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Nav sits between logo and donate button and grows to fill the
   remaining space, with its own list centered inside that space —
   this is what actually makes the menu appear centered rather than
   clumped to one side. */
.wai-main-navigation {
  flex: 1 1 auto;
  /* A flex item won't shrink below its content width without this, which is
     how the menu came to overrun its own box and sit under the Donate
     button rather than being constrained by it. */
  min-width: 0;
  display: flex;
  justify-content: center;
}

/* WWP declare justify-content:center then override it with space-between
   later in the same file, so space-between is what actually renders. */
.wai-main-navigation ul.menu,
.wai-main-navigation ul#primary-menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

/* Root link and hover styling lives in the WWP-matched block further down
   ("NAV LINKS — values taken directly from WWP site.min.css"). A duplicate
   set used to sit here at 12.5px / 17px 9px, silently overridden by that
   block — two sources of truth for the same selector. */

.wai-header-donate-btn {
  display: inline-block;
  flex: 0 0 auto;
  background-color: #b5121b;
  border: 2px solid #b5121b;
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 14px 28px;
  min-width: 150px;
  text-align: center;
  border-radius: 0;
  white-space: nowrap;
  box-sizing: border-box;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.wai-header-donate-btn:hover {
  background-color: #ffffff;
  color: #b5121b !important;
}

@media (max-width: 1400px) {
  .wai-utility-bar-inner {
    padding: 8px 20px;
    justify-content: center;
    text-align: center;
  }
  .wai-header-inner {
    padding: 14px 20px;
    flex-wrap: wrap;
  }
  .wai-main-navigation {
    flex: 1 1 100%;
    order: 3;
  }
  .wai-main-navigation ul.menu,
  .wai-main-navigation ul#primary-menu {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .wai-main-navigation ul.menu li a,
  .wai-main-navigation ul#primary-menu li a {
    padding: 10px 4px;
  }
}

/* ============================================================
   WAI HEADER NAV — exact match to Wounded Warrior Project
   Values taken directly from WWP site.min.css
   ============================================================ */
.wai-main-navigation ul.menu li,
.wai-main-navigation ul#primary-menu li {
  position: relative;
}

/* Nav links: WWP uses 17px 10px, uppercase bold #003161 */
.wai-main-navigation ul.menu li a,
.wai-main-navigation ul#primary-menu li a {
  color: #003161;
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  /* WWP declare no font-size on a.menu-link-root, so it inherits their
     body { font-size: 14px }. We were at 13px with 0.2px of tracking; they
     have neither. */
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: normal;
  padding: 17px 10px;
  display: inline-block;
  line-height: 1;
  white-space: nowrap;
  transition: color 300ms, background-color 300ms;
  outline: none;
}

/* a.menu-link-root > span { display:inline-block; padding:2px } — the 2px is
   inside the hover block, so leaving it out made the highlight 4px short in
   each axis. The menu emits the span via link_before/link_after. */
.wai-main-navigation > ul.menu > li > a > span,
.wai-main-navigation > ul#primary-menu > li > a > span {
  display: inline-block;
  padding: 2px;
}

/* link_before/link_after wraps every level, but WWP only pad the root
   labels — their child-link carries no span at all. */
.wai-main-navigation ul.sub-menu a > span {
  display: inline;
  padding: 0;
}

/* WWP's keyboard focus ring on root links. */
.wai-main-navigation ul.menu li a:focus-visible,
.wai-main-navigation ul#primary-menu li a:focus-visible {
  outline: 3px solid #003161 !important;
  outline-offset: 1px;
}

/* Hover/focus: white on #005da5 (WWP exact) */
.wai-main-navigation ul.menu li a:hover,
.wai-main-navigation ul#primary-menu li a:hover,
.wai-main-navigation ul.menu li a:focus,
.wai-main-navigation ul#primary-menu li a:focus {
  color: #fff !important;
  background-color: #005da5;
}

/* Active/current page: red text #b5121b (WWP .activeLink) */
.wai-main-navigation ul.menu li.current-menu-item > a,
.wai-main-navigation ul#primary-menu li.current-menu-item > a,
.wai-main-navigation ul.menu li.current-menu-ancestor > a,
.wai-main-navigation ul#primary-menu li.current-menu-ancestor > a {
  color: #b5121b;
}
.wai-main-navigation ul.menu li.current-menu-item > a:hover,
.wai-main-navigation ul#primary-menu li.current-menu-item > a:hover {
  color: #fff !important;
}

/* Dropdown caret */
.wai-main-navigation ul.menu li.menu-item-has-children > a,
.wai-main-navigation ul#primary-menu li.menu-item-has-children > a {
  padding-right: 24px;
}
.wai-main-navigation ul.menu li.menu-item-has-children > a::after,
.wai-main-navigation ul#primary-menu li.menu-item-has-children > a::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-65%) rotate(45deg);
  opacity: 0.85;
}

/* Dropdown panel — BLUE #005da5 with white top border (WWP exact) */
.wai-main-navigation ul.menu li.menu-item-has-children > ul.sub-menu,
.wai-main-navigation ul#primary-menu li.menu-item-has-children > ul.sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  max-width: 300px;
  /* No min-width — WWP's .item-dropdown declares max-width: 300px only, and
     a 200px floor was widening short menus past their panel. */
  background-color: #005da5;
  border-top: 1px solid #fff;
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  list-style: none;
  margin: 0;
  padding: 10px 0;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
  z-index: 20;
  box-shadow: 0 11px 20px 0 rgba(0,0,0,.15);
}

.wai-main-navigation ul.menu li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation ul#primary-menu li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation ul.menu li.menu-item-has-children:focus-within > ul.sub-menu,
.wai-main-navigation ul#primary-menu li.menu-item-has-children:focus-within > ul.sub-menu,
.wai-main-navigation li.menu-item-has-children.wai-open > ul.sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Invisible bridge so moving the mouse from the link down into the panel
   never crosses a dead zone that closes the dropdown. */
.wai-main-navigation ul.sub-menu::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 0;
  right: 0;
  height: 8px;
}

/* Dropdown items — 16px white, hover to navy #003161 (WWP exact) */
.wai-main-navigation ul.sub-menu li {
  display: block;
  width: 100%;
  /* Clears the stock theme's ul ul li padding/margin — see the note in the
     desktop block below. */
  padding: 0;
  margin: 0;
}
.wai-main-navigation ul.sub-menu li a {
  display: inline-block;
  width: 100%;
  padding: 4px 20px !important;
  /* WWP's a.child-link computes to 16px Montserrat. Every other property
     here matched, but font-family was never declared, so the panel fell
     back to the theme's body font and rendered in Arial. */
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  text-transform: none;
  letter-spacing: 0;
  white-space: normal;
  line-height: 21px;
  transition: 0.3s;
}
.wai-main-navigation ul.sub-menu li a:hover,
.wai-main-navigation ul.sub-menu li a:focus {
  background-color: #003161;
  color: #fff !important;
}

/* Mobile */
@media (max-width: 1400px) {
  .wai-main-navigation ul.menu li a,
  .wai-main-navigation ul#primary-menu li a {
    padding: 12px 6px;
  }
  .wai-main-navigation ul.menu li.menu-item-has-children > ul.sub-menu,
  .wai-main-navigation ul#primary-menu li.menu-item-has-children > ul.sub-menu {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    max-width: none;
    min-width: 0;
    border-top: none;
  }
  .wai-main-navigation ul.menu li.menu-item-has-children > a::after,
  .wai-main-navigation ul#primary-menu li.menu-item-has-children > a::after {
    display: none;
  }
}

/* ============================================================
   WAI DROPDOWN — nested submenu fixes (kill diamond carets,
   fix sub-sub-menu flyout overlap)
   ============================================================ */

/* Kill the theme's original +/- carets that render as diamonds */
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a::before,
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Clean right-pointing arrow for sub-menu parents (has children) */
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a {
  position: relative;
  padding-right: 30px !important;
}
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a .wai-subcaret,
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a::first-line {
  /* placeholder */
}
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a {
  background-image: none;
}
.wai-main-navigation ul.sub-menu li.menu-item-has-children > a:after {
  content: "" !important;
  display: block !important;
  position: absolute;
  right: 16px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  background: none !important;
  transform: translateY(-50%) rotate(-45deg);
  opacity: 0.9;
}

/* Third-level submenu: fly out to the RIGHT, not overlap */
.wai-main-navigation ul.sub-menu li.menu-item-has-children > ul.sub-menu {
  top: -11px;
  left: 100%;
  margin-left: 0;
  transform: translateX(8px);
}
.wai-main-navigation ul.sub-menu li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation ul.sub-menu li.menu-item-has-children:focus-within > ul.sub-menu,
.wai-main-navigation ul.sub-menu li.menu-item-has-children.wai-open > ul.sub-menu {
  transform: translateX(0);
}

/* Side bridge for the right flyout so the mouse can cross into it */
.wai-main-navigation ul.sub-menu li.menu-item-has-children > ul.sub-menu::after {
  content: "";
  position: absolute;
  top: 0;
  left: -10px;
  width: 10px;
  height: 100%;
}

/* If it would run off the right edge, common fix: flip left */
.wai-main-navigation ul.sub-menu li.menu-item-has-children.wai-flip-left > ul.sub-menu {
  left: auto;
  right: 100%;
}

@media (max-width: 1400px) {
  /* On mobile everything stacks; nested opens inline */
  .wai-main-navigation ul.sub-menu li.menu-item-has-children > ul.sub-menu {
    left: 0;
    top: auto;
    transform: none;
    padding-left: 16px;
  }
  .wai-main-navigation ul.sub-menu li.menu-item-has-children > a:after {
    transform: translateY(-50%) rotate(45deg);
  }
}

/* ============================================================
   WAI NAV — keep on one row, prevent load-shift wrap
   ============================================================ */
.wai-main-navigation ul.menu,
.wai-main-navigation ul#primary-menu {
  flex-wrap: nowrap;
}

/* Hide JS-injected submenu-buttons and mobile toggle on desktop (>900px)
   to prevent reflow/shift when custom.js injects them */
.wai-main-navigation .submenu-button,
.main-navigation .submenu-button {
  display: none;
}
.wai-main-navigation .main-navigation-toggle,
.main-navigation-toggle {
  display: none;
}
@media (max-width: 1400px) {
  .wai-main-navigation .main-navigation-toggle,
  .main-navigation-toggle {
    display: block;
  }
  .wai-main-navigation .submenu-button {
    display: inline-block;
  }
}

/* ============================================================
   WAI NAV — fitting seven items on one row

   WWP run 14px with six short labels in a 1230px container and no CTA
   button. WAI has seven longer ones plus the red Donate button, so 14px
   only fits once there's enough width. Above 1600px the exact WWP size
   is used; between the desktop breakpoint and there it steps down.

   Three media queries used to live here written as
     (max-width: 1300px) and (min-width: 1401px)
   which can never match — nothing is under 1300 and over 1401 at once.
   They had no effect; an unconditional 12.5px rule below them was doing
   all the work and silently overriding the WWP-matched block.
   ============================================================ */
@media (min-width: 1401px) and (max-width: 1600px) {
  .wai-main-navigation ul.menu li a,
  .wai-main-navigation ul#primary-menu li a {
    font-size: 12.5px;
    padding: 17px 8px;
  }
  .wai-header-inner { padding: 8px 24px; }
  .wai-header-donate-btn { min-width: 130px; padding: 14px 20px; }
}

/* ============================================================
   WAI NAV — authoritative final rules (fix wrap + dropdown)
   ============================================================ */
/* Nav container sizes to content, centered, doesn't squeeze the menu */
.wai-main-navigation {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  min-width: 0;
}
/* Top-level menu: single row, never wrap */
.wai-main-navigation > ul,
.wai-main-navigation ul.menu,
.wai-main-navigation ul#primary-menu {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Submenus stay out of the flex row */
.wai-main-navigation ul.sub-menu {
  display: block !important;
  flex-wrap: initial !important;
}
/* Dropdown reveal on hover — authoritative, beats the hidden state */
.wai-main-navigation li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation li.menu-item-has-children:focus-within > ul.sub-menu {
  left: 0;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0);
}
/* Third-level flyout on hover */
.wai-main-navigation ul.sub-menu li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation ul.sub-menu li.menu-item-has-children:focus-within > ul.sub-menu {
  left: 100%;
  top: 0;
}

/* ============================================================
   WAI SUBMENU — definitive fix
   Overrides theme's .nav-menu ul { left:-9999px } that JS triggers
   ============================================================ */
/* Hidden state: keep in place (not -9999px), just invisible */
.wai-main-navigation ul.sub-menu,
.wai-main-navigation.main-navigation ul ul,
.nav-menu.wai-main-navigation ul,
.wai-main-navigation .nav-menu ul {
  left: 0 !important;
  position: absolute !important;
  opacity: 0;
  visibility: hidden;
  transition: opacity .18s ease, visibility .18s ease;
}
/* Reveal on hover — beats everything */
.wai-main-navigation li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation li.menu-item-has-children:focus-within > ul.sub-menu {
  left: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Third level flies right */
.wai-main-navigation ul.sub-menu li.menu-item-has-children:hover > ul.sub-menu,
.wai-main-navigation ul.sub-menu li.menu-item-has-children:focus-within > ul.sub-menu {
  left: 100% !important;
  top: 0 !important;
}

/* ============================================================
   WAI HEADER — reduced padding only (centering left as original)
   ============================================================ */
.wai-header-inner {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  min-height: 64px !important;
}
/* Restore original layout: logo left, nav takes remaining space and centers,
   donate button natural size on the right */
.wai-header-inner > .wai-site-branding {
  flex: 0 0 auto;
}
.wai-header-inner > .wai-main-navigation {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
}
.wai-header-inner > .wai-header-donate-btn {
  flex: 0 0 auto;
  margin-left: auto;
}

/* ============================================================
   WAI SEARCH PAGE — WWP-style search results
   ============================================================ */
.wai-search-page {
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  padding: 50px 20px 70px;
}
.wai-search-inner {
  max-width: 1140px;
  margin: 0 auto;
}
.wai-search-breadcrumb {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 0 0 24px;
}
.wai-search-breadcrumb a {
  color: #003161;
  text-decoration: none;
}
.wai-search-breadcrumb a:hover { color: #005da5; }
.wai-search-crumb-sep { color: #9aa7b5; margin: 0 8px; }
.wai-search-crumb-current { color: #7a8290; }

.wai-search-title {
  font-size: 40px;
  font-weight: 800;
  color: #0e0e0e;
  margin: 0 0 28px;
}

.wai-search-form-wrap { margin: 0 0 32px; }
.wai-searchform {
  display: flex;
  gap: 12px;
  align-items: stretch;
  max-width: 640px;
  flex-wrap: wrap;
}
.wai-searchform-input {
  flex: 1 1 340px;
  min-width: 0;
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  font-size: 15px;
  color: #1a2233;
  padding: 14px 18px;
  border: 1px solid #cfd6df;
  border-radius: 4px;
  background: #fff;
}
.wai-searchform-input:focus {
  outline: none;
  border-color: #005da5;
  box-shadow: 0 0 0 3px rgba(0,93,165,.15);
}
.wai-searchform-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #005da5;
  color: #fff;
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  border: none;
  border-radius: 999px;
  padding: 0 26px;
  cursor: pointer;
  transition: background .2s ease;
}
.wai-searchform-btn:hover { background: #004a85; }

.wai-search-summary {
  font-size: 14px;
  color: #7a8290;
  margin: 0 0 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e4e8ee;
}

.wai-search-results {
  list-style: none;
  margin: 0;
  padding: 0;
}
.wai-search-result {
  padding: 22px 0;
  border-bottom: 1px solid #e4e8ee;
}
.wai-search-result-title {
  display: inline-block;
  font-size: 19px;
  font-weight: 700;
  color: #003161;
  text-decoration: none;
  margin: 0 0 8px;
}
.wai-search-result-title:hover { color: #005da5; }
.wai-search-result-excerpt {
  font-size: 15px;
  line-height: 1.6;
  color: #38455a;
  margin: 0 0 10px;
}
.wai-search-result-link {
  font-size: 13px;
  font-weight: 700;
  color: #b5121b;
  text-decoration: none;
}
.wai-search-result-link:hover { text-decoration: underline; }

.wai-search-noresults {
  font-size: 16px;
  color: #38455a;
  padding: 20px 0;
}

.wai-search-pagination { margin-top: 30px; }
.wai-search-pagination .page-numbers {
  display: inline-block;
  padding: 8px 14px;
  margin: 0 4px 4px 0;
  border: 1px solid #cfd6df;
  border-radius: 4px;
  color: #003161;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
}
.wai-search-pagination .page-numbers.current {
  background: #003161;
  color: #fff;
  border-color: #003161;
}
.wai-search-pagination a.page-numbers:hover {
  background: #005da5;
  color: #fff;
  border-color: #005da5;
}

@media (max-width: 600px) {
  .wai-search-title { font-size: 30px; }
  .wai-searchform-btn { flex: 1 1 100%; justify-content: center; padding: 14px; }
}

/* ============================================================
   WAI UTILITY BAR SEARCH — expanding inline form
   ============================================================ */
.wai-utility-searchform {
  display: inline-block;
  width: 0;
  overflow: hidden;
  vertical-align: middle;
  transition: width .25s ease, margin .25s ease;
  margin-left: 0;
}
.wai-utility-searchform.is-open {
  width: 200px;
  margin-left: 12px;
}
.wai-utility-searchform input {
  width: 200px;
  box-sizing: border-box;
  border: none;
  border-radius: 3px;
  padding: 6px 10px;
  font-size: 13px;
  font-family: Montserrat, Arial, Helvetica, sans-serif;
  color: #1a2233;
  background: #fff;
}
.wai-utility-searchform input:focus { outline: 2px solid #005da5; }
button.wai-utility-search {
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
  padding: 4px;
  display: inline-flex;
  align-items: center;
}
button.wai-utility-search:hover { color: #cdd9e8; }

/* Relevanssi search term highlighting — aggressive, covers every wrapper */
.wai-search-result-excerpt mark,
.wai-search-result-excerpt strong,
.wai-search-result-excerpt b,
.wai-search-result-excerpt em,
.wai-search-result-excerpt span.relevanssi-query-term,
.wai-search-result-excerpt .relevanssi-query-term,
.wai-search-result-excerpt .highlight,
.wai-search-result-title mark,
.wai-search-result-title strong,
.wai-search-result-title b,
.wai-search-result-title .relevanssi-query-term {
  background-color: #ffe58a !important;
  color: #1a2233 !important;
  padding: 0 3px !important;
  border-radius: 2px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* ==================================================================
   WAI NAV — authoritative controller (overrides earlier scattered
   rules). Desktop: JS hover-intent via .wai-open (no :hover flicker).
   Mobile: WWP-style accordion with tap-to-expand.
   ================================================================== */

/* Panels are hidden unless opened by JS (.wai-open) or keyboard focus.
   !important beats the older :hover show rules further up the file.

   Desktop toggles with display alone, matching WWP:
     .item-dropdown{display:none}
     .menu-item-as-dropdown.open .item-dropdown{display:block}
   and no transition. Animating opacity/visibility left the panel laid out
   but invisible between states — it still occupied space and still took
   pointer events during the fade, which is where the flicker and the
   dead-click on fast pointer moves came from. opacity, visibility and
   transform are forced back to their defaults so the older scattered rules
   higher up the file can't reintroduce a half-faded panel.

   Scoped to desktop: the mobile block below animates max-height on a
   position:static panel and never sets display, so a global display:none
   would stop the accordion opening at all. */
@media (min-width:1401px){
  .wai-main-navigation li.menu-item-has-children > ul.sub-menu{
    display:none !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    transition:none !important;
  }
  .wai-main-navigation li.menu-item-has-children.wai-open > ul.sub-menu,
  .wai-main-navigation li.menu-item-has-children:hover > ul.sub-menu,
  .wai-main-navigation li.menu-item-has-children:focus-within > ul.sub-menu{
    display:block !important;
  }
}

/* Injected chevron toggle — desktop hides it (hover handles menus) */
.wai-submenu-toggle{ display:none; }

@media (min-width:1401px){
  /* 2nd-level sits flush under the top link */
  .wai-main-navigation > ul > li.menu-item-has-children > ul.sub-menu{
    transform:none !important;
  }
  /* 3rd-level flyout: nudge LEFT and overlap the parent panel so there is
     no dead gap to cross — this is what kills the flashing. */
  .wai-main-navigation ul.sub-menu li.menu-item-has-children > ul.sub-menu{
    top:-11px;
    left:100%;
    margin-left:-16px;
    transform:none !important;
  }
}

/* ---------- MOBILE ACCORDION (<=900px) ---------------------------- */
@media (max-width:1400px){
  /* kill desktop hover bridges so they don't create phantom tap zones */
  .wai-main-navigation ul.sub-menu::before,
  .wai-main-navigation ul.sub-menu li.menu-item-has-children > ul.sub-menu::after{
    display:none !important;
  }

  .wai-main-navigation > ul{ flex-direction:column; width:100%; }

  .wai-main-navigation ul.menu > li,
  .wai-main-navigation ul#primary-menu > li{
    width:100%;
    border-bottom:1px solid #e6e9ee;
  }

  /* row layout: link fills, chevron button sits on the right */
  .wai-main-navigation li.menu-item-has-children{
    display:flex;
    flex-wrap:wrap;
    align-items:stretch;
  }
  .wai-main-navigation li.menu-item-has-children > a{ flex:1 1 auto; }
  .wai-main-navigation ul.menu li a,
  .wai-main-navigation ul#primary-menu li a{
    padding:15px 20px !important;
    font-size:14px;
    display:flex;
    align-items:center;
  }
  /* hide the desktop diamond caret on mobile */
  .wai-main-navigation li.menu-item-has-children > a::after{ display:none !important; }

  .wai-submenu-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    width:52px;
    background:none;
    border:none;
    border-left:1px solid #e6e9ee;
    color:#003161;
    cursor:pointer;
  }
  .wai-submenu-toggle::before{
    content:"";
    width:9px;height:9px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg) translateY(-2px);
    transition:transform .2s ease;
  }
  .wai-main-navigation li.menu-item-has-children.wai-open > .wai-submenu-toggle::before{
    transform:rotate(-135deg) translateY(-2px);
  }

  /* submenu = collapsible blue panel (WWP), full width */
  .wai-main-navigation ul.sub-menu{
    position:static !important;
    width:100%;
    flex:1 1 100%;
    max-width:none;
    min-width:0;
    max-height:0;
    overflow:hidden;
    opacity:1 !important;
    visibility:visible !important;
    background-color:#005da5;
    border-top:none;
    box-shadow:none;
    padding:0 !important;
    transform:none !important;
    transition:max-height .3s ease;
  }
  .wai-main-navigation li.menu-item-has-children.wai-open > ul.sub-menu{
    max-height:1500px;
    padding:6px 0 !important;
  }
  .wai-main-navigation ul.sub-menu li a{
    color:#fff;
    padding:13px 24px !important;
    font-size:14px;
    text-transform:none;
    font-weight:400;
  }
  .wai-main-navigation ul.sub-menu li a::after{ display:none !important; }

  /* nested (3rd level) — indent + slightly darker so hierarchy reads */
  .wai-main-navigation ul.sub-menu ul.sub-menu{ background-color:#0a4f88; }
  .wai-main-navigation ul.sub-menu ul.sub-menu li a{ padding-left:44px !important; }

  /* chevrons inside blue panels are white */
  .wai-main-navigation ul.sub-menu .wai-submenu-toggle{
    color:#fff;
    border-left-color:rgba(255,255,255,.28);
  }
  .wai-main-navigation ul.sub-menu li{ border-bottom:none; }
}

/* Mobile open/close: hamburger toggles .toggled on #site-navigation
   (replaces the dequeued navigation.js). */
@media (max-width:1400px){
  .wai-main-navigation{ position:relative; }
  .wai-main-navigation > ul{ display:none; }
  #site-navigation.toggled > ul{ display:flex; }
  .main-navigation-toggle{
    display:block;
    margin:6px 0;
  }
}
@media (min-width:1401px){
  .main-navigation-toggle{ display:none; }
}

/* ==================================================================
   WAI MOBILE HEADER — hamburger sits next to Donate, menu drops below
   ================================================================== */

/* Any leftover old-theme toggle buttons stay hidden */
#masthead .submenu-button{ display:none !important; }

/* Undo the base theme's absolute positioning of the hamburger */
.main-navigation-toggle{
  position:static !important;
  top:auto !important;
  right:auto !important;
}

@media (max-width:1400px){
  .wai-header-inner{ flex-wrap:wrap; align-items:center; row-gap:12px; }
  .wai-site-branding{ order:1; flex:1 1 auto; }
  .main-navigation-toggle{ order:2; }
  .wai-header-donate-btn{ order:3; }
  .wai-main-navigation{ order:4; flex:1 1 100%; }

  .main-navigation-toggle{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:50px;
    height:46px;
    margin:0 14px 0 0;
    background:#003161;
    border:none;
    border-radius:4px;
    cursor:pointer;
  }
  .main-navigation-toggle:hover,
  .main-navigation-toggle:focus{ background:#06427f; }
  /* clean 3-line hamburger icon */
  .main-navigation-toggle::after{
    content:"" !important;
    position:static !important;
    display:block;
    width:22px;
    height:2px;
    background:#fff;
    box-shadow:0 -6px 0 #fff, 0 6px 0 #fff;
    border:none !important;
    top:auto !important;
    right:auto !important;
  }
  .main-navigation-toggle::before{ display:none !important; }

  /* menu is hidden until the hamburger opens it */
  #site-navigation > ul,
  .wai-main-navigation > ul.menu,
  .wai-main-navigation > ul#primary-menu{ display:none !important; }
  #site-navigation.toggled > ul,
  #site-navigation.toggled > ul.menu,
  .wai-main-navigation.toggled > ul{ display:flex !important; flex-direction:column; width:100%; }
}

@media (min-width:1401px){
  .main-navigation-toggle{ display:none !important; }
}

/* ==================================================================
   WWP-EXACT DROPDOWN MATCH (authoritative — desktop ≥901px)
   Mirrors woundedwarriorproject.org site.min.css .item-dropdown:
   bg #005da5, max-width 300px, NO min-width (shrinks to content),
   border-top 1px #fff, box-shadow 0 11px 20px rgba(0,0,0,.15),
   NO radius, NO entrance transform. Items: 16px, normal weight,
   white, not uppercase, padding 4px 20px, hover #003161.
   ================================================================== */
@media (min-width:1401px){

  /* --- 2nd + 3rd level panel --- */
  .wai-main-navigation ul.sub-menu{
    min-width:0 !important;
    max-width:300px !important;
    width:auto !important;
    background-color:#005da5 !important;
    border:none !important;
    border-top:1px solid #fff !important;
    border-radius:0 !important;
    box-shadow:0 11px 20px 0 rgba(0,0,0,.15) !important;
    padding:10px 0 !important;
    margin:0 !important;
    transform:none !important;
    transition:opacity .18s ease, visibility .18s ease !important;
  }

  /* --- dropdown items (WWP exact) --- */
  /* The stock theme sets .main-navigation ul ul li { margin-bottom:12px;
     padding:0 20px }. That was never reset here, so every item carried 20px
     of li padding on top of the link's own 20px (40px indent against WWP's
     20px) and 12px of margin on top of the 4px padding. WWP's
     .item-dropdown ul li declares display:block and nothing else. */
  .wai-main-navigation ul.sub-menu li{
    display:block !important;
    padding:0 !important;
    margin:0 !important;
  }
  .wai-main-navigation ul.sub-menu li a{
    display:inline-block !important;
    width:100% !important;
    font-family:Montserrat, Arial, Helvetica, sans-serif !important;
    font-size:16px !important;
    font-weight:normal !important;
    color:#fff !important;
    text-transform:none !important;
    letter-spacing:0 !important;
    text-decoration:none !important;
    padding:4px 20px !important;
    transition:.3s !important;
    /* 4 + 21 + 4 = 29px, the measured height of WWP's a.child-link.
       Their 21px is not 1.5 x 16 — it comes from body { line-height:1.5em }
       computing to a fixed 21px at their 14px body size and inheriting as a
       length, so the 16px links keep 21px instead of recalculating to 24. */
    line-height:21px !important;
  }
  .wai-main-navigation ul.sub-menu li a:hover,
  .wai-main-navigation ul.sub-menu li a:focus{
    background-color:#003161 !important;
    color:#fff !important;
  }

  /* --- 3rd level: same panel, flush right flyout (no gap) --- */
  .wai-main-navigation ul.sub-menu li.menu-item-has-children > ul.sub-menu{
    top:-11px !important;
    left:100% !important;
    right:auto !important;
    margin-left:-16px !important;
  }
  /* parent-of-submenu right caret stays subtle white */
  .wai-main-navigation ul.sub-menu li.menu-item-has-children > a{ padding-right:34px !important; }

  /* --- top-level links (WWP exact) --- */
  .wai-main-navigation ul.menu > li > a,
  .wai-main-navigation ul#primary-menu > li > a{
    color:#003161;
    text-transform:uppercase;
    font-weight:bold;
    line-height:1;
    padding:17px 10px !important;
    transition:color .3s, background-color .3s;
  }
  .wai-main-navigation ul.menu > li > a:hover,
  .wai-main-navigation ul.menu > li > a:focus,
  .wai-main-navigation ul#primary-menu > li > a:hover,
  .wai-main-navigation ul#primary-menu > li > a:focus{
    color:#fff !important;
    background-color:#005da5 !important;
  }
  .wai-main-navigation ul.menu > li.current-menu-item > a,
  .wai-main-navigation ul.menu > li.current-menu-ancestor > a{ color:#b5121b; }
}

/* ==================================================================
   WWP-EXACT MOBILE MENU MATCH (authoritative — ≤900px)
   Mirrors woundedwarriorproject.org: white hamburger w/ dark #232323
   lines that morph to an X; dropdown panel bg #fff w/ #c5ccd0 top
   border; top-level items UPPERCASE navy #003161 bold 16px padding
   18px 15px, turning blue #005da5 white when expanded; 50px chevron
   that rotates 180deg; submenu panel bg #005da5, white items (not
   uppercase, normal weight, 16px), hover #003161.
   ================================================================== */
@media (max-width:1400px){

  /* ---- Hamburger: white box, dark lines, morph to X ---- */
  .main-navigation-toggle{
    display:inline-flex !important;
    align-items:center; justify-content:center;
    position:relative !important;
    width:46px !important; height:44px !important;
    padding:10px !important; margin:0 14px 0 0 !important;
    background:#fff !important;
    border:1px solid #c5ccd0 !important;
    border-radius:0 !important;
    line-height:0 !important; cursor:pointer;
    box-shadow:none !important;
  }
  .main-navigation-toggle::before,
  .main-navigation-toggle::after{
    content:"" !important; display:block !important; position:absolute; left:50%; top:50%;
    width:25px; height:2px; background:#232323 !important;
    border:none !important; box-shadow:none;
    transition:transform .3s ease, opacity .3s ease;
  }
  /* closed = 3 lines (::before is middle + top/bottom via shadow) */
  .main-navigation-toggle::before{
    transform:translate(-50%,-50%);
    box-shadow:0 -7px 0 #232323, 0 7px 0 #232323;
  }
  .main-navigation-toggle::after{ transform:translate(-50%,-50%); opacity:0; }
  /* open = X */
  .main-navigation-toggle[aria-expanded="true"]::before{
    box-shadow:none; transform:translate(-50%,-50%) rotate(45deg);
  }
  .main-navigation-toggle[aria-expanded="true"]::after{
    opacity:1; transform:translate(-50%,-50%) rotate(-45deg);
  }

  /* ---- Dropdown panel: white with top divider ---- */
  #site-navigation.toggled > ul{
    background:#fff !important;
    border-top:1px solid #c5ccd0 !important;
  }

  /* ---- Top-level rows ---- */
  .wai-main-navigation ul.menu > li,
  .wai-main-navigation ul#primary-menu > li{
    border-bottom:none !important;
  }
  .wai-main-navigation ul.menu li a,
  .wai-main-navigation ul#primary-menu li a{
    text-transform:uppercase !important;
    color:#003161 !important;
    font-weight:bold !important;
    font-size:16px !important;
    line-height:1 !important;
    padding:18px 15px !important;
    display:flex; align-items:center;
    transition:background-color .3s, color .3s !important;
  }
  /* expanded / hover parent row turns blue */
  .wai-main-navigation li.menu-item-has-children.wai-open > a,
  .wai-main-navigation ul.menu li a:hover,
  .wai-main-navigation ul.menu li a:focus{
    background-color:#005da5 !important;
    color:#fff !important;
  }
  .wai-main-navigation ul.menu > li.current-menu-item > a{ color:#b5121b !important; }

  /* ---- Chevron toggle button (50px, rotates 180) ---- */
  .wai-submenu-toggle{
    display:flex !important; align-items:center; justify-content:center;
    width:50px !important; flex:0 0 50px !important;
    background:transparent !important; border:none !important;
    color:#003161 !important; cursor:pointer; position:relative;
    transition:background-color .3s, color .3s;
  }
  .wai-submenu-toggle::before{
    content:"" !important; width:10px; height:10px; margin-top:-3px;
    border-right:2px solid currentColor; border-bottom:2px solid currentColor;
    transform:rotate(45deg); transition:transform .3s ease;
  }
  .wai-main-navigation li.menu-item-has-children.wai-open > .wai-submenu-toggle{
    background-color:#005da5 !important; color:#fff !important;
  }
  .wai-main-navigation li.menu-item-has-children.wai-open > .wai-submenu-toggle::before{
    transform:rotate(-135deg); margin-top:3px;
  }

  /* ---- Submenu panel (blue, WWP-exact items) ---- */
  .wai-main-navigation ul.sub-menu{
    background-color:#005da5 !important;
    padding:0 !important; border:none !important; box-shadow:none !important;
  }
  .wai-main-navigation li.menu-item-has-children.wai-open > ul.sub-menu{
    padding:10px 0 !important;
  }
  .wai-main-navigation ul.sub-menu li{ padding:0 !important; margin:0 !important; }
  .wai-main-navigation ul.sub-menu li a{
    color:#fff !important;
    font-family:Montserrat, Arial, Helvetica, sans-serif !important;
    font-weight:normal !important;
    text-transform:unset !important;
    font-size:16px !important;
    padding:8px 15px !important;
    line-height:21px !important;
  }
  .wai-main-navigation ul.sub-menu li a:hover,
  .wai-main-navigation ul.sub-menu li a:focus{ background-color:#003161 !important; color:#fff !important; }
  .wai-main-navigation ul.sub-menu li a::after{ display:none !important; }

  /* nested (3rd level) indented, same blue */
  .wai-main-navigation ul.sub-menu ul.sub-menu{ background-color:#005da5 !important; }
  .wai-main-navigation ul.sub-menu ul.sub-menu li a{ padding-left:32px !important; }
}

/* Fix: keep the dropdown caret to the RIGHT of the text on top-level parents
   (the WWP-exact padding override above had squeezed it onto the text). */
@media (min-width:1401px){
  .wai-main-navigation ul.menu li.menu-item-has-children > a,
  .wai-main-navigation ul#primary-menu li.menu-item-has-children > a{
    padding-right:28px !important;
    position:relative;
  }
  .wai-main-navigation ul.menu li.menu-item-has-children > a::after,
  .wai-main-navigation ul#primary-menu li.menu-item-has-children > a::after{
    right:10px !important;
  }
}

/* ==================================================================
   Kill reserved height on EMPTY Elementor containers in the content
   area (grid 1fr rows + default padding reserve space when empty).
   Once a container actually has widgets, normal spacing returns.
   ================================================================== */
.site-content .e-con:not(:has(.elementor-widget)) {
  --min-height: 0px !important;
  min-height: 0 !important;
  --padding-top: 0px !important;
  --padding-bottom: 0px !important;
}
.site-content .e-con:not(:has(.elementor-widget)) > .e-con-inner {
  min-height: 0 !important;
  padding-block-start: 0 !important;
  padding-block-end: 0 !important;
}
/* grid row tracks: use content-sized rows, not stretchy 1fr, when empty */
.site-content .e-con.e-grid:not(:has(.elementor-widget)),
.site-content .e-con.e-grid:not(:has(.elementor-widget)) > .e-con-inner {
  --e-con-grid-template-rows: none !important;
  grid-template-rows: none !important;
}

/* ==================================================================
   WWP-EXACT MOBILE HAMBURGER v2 (authoritative — final override)
   Real <span> lines (3-line hamburger morphing to an X-cross),
   exactly like woundedwarriorproject.org's .mobile-toggle-button.
   Supersedes every earlier .main-navigation-toggle pseudo-element rule.
   ================================================================== */
@media (max-width:1400px){

  /* kill ALL legacy ::before/::after icons on the toggle */
  .main-navigation-toggle::before,
  .main-navigation-toggle::after{
    content:none !important;
    display:none !important;
    box-shadow:none !important;
    background:none !important;
  }

  /* button shell = WWP mobile-toggle-button (white, 1px #c5ccd0, 10px pad) */
  .main-navigation-toggle{
    display:inline-flex !important;
    align-items:center; justify-content:center;
    position:relative !important;
    width:auto !important; height:auto !important;
    line-height:0 !important;
    padding:10px !important;
    margin:0 14px 0 0 !important;
    background-color:#fff !important;
    border:1px solid #c5ccd0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    outline:none; cursor:pointer;
  }
  .main-navigation-toggle span{ display:block; }

  /* hamburger: 3 dark lines, shown by default */
  .main-navigation-toggle .hamburger{
    position:relative; opacity:1;
    transition:opacity .3s; pointer-events:none;
  }
  .main-navigation-toggle .hamburger .lines > span{
    height:3px; width:30px; background-color:#232323; border-radius:0;
  }
  .main-navigation-toggle .hamburger .lines > span:not(:last-child){ margin-bottom:7px; }

  /* cross: X made of two rotated bars, hidden until open */
  .main-navigation-toggle .cross{
    position:absolute; top:50%; left:50%;
    transform:translate(-50%,-50%);
    opacity:0; transition:opacity .3s; pointer-events:none;
  }
  .main-navigation-toggle .cross .lines{ position:absolute; transform:rotate(45deg); }
  .main-navigation-toggle .cross .lines .line1,
  .main-navigation-toggle .cross .lines .line2{
    background-color:#232323; position:absolute; top:50%; left:50%;
    transform:translate(-50%,-50%);
  }
  .main-navigation-toggle .cross .lines .line1{ width:30px; height:3px; }
  .main-navigation-toggle .cross .lines .line2{ width:3px; height:30px; }

  /* swap hamburger <-> cross on open */
  .main-navigation-toggle[aria-expanded="true"] .hamburger{ opacity:0; }
  .main-navigation-toggle[aria-expanded="true"] .cross{ opacity:1; }
  .main-navigation-toggle:focus-visible{ outline:1px solid #b5121b; outline-offset:1px; }

  /* accordion: remove stray white borders so an expanded row is flush
     with its blue sub-panel (kills the white bar under the title) */
  .wai-main-navigation ul.menu li,
  .wai-main-navigation ul.menu li a,
  .wai-main-navigation ul.sub-menu li,
  .wai-main-navigation ul.sub-menu li a{ border:0 !important; }
  .wai-main-navigation li.menu-item-has-children.wai-open > a,
  .wai-main-navigation li.menu-item-has-children.wai-open > .wai-submenu-toggle{
    background-color:#005da5 !important; color:#fff !important;
  }
}
