.floating-dishes-block {
  color: var(--light-green);
  padding-top: max(5.8125rem, 13.3203125vw);
  position: relative;
  padding-bottom: max(6.806875rem, 16.8359375vw);
}

.floating-dishes-block__marquee-wrapper {
  grid-column: 1 / span 14;
  grid-row: 1 / span 1;
  color: var(--green);
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  gap: 0.3em;
}

.floating-dishes-block__marquee {
  display: flex;
  overflow-x: clip;
  width: 100%;
}

.floating-dishes-block__marquee-line {
  display: flex;
  gap: 0.5em;
  padding-left: 0.5em;
}

.loaded .floating-dishes-block__marquee-line {
  animation: lineBackwards 30s linear infinite;
}

.marquee-2.loaded .floating-dishes-block__marquee-line {
  animation: lineForwards 50s linear infinite;
}

.marquee-3 .floating-dishes-block__marquee-line {
  animation-duration: 40s;
}

.floating-dishes-block__marquee-line-element {
  white-space: nowrap;
}

.floating-dishes-block__img-wrapper {
  grid-column: 1 / span 14;
  grid-row: 2 / span 1;
  position: relative;
  height: 47.5vw;
}

.floating-dishes-block__dish {
  position: absolute;
  height: auto;
}

.floating-dishes-block__dish.dish-1 {
  width: 23.0078125%;
  left: 4.375%;
  bottom: 11.1842105263%;
}

.floating-dishes-block__dish.dish-2 {
  width: 22.3828125%;
  left: 35.1171875%;
  bottom: 40.3782894736%;
}

.floating-dishes-block__dish.dish-3 {
  width: 33.7109375%;
  right: 0;
  bottom: 4.3585526315%;
}

.floating-dishes-block__dish.currant {
  width: 5.3515625%;
  left: 23.75%;
  bottom: 47.2861842105%;
}

.floating-dishes-block__dish.single-currant {
  width: max(6px, 0.9375vw);
  animation: hoveringDishes 4s ease-in-out infinite;
}

.floating-dishes-block__dish.currant-1 {
  left: 9.0234375%;
  bottom: 54.8519736842%;
  animation-delay: 1s;
}

.floating-dishes-block__dish.currant-2 {
  left: 24.9609375%;
  bottom: 61.0197368421%;
  animation-delay: 2s;
}

.floating-dishes-block__dish.currant-3 {
  left: 28.6328125%;
  bottom: 39.4736842105%;
  animation-delay: 3s;
}

.floating-dishes-block__dish.single-pea {
  animation: hoveringDishes 4s ease-in-out infinite;
}

.floating-dishes-block__dish.pea-1 {
  width: 0.8984375%;
  left: 40%;
  bottom: 80%;
  animation-delay: 1s;
}

.floating-dishes-block__dish.pea-2 {
  width: 0.8984375%;
  left: 43.8671875%;
  bottom: 85.5263157894%;
  animation-delay: 2s;
}

.floating-dishes-block__dish.pea-3 {
  width: 0.625%;
  left: 45.5859375%;
  bottom: 79.0296052631%;
  animation-delay: 3s;
}

.content-wrapper h2.floating-dishes-block__headline {
  grid-column: 3 / span 5;
  grid-row: 3 / span 1;
  margin: 0;
}

.floating-dishes-block__description {
  grid-column: 3 / span 5;
  grid-row: 4 / span 1;
  margin-top: var(--s-sm);
}

.content-wrapper a.floating-dishes-block__pill-btn {
  grid-column: 9 / span 3;
  grid-row: 3 / span 1;
  align-self: flex-end;
  color: var(--light-green);
}

.floating-dishes-block__pill-btn .small-pill {
  mask-image: url("../../img/burger-pill.svg");
}

.floating-dishes-block__bubbles {
  position: absolute;
  height: auto;
  bottom: 50%;
  transform: translateY(50%);
}

.floating-dishes-block__img-wrapper .green-bubble {
  position: absolute;
  height: auto;
}

.floating-dishes-block__bubbles.bubbles-1 {
  width: max(8.875rem, 29.2578125vw);
}

.floating-dishes-block__bubbles.bubbles-2 {
  width: max(7.25rem, 24.0625vw);
  transform: translate(50%, 50%);
  right: 50%;
}

.floating-dishes-block__bubbles.bubbles-3 {
  width: max(8.4375rem, 29.84375vw);
  right: 0;
}

.floating-dishes-block__img-wrapper .green-bubble-1 {
  width: 2.4109375%;
  left: 12.6953125%;
  bottom: 61.1019736842%;
}

.floating-dishes-block__img-wrapper .green-bubble-2 {
  width: 4.184375%;
  left: 15%;
  bottom: 71.2993421052%;
}

.floating-dishes-block__img-wrapper .green-bubble-3 {
  width: 5.787109375%;
  left: 36.0546875%;
  bottom: 8.2236842105%;
}

.floating-dishes-block__img-wrapper .green-bubble-4 {
  width: 2.27265625%;
  left: 42.890625%;
  bottom: 22.6151315789%;
}

.floating-dishes-block__img-wrapper .green-bubble-5 {
  width: 3.6671875%;
  left: 60.9375%;
  bottom: 66.0361842105%;
}

.floating-dishes-block__dish-green-bubble-6 {
  width: max(1.0625rem, 3.294140625vw);
  grid-column: 13 / span 1;
  justify-self: flex-end;
  align-self: flex-end;
  grid-row: 3 / span 1;
}

.floating-dishes-block__dish.carrot {
  grid-column: 1 / span 14;
  grid-row: 3 / span 2;
  position: absolute;
  right: 0;
  width: max(10.125rem, 30.859375vw);
}

@keyframes hoveringDishes {
  0% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-50%);
  }

  100% {
    transform: translateY(0);
  }
}

@media (max-width: 991.98px) {
  .content-wrapper h2.floating-dishes-block__headline,
  .floating-dishes-block__description {
    grid-column: 2 / span 7;
  }
}

@media (max-width: 767.98px) {
  .floating-dishes-block__marquee.marquee-2 {
    font-size: 2.5rem;
  }

  .content-wrapper h2.floating-dishes-block__headline,
  .floating-dishes-block__description {
    grid-column: 2 / span 12;
  }

  .content-wrapper h2.floating-dishes-block__headline {
    grid-row: 4 / span 1;
  }

  .floating-dishes-block__description {
    grid-row: 5 / span 1;
  }

  .content-wrapper a.floating-dishes-block__pill-btn {
    grid-row: 6 / span 1;
    grid-column: 2 / span 12;
    margin-top: 2.5625rem;
    justify-self: center;
  }

  .floating-dishes-block__dish-green-bubble-6 {
    display: none;
  }

  .floating-dishes-block__dish.carrot {
    grid-row: 3 / span 1;
    position: relative;
    justify-self: flex-end;
  }
}

@media only screen and (orientation: portrait) and (max-width: 575.98px) {
  .floating-dishes-block__img-wrapper {
    height: 22.9375rem;
    margin-top: 0.5rem;
  }

  .floating-dishes-block__dish.dish-2 {
    top: 2.765625rem;
    right: var(--grid-gap);
    bottom: unset;
    left: unset;
    width: 10.354375rem;
  }

  .floating-dishes-block__dish.pea-1 {
    width: 0.27125rem;
    left: unset;
    bottom: unset;
    top: 2.461875rem;
    right: 8.33375rem;
  }

  .floating-dishes-block__dish.pea-2 {
    width: 0.47625rem;
        left: unset;
    bottom: unset;
    top: 1.3125rem;
    right: 7.053125rem;
  }

  .floating-dishes-block__dish.pea-3 {
    width: 0.295625rem;
        left: unset;
    bottom: unset;
    top: 2.93125rem;
    right: 6.424375rem;
  }

  .floating-dishes-block__dish.dish-3 {
    width: 12.28rem;
    top: 15.231875rem;
    bottom: unset;
  }

  .floating-dishes-block__dish.dish-1 {
    width: 9rem;
    left: 0.625rem;
    bottom: unset;
    top: 11.25rem;
  }

  .floating-dishes-block__dish.currant {
    width: 2.0625rem;
    top: 9.875rem;
    bottom: unset;
    left: 8.3125rem;
  }

.floating-dishes-block__dish.single-currant {
  width: 0.3775rem;
}

  .floating-dishes-block__dish.currant-1 {
    bottom: unset;
    left: 2.450625rem;
    top: 9.85125rem;
  }

  .floating-dishes-block__dish.currant-2 {
    bottom: unset;
    left: 8.701875rem;
    top: 8.6875rem;
  }

  .floating-dishes-block__dish.currant-3 {
    bottom: unset;
    left: 10.211875rem;
    top: 12.7925rem;
  }

  .floating-dishes-block__dish.carrot {
    margin-bottom: 3.125rem;
  }

  .floating-dishes-block__dish-green-bubble-6 {
    display: flex;
    width: 2.5625rem;
    grid-column: 4 / span 10;
    justify-self: flex-start;
    align-self: center;
  }

  .floating-dishes-block__img-wrapper .green-bubble-4 {
    bottom: unset;
    width: 3.8125rem;
    top: 20.951875rem;
    left: 2.3125rem;
  }

  .floating-dishes-block__img-wrapper .green-bubble-1 {
    width: 1.153125rem;
    top: 5.854375rem;
    left: 2.9375rem;
    bottom: unset;
  }

  .floating-dishes-block__img-wrapper .green-bubble-2 {
    width: 2rem;
    top: 2.8125rem;
    bottom: unset;
    left: 4.065625rem; 
  }

  .floating-dishes-block__img-wrapper .green-bubble-3 {
    width: 1.0625rem;
    bottom: unset;
    top: 24.5625rem;
    left: 9.5rem;
  }

  .floating-dishes-block__img-wrapper .green-bubble-5 {
    width: 1.0625rem;
    left: unset;
    right: var(--grid-gap);
    bottom: unset;
    top: 10.375rem;
  }

}