.desktop-search a {
            border-radius: 50%;
    padding-top: 8px!important;
    padding-right: 9px!important;
    padding-bottom: 8px!important;
    padding-left: 9px!important;
    
    }

    .desktop-search a>img {
        width:16px!important;
    }

    .desktop-se-modal {
        position: absolute;
    top: 75px;
    left: 217px;
    max-width:350px;
    }

        @media (min-width: 1181px) {
  .mobile-navigation { display: none; }
  .mn-trigger { display: none; }

}

    @media (min-width: 992px) {
  .mobile-navigation { display: none; }

}

/* @media screen and (min-width: 993px) and (max-width: 1440px) {
    .has-global-padding {
        padding-left: var(--wp--preset--spacing--40)!important;
        padding-right: var(--wp--preset--spacing--40)!important;
    }

} */

@media screen and (min-width: 993px) and (max-width: 1180px) {
    .header-desktop-items {
        display: none!important;
    }

    .header-mobile-items {
        display: flex!important;
    }

    .header-mobile-items button, .header-mobile-items .wp-block-button {
        height: 40px;
        width: 40px;
    }
    .header-mobile-items .wp-block-button a {
        padding:0px!important;
    }

        .masthead>div {
        padding-left: var(--wp--preset--spacing--20)!important;
        flex-direction: row-reverse;
        padding-right: var(--wp--preset--spacing--20)!important;
        height:90px;
    }

       .mobile-tel-row {
        display: flex!important; 
        margin-top: 0;
    }

    .mobile-tel-row a {
        text-decoration:none;
    }

      .entry-content {
        margin:5rem 1rem 0rem 1rem;
    }
    .contact-sticky {
    position: fixed;
    left: 0;
    top: 85%;
    transform: translateY(-50%) rotate(-90deg);
    transform-origin: left top;
    display: block!important;
    }

}


@media screen and (max-width: 1180px) {
    /* ================================
       Mobile Navigation (Drawer)
       ================================ */

    /* Drawer wrapper occupies the right side; use transforms to slide */
    .mobile-navigation { 
      position: fixed; /* drawer below header */
      /* Header height: use CSS var if set, fallback to 90px (see .masthead>div) */
      --header-h: var(--header-height, 90px);
      top: var(--header-h);
      right: 0; 
      height: calc(100vh - var(--header-h));
      width: 75vw; 
      pointer-events: none; /* clicks disabled until open */
      z-index: 9999;
    }

    /* The actual green panel */
    .mobile-navigation .mn-menu {
      position: absolute;
      top: 0;
      right: 0;
      height: 100%; /* fill wrapper below header */
      width: 75vw;
      background: #003D43; /* site green */
      color: #fff;
      font-size: 23px;
      overflow: auto;
      transform: translateX(100%); /* hidden off-canvas (from right) */
      transition: transform .32s ease-in-out;
      padding: 18px 14px;
      box-shadow: 0 0 24px rgba(0,0,0,.18);
    }

    /* When open, enable pointer events and slide in */
    .mobile-navigation.is-open { pointer-events: auto; }
    .mobile-navigation.is-open .mn-menu { transform: translateX(0); }

    /* Reset list styles */
    .mn-menu ul { list-style: none; margin: 0; padding: 0; }
    /*.mn-menu li { border-bottom: 1px solid rgba(255,255,255,.15); }*/
    .mn-menu a { color: #fff; text-decoration: none; display: block; padding: 12px 14px; }

    /* RTL layout and chevron on the left */
    .mn-menu { direction: rtl; text-align: right; }
    .mn-menu li { position: relative; }
    /* Keep list items block so submenu can open BELOW the parent */
    .mn-menu li.menu-item-has-children { display: block; }
    /* Add left padding for the absolute chevron button */
    .mn-menu li.menu-item-has-children > a { display:block; padding-left: 42px; }

    /* Chevron button styling: absolute on the LEFT (RTL), fixed to parent line */
    .mn-menu .toggle-sub-menu {
      appearance: none;
      border: 0;
      background: transparent;
      position: absolute;
      left: 10px;
      top: 12px; /* align with parent link padding-top so it won't drift when submenu opens */
      width: 28px;
      height: 28px;
      padding: 0;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: #fff;           /* make chevron white */
      z-index: 2;            /* stay above expanding content */
    }

    /* SVG chevron (left arrow) and open state */
    .mn-menu .mn-chevron-svg { width: 30px; height: 30px; transform: rotate(0deg); transition: transform .2s ease; }
    .mn-menu .toggle-sub-menu svg path { stroke: currentColor !important; fill: none !important; }
    .mn-menu li.menu-item-open > .toggle-sub-menu .mn-chevron-svg { transform: rotate(-90deg); }

    /* Submenus are hidden by default; JS slides them down UNDER the parent */
    .mn-menu ul.sub-menu {
      display: none;
      padding: 6px 14px 8px 14px; /* even padding in RTL */
      border-top: 1px solid rgba(255,255,255,.12);
    }
    .mn-menu ul.sub-menu a { padding: 10px 14px; font-size: 23px; color: #DAF1BE; }

    /* --- Trigger icon swap (hamburger ↔ X) --- */
    .mn-trigger { position: relative; color:#003D43; right:15px; }
    .mn-trigger svg { display:block; }

    /* stack both icons in the same place */
    .mn-trigger .icon-hamburger,
    .mn-trigger .icon-close {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 40px;
      height: 40px;
      transform: translate(-50%, -50%) rotate(0deg) scale(1);
      transition: opacity .22s ease, transform .22s ease;
      display:block !important; /* override any earlier display toggles */
    }

    /* initial states */
    .mn-trigger .icon-hamburger { opacity: 1; transform: translate(-50%, -50%) rotate(0)    scale(1); }
    .mn-trigger .icon-close     { opacity: 0; transform: translate(-50%, -50%) rotate(-90deg) scale(.9); }

    /* when open */
    .mn-trigger[aria-expanded="true"] .icon-hamburger { opacity: 0; transform: translate(-50%, -50%) rotate(90deg)  scale(.9); }
    .mn-trigger[aria-expanded="true"] .icon-close     { background: #DFF4FF; opacity: 1; transform: translate(-50%, -50%) rotate(0)     scale(1); }
}
    @media screen and (max-width: 992px) {
    
    .wp-block-site-logo {
        margin-right:35px!important;
    }


    .header-desktop-items {
        display: none!important;
    }

    .header-mobile-items {
        display: flex!important;
    }

    .header-mobile-items button, .header-mobile-items .wp-block-button {
        height: 40px;
        width: 40px;
    }
    .header-mobile-items .wp-block-button a {
        padding:0px!important;
    }

    .mobile-menu-modal {
        min-height: 100vh;
        width: 85%;
        transform: translate(30px, 0px)!important;
    }

    .mobile-menu-modal .wpb_wmca_accordion_wrapper_theme_transparent ul li a {
        color: #fff !important;
        border-radius: 0px!important;
        border-left: 0px solid transparent!important;
    }

    .mobile-menu-modal .wpb_wmca_accordion_wrapper_theme_transparent ul li a:hover {
        background-color:rgb(245 248 250 / 0%)!important;
    }

    .mobile-menu-modal .wp-block-cloudcatch-light-modal-block__close {
        right:8px!important;
        left:auto!important;
    }

    .mobile-menu-modal .wpb_wmca_accordion_wrapper_theme_transparent ul ul {
        padding:0px!important;
    }

    .wpb_wmca_accordion_wrapper_theme_transparent ul li a:hover, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current_page_ancestor>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current_page_parent>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current_page_item>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current-menu-parent>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current-menu-ancestor>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current-menu-item>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.current-cat>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.wpb-wmca-current-cat-parent>a, .wpb_wmca_accordion_wrapper_theme_transparent>ul>li.wpb-submenu-indicator-minus>a {
        background-color: rgba(245, 248, 250, 0);
    }

    body.rtl .wpb_category_n_menu_accordion>ul>li li:hover>a, body.rtl .wpb_category_n_menu_accordion>ul>li li.current-cat>a, body.rtl .wpb_category_n_menu_accordion>ul>li li.current-menu-item>a, body.rtl .wpb_category_n_menu_accordion li.wpb-submenu-indicator-minus>a {
        border-right:0px!important;
        color: #7DC229 !important;
    }
    
    .masthead>div {
        padding-left: var(--wp--preset--spacing--40)!important;
        flex-direction: row-reverse;
        padding-right: var(--wp--preset--spacing--40)!important;
        height:90px;
    }

    .mobile-tel-row {
        display: flex!important; 
        margin-top: 0;
    }

    .mobile-tel-row p {
        font-size:17px!important;
    }

    .mobile-tel-row a {
        text-decoration:none;
    }

        .contact-sticky {
    position: fixed;
    left: 0;
    top: 85%;
    transform: translateY(-50%) rotate(-90deg);
    transform-origin: left top;
    display: block!important;
    }

    .home .entry-content {
        margin:5rem 1rem 0rem 1rem;

    }

    .entry-content {
        margin:1rem 1rem 0rem 1rem;
    }

    .home-hero {
        background-image: url(/wp-content/uploads/2025/05/hero-mobile.jpg);
        background-size: contain;
        background-position: bottom;
        background-repeat: no-repeat;
        min-height: 500px!important;
    }

    .home-hero .wp-block-columns {
        padding-top: 0!important;
        padding-right: var(--wp--preset--spacing--40)!important;
        padding-bottom: var(--wp--preset--spacing--70);
        padding-left: var(--wp--preset--spacing--40)!important;
        text-align:center!important;
    }

    .home-hero .wp-block-cover__inner-container {
        top:-100px;
    }

    .home-hero .wp-image-86 {
        display:block;
        margin-top:10px;
    }

    .home-hero h2 {
        font-size: 2rem !important;
    }

    .home-hero p {
        font-size: 1rem !important;
        text-align: center;
        margin-top: 1rem;
    }

    .home-hero img {
        display:none;
    }

    .home-hero .hero-text-secondary {
        font-size:1.3rem!important;
    }

    .about-section>div {
        flex-basis:100%;
        text-align: center;
        align-items: center;
    }

    .about-section img {
        width:80%!important;
    }

    .about-section-box {
        padding-top: var(--wp--preset--spacing--80);
        padding-right: var(--wp--preset--spacing--40)!important;
        padding-bottom: var(--wp--preset--spacing--80);
        padding-left: var(--wp--preset--spacing--40)!important;
    }

     #splide01 .splide {
      overflow: hidden;
      padding-inline: 1rem;
    }
    
    #splide01 .splide__track {
      overflow: hidden;
    }
    
    #splide01 .splide__slide {
        width: calc(90% - 2rem) !important;
        margin: 0 0.5rem !important;
    }

    .contact-box p {
        margin-top:0px!important;
        text-align:center;
    }

    .contact-box .wp-block-contact-form-7-contact-form-selector {
        padding:0 2rem;
    }

    .contact-box .form-row--split {
        display: flex;
        gap: 0;
        margin-bottom: 0;
        flex-direction: column;
    }

    .footer-columns {
        margin: 0rem 2rem !important;
    }

    .breadcrumbs {
        text-align: center;
        position: relative;
        top: 2.2rem;
        font-size: var(--wp--preset--font-size--small);
    }

    .single .author {
        justify-content: center;
    }

    .single .author p {
        font-size:18px;
    }

    .single .entry-content .wp-block-post-author-name {
        font-size:18px;
    }

    .about-features {
        padding-right:0px!important;
        padding-left:0px!important;
    }

    .method-img {
        margin-left:0!important;
        margin-right:0!important;
    }

    .single-post-grid {
        display: block; /* stack layout */
      }
    
      .wp-block-template-part.post-sidebar {
        position: static;
        margin-top: 3rem;
                margin-right: 1rem !important;
        margin-left: 1rem !important;
      }

      .toc-block {
        display: inline-block;
        min-width: 90%;
        /* width: 90%; */
        margin: 1rem 1rem 0rem 1rem;
    }

    .single h1, .search-results h1, .archive h1, .page-template-default h1, .page-template-contact h1 {
        margin-left: 1rem !important;
        margin-right: 1rem !important;
        font-size:24px;
        text-align:center;
        margin:3rem 1rem 1rem 1rem!important;
    }

    .mobile-search-modal {
        position: absolute;
        top: 70px;
    }

    .mobile-search-toggle button {
        padding:0.6em!important;
    }

    .search-query {
        margin:1rem!important;
    }

    .boxed-text {
        margin-right:1rem;
        margin-left:1rem;
    }

  /* Make the table fill the row and prevent wrap */
  .gsc-control-cse table.gsc-search-box { 
    width: 100% !important; 
    table-layout: fixed !important;
  }
  /* Give the input cell all the width */
  .gsc-control-cse .gsc-search-box td.gsc-input {
    width: 100% !important;
    padding-right: 8px !important;
  }
  /* Keep the button compact so it doesn’t push to a new line */
  .gsc-control-cse .gsc-search-box td.gsc-search-button { 
    width: 1% !important; 
    white-space: nowrap !important;
  }
  .gsc-control-cse .gsc-search-button-v2 {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 12px !important;
  }

/* 1. At narrow viewports, make everything block-level */
@media (max-width: 768px) {
  table,
  thead,
  tbody,
  tr,
  th,
  td {
    /* display: block !important; */
    width: 100% !important;
    box-sizing: border-box;
  }

  /* 2. Add some breathing room between “rows” (they’re now blocks) */
  tr {
    margin-bottom: 1em;
  }

  /* 3. Tidy up cell padding */
  th,
  td {
    padding: 0.5em;
    /* optional: add a border or background to separate cells */
    /* border-bottom: 1px solid #ddd; */
  }

  /* 4. (Optional) Hide table headers if they no longer make sense */
  thead {
    display: none;
  }
}

.wp-block-list {
    font-size: 20px!important;
    padding-right: 18px!important;
}

.single .entry-content h2::before {
    content: '';
    display: block;
    height: 1rem;
    width: 0;
    padding-top: 8rem;
    margin-top: -8rem;
}

.qa-top summary {
    padding: 1rem;
    border-radius: 20px;
    background-color: #003D42;
    color: #fff;
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: flex-start;
}

.footer-columns .wp-block-navigation-item, .footer-columns p {
    font-size:large!important;
}

.page-id-301 p, .page-id-345 p {
    font-size: clamp(18px, 1.125rem + 0.30vw, 21px)!important;
    margin-top: 10px;
}

.page-id-301 h2, .page-id-345 h2 {
    font-size: clamp(28px, 1.125rem + 0.30vw, 27px) !important;
}

.contact-bottom {
    position: fixed;
    bottom: 0;
    z-index: 1;
    width: 100%;
    display:block;
}

.contact-bottom .wp-block-button {
    width:50%!important;
    height:55px;
}

.contact-bottom .wp-block-button img {
    filter: invert(1);
}

}