.bato-categoryproducts {
    overflow-x: clip;
}

.bato-categoryproducts__inner {
    display: grid;
    align-items: stretch;
    grid-template-columns: repeat(12, 1fr);
    gap: 2rem;
}

.bato-categoryproducts__image {
    grid-column: span 5;
    position: relative;
    overflow: hidden;
}

.bato-categoryproducts__image img {
    position: absolute;
    inset: 0;
}

.bato-categoryproducts__content {
    grid-column: span 7;
}

.bato-categoryproducts__text {
    color: var(--color-gray-dark);
}

.bato-categoryproducts__header {    
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 2rem;
    margin-bottom: 1.2rem;
}

.bato-categoryproducts__title {
    line-height: 0.95;
}

.bato-categoryproducts__title span {
    display: block;
}

.bato-categoryproducts__link {
    margin: 0 3.5rem 1rem 0rem;
}

.bato-categoryproducts__list {
    -webkit-clip-path: inset(0 -100% 0 0);
    clip-path: inset(0 -100% 0 0);
}

.bato-categoryproducts .swiper {
    overflow: visible;
}

.bato-categoryproducts .products-item {
    max-width: 100%;
    width: 29.5rem;
}

@media screen and (max-width: 1024.9px) {
    .bato-categoryproducts__inner {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

    .bato-categoryproducts__image {
        aspect-ratio: 393/551;
        width: 60rem;
        max-width: 100%;
        margin-inline: auto;
    }

    .bato-categoryproducts__image img {
        position: static;
    }

    .bato-categoryproducts__list {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        -webkit-clip-path: unset;
        clip-path: unset;
    }

    .bato-categoryproducts__list .swiper {
        width: 100%;
    }
}

@media screen and (max-width: 767.9px) {
    .bato-categoryproducts__image {
        width: auto;
        max-width: unset;
        margin-inline: -2rem;
    }

    .bato-categoryproducts__content {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

    .bato-categoryproducts__header {
        display: contents;
        margin: 0;
    }

    .bato-categoryproducts__title  {
        order: -2;
    }

    .bato-categoryproducts__text {
        order: -1;
    }

    .bato-categoryproducts__link {
        margin: 0;
        margin-bottom: 1.5rem;
    }
}