/* ================= GLOBAL ================= */
body{
  margin:0;
  font-family:Arial, sans-serif;
  background:#fafafa;
  display:flex;
  justify-content:center;
}

/* ================= LAYOUT ================= */
.main-wrapper{
  width:60%;
  min-width:320px;
}

/* ================= HEADER ================= */
header{
  background:linear-gradient(45deg,#ff4b2b,#ff922b,#ffd000);
  color:#fff;
  padding:16px 3%;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.logo{
  font-size:1.6rem;
  font-weight:bold;
}

.search-bar{
  display:flex;
  background:#fff;
  padding:6px 12px;
  border-radius:30px;
  flex:0 1 35%;
}

.search-bar input{
  border:none;
  outline:none;
  flex:1;
}

.search-bar button{
  background:#ff4b2b;
  border:none;
  color:#fff;
  padding:8px 12px;
  border-radius:50%;
  cursor:pointer;
}

.social-icons{
  display:flex;
  gap:15px;
  font-size:1.4rem;
}

.social-icons a{
  color:#fff;
  text-decoration:none;
}

/* ================= MARQUEE ================= */
.marquee-bar{
  background:#ffad33;
  color:#fff;
  overflow:hidden;
  white-space:nowrap;
  padding:10px 0;
  font-weight:bold;
  text-align:center;
}

.marquee-bar span{
  display:inline-block;
  padding-left:100%;
  animation:marquee 22s linear infinite;
}

@keyframes marquee{
  0%{transform:translateX(0)}
  100%{transform:translateX(-100%)}
}

/* ================= MENU ================= */
.menu-section h2{
  text-align:center;
  color:#d62828;
  margin:15px 0;
  font-size:2rem;
}

.menu-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.item-card{
  background:linear-gradient(135deg,#ff4b2b22,#ff922b22,#ffd00022);
  padding:16px;
  border-radius:16px;
  box-shadow:0 4px 14px rgba(0,0,0,.15);
  text-align:center;
  transition:transform .2s, box-shadow .2s;
}

.img-up{transform:translateY(-10px);}

/* ===== IMAGE FIX (NO STRETCH) ===== */
.item-card img{
  width:100%;
  height:200px;
  object-fit:cover;
  object-position: center top;   /* 🔥 MAIN FIX */
  border-radius:10px;
  background:#ddd;
  transition:transform .3s ease;
}

/* Hover image zoom */
.item-card:hover img{
  transform:scale(1.05);
}

/* ===== HALKA SHAKY EFFECT ===== */
.item-card:hover{
  animation:shake .35s ease-in-out;
  box-shadow:0 8px 20px rgba(0,0,0,.3);
}

@keyframes shake{
  0%{transform:translateX(0)}
  25%{transform:translateX(-2px)}
  50%{transform:translateX(2px)}
  75%{transform:translateX(-1px)}
  100%{transform:translateX(0)}
}

/* ===== GREEN GRADIENT TEXT ===== */
.item-card h3{
  background:linear-gradient(45deg,#1b7f3b,#2ecc71,#a8e063);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:bold;
}

.item-card p{
  color:#1f8f4a;
  font-weight:500;
}

/* ================= CONTACT ================= */
.contact{
  text-align:center;
  margin:30px 0;
}

.contact a{
  background:linear-gradient(45deg,#ff4b2b,#ff922b,#ffd000);
  padding:12px 22px;
  border-radius:14px;
  color:#fff;
  text-decoration:none;
  font-size:1.4rem;
  font-weight:bold;
}

/* ================= FOOTER ================= */
footer{
  background:linear-gradient(45deg,#ff4b2b,#ff922b,#ffd000);
  color:#fff;
  text-align:center;
  padding:18px;
  margin-top:25px;
}

/* ================= WHATSAPP ================= */
.whatsapp-float{
  position:fixed;
  bottom:90px;
  right:25px;
  background:#25D366;
  color:#fff;
  padding:12px 18px;
  border-radius:50px;
  text-decoration:none;
  display:flex;
  gap:10px;
  align-items:center;
  font-weight:bold;
  box-shadow:0 6px 18px rgba(0,0,0,.3);
  z-index:999;
}

/* ================= MOBILE ================= */
.mobile-call-bar{
  display:none;
}

@media(max-width:1024px){
  .main-wrapper{width:85%}
}

@media(max-width:768px){
  .main-wrapper{width:95%}
  .search-bar{display:none}
  .menu-grid{grid-template-columns:1fr}

  .mobile-call-bar{
    display:flex;
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    background:linear-gradient(45deg,#ff4b2b,#ff922b,#ffd000);
    justify-content:center;
    padding:14px;
    z-index:998;
  }

  .mobile-call-bar a{
    color:#fff;
    text-decoration:none;
    font-size:1.4rem;
    font-weight:bold;
  }
}