.header-banner {
    padding: 10px 20px;
    background-color: var(--wp--preset--color--accent);
    cursor: pointer;
}

.header-banner:hover .header-banner__link {
    color: var(--wp--preset--color--primary);
}

.header-banner__title p,
.header-banner__link {
    font-size: 14px;
    color: #fff;
    margin-bottom: 0;
    margin-top: 0;
    display: block;
}

@media (max-width: 772px) {
    .header-banner__title p,
    .header-banner__link {
        font-size: 12px;
    }
}

.header-banner__link {
    font-weight: 700;
    transition: .2s linear;
}

.header-banner__link i {
    font-size: 9px;
    margin: auto 0 auto 5px;
}

@media (min-width: 772px) {
    .header-banner {
        width: 380px;
        height: 40px;
        position: fixed;
        top: 50%;
        transform: rotate(90deg) translateX(-20px);
        left: -180px;
        border-radius: 8px 8px 0 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .header-banner .container {
        width: 100%;
    }

    .header-banner .col-6 {
        display: flex;
        justify-content: center;
    }

    .header-banner__link {
        font-weight: 500;
    }
}