#header-wrapper {
    position: fixed;
    top: 0;
    width: 100%;
    padding: 0.938rem 0;
    box-shadow: 0 2px 8px transparent;
    z-index: 99;
}
#header-wrapper::before {
    content: '';
    background: linear-gradient(90deg, rgba(44, 44, 44, 0.85) 0%, rgba(44, 44, 44, 0.00) 100%);
    position: absolute;
    inset: 0;
    z-index: -1;
}

#header-wrapper.header-hidden {
    transform: translateY(-100%);
}

#header-wrapper.header-shown {
    transform: translateY(0);
}

#header-wrapper.header-active::before {
    background-color: var(--e-global-color-text);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);      
}

body.no-scroll #header-wrapper.header-active::before {
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

#header-wrapper .header-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; 
    padding: 0 1.25rem;
}

.header-logo {
    max-width: 150px;    
    flex: 1 1 0;
    z-index: 1;
}

.header-logo img.custom-logo {
    width: 100%;
    height: initial;
    overflow: visible;
}

.header-right {
    display: flex;
    align-items: center;
    gap: 24px;
}

button#estimate-btn {
    background-color: transparent;
    font-size: clamp(0.875rem, 1.33vw, 1rem) !important;
    color: var(--e-global-color-accent);
    text-wrap: nowrap;
}

/* Media Queries */

@media (width <=575px) {
    button#estimate-btn {
        padding: 0.625rem 1.25rem 0.625rem 1.25rem;
    }
}