.header-country {
    display: grid;
}

.header-country__column--content {
    margin-top: 25px;
}

.header-country__title.main-title.title-h1 {
    font-family: "Comfortaa", cursive;
    color: #243570;
    word-wrap: break-word;
    padding: 15px 0 0 0;
}

.header-country__special-text {
    border: 1px solid #25358033;
    border-radius: 14px;
    padding: 15px;
    transition: all 0.3s ease;
    background-image: linear-gradient(to right,
            rgba(5, 9, 55, 0.1) 0%,
            rgba(0, 0, 0, 0) 50%,
            rgba(250, 46, 65, 0.1) 100%);

    @supports (color: oklab(0 0 0)) {
        background-image: linear-gradient(to right,
                oklab(0.363448 -0.00046885 -0.1278 / 0.1) 0%,
                rgba(0, 0, 0, 0) 50%,
                oklab(0.7299 0.160906 0.0368927 / 0.1) 100%);
    }
}

.header-country__special-text:hover {
    background-image: linear-gradient(to right, oklab(0.363448 -0.00046885 -0.1278 / 0.15) 0%, rgba(0, 0, 0, 0) 50%, oklab(0.7299 0.160906 0.0368927 / 0.15) 100%);
}

.header-country__special-text h5 {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #253580;
    font-size: 18px;
    margin-bottom: 10px;
    line-height: 1;
}

.header-country__special-text h5:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(/wp-content/themes/vittoriavita/images/warning-icon.svg);
}

.header-country__special-text p {
    padding-left: 30px;
}

.header-country__image {
    margin: 35px 0 15px 0;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

.header-country__image:hover {
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px;
}

.header-country__img {
    border-radius: 10px;
    object-fit: cover;
    height: 240px;
    object-position: top;
}

.header-country__cards {
    margin: 0px 0 15px 0;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    padding: 35px 25px;
}

.header-country__card {
    width: 140px;
    height: 165px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 10px 10px 25px 10px;
    background-color: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
    transition: scale 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.header-country__card:hover {
    z-index: 99 !important;
    scale: 1.05;
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px;
}

.header-country__card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.header-country__card-title {
    font-family: "Comfortaa", cursive;
    color: #4a5565;
    word-wrap: break-word;
    font-size: 12px;
}

.header-country__tags {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.header-country__tag {
    display: flex;
    align-items: center;
    gap: 10px;
    backdrop-filter: blur(8px);
    background-color: #ffffffcc;
    border: 1px solid #f3f4f699;
    border-radius: 10px;
    padding: 6px 8px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
        0 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

.header-country__tag:hover {
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.1) 0px 4px 6px -4px;
}

.header-country__tag-image {
    width: 18px;
    height: 18px;
}

.header-country__tag-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    color: #374151;
}

.header-country__card.is-hidden-mobile {
    display: none !important;
}

@media screen and (min-width: 992px) {
    .header-country__card.is-hidden-mobile {
        display: flex !important;
    }

    .header-country__cards {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .header-country {
        grid-template-columns: 1fr 1fr;
        align-items: center;
        gap: 0 35px;
    }

    .header-country__title.main-title {
        font-size: 48px;
        line-height: 1.2;
        grid-column: 1 / 2;
    }

    .header-country__column--image {
        grid-row: 1 / 3;
        grid-column: 2 / 3;
            align-self: baseline;
    }

    .header-country__column--content {
        grid-column: 1 / 2;
    }

    .header-country__tags {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

}

@media screen and (min-width: 1200px) {
    .header-country {
        gap: 0 50px;
    }

    .header-country__special-text {
        margin: 0 auto 50px auto;
        width: 80%;
        grid-column: 1 / 3;
    }
}