/* Style for the scrolled header */
.site-header, header, [data-elementor-type="header"], .elementor-location-header, .elementor-section-wrap {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Force test color to prove it runs */
.is-scrolled {
    background-color: rgba(255, 0, 0, 0.5) !important; /* Bright red test */
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    z-index: 9999 !important; /* Ensure it stays above content */
}

/* Specific fix for Elementor Pro headers */
.elementor-location-header > .e-con,
.elementor-location-header > .elementor-section {
    transition: padding 0.3s ease !important;
}

.is-scrolled > .e-con,
.is-scrolled > .elementor-section {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}