.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-501 .elementor-element.elementor-element-32ba994 .elementor-icon-wrapper{text-align:center;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:767px){.elementor-501 .elementor-element.elementor-element-32ba994 .elementor-icon{font-size:20px;}.elementor-501 .elementor-element.elementor-element-32ba994 .elementor-icon svg{height:20px;}}/* Start custom CSS */.site-header {
    position: fixed;      /* or sticky */
    top: 30px;
    left: 0;
    width: 100%;
    z-index: 999;
    background-color: transparent;
    transition: background-color 0.4s ease, box-shadow 0.4s ease;
}

/* pull the page content up behind the header */
body {
    margin-top: 0;
}

@supports (animation-timeline: scroll()) {
    .site-header {
        animation: header-reveal linear both;
        animation-timeline: scroll(root);
        animation-range: 0px 200px; /* background fully revealed after 200px of scroll */
    }

    @keyframes header-reveal {
        from {
            background-color: rgba(255, 255, 255, 0);
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0);
        }
        to {
            background-color: rgba(250, 250, 250, 0.98); /* your color */
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
        }
    }
}/* End custom CSS */