.mosaics-block {
    display: grid;
    grid-template-columns: repeat(3, calc(100% / 3 + 16px / 3));
    margin: 32px 18.75%;
    row-gap: 32px;
}
.mosaic-item {
    color: var(--font-color);
    font-family: 'Montserrat';
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    border-radius: 16px;
    background: var(--color-white-2);
    border: solid 4px var(--color-white-1);
    transition: 0.4s ease-in-out;
    width: calc(100% - 64px);
}
.mosaic-item-img {
    width: 100%;
    height: auto;
    border-radius: 16px;
}
.mosaic-item-tilte {
    margin: 32px 0;
}
.mosaic-item:hover {
    cursor: pointer;
    transform: scale(1.01);
}
.choose {
    text-align: center;
    margin: 48px 0;
    font-family: 'Montserrat';
    font-weight: 900;
}

@media screen and (max-width: 1536px) {
    .mosaics-block {
        grid-template-columns: repeat(3, calc(100% / 3 + 16px * 0.8 / 3));
        margin: calc(32px * 0.8) 18.75%;
        row-gap: calc(32px * 0.8);
    }
    .mosaic-item {
        border-radius: calc(16px * 0.8);
        width: calc(100% - 64px * 0.8);
    }
    .mosaic-item-img {
        border-radius: calc(16px * 0.8);
    }
    .mosaic-item-tilte {
        margin: calc(32px * 0.8) 0;
    }
    .choose {
        text-align: center;
        margin: calc(48px * 0.8) 0;
    }
}
@media screen and (max-width: 414px) {
    .mosaics-block {
        display: block;
        margin: 0;
    }
    .mosaic-item {
        border-radius: 16px;
        margin: 16px;
        width: auto;
        display: block;
    }
    .mosaic-item-img {
        width: 100%;
        display: block;
        aspect-ratio: 1/1;
        border-radius: 16px;
    }
    .mosaic-item-tilte {
        margin: 16px 0;
    }
    .choose {
        margin: 32px 0;
    }
}