:root {
    --promo-header-height: 60px;
}

.c-header {
    width: 100%;
    top: var(--promo-header-height);
}

.c-header.c-header--scrolled {
    top: 0;
}

.c-responsive-header {
    top: var(--promo-header-height);
}

.c-responsive-header.c-responsive-header--scrolled {
    top: 0;
}

.promotion-header {
    padding: 0 40px;
    display: flex;
    gap: 20px;
    align-items: center;
    flex-direction: row;
    text-align: center;
    background: #E61937;
    height: var(--promo-header-height);
    color: white;
    font-size: 20px;

    .contact {
        flex-grow: 1;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    a {
        color: white;
    }

    .fa-solid.fa-gift {
        margin-right: 20px;
        color: gold;
        transform: rotate(15deg);
        display: inline-block;
        text-shadow: -2px -2px 0 #fff,
        2px -2px 0 #fff,
        -2px 2px 0 #fff,
        2px 2px 0 #fff;
    }
}

@media (max-width: 1360px) {
    :root {
        --promo-header-height: 90px;
    }

    .promotion-header {
        font-size: 18px;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        gap: 10px;
        padding: 0 30px;

        .contact {
            justify-content: center;
            flex-grow: initial;
            gap: 20px;
        }
    }
}

@media (max-width: 960px) {
    :root {
        --promo-header-height: 90px;
    }

    .promotion-header {
        font-size: 16px;
        gap: 5px;
    }
}

@media (max-width: 480px) {
    .promotion-header {
        font-size: 14px;

        .fa-solid.fa-gift {
            display: none;
        }
    }
}