
body{
  background:#050505;
  color:white;
  font-family:'Inter',sans-serif;
}

.nav-link{
  color:#d1d5db;
  position:relative;
  transition:.3s;
}

.nav-link:hover{
  color:#facc15;
}

.nav-link::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-8px;
  width:0;
  height:2px;
  background:#facc15;
  transition:.3s;
}

.nav-link:hover::after{
  width:100%;
}

#mobileMenu{
  box-shadow:-20px 0 80px rgba(0,0,0,.6);
}

#heroFood{
  transition: opacity .5s ease;
}

/* ========================= */
/* FEATURE CARDS */
/* ========================= */

.feature-card{
  background: rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);

  backdrop-filter: blur(20px);

  transition:.4s ease;

  position:relative;

  overflow:hidden;
}

.feature-card::before{
  content:"";

  position:absolute;

  top:0;
  left:-100%;

  width:100%;
  height:100%;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(250,204,21,.15),
    transparent
  );

  transition:.6s;
}

.feature-card:hover::before{
  left:100%;
}

.feature-card:hover{
  transform:translateY(-10px);

  border-color:#facc15;
}

/* ========================= */
/* SIGNATURE DISHES */
/* ========================= */

.dish-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:30px;
  overflow:hidden;
  backdrop-filter:blur(20px);
  transition:.4s ease;
}

.dish-card:hover{
  transform:translateY(-12px);
  border-color:#facc15;
}

.dish-image{
  width:100%;
  height:280px;
  object-fit:cover;
  transition:.6s ease;
}

.dish-card:hover .dish-image{
  transform:scale(1.08);
}

.dish-btn{
  width:100%;
  padding:14px;
  border-radius:999px;
  background:#facc15;
  color:#000;
  font-weight:700;
  transition:.3s ease;
}

.dish-btn:hover{
  transform:scale(1.03);
}

.light-mode {
  background: #f8f8f8;
  color: #544747;
}

.light-mode nav,
.light-mode header {
  background: rgba(130, 79, 79, 0.9);
}

.light-mode h1,
.light-mode h2,
.light-mode h3 {
  color: #6c6385d4;
}

.light-mode p {
  color: #544e4e;
}

.gallery-card{
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
}

.gallery-card img{
  width:100%;
  height:280px;
  object-fit:cover;
  transition:.6s ease;
}

.gallery-card:hover img{
  transform:scale(1.1);
}

.premium-btn{
  position: relative;
  overflow: hidden;
  transition: all .4s ease;
}

.premium-btn::before{
  content:"";
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.3),
    transparent
  );
  transition:.6s;
}

.premium-btn:hover::before{
  left:100%;
}

.premium-btn:hover{
  transform:translateY(-3px);
}

.filter-btn{
  padding:14px 28px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  transition:.3s;
}

.filter-btn:hover{
  border-color:#facc15;
}

.active-filter{
  background:#facc15;
  color:#000;
}

.menu-item{
  transform:translateY(0);
  transition:all .45s ease;
}

.menu-item:hover{
  transform:translateY(-10px);
  box-shadow:
  0 20px 60px rgba(250,204,21,.15);
}

.menu-item{
  animation:fadeUp .8s ease forwards;
}

@keyframes fadeUp{
  from{
    opacity:0;
    transform:translateY(30px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}


