.choose-cheese-container {
    position: fixed;
    bottom: -100px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 3%;
    opacity: 0;
    transition: bottom 1s ease-out, opacity 0.5s ease-out;
}

.choose-cheese-container.active {
    bottom: 7%;
    opacity: 1;
}

.cheese-choice-button {
    background: linear-gradient(to right, #FFE680, #FAB041, #FFE680);
    border: none;
    width: 20%;
    border-radius: 16px;
    padding: 23px 0;
    cursor: pointer;
    color: #442F1E;
    font-weight: 600;
    font-size: 2.2vh;
    text-align: center;
    font-family: 'Circe Rounded', Arial, sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-sizing: border-box;
    line-height: 100%;
    position: relative;
    overflow: hidden;
}

.cheese-choice-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: #fff;
    transition: all 0.3s ease;
    z-index: 1;
}

.cheese-choice-button::after {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background: #fff;
    transition: all 0.3s ease;
    z-index: 1;
}

.cheese-choice-button:hover::before {
    left: 0;
}

.cheese-choice-button:hover::after {
    right: 0;
}

.cheese-choice-button span {
    position: relative;
    z-index: 2;
}

.petite {
    position: fixed;
    bottom: -100vh;
    top: auto;
    left: 10%;
    width: 43%;
    height: auto;
    opacity: 0;
    pointer-events: none;
}

.petite.active {
    opacity: 1;
}

@keyframes showPetite {
    from {
        bottom: -100vh;
        top: auto;
        left: 10%;
    }
    to {
        bottom: 13%;
        top: auto;
        left: 3%;
    }
}

@keyframes hidePetite {
    from {
        top: 13%;
        left: 3%;
    }
    to {
        top: -100vh;
        left: 10%;
    }
}

.camamber-box {
    position: fixed;
    bottom: -100vh;
    left: 10%;
    width: 40%;
    height: auto;
    opacity: 0;
    pointer-events: none;
}

.camamber-box.active {
    opacity: 1;
}

@keyframes showCamamberBox {
    from {
        bottom: -100vh;
        left: 19%;
        opacity: 1;
    }
    to {
        bottom: 18%;
        left: 28%;
        opacity: 1;
    }
}

@keyframes hideCamamberBox {
    from {
        bottom: 18%;
        left: 28%;
        opacity: 1;
    }
    to {
        bottom: -100vh;
        left: 19%;
        opacity: 1;
    }
}

.blue {
    position: fixed;
    bottom: 17%;
    left: 50%;
    width: 40%;
    height: auto;
    opacity: 0;
    pointer-events: none;
}  

.blue.active {
    opacity: 1;
}

@keyframes showBlue {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes hideBlue {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.fondant {
    position: fixed;
    bottom: 16%;
    left: 150%;
    width: 45%;
    height: auto;
    opacity: 0;
    pointer-events: none;
    transform: rotate(15deg);
}  

.fondant.active {
    opacity: 1;
}

@keyframes showFondant {
    from {
        left: 150%;
        opacity: 0;
    }
    to {
        left: 72%;
        opacity: 1;
    }
}

@keyframes hideFondant {
    from {
        left: 72%;
        opacity: 1;
    }
    to {
        left: 150%;
        opacity: 0;
    }
}

@media screen and (max-width: 2060px) {
    .petite {
        position: fixed;
        bottom: -100vh;
        top: auto;
        left: 10%;
        width: auto;
        height: 60%;
        opacity: 0;
        pointer-events: none;
    }
    
    .petite.active {
        opacity: 1;
    }
    
    @keyframes showPetite {
        from {
            bottom: -100vh;
            left: 10%;
        }
        to {
            bottom: 22%;
            left: 3%;
        }
    }
    
    @keyframes hidePetite {
        from {
            bottom: 22%;
            left: 3%;
        }
        to {
            bottom: -100vh;
            left: 10%;
        }
    }
    
    .camamber-box {
        position: fixed;
        bottom: -100vh;
        left: 10%;
        width: auto;
        height: 52%;
        opacity: 0;
        pointer-events: none;
    }
    
    .camamber-box.active {
        opacity: 1;
    }
    
    @keyframes showCamamberBox {
        from {
            bottom: -100vh;
            left: 19%;
            opacity: 1;
        }
        to {
            bottom: 18%;
            left: 28%;
            opacity: 1;
        }
    }
    
    @keyframes hideCamamberBox {
        from {
            bottom: 18%;
            left: 28%;
            opacity: 1;
        }
        to {
            bottom: -100vh;
            left: 19%;
            opacity: 1;
        }
    }
    
    .blue {
        position: fixed;
        bottom: 26%;
        left: 50%;
        width: auto;
        height: 52%;
        opacity: 0;
        pointer-events: none;
    }  
    
    .blue.active {
        opacity: 1;
    }
    
    @keyframes showBlue {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    
    @keyframes hideBlue {
        from {
            opacity: 1;
        }
        to {
            opacity: 0;
        }
    }
    
    .fondant {
        position: fixed;
        bottom: 16%;
        left: 150%;
        width: auto;
        height: 48%;
        opacity: 0;
        pointer-events: none;
        transform: rotate(15deg);
    }  
    
    .fondant.active {
        opacity: 1;
    }
    
    @keyframes showFondant {
        from {
            left: 150%;
            opacity: 0;
        }
        to {
            left: 72%;
            opacity: 1;
        }
    }
    
    @keyframes hideFondant {
        from {
            left: 72%;
            opacity: 1;
        }
        to {
            left: 150%;
            opacity: 0;
        }
    }
}

.cheese-text-container {
    position: fixed;
    top: -100vh;
    left: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: translateX(-50%);
    text-align: center;
    opacity: 0;
    transition: top 1s ease-out, opacity 0.5s ease-out;
}

.cheese-text-container.active {
    top: 10%;
    opacity: 1;
}

.cheese-title {
    max-width: 100%;
    font-family: 'Circe Rounded', Arial, sans-serif;
    font-size: 3.5vh;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 10px;
}

.cheese-subtitle {
    font-family: 'Circe Rounded', Arial, sans-serif;
    font-size: 2.4vh;
    color: #fff;
}

.selected-cheese {
    position: fixed;
    display: flex;
    justify-content: flex-start;
    bottom: 22%;
    left: 6%;
    height: 23%;
    width: fit-content;
    max-width: 25%;
    opacity: 0;
    transition: all 0.5s ease-out;
    z-index: 54;
    pointer-events: none;
}

.selected-cheese[data-cheese="petite"] {
    bottom: 20.5%;
    left: 4.7%;
}

@media screen and (max-width: 2060px) {
    .selected-cheese[data-cheese="petite"] {
        bottom: 21%;
        left: 4.7%;
    }
}

.selected-cheese[data-cheese="camamber"] {
    transform: rotate(-25deg);
    bottom: 25%;
    left: 4.4%;
}

@media screen and (max-width: 2060px) {
    .selected-cheese[data-cheese="camamber"] {
        bottom: 25.6%;
    }
}

.selected-cheese[data-cheese="blue"] {
    bottom: 22.5%;
    left: 6.5%;
}

.selected-cheese[data-cheese="fondant"] {
    left: 4.5%;
}

.selected-cheese.active {
    opacity: 1;
}

.selected-cheese-image {
    width: fit-content;
    height: 100%;
    object-fit: contain;
}

.selected-cheese-image[data-cheese="fondant"] {
    content: url(../images/fondant-shadow.webp);
}

.cheese-info-card {
    display: none;
    position: fixed;
    top: -100px;
    left: 50%;
    transform: translateX(-50%);
    background: #CC0102;
    border-radius: 16px;
    border-left: 8px solid #FFE26B;
    padding: 20px;
    color: #fff;
    text-align: left;
    opacity: 0;
    transition: all 0.5s ease-out;
    z-index: 53;
    width: 70%;
    max-width: 400px;
}

.cheese-info-card.active {
    top: 80%;
    opacity: 1;
}

.cheese-info-card-desktop {
    position: fixed;
    bottom: 10%;
    left: 6%;
    padding: 20px;
    background: #CC0102;
    transform: translateY(100%);
    opacity: 0;
    border-radius: 16px;
    border-left: 8px solid #FFE26B;
    color: #fff;
    text-align: left;
    transition: all 0.5s ease-out;
    z-index: 53;
    min-width: 23%;
    max-width: 30%;
    pointer-events: none;
}

.cheese-info-card-desktop.active {
    transform: translateY(0);
    opacity: 1;
}

.selected-cheese-text-desktop {
    width: 24%;
    position: fixed;
    bottom: -50%;
    right: 13%;
    color: #fff;
    font-size: 2.5vh;
    text-align: left;
    transform: translateY(100%);
    opacity: 0;
    transition: transform 0.5s ease-out, opacity 0.5s ease-out;
    z-index: 100;
    pointer-events: none;
}

.selected-cheese-text-desktop.active {
    bottom: 5%;
    transform: translateY(0);
    opacity: 1;
}

.cheese-info-name {
    font-family: 'Circe Rounded', Arial, sans-serif;
    font-size: 3.5vh;
    font-weight: 600;
    margin: 0 0 6px 0;
    text-align: left;
    text-transform: uppercase;
    display: flex;
    align-items: baseline;
    gap: 5px;
}

.cheese-info-details {
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: left;
}

.cheese-info-maturation,
.cheese-info-fat {
    font-family: 'Circe Rounded', Arial, sans-serif;
    font-size: 2.4vh;
    margin: 0;
    text-align: left;
}

.cheese-info-maturation span,
.cheese-info-fat span {
    color: #FFE26B;
}

.header-back-arrow {
    display: none;
    position: absolute;
    left: 20px;
    top: 35%;
    transform: translateY(-50%);
    width: 20px;
    height: 35px;
    opacity: 0;
    transition: opacity 0.5s ease-out;
    cursor: pointer;
    z-index: 56;
}

.header-back-arrow.active {
    opacity: 1;
}

.selected-cheese-text {
    display: none;
    position: fixed;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: #fff;
    font-size: 18px;
    opacity: 0;
    transition: bottom 0.5s ease-out, opacity 0.5s ease-out;
    z-index: 100;
    width: 68%;
    max-width: 400px;
    font-weight: 300;
}

.selected-cheese-text.active {
    bottom: 20px;
    opacity: 1;
}

.selected-cheese-text p {
    margin: 0;
    line-height: 1.4;
}

.cheese-images-grid {
    position: fixed;
    left: -100%;
    bottom: 80px;
    width: 70vh;
    height: 70vh;
    opacity: 0;
    transition: right 0.5s ease-out, opacity 0.5s ease-out;
    z-index: 53;
    pointer-events: none;
}

.cheese-images-grid.active {
    left: 50%;
    top: 17%;
    transform: translateX(-50%);
    opacity: 1;
}

.cheese-images-grid.active[data-cheese="petite"] {
    left: 30%;
    top: 18%;
    width: 70vh;
    height: 70vh;
    transform: rotate(-86deg);
}

.cheese-images-grid.active[data-cheese="camamber"] {
    left: 30%;
    top: 18%;
    width: 70vh;
    height: 70vh;
    transform: rotate(-86deg);
}

.cheese-images-grid.active[data-cheese="blue"] {
    left: 33%;
    top: 23%;
    right: auto;
    width: 36%;
    transform: rotate(-33deg);
    z-index: 52;
}

.cheese-images-grid.active.cutting[data-cheese="blue"] {
    left: 50%;
    top: 29%;
    right: auto;
    width: 36%;
    transform: rotate(-40deg);
}

.cheese-images-grid.active[data-cheese="fondant"] {
    top: 6%;
    left: 38%;
    width: 65vh;
    height: 65vh;
    transform: translateX(-35%) rotate(59deg);
}

.cheese-images-grid.active.cutting[data-cheese="fondant"] {
    top: 7%;
    left: 31%;
    right: auto;
    z-index: 52;
}

.cheese-grid-image {
    position: absolute;
    width: auto;
    height: auto;
    border-radius: 8px;
    object-fit: cover;
}

/* Стили для изображений Бри */
.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(1) {
    bottom: 50%;
    left: 50%;
    height: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(2) {
    bottom: 50%;
    left: 49%;
    width: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(3) {
    top: 49%;
    left: 49%;
    width: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(4) {
    top: 49%;
    left: 50%;
    height: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(5) {
    top: 49%;
    right: 49%;
    height: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(6) {
    top: 48%;
    right: 48%;
    width: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(7) {
    bottom: 51%;
    right: 48%;
    width: 50%;
}

.cheese-images-grid[data-cheese="petite"] .cheese-grid-image:nth-child(8) {
    bottom: 50%;
    right: 49%;
    height: 50%;
}

/* Стили для изображений Камамбера */
.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(1) {
    bottom: 50%;
    left: 50%;
    height: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(2) {
    bottom: 50%;
    left: 50%;
    width: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(3) {
    top: 49%;
    left: 50%;
    width: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(4) {
    top: 49%;
    left: 50%;
    height: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(5) {
    top: 49%;
    right: 49%;
    height: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(6) {
    top: 49%;
    right: 49%;
    width: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(7) {
    bottom: 50%;
    right: 49%;
    width: 50%;
}

.cheese-images-grid[data-cheese="camamber"] .cheese-grid-image:nth-child(8) {
    bottom: 50%;
    right: 49%;
    height: 50%;
}

/* Стили для изображений Блю */
.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(1) {
    top: 0%;
    left: 10%;
    width: 40%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(2) {
    top: 0%;
    right: 9%;
    width: 42%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(3) {
    top: 18%;
    left: 10%;
    width: 40%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(4) {
    top: 18%;
    right: 10%;
    width: 41%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(5) {
    top: 36%;
    left: 10%;
    width: 40%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(6) {
    top: 36%;
    right: 10%;
    width: 40%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(7) {
    top: 54%;
    left: 10%;
    width: 40%;
}

.cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(8) {
    top: 54%;
    right: 10%;
    width: 40%;
}

/* Стили для изображений Фонданта */
.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(1) {
    top: 0;
    left: 50%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(2) {
    top: 12%;
    left: 44%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(3) {
    top: 24%;
    left: 41%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(4) {
    top: 36%;
    left: 40%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(5) {
    top: 48%;
    left: 40%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(6) {
    top: 60%;
    left: 41%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(7) {
    top: 72%;
    left: 44.5%;
    height: 12.5%;
}

.cheese-images-grid[data-cheese="fondant"] .cheese-grid-image:nth-child(8) {
    top: 84%;
    left: 51%;
    height: 11.6%;
}

.knife-image {
    position: fixed;
    right: -200%;
    top: 65%;
    transform: translateY(-50%);
    width: auto;
    height: 90vh;
    opacity: 0;
    z-index: -1;
    pointer-events: none;
    transition: none;
    cursor: pointer;
}

.knife-image.active {
    padding: 0px 100px;
    right: 5%;
    opacity: 1;
    transform: translateY(-50%) rotate(-30deg);
    z-index: 100;
    pointer-events: auto;
}

.knife-image.smooth {
    transition: transform 0.3s ease-out;
}

.knife-image.fixed {
    transition: transform 0.2s ease-out;
}

.paw-image {
    position: fixed;
    right: -100%;
    top: 80%;
    transform: translateY(-50%);
    width: auto;
    height: 12vh;
    opacity: 0;
    transition: right 0.5s ease-out, opacity 0.5s ease-out;
    z-index: 99;
    animation: pawFloat 2s ease-in-out infinite;
}

.paw-image.active {
    right: 5%;
    opacity: 1;
    z-index: 101;
    pointer-events: none;
}

@keyframes pawFloat {
    0% {
        transform: translateY(-50%) translateX(0) translateY(0);
    }
    50% {
        transform: translateY(-50%) translateX(-10px) translateY(-10px);
    }
    100% {
        transform: translateY(-50%) translateX(0) translateY(0);
    }
}

/* Стили для изображений Бри при движении ножа */
.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(1) {
    bottom: 119%;
    left: 24%;
    height: 40%;
    transform: rotate(-68deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(2) {
    bottom: 133%;
    left: 68%;
    width: 40%;
    transform: rotate(133deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(3) {
    top: 30%;
    left: 68%;
    width: 40%;
    transform: rotate(-11deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(4) {
    top: 36%;
    left: 23%;
    height: 40%;
    transform: rotate(218deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(5) {
    top: 64%;
    right: -17%;
    height: 40%;
    transform: rotate(121deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(6) {
    top: 98%;
    right: 38%;
    width: 40%;
    transform: rotate(-8deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(7) {
    bottom: 78%;
    right: 51%;
    width: 40%;
    transform: rotate(18deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(8) {
    bottom: 86%;
    right: -6%;
    height: 40%;
    transform: rotate(85deg);
    transition: all 1s ease-in-out;
}

/* Стили для изображений камамбера при движении ножа */
.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(1) {
    bottom: 119%;
    left: 24%;
    height: 40%;
    transform: rotate(-68deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(2) {
    bottom: 133%;
    left: 68%;
    width: 40%;
    transform: rotate(133deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(3) {
    top: 30%;
    left: 68%;
    width: 40%;
    transform: rotate(-11deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(4) {
    top: 36%;
    left: 23%;
    height: 40%;
    transform: rotate(218deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(5) {
    top: 64%;
    right: -17%;
    height: 40%;
    transform: rotate(121deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(6) {
    top: 98%;
    right: 38%;
    width: 40%;
    transform: rotate(-8deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(7) {
    bottom: 78%;
    right: 51%;
    width: 40%;
    transform: rotate(18deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(8) {
    bottom: 86%;
    right: -6%;
    height: 40%;
    transform: rotate(85deg);
    transition: all 1s ease-in-out;
}

/* Стили для изображений BLUE при движении ножа */
.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(1) {
    top: -76%;
    left: -28%;
    width: 45%;
    transform: rotate(-90deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(2) {
    top: -46%;
    right: 38%;
    width: 45%;
    transform: rotate(-30deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(3) {
    top: -23%;
    left: -63%;
    width: 48%;
    transform: rotate(-11deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(4) {
    top: -16%;
    right: 16%;
    width: 45%;
    transform: rotate(-9deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(5) {
    top: 30%;
    left: -21%;
    width: 45%;
    transform: rotate(-5deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(6) {
    top: 18%;
    right: -31%;
    width: 45%;
    transform: rotate(13deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(7) {
    top: 34%;
    left: 28%;
    width: 45%;
    transform: rotate(71deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(8) {
    top: 95%;
    right: -9%;
    width: 45%;
    transform: rotate(-76deg);
    transition: all 1s ease-in-out;
}

/* Стили для изображений fondant при движении ножа */
.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(1) {
    top: -72%;
    left: 73%;
    height: 12.5%;
    transform: rotate(-84deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(2) {
    top: -23%;
    left: 42%;
    height: 12.5%;
    transform: rotate(-97deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(3) {
    top: 1%;
    left: 138%;
    height: 12.5%;
    transform: rotate(0deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(4) {
    top: -46%;
    left: 112%;
    height: 12.5%;
    transform: rotate(-27deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(5) {
    top: 1%;
    left: 14%;
    height: 12.5%;
    transform: rotate(60deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(6) {
    top: 85%;
    left: 42%;
    height: 12.5%;
    transform: rotate(-100deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(7) {
    top: 70%;
    left: -24%;
    height: 12.5%;
    transform: rotate(-44deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(8) {
    top: 46%;
    left: 106%;
    height: 11.6%;
    transform: rotate(-80deg);
    transition: all 1s ease-in-out;
}

@media screen and (max-width: 1600px) {
    .cheese-info-card-desktop {
        max-width: 40%;
    }
}

@media screen and (max-width: 1500px) {
    .petite {
        height: 58%;
    }

    .camamber-box {
        height: 49%;
        /* top: 28%; */
    }

    .blue {
        left: 50%;
        height: 49%;
    }

    .fondant {
        height: 45%;
    }

    /* Стили для изображений Блю */
    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(1) {
        top: 0%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(2) {
        top: 0%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(3) {
        top: 17%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(4) {
        top: 17%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(5) {
        top: 34%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(6) {
        top: 34%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(7) {
        top: 51%;
    }

    .cheese-images-grid[data-cheese="blue"] .cheese-grid-image:nth-child(8) {
        top: 51%;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(4) {
        left: 103%;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(7) {
        top: 58%;
        left: -11%;
    }
}

@media screen and (max-width: 1400px) {
    .fondant {
        height: 48%;
    }
}
    
@media screen and (max-width: 1050px) {

    .cheese-text-container.active {
        width: 80%;
        top: 15%;
    }

    .cheese-info-card-desktop {
        bottom: 70%;
        left: 35%;
        max-width: 55%;
    }
    
    .selected-cheese {
        display: block;
        max-width: auto;
        bottom: 5%;
    }
    
    .selected-cheese[data-cheese="petite"] {
        left: 6%;
    }
    
    .selected-cheese[data-cheese="camamber"] {
        left: 6%;
        bottom: 6%;
    }
    
    .selected-cheese[data-cheese="blue"] {
        left: 6%;
        bottom: 9%;
    }
    
    .selected-cheese[data-cheese="fondant"] {
        left: 4%;
    }

    /* .cheese-images-grid.active[data-cheese="petite"] {
        left: 20%;
        top: 40%;
        width: 60vw;
        height: 60vw;
        transform: rotate(0deg);
    }

    .cheese-images-grid.active[data-cheese="camamber"] {
        left: 20%;
        top: 40%;
        width: 60vw;
        height: 60vw;
        transform: rotate(0deg);
    } */

    .selected-cheese-text-desktop.active {
        width: 55%;
        font-size: 2vh;
        pointer-events: none;
    }

    .knife-image {
        right: -200%;
        top: 50%;
        height: 55vh;
    }

    .knife-image.active {
        opacity: 1;
        right: 14%;
        top: 59%;
        padding: 0;
        transform: translateY(-50%) rotate(3deg);
        z-index: 100;
    }
    
    .paw-image.active {
        width: 10%;
        height: auto;
        opacity: 1;
        right: 1%;
        top: 70%;
    }
    
    .selected-cheese {
        pointer-events: none;
        max-width: none;
    }

    .petite {
        position: fixed;
        bottom: -100vh;
        top: auto;
        left: 10%;
        width: auto;
        height: 25%;
        opacity: 0;
    }

    @keyframes showPetiteTablet {
        from {
            bottom: -100vh;
            top: auto;
            left: 10%;
        }
        to {
            bottom: 13%;
            top: auto;
            left: 3%;
        }
    }
    
    @keyframes hidePetiteTablet {
        from {
            bottom: 13%;
            left: 3%;
        }
        to {
            bottom: -100vh;
            top: auto;
            left: 10%;
        }
    }

    .camamber-box {
        position: fixed;
        bottom: -100vh;
        left: 10%;
        width: auto;
        height: 22%;
        opacity: 0;
    }
    

    @keyframes showCamamberBoxTablet {
        from {
            bottom: -100vh;
            left: 19%;
            opacity: 1;
        }
        to {
            bottom: 21%;
            left: 28%;
            opacity: 1;
        }
    }
    
    @keyframes hideCamamberBoxTablet {
        from {
            bottom: 21%;
            left: 28%;
            opacity: 1;
        }
        to {
            bottom: -100vh;
            left: 19%;
            opacity: 1;
        }
    }

    .blue {
        position: fixed;
        bottom: 21%;
        left: 49%;
        width: auto;
        height: 21%;
        opacity: 0;
    }

    @keyframes showBlueTablet {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    
    @keyframes hideBlueTablet {
        from {
            opacity: 1;
        }
        to {
            opacity: 0;
        }
    }

    .fondant {
        position: fixed;
        bottom: 21%;
        right: -30%;
        width: auto;
        height: 20%;
        opacity: 0;
    }

    @keyframes showFondantTablet {
        from {
            right: -30%;
            opacity: 0;
        }
        to {
            right: -2%;
            opacity: 1;
        }
    }
    
    @keyframes hideFondantTablet {
        from {
            right: -2%;
            opacity: 1;
        }
        to {
            right: -30%;
            opacity: 0;
        }
    }

    .cheese-images-grid.active {
        transition: left 0.5s ease-out, opacity 0.5s ease-out;
        left: 43%;
        top: 40%;
        transform: translateX(-50%);
    }

    .cheese-images-grid.active[data-cheese="petite"] {
        left: 20%;
        top: 40%;
        width: 60vw;
        height: 60vw;
        transform: rotate(0deg);
    }
    
    .cheese-images-grid.active[data-cheese="camamber"] {
        left: 20%;
        top: 40%;
        width: 60vw;
        height: 60vw;
        transform: rotate(0deg);
    }

    .cheese-images-grid.active[data-cheese="blue"] {
        left: 39%;
        top: 45%;
        width: 38vh;
        height: 38vh;
        transform: translateX(-50%) rotate(50deg);
    }

    .cheese-images-grid.active.cutting[data-cheese="blue"] {
        left: 5%;
        top: 48%;
        width: 38vh;
        height: 38vh;
        transform: rotate(50deg);
        animation: blueCutting 0.0001s ease-in-out;
    }

    @keyframes blueCutting {
        0% {
            left: 39%;
        }
        100% {
            left: 5%;
        }
    }

    .cheese-images-grid.active[data-cheese="fondant"] {
        top: 38%;
        width: 38vh;
        height: 38vh;
        transform: translateX(-52%) rotate(45deg);
    }

    .cheese-images-grid.active.cutting[data-cheese="fondant"] {
        top: 47%;
        left: 13%;
        right: auto;
        transform: rotate(-48deg);
        animation: fondantCutting 0.0001s ease-in-out;
    }

    @keyframes fondantCutting {
        0% {
            left: 44%;
        }
        100% {
            left: 13%;
        }
    }

    /* Стили для изображений Бри при движении ножа */
    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(1) {
        bottom: 119%;
        left: 11%;
        height: 40%;
        transform: rotate(-68deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(2) {
        bottom: 133%;
        left: 102%;
        width: 40%;
        transform: rotate(133deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(3) {
        top: 30%;
        left: 72%;
        width: 40%;
        transform: rotate(-11deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(4) {
        top: 36%;
        left: -3%;
        height: 40%;
        transform: rotate(218deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(5) {
        top: 64%;
        right: -28%;
        height: 40%;
        transform: rotate(121deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(6) {
        top: 98%;
        right: 57%;
        width: 40%;
        transform: rotate(-8deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(7) {
        bottom: 78%;
        right: 61%;
        width: 40%;
        transform: rotate(18deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(8) {
        bottom: 86%;
        right: -6%;
        height: 40%;
        transform: rotate(85deg);
        transition: all 1s ease-in-out;
    }

    /* Стили для изображений камамбера при движении ножа */
    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(1) {
        bottom: 119%;
        left: 11%;
        height: 40%;
        transform: rotate(-68deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(2) {
        bottom: 133%;
        left: 102%;
        width: 40%;
        transform: rotate(133deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(3) {
        top: 30%;
        left: 72%;
        width: 40%;
        transform: rotate(-11deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(4) {
        top: 36%;
        left: -3%;
        height: 40%;
        transform: rotate(218deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(5) {
        top: 64%;
        right: -28%;
        height: 40%;
        transform: rotate(121deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(6) {
        top: 98%;
        right: 57%;
        width: 40%;
        transform: rotate(-8deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(7) {
        bottom: 78%;
        right: 61%;
        width: 40%;
        transform: rotate(18deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(8) {
        bottom: 86%;
        right: -6%;
        height: 40%;
        transform: rotate(85deg);
        transition: all 1s ease-in-out;
    }

    /* Стили для изображений BLUE при движении ножа */
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(1) {
        top: -109%;
        left: -5%;
        width: 42%;
        transform: rotate(-90deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(2) {
        top: -83%;
        right: 6%;
        width: 42%;
        transform: rotate(-19deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(3) {
        top: -20%;
        left: -69%;
        width: 40%;
        transform: rotate(-11deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(4) {
        top: -55%;
        right: -29%;
        width: 41%;
        transform: rotate(-9deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(5) {
        top: 27%;
        left: -13%;
        width: 40%;
        transform: rotate(-5deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(6) {
        top: -11%;
        right: -73%;
        width: 40%;
        transform: rotate(13deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(7) {
        top: 69%;
        left: 25%;
        width: 40%;
        transform: rotate(71deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(8) {
        top: 86%;
        right: -15%;
        width: 40%;
        transform: rotate(-76deg);
        transition: all 1s ease-in-out;
    }

    /* Стили для изображений fondant при движении ножа */
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(1) {
        top: -72%;
        left: 73%;
        height: 12.5%;
        transform: rotate(-84deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(2) {
        top: -23%;
        left: 42%;
        height: 12.5%;
        transform: rotate(-97deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(3) {
        top: 39%;
        left: 160%;
        height: 12.5%;
        transform: rotate(0deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(4) {
        top: -46%;
        left: 145%;
        height: 12.5%;
        transform: rotate(-27deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(5) {
        top: 2%;
        left: -4%;
        height: 12.5%;
        transform: rotate(60deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(6) {
        top: 126%;
        left: 42%;
        height: 12.5%;
        transform: rotate(-100deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(7) {
        top: 70%;
        left: -48%;
        height: 12.5%;
        transform: rotate(-44deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(8) {
        top: 83%;
        left: 121%;
        height: 11.6%;
        transform: rotate(-80deg);
        transition: all 1s ease-in-out;
    }
}

@media screen and (max-width: 768px) {
    .choose-cheese-container {
        display: none !important;
    }
    
    /* Скрываем только изображения вне модального окна */
    .cheese-image:not(.cheese-modal .cheese-image) {
        display: none !important;
    }

    .mobile-slider {
        position: fixed;
        bottom: 50px;
        left: 0;
        width: 100%;
        height: 70vh;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.5s ease-out;
    }

    .mobile-slider.active {
        opacity: 1;
    }

    .slider-container {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: relative;
    }

    .slider-track {
        display: flex;
        transition: transform 0.5s ease-out;
        height: 100%;
    }

    .slide {
        min-width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .slide-image {
        width: auto;
        height: 70%;
        object-fit: contain;
        margin-bottom: 20px;
    }

    .slide-image.petite-slider {
        position: absolute;
        left: 15%;
        height: 95%;
        object-fit: contain;
    }

    .slide-image.camamber-box-slider {
        position: absolute;
        left: 122%;
        height: 82%;
        object-fit: contain;
    }

    .slide-image.blue-slider {
        position: absolute;
        left: 220%;
        height: 83%;
        object-fit: contain;
    }

    .slide-image.fondant-slider {
        position: absolute;
        left: 310%;
        width: 90%;
        height: 89%;
        object-fit: contain;
    }

    .slide-button {
        position: absolute;
        bottom: 0%;
        background: linear-gradient(to right, #FFE680, #FAB041, #FFE680);
        border: none;
        border-radius: 16px;
        padding: 15px 10px;
        cursor: pointer;
        color: #442F1E;
        font-weight: 600;
        font-size: 18px;
        text-align: center;
        font-family: 'Circe Rounded', Arial, sans-serif;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 85%;
        max-width: 300px;
    }

    .slider-arrow {
        position: absolute;
        top: 60%;
        transform: translateY(-50%);
        background: none;
        border: none;
        cursor: pointer;
        padding: 10px;
        z-index: 5;
    }

    .slider-arrow img {
        width: 20px;
        height: 35px;
        z-index: 5;
    }

    .slider-arrow-left {
        left: 10px;
    }

    .slider-arrow-right {
        right: 10px;
    }

    .cheese-text-container.active {
        width: 100%;
        top: 18%;
    }

    .cheese-title {
        max-width: 90%;
        font-size: 3vh;
    }
    
    .cheese-subtitle {
        width: 60%;
        font-size: 2.5vh;
        font-weight: 400;
        margin: 0;
    }

    .selected-cheese {
        position: fixed;
        top: 20px;
        right: -100px;
        left: auto;
        width: 80px;
        height: 80px;
        opacity: 0;
        transition: all 0.5s ease-out;
        z-index: 54;
    }

    .selected-cheese.active {
        right: -80%;
        top: 3%;
        bottom: auto;
        width: auto;
        height: 20%;
        opacity: 1;
    }

    .selected-cheese.active[data-cheese="camamber"] {
        top: 0%;
    }

    .selected-cheese.active[data-cheese="fondant"] {
        right: -63%;
    }
    
    .selected-cheese-image {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .cheese-info-card {
        display: block;
        width: 70%;
        padding: 15px;
    }

    .cheese-info-name {
        font-size: 2.5vh;
        margin: 0 0 6px 0;
    }

    .cheese-info-maturation,
    .cheese-info-fat {
        font-size: 2.6vh;
    }

    .cheese-info-card.active {
        top: 20%;
    }

    .header-back-arrow {
        display: block;
        left: 5%;
        width: 4%;
        height: 35%;
    }

    .selected-cheese-text {
        display: block;
        font-size: 2.3vh;
    }
    
    .selected-cheese-text.active {
        bottom: 2%;
        font-weight: 200;
    }

    .cheese-images-grid {
        width: 85vw;
        height: 85vw;
        max-width: 50vh;
        max-height: 50vh;
        left: -200%;
        z-index: 3;
    }
    
    .cheese-images-grid.active {
        transition: left 0.5s ease-out, opacity 0.5s ease-out;
        left: 43%;
        top: 40%;
        transform: translateX(-50%);
    }

    .cheese-images-grid.active[data-cheese="petite"] {
        left: 20%;
        top: 40%;
        width: 85vw;
        height: 85vw;
        transform: rotate(0deg);
    }

    .cheese-images-grid.active.cutting[data-cheese="petite"] {
        left: 5%;
    }
    
    .cheese-images-grid.active[data-cheese="camamber"] {
        left: 20%;
        top: 40%;
        width: 85vw;
        height: 85vw;
        transform: rotate(0deg);
    }

    .cheese-images-grid.active.cutting[data-cheese="camamber"] {
        left: 5%;
    }

    .cheese-images-grid.active[data-cheese="blue"] {
        left: 39%;
        top: 45%;
        width: 38vh;
        height: 38vh;
        transform: translateX(-50%) rotate(50deg);
    }

    .cheese-images-grid.active.cutting[data-cheese="blue"] {
        left: 5%;
        top: 48%;
        width: 38vh;
        height: 38vh;
        transform: rotate(50deg);
        animation: blueCutting 0.0001s ease-in-out;
    }

    @keyframes blueCutting {
        0% {
            left: 39%;
        }
        100% {
            left: 5%;
        }
    }

    .cheese-images-grid.active[data-cheese="fondant"] {
        top: 38%;
        width: 38vh;
        height: 38vh;
        transform: translateX(-52%) rotate(45deg);
    }

    .cheese-images-grid.active.cutting[data-cheese="fondant"] {
        top: 47%;
        left: 13%;
        right: auto;
        transform: rotate(-48deg);
        animation: fondantCutting 0.0001s ease-in-out;
    }

    @keyframes fondantCutting {
        0% {
            left: 44%;
        }
        100% {
            left: 13%;
        }
    }

    /* Стили для изображений Бри при движении ножа */
.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(1) {
    bottom: 119%;
    left: 11%;
    height: 40%;
    transform: rotate(-68deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(2) {
    bottom: 133%;
    left: 102%;
    width: 40%;
    transform: rotate(133deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(3) {
    top: 30%;
    left: 72%;
    width: 40%;
    transform: rotate(-11deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(4) {
    top: 36%;
    left: -3%;
    height: 40%;
    transform: rotate(218deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(5) {
    top: 64%;
    right: -28%;
    height: 40%;
    transform: rotate(121deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(6) {
    top: 98%;
    right: 57%;
    width: 40%;
    transform: rotate(-8deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(7) {
    bottom: 78%;
    right: 61%;
    width: 40%;
    transform: rotate(18deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(8) {
    bottom: 86%;
    right: -6%;
    height: 40%;
    transform: rotate(85deg);
    transition: all 1s ease-in-out;
}

/* Стили для изображений камамбера при движении ножа */
.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(1) {
    bottom: 119%;
    left: 11%;
    height: 40%;
    transform: rotate(-68deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(2) {
    bottom: 133%;
    left: 102%;
    width: 40%;
    transform: rotate(133deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(3) {
    top: 30%;
    left: 72%;
    width: 40%;
    transform: rotate(-11deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(4) {
    top: 36%;
    left: -3%;
    height: 40%;
    transform: rotate(218deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(5) {
    top: 64%;
    right: -28%;
    height: 40%;
    transform: rotate(121deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(6) {
    top: 98%;
    right: 57%;
    width: 40%;
    transform: rotate(-8deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(7) {
    bottom: 78%;
    right: 61%;
    width: 40%;
    transform: rotate(18deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(8) {
    bottom: 86%;
    right: -6%;
    height: 40%;
    transform: rotate(85deg);
    transition: all 1s ease-in-out;
}

/* Стили для изображений BLUE при движении ножа */
.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(1) {
    top: -109%;
    left: -5%;
    width: 42%;
    transform: rotate(-90deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(2) {
    top: -83%;
    right: 6%;
    width: 42%;
    transform: rotate(-19deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(3) {
    top: -20%;
    left: -69%;
    width: 40%;
    transform: rotate(-11deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(4) {
    top: -55%;
    right: -29%;
    width: 41%;
    transform: rotate(-9deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(5) {
    top: 27%;
    left: -13%;
    width: 40%;
    transform: rotate(-5deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(6) {
    top: -11%;
    right: -73%;
    width: 40%;
    transform: rotate(13deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(7) {
    top: 69%;
    left: 25%;
    width: 40%;
    transform: rotate(71deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(8) {
    top: 86%;
    right: -15%;
    width: 40%;
    transform: rotate(-76deg);
    transition: all 1s ease-in-out;
}

/* Стили для изображений fondant при движении ножа */
.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(1) {
    top: -72%;
    left: 73%;
    height: 12.5%;
    transform: rotate(-84deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(2) {
    top: -23%;
    left: 42%;
    height: 12.5%;
    transform: rotate(-97deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(3) {
    top: 39%;
    left: 160%;
    height: 12.5%;
    transform: rotate(0deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(4) {
    top: -46%;
    left: 145%;
    height: 12.5%;
    transform: rotate(-27deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(5) {
    top: 2%;
    left: -4%;
    height: 12.5%;
    transform: rotate(60deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(6) {
    top: 126%;
    left: 42%;
    height: 12.5%;
    transform: rotate(-100deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(7) {
    top: 70%;
    left: -48%;
    height: 12.5%;
    transform: rotate(-44deg);
    transition: all 1s ease-in-out;
}

.cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(8) {
    top: 83%;
    left: 121%;
    height: 11.6%;
    transform: rotate(-80deg);
    transition: all 1s ease-in-out;
}
    
    .cheese-grid-image {
        border-radius: 4px;
    }

    .knife-image {
        position: fixed;
        right: -200%;
        top: 50%;
        transform: translateY(-50%);
        width: auto;
        height: 70vh;
        opacity: 0;
        transition: all 1s ease-in-out;
        z-index: -1;
        pointer-events: none;
        padding: 0px;
    }
    
    .knife-image.active {
        opacity: 1;
        right: 3%;
        top: 70%;
        padding: 0;
        transform: translateY(-50%) rotate(3deg);
        z-index: 100;
        pointer-events: auto;
    }

    .paw-image {
        position: fixed;
        right: -100%;
        top: 90%;
        transform: translateY(-50%);
        width: auto;
        height: 10vh;
        opacity: 0;
        transition: right 0.5s ease-out, opacity 0.5s ease-out;
        z-index: 101;
        animation: pawFloat 2s ease-in-out infinite;
    }
    
    .paw-image.active {
        opacity: 1;
        right: 1%;
        top: 90%;
    }
}

@media (max-width: 768px) {
    .cheese-info-card-desktop,
    .selected-cheese-text-desktop {
        display: none;
    }
}


@media (max-width: 600px) {
    .cheese-text-container.active {
        width: 100%;
        top: 11%;
    }

    .slide-image.petite-slider {
        position: absolute;
        left: 11%;
        /* height: 90%; */
        height: auto;
        width: 135%;
        object-fit: contain;
    }

    .slide-image.camamber-box-slider {
        position: absolute;
        left: 116%;
        /* height: 80%; */
        height: auto;
        width: 135%;
        object-fit: contain;
    }

    .slide-image.blue-slider {
        position: absolute;
        left: 214%;
        /* height: 83%; */
        height: auto;
        width: 135%;
        object-fit: contain;
    }

    .slide-image.fondant-slider {
        position: absolute;
        left: 310%;
        width: 90%;
        height: 75%;
        object-fit: contain;
    }

    .cheese-images-grid.active[data-cheese="petite"] {
        left: 5%;
        top: 40%;
    }
    
    .cheese-images-grid.active[data-cheese="camamber"] {
        left: 5%;
        top: 40%;
    }

    .cheese-images-grid.active[data-cheese="blue"] {
        left: 39%;
        top: 45%;
    }

    .cheese-images-grid.active.cutting[data-cheese="blue"] {
        left: 5%;
        top: 48%;
    }

    .cheese-images-grid.active[data-cheese="fondant"] {
        top: 38%;
    }

    .cheese-images-grid.active.cutting[data-cheese="fondant"] {
        top: 47%;
        left: 13%;
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(1) {
        left: 5%;
        bottom: 124%;
        transform: rotate(-108deg);
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(2) {
        left: 67%;
        bottom: 137%;
        transform: rotate(-13deg);
    }
    
    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(4) {
        left: 21%;
        transform: rotate(80deg);
    }
    
    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(5) {
        top: 68%;
        right: 2%;
        transform: rotate(-62deg);
    }
    
    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(6) {
        top: 89%;
        right: 42%;
        transform: rotate(-4deg);
    }

    .cheese-images-grid[data-cheese="petite"].cutting .cheese-grid-image:nth-child(7) {
        bottom: 100%;
        right: 40%;
        transform: rotate(18deg);
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(1) {
        left: 5%;
        bottom: 124%;
        transform: rotate(-108deg);
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(2) {
        left: 67%;
        bottom: 137%;
        transform: rotate(-13deg);
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(4) {
        left: 21%;
        transform: rotate(80deg);
    }

    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(5) {
        top: 68%;
        right: 2%;
        transform: rotate(-10deg);
    }
    
    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(6) {
        top: 89%;
        right: 42%;
        transform: rotate(-4deg);
    }
    
    .cheese-images-grid[data-cheese="camamber"].cutting .cheese-grid-image:nth-child(7) {
        bottom: 100%;
        right: 40%;
        transform: rotate(10deg);
    }

    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(1) {
        top: -76%;
        left: -28%;
        width: 42%;
        transform: rotate(-90deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(2) {
        top: -46%;
        right: 38%;
        width: 42%;
        transform: rotate(-19deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(3) {
        top: -10%;
        left: -85%;
        width: 40%;
        transform: rotate(-11deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(4) {
        top: -16%;
        right: 16%;
        width: 41%;
        transform: rotate(-9deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(5) {
        top: 27%;
        left: -37%;
        width: 40%;
        transform: rotate(-5deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(6) {
        top: 18%;
        right: -31%;
        width: 40%;
        transform: rotate(13deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(7) {
        top: 78%;
        left: 20%;
        width: 40%;
        transform: rotate(71deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="blue"].cutting .cheese-grid-image:nth-child(8) {
        top: 90%;
        right: -5%;
        width: 40%;
        transform: rotate(-76deg);
        transition: all 1s ease-in-out;
    }

    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(1) {
        top: -72%;
        left: 73%;
        height: 12.5%;
        transform: rotate(-84deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(2) {
        top: -23%;
        left: 42%;
        height: 12.5%;
        transform: rotate(-97deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(3) {
        top: 37%;
        left: 98%;
        height: 12.5%;
        transform: rotate(25deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(4) {
        top: 0%;
        left: 140%;
        height: 12.5%;
        transform: rotate(0deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(5) {
        top: 1%;
        left: 14%;
        height: 12.5%;
        transform: rotate(60deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(6) {
        top: 85%;
        left: 42%;
        height: 12.5%;
        transform: rotate(-100deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(7) {
        top: 51%;
        left: -26%;
        height: 12.5%;
        transform: rotate(80deg);
        transition: all 1s ease-in-out;
    }
    
    .cheese-images-grid[data-cheese="fondant"].cutting .cheese-grid-image:nth-child(8) {
        top: 82%;
        left: 93%;
        height: 11.6%;
        transform: rotate(-80deg);
        transition: all 1s ease-in-out;
    }  
}