:root {
  --color-primary: #0D2342;
}

.encarts-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: 16px;
}

.encart__link {
    display: block;
    position: relative;

    text-decoration: none;

    color: inherit;

    width: 100%;
    max-width: 100%;

    border-radius: 0;

    overflow: hidden;

    transition: transform 0.2s;

}

@media screen and (min-width: 388px) {
    .encart__link {
        max-width: 290px;

        flex: 1 1 23%;
    }
}
@media screen and (min-width: 768px) {
    .encart__link {
        max-width: 340px;

        flex: 1 1 48%;
    }
}
@media screen and (min-width: 1200px) {
    .encart__link {
        max-width: 290px;

        flex: 1 1 23%;
    }
}

.encart__link:hover .encart__bottom svg {
    opacity: 1;

    transition: opacity 150ms ease-in 100ms;
}

.encart__link:hover .encart__bottom {
    bottom: 0;

    transition: bottom 300ms ease-in;
}

.encart__link:hover .encart__inner .encart__bg-image img {
    opacity: 0.8;

    transition: opacity 150ms ease-in;
}

.encart__inner {
    position: relative;

    height: 100%;

    padding-bottom: 70px;

    background-size: cover;
    background-position: center;

    aspect-ratio: 27/25;
}

.encart__inner .encart__bg-image {
    display: flex;
    align-items: center;
    justify-content: center;

    background-color: #000;

    aspect-ratio: 29/22;
}

.encart__inner .encart__bg-image img {
    object-fit: cover;
    min-height: 100%;
    min-width: 100%;

    opacity: 1;

    transition: opacity 250ms ease-in;
}

.encart__watermark {
    position: absolute;
    z-index: 1;

    width: 100%;
    height: 100%;

    aspect-ratio: 29/22;

    background-color: #0D2342;
}

.encart__watermark::before  {
    opacity: 0.15;
}

.encart__bottom {
    position: absolute;
    bottom: -10px;
    left: 0;
    z-index: 2;

    padding: 1rem;
    width: 100%;
    min-height: 112px;

    box-sizing: border-box;

    text-align: center;
    font-weight: 600;

    transition: bottom 300ms ease-in;
}

.encart__bottom[class*=bg-color--] {
    padding: 1rem;
}

.encart__bottom:not(.bg-color--primary) {
    color: var(--color-primary)
}

.encart__bottom::before {
    content: '';
    position: absolute;
    left: 0;
    top: -45px;
    z-index: 1;

    height: 46px;
    width: 100%;

    background-position: center bottom -1px;
    background-repeat: no-repeat;
    background-size: contain;

    opacity: 1 !important;
}

@media screen and (min-width: 388px) and (max-width: 1199px) {
    .encart__bottom::before {
        top: -60px;
        height: 61px;
    }
}

.encart__bottom svg {
    width: 17px;
    
    opacity: 0;

    transition: opacity 250ms ease-in;
}

.encart__title p {
    font-weight: 600;
    line-height: 1;
}
.encart__subtitle {
    padding: 0 20px;
}

.encart__subtitle p {
    font-weight: 400;
    font-size: 1.6rem;
    line-height: 1;
}

.encart__watermark.bg-watermark--icons-casa1::before {
    background-size: 562px auto;
}

.encart__watermark.bg-watermark--icons-casa2::before {
    background-size: 565px auto;
}

.encart__watermark.bg-watermark--icons-casa3::before {
    background-size: 602px auto;
}


.bg-color--primary .encart__watermark {
    background-color: rgba(255,255,255,0.3);
}