.elementor-18 .elementor-element.elementor-element-36f609c{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;}.elementor-18 .elementor-element.elementor-element-756d637{width:var( --container-widget-width, 11.127% );max-width:11.127%;--container-widget-width:11.127%;--container-widget-flex-grow:0;text-align:start;}.elementor-18 .elementor-element.elementor-element-756d637.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-18 .elementor-element.elementor-element-756d637 img{width:100%;}.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-menu-toggle{margin:0 auto;}.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for nav-menu, class: .elementor-element-c4d24bd *//* 1. Turn off Elementor's default pointer line so they don't overlap */
.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-item::after, 
.elementor-18 .elementor-element.elementor-element-c4d24bd .wp-block-navigation-item__content::after {
    display: none !important;
}

/* 2. Target the menu links */
.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-item,
.elementor-18 .elementor-element.elementor-element-c4d24bd .wp-block-navigation-item a {
    position: relative;
    text-decoration: none;
    padding-bottom: 12px !important; 
}

/* 3. Apply the brush stroke using a pseudo-element */
.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-item::before,
.elementor-18 .elementor-element.elementor-element-c4d24bd .wp-block-navigation-item a::before {
    content: "";
    position: absolute;
    bottom: -5px; 
    left: 0;
    width: 100%;
    height: 12px; 
    
    /* The Brush Stroke Image (SVG) */
    background-image: url("https://ohha.stermanmarketing.ca/wp-content/uploads/2026/06/underline-orange.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    
    /* Animation settings */
    transform: scaleX(0);
    transform-origin: center; 
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275); 
}

/* 4. Trigger the brush stroke on Hover AND Active States */
.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-item:hover::before,
.elementor-18 .elementor-element.elementor-element-c4d24bd .elementor-item.elementor-item-active::before,
.elementor-18 .elementor-element.elementor-element-c4d24bd .wp-block-navigation-item a:hover::before,
.elementor-18 .elementor-element.elementor-element-c4d24bd .wp-block-navigation-item.current-menu-item a::before,
.elementor-18 .elementor-element.elementor-element-c4d24bd .wp-block-navigation-item.current_page_item a::before {
    transform: scaleX(1);
}/* End custom CSS */