.menu-order {
  width: 100%;
  height: 50dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
  position: relative; /* Wajib untuk pseudoelement */
}

.menu-order::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(https://i.pinimg.com/1200x/25/c1/ea/25c1ea3d44ba8df0115adf4ca33144e9.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: sepia(100%) hue-rotate(50deg) saturate(500%);
  z-index: -1; /* Letakkan di belakang konten */
}

.menu-order .container-order {
  width: 230px;
  height: 230px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 20px 0px 20px 0px;
  background-color: var(--primary-bg-color);
  z-index: 1; /* Pastikan child di atas background */
  padding: 1rem;
}

.menu-order .container-order h2 {
  font-weight: 500;
  color: var(--secondry-bg-color);
}

.menu-order .container-order p {
  text-align: center;
}

.menu-order .container-order .icon-order {
  width: 40px;
  height: 40px;
  display: flex;
}

.menu-order .container-order .icon-order img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 600px) {
  .menu-order {
    flex-direction: column;
    height: auto;
    padding: 4rem 0px;
  }
}