.s-chef-highlight {
    position: relative;
    margin-top: -3.5rem;
    padding: 12rem 0;
    overflow: hidden;
    color: var(--color-brand-3);
    text-align: center
}

@media only screen and (max-width: 1440px) {
    .s-chef-highlight {
        padding: 9rem 0
    }
}

@media only screen and (max-width: 1280px) {
    .s-chef-highlight {
        padding: 7rem 0
    }
}

@media only screen and (max-width: 987px) {
    .s-chef-highlight {
        padding: 6rem 0
    }
}

.s-chef-highlight .s__image {
    --width: calc(var(--font-size-h-xl) * 3.8);
    margin: auto;
    width: var(--width);
    max-width: var(--width)
}

.s-chef-highlight .s__image img {
    display: block;
    width: 100%;
    height: auto
}

.s-chef-highlight__container {
    pointer-events: none;
    text-rendering: optimizespeed;
    will-change: transform
}

.s-chef-highlight .s__content {
    margin-top: calc(var(--font-size-h-xl) * -0.3)
}

.s-chef-highlight .s__content .btn {
    pointer-events: auto
}

.s-chef-highlight .s__title {
    margin-bottom: .1em
}

.s-chef-highlight .s__text {
    margin-bottom: 1.42em
}

.s-chef-highlight__bg {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    background: var(--color-white);
    animation-play-state: paused !important
}

.s-chef-highlight__bg .s__dish-container {
    position: relative;
    width: 20%;
    height: 20rem;
    transform: translate3d(0, calc(var(--progress) * -100% * var(--y)), 0);
    will-change: transform
}

@media only screen and (max-width: 987px) {
    .s-chef-highlight__bg .s__dish-container {
        width: 33%;
        height: 10rem
    }
}

@media only screen and (max-width: 767px)and (orientation: landscape), only screen and (max-width: 576px) {
    .s-chef-highlight__bg .s__dish-container {
        margin: .5em;
        width: 50%;
        height: 8rem
    }
}

.s-chef-highlight__bg .s__dish-container:nth-child(3n+1) {
    display: flex;
    justify-content: center;
    width: 30%
}

.s-chef-highlight__bg .s__dish-container:nth-child(5n) {
    display: flex;
    justify-content: flex-end
}

.s-chef-highlight__bg .s__dish {
    position: absolute;
    display: block;
    width: calc(var(--font-size-h-2xl) * var(--s, 0.5));
    transform: rotate(calc(var(--rotation) * 10deg * var(--progress) * -0.5));
    will-change: transform
}

.s-chef-highlight__bg .s__dish:nth-child(even) {
    margin-left: 45px
}

.s-chef-highlight__bg .s__dish:after {
    display: block;
    padding-bottom: 100%;
    height: 0;
    background: no-repeat center/contain;
    content: "";
    opacity: 0.1;
}

.s-chef-highlight__bg .s__cupcake:after {
    background-image: url("../images/discover/cupcake.svg")
}


.s-chef-highlight__bg .s__cherries:after {
    background-image: url("../images/discover/cherries.svg")
}

.s-chef-highlight__bg .s__roll:after {
    background-image: url("../images/discover/roll.svg")
}

.s-chef-highlight__bg .s__popsicle:after {
    background-image: url("../images/discover/popsicle.svg")
}

.s-chef-highlight__bg .s__popcake:after {
    background-image: url("../images/discover/popcake.svg")
}

.s-chef-highlight__bg .s__cookie:after {
    background-image: url("../images/discover/cookie.svg")
}

.s-chef-highlight__bg .s__cake:after {
    background-image: url("../images/discover/cake.svg")
}

.s-chef-highlight__bg .s__donut:after {
    background-image: url("../images/discover/donut.svg")
}

.s-chef-highlight__bg .s__strawberry:after {
    background-image: url("../images/discover/strawberry.svg")
}

.s-chef-highlight__bg .s__cakestand:after {
    background-image: url("../images/discover/cakestand.svg")
}

.s-chef-highlight .s__circle {
    position: absolute;
    top: var(--ts);
    left: var(--ls);
    display: block;
    width: 1rem
}

.s-chef-highlight .s__circle:after {
    display: block;
    padding-bottom: 100%;
    height: 0;
    background: #e9e3cc;
    -webkit-mask: url("../images/chef-circle.svg") no-repeat center/contain;
    mask: url("../images/chef-circle.svg") no-repeat center/contain;
    mask-mode: alpha;
    content: ""
}