.header--blog {
    background-color: #fff;
}

.header--blog::before {
    background-color: #fff;
}

.header__wrapper--blog {
    width: 100%;
    max-width: none;
    padding-left: 24px;
    padding-right: 24px;
}

.header--blog .custom-logo-link {
    max-width: 320px;
}

.header--blog .custom-logo-link img {
    width: auto;
    height: 58px;
    max-height: 58px;
    object-fit: contain;
}

.header--blog .custom-logo--white,
.header--blog .custom-logo--blue {
    width: auto !important;
    min-width: 1px;
}

@media screen and (min-width: 1024px) {
    .header__wrapper--blog {
        padding-left: 40px;
        padding-right: 40px;
    }

    .header--blog .custom-logo-link img {
        height: 64px;
        max-height: 64px;
    }
}

.header--blog .header__right a {
    color: var(--color-blue-dark);
    border-right-color: var(--color-blue-dark);
}

.header--blog .header__toggle-line {
    background-color: var(--color-blue-dark);
}

.header--blog .header__nav--desktop a {
    color: var(--color-blue-dark);
}

.header--blog .custom-logo--blue {
    display: block;
}

.header--blog .custom-logo--white {
    display: none;
}

.header--blog.scrolled,
.header--blog.menu-open {
    background-color: var(--color-blue-dark) !important;
}

.header--blog.scrolled .header__wrapper,
.header--blog.menu-open .header__wrapper {
    background-color: var(--color-blue-dark) !important;
}

.header--blog.scrolled::before,
.header--blog.menu-open::before {
    background-color: var(--color-blue-dark) !important;
}

.header--blog.scrolled .header__right a,
.header--blog.menu-open .header__right a {
    color: #fff;
    border-right-color: #fff;
}

.header--blog.scrolled .header__toggle-line,
.header--blog.menu-open .header__toggle-line {
    background-color: #fff;
}

.header--blog.scrolled .header__nav--desktop a,
.header--blog.menu-open .header__nav--desktop a {
    color: #fff;
}

.header--blog.scrolled .custom-logo-link--has-white .custom-logo--blue,
.header--blog.menu-open .custom-logo-link--has-white .custom-logo--blue {
    display: none;
}

.header--blog.scrolled .custom-logo-link--has-white .custom-logo--white,
.header--blog.menu-open .custom-logo-link--has-white .custom-logo--white {
    display: block;
}
