:root{
  --saffron:#FF9933;
  --brown:#8B4513;
  --gold:#FFD700;
  --beige:#F5F5DC;
  --dark:#2e2e2e;
  --white:#ffffff;
}

/* ===== RESET ===== */
*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  font-family:'Roboto',sans-serif;
  color:var(--dark);
  background:#fff;
  line-height:1.7;
}

img{
  max-width:100%;
  display:block;
}

a{
  text-decoration:none;
  color:inherit;
}

/* ===== NAVBAR ===== */
.navbar{
  position:sticky;
  top:0;
  background:#fff;
  z-index:1000;
  box-shadow:0 6px 25px rgba(0,0,0,0.08);
}

.nav-container{
  max-width:1200px;
  margin:auto;
  padding:14px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

/* LOGO */
.logo{
  display:flex;
  gap:14px;
  align-items:center;
}

/* ===== LOGO PREMIUM ===== */

.logo{
  display:flex;
  align-items:center;
  gap:12px;
  flex:1;           /* 🔥 mobile me compress nahi hoga */
  min-width:0;
}

.logo img{
  height:58px;
  width:auto;
  flex-shrink:0;    /* 🔥 logo shrink nahi hoga */
  transition:0.3s ease;
}

/* 🔥 BRAND NAME */
/* ===== LOGO PREMIUM ===== */

.logo{
  display:flex;
  align-items:center;
  gap:12px;
  flex:1;           /* 🔥 mobile me compress nahi hoga */
  min-width:0;
}

.logo img{
  height:58px;
  width:auto;
  flex-shrink:0;    /* 🔥 logo shrink nahi hoga */
  transition:0.3s ease;
}

.logo h2{
  font-family:'Playfair Display',serif;
  font-size:24px;
  color:var(--brown);
  line-height:1.1;
  letter-spacing:1px;
  font-weight:700;
  white-space:nowrap; /* 🔥 text wrap nahi karega */
}

.logo span{
  font-size:13px;
  color:#999;
  letter-spacing:1px;
  text-transform:uppercase;
}


/* NAV LINKS */
nav{
  display:flex;
  align-items:center;
  gap:18px;
}

/* NAV LINKS */
nav a{
  position:relative;
  font-weight:600;
  font-size:16px;
  padding:6px 4px;
  color:#333;
  letter-spacing:0.4px;
  transition:all .35s ease;
}

/* 🔥 PREMIUM GRADIENT UNDERLINE */
nav a::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-4px;
  width:0;
  height:3px;
  border-radius:10px;
  background:linear-gradient(135deg,#ff9f1a,#ff7a18);
  transition:width .35s ease;
}

/* HOVER EFFECT */
nav a:hover{
  color:var(--saffron);
  transform:translateY(-1px);
}

nav a:hover::after{
  width:100%;
}
/* BUTTON */
.btn{
  background:linear-gradient(135deg,var(--saffron),#ff7a18);
  color:#fff;
  padding:10px 22px;
  border-radius:30px;
  font-weight:500;
  transition:.35s;
  box-shadow:0 8px 18px rgba(255,153,51,.35);
}

.btn:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 25px rgba(255,153,51,.45);
}

.btn.outline{
  background:transparent;
  border:2px solid #fff;
  box-shadow:none;
}

/* HAMBURGER */
.hamburger{
  display:none;
  font-size:30px;
  cursor:pointer;
}

/* ===== HERO ===== */

.hero{

  height:85vh;
  min-height:520px;

  /* DESKTOP IMAGE */
  background-image:url("../images/pn.png");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  position:relative;
  overflow:hidden;

}


/* ===== PREMIUM DARK OVERLAY ===== */

.hero-overlay{

  height:100%;
  width:100%;

  background:linear-gradient(
    180deg,
    rgba(0,0,0,0.35),
    rgba(0,0,0,0.65)
  );

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;

  color:#fff;
  padding:20px;
}


/* ===== HEADING PREMIUM LOOK ===== */

.hero h1{

  font-family:'Playfair Display',serif;
  font-size:46px;
  max-width:850px;
  line-height:1.2;
  letter-spacing:0.5px;

  text-shadow:0 4px 12px rgba(0,0,0,0.5);

}


/* ===== SUBTITLE ===== */

.hero p{

  margin:18px 0 28px;
  font-size:18px;
  color:#f1f1f1;

  text-shadow:0 2px 8px rgba(0,0,0,0.4);

}


/* ===== BUTTONS ===== */

.hero-btns{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}


/* ===================================
   MOBILE VERSION AUTO IMAGE CHANGE
=================================== */

@media (max-width:768px){

  .hero{

    height:75vh;

    /* MOBILE IMAGE */
    background-image:url("../images/png.png");

    background-position:center top;

  }

  .hero h1{
    font-size:28px;
    max-width:100%;
  }

  .hero p{
    font-size:15px;
  }

}




/* ===== SECTIONS ===== */
.section{
  padding:90px 20px;
}

.section.beige{
  background:var(--beige);
}

.section-title{
  text-align:center;
  font-family:'Playfair Display',serif;
  font-size:36px;
  margin-bottom:55px;
  color:var(--brown);
}

/* ===== CARDS ===== */
.card-grid{
  max-width:1100px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:32px;
}

.card{
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,0.1);
  transition:.4s;
  text-align:center;
}

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

.card img{
  height:200px;
  object-fit:cover;
}

.card h3{
  font-family:'Playfair Display',serif;
  margin:18px 0 6px;
}

.card span{
  display:block;
  margin:12px 0 22px;
  font-weight:600;
  color:var(--saffron);
}

/* ===== ABOUT ===== */
.about-strip{
  max-width:1100px;
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:45px;
  align-items:center;
}

.about-strip img{
  border-radius:22px;
}

.features{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:22px;
}

.features span{
  background:#fff;
  padding:12px;
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
  font-size:14px;
}

/* ===== GALLERY ===== */
.gallery-preview{
  max-width:1100px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.gallery-preview img{
  border-radius:16px;
  transition:.4s;
}

.gallery-preview img:hover{
  transform:scale(1.06);
}

.gallery-btn{
  background:linear-gradient(135deg,var(--saffron),#ff7a18);
  color:#fff;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
}

/* ===== CTA ===== */
.cta{
  background:linear-gradient(135deg,var(--saffron),#ff7a18);
  color:#fff;
  padding:100px 20px;
  text-align:center;
}

.cta h2{
  font-family:'Playfair Display',serif;
  font-size:38px;
}

.cta-cards{
  display:flex;
  justify-content:center;
  gap:30px;
  margin:45px 0;
  flex-wrap:wrap;
}

.cta-cards div{
  background:#fff;
  color:#333;
  padding:22px 26px;
  border-radius:16px;
  min-width:200px;
}

/* ===== FOOTER ===== */
footer{
  background:var(--brown);
  color:#fff;
  text-align:center;
  padding:24px;
}

/* ===== MOBILE ===== */
@media(max-width:768px){

  nav{
    display:none;
    flex-direction:column;
    position:absolute;
    top:70px;
    right:20px;
    background:#fff;
    padding:18px;
    border-radius:14px;
    box-shadow:0 12px 30px rgba(0,0,0,0.18);
  }

  nav.active{
    display:flex;
  }

  nav a{
    margin:12px 0;
  }

  .hamburger{
    display:block;
  }

  .hero{
    height:75vh;
  }

  .hero h1{
    font-size:30px;
  }

  .hero p{
    font-size:16px;
  }

  .section{
    padding:70px 16px;
  }

  .section-title{
    font-size:28px;
  }

  .about-strip{
    grid-template-columns:1fr;
  }

  .gallery-preview{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:480px){

  .nav-container{
    gap:10px;
  }

  .logo img{
    height:50px;
  }

  .logo h2{
    font-size:18px;
  }

  .logo span{
    font-size:11px;
  }


  .hero h1{
    font-size:26px;
  }

  .hero-btns{
    flex-direction:column;
    width:100%;
  }

  .hero-btns .btn{
    width:100%;
    text-align:center;
  }

  .gallery-preview{
    grid-template-columns:1fr;
  }

  .cta h2{
    font-size:26px;
  }
}

    



/* ================= MENU GRID ================= */

.menu-items{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:30px;
  margin-top:30px;
}

/* ================= MENU CARD ================= */

.menu-item-card{
  display:flex;
  align-items:center;
  gap:18px;
  background:linear-gradient(180deg,#ffffff,#fffdf8);
  padding:18px 20px;
  border-radius:20px;
  box-shadow:0 14px 40px rgba(0,0,0,0.12);
  transition:all .35s cubic-bezier(.4,0,.2,1);
  position:relative;
  overflow:hidden;
}

/* LEFT GRADIENT STRIP */
.menu-item-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:6px;
  height:100%;
  background:linear-gradient(180deg,var(--saffron),#ff7a18);
}

/* HOVER EFFECT */
.menu-item-card:hover{
  transform:translateY(-10px) scale(1.01);
  box-shadow:0 30px 70px rgba(0,0,0,0.25);
}

/* ================= IMAGE ================= */

.menu-item-card img{
  width:82px;
  height:82px;
  border-radius:16px;
  object-fit:cover;
  flex-shrink:0;
  box-shadow:0 10px 24px rgba(0,0,0,0.28);
  transition:transform .4s ease;
}

.menu-item-card:hover img{
  transform:scale(1.1) rotate(-1deg);
}

/* ================= INFO ================= */

.menu-item-info{
  flex:1;
}

.menu-item-info h4{
  font-family:'Playfair Display',serif;
  font-size:19px;
  margin:0 0 6px;
  color:#2b2b2b;
  line-height:1.25;
}

/* ================= PRICE ================= */

.menu-item-price{
  font-weight:800;
  color:var(--brown);
  font-size:18px;
  white-space:nowrap;
  margin-left:6px;
}

/* ===== HALF FULL SIZE TOGGLE ===== */

.size-toggle{
display:flex;
gap:6px;
margin-top:6px;
}

.size-toggle button{
border:none;
padding:4px 10px;
border-radius:20px;
background:#eee;
font-size:12px;
cursor:pointer;
transition:0.3s;
}

.size-toggle button.active{
background:linear-gradient(135deg,#ff9f1a,#ff7a18);
color:#fff;
}

/* ================= VEG BADGE ================= */

.menu-item-veg{
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin-top:6px;
  background:linear-gradient(135deg,#2ecc71,#27ae60);
  color:#fff;
  font-size:11px;
  padding:4px 14px;
  border-radius:30px;
  letter-spacing:.6px;
  font-weight:600;
}

/* ================================================= */
/* ============== ADD TO CART SYSTEM =============== */
/* ================================================= */

.menu-cart-box{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:auto;
}

.qty-btn{
  width:32px;
  height:32px;
  border:none;
  border-radius:8px;
  background:linear-gradient(135deg,#ff9f1a,#ff7a18);
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 6px 16px rgba(255,122,24,0.35);
  transition:all .25s ease;
}

.qty-btn:hover{
  transform:translateY(-2px) scale(1.05);
  box-shadow:0 12px 28px rgba(255,122,24,0.5);
}

.qty-btn:active{
  transform:scale(0.92);
}

.qty{
  min-width:22px;
  text-align:center;
  font-weight:700;
  font-size:15px;
  color:#333;
}

/* ADD TO CART BUTTON */
.add-cart-btn{
  position:absolute;
  bottom:12px;
  right:14px;
  padding:6px 16px;
  font-size:13px;
  border:none;
  border-radius:20px;

  /* 🔥 SAME ORANGE THEME */
  background:linear-gradient(135deg,#ff9f1a,#ff7a18);

  color:#fff;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(255,122,24,0.4);
  transition:all .3s ease;
}

.add-cart-btn:hover{
  transform:translateY(-2px) scale(1.03);
  box-shadow:0 14px 32px rgba(255,122,24,0.55);
}

.add-cart-btn:active{
  transform:scale(0.94);
}

/* ================================================= */
/* ================= CART PAGE ===================== */
/* ================================================= */

.cart-section{
  max-width:1100px;
  margin:auto;
}

.cart-items{
  margin-bottom:30px;
}

.cart-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 18px;
  margin-bottom:14px;
  background:#ffffff;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,0.12);
  transition:.3s;
}

.cart-item:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 45px rgba(0,0,0,0.18);
}

.cart-left h4{
  margin:0;
  font-size:18px;
  font-family:'Playfair Display',serif;
}

.cart-left p{
  margin:4px 0 0;
  font-size:14px;
  color:#666;
}

.cart-qty{
  display:flex;
  align-items:center;
  gap:10px;
}

.cart-qty button{
  width:32px;
  height:32px;
  border:none;
  border-radius:8px;
  background:linear-gradient(135deg,#ff9f1a,#ff7a18);
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 6px 16px rgba(255,122,24,0.35);
}

.cart-qty span{
  min-width:22px;
  text-align:center;
  font-weight:700;
}

.cart-item .price{
  font-weight:800;
  font-size:16px;
  white-space:nowrap;
}

/* ================= SUMMARY ================= */

.cart-summary{
  background:#fafafa;
  padding:22px;
  border-radius:18px;
  box-shadow:0 12px 36px rgba(0,0,0,0.12);
}

.summary-row{
  display:flex;
  justify-content:space-between;
  margin-bottom:12px;
  font-size:15px;
}

.summary-row.total{
  font-size:18px;
  font-weight:800;
}

/* ================= NEW CART INPUTS ================= */

.cart-input{
  width:100%;
  margin-top:12px;
  padding:12px 16px;
  border-radius:30px;
  border:1px solid #ddd;
  font-size:15px;
  outline:none;
  transition:.25s;
}

.cart-input:focus{
  border-color:#ff9f1a;
  box-shadow:0 0 0 3px rgba(255,159,26,.15);
}

/* CLEAR CART BUTTON */
.clear-cart-btn{
  width:100%;
  margin-top:14px;
  padding:12px;
  border:none;
  border-radius:30px;
  background:linear-gradient(135deg,#ff4d4d,#ff1e1e);
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  transition:.3s;
}

.clear-cart-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 32px rgba(255,30,30,.4);
}

/* WHATSAPP BUTTON */
.whatsapp-btn{
  width:100%;
  margin-top:16px;
  padding:14px;
  border:none;
  border-radius:30px;
  background:linear-gradient(135deg,#ff9f1a,#ff7a18); /* SAME THEME */
  color:#fff;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  transition:.3s;
}

.whatsapp-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(255,122,24,0.45);
}

/* ================================================= */
/* ================= MOBILE FIX ==================== */
/* ================================================= */

@media(max-width:768px){

  .menu-items{
    grid-template-columns:repeat(2,1fr);
    gap:14px;
  }

  .menu-item-card{
    padding:14px;
    flex-direction:column;
    align-items:flex-start;
    border-radius:18px;
  }

  .menu-item-card img{
    width:58px;
    height:58px;
    border-radius:12px;
    margin-bottom:6px;
  }

  .menu-item-info h4{
    font-size:14px;
    line-height:1.25;
  }

  .menu-item-price{
    font-size:14px;
    margin-bottom:6px;
  }

  .menu-cart-box{
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:6px 0 10px;
    gap:10px;
    margin-left:0;
  }

  .qty-btn{
    width:30px;
    height:30px;
    font-size:16px;
    border-radius:8px;
  }

  .qty{
    min-width:22px;
    font-size:14px;
  }

  .add-cart-btn{
    position:static;
    width:100%;
    padding:10px;
    font-size:14px;
    border-radius:22px;
    text-align:center;
  }

  .cart-item{
    flex-direction:column;
    align-items:flex-start;
  }

  .cart-qty{
    margin-top:8px;
  }

  .cart-item .price{
    align-self:flex-end;
    font-size:15px;
  }
}

/* ================================================= */
/* ============== MOBILE NAV FIX =================== */
/* ================================================= */

@media (max-width:768px){

  nav{
    position:absolute;
    top:70px;
    right:20px;
    background:#ffffff;
    width:220px;
    padding:20px;
    border-radius:14px;
    box-shadow:0 20px 50px rgba(0,0,0,0.2);
    display:none;
    flex-direction:column;
    gap:14px;
    z-index:2000;
  }

  nav.active{
    display:flex;
  }

  nav a{
    font-size:16px;
  }

  .hamburger{
    display:block;
    font-size:28px;
    cursor:pointer;
  }
}

/* ================= ABOUT PAGE ================= */

/* HERO */
.about-hero{
  height:55vh;
  background:url('../images/pn.png') center center/cover no-repeat;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.about-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.35); /* dark overlay for premium look */
}

/* SECTION */
.about-section{
  padding:80px 20px;
  background:#fff;
}

/* CONTAINER */
.about-container{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

/* TEXT */
.about-text h2{
  font-family:'Playfair Display',serif;
  font-size:36px;
  color:var(--brown);
  margin-bottom:20px;
  line-height:1.2;
}

.about-text p{
  font-size:16px;
  line-height:1.8;
  color:#555;
  margin-bottom:16px;
}

/* TAGS */
.about-tags{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}

.about-tags span{
  background:#fff;
  padding:8px 18px;
  border-radius:30px;
  font-size:13px;
  font-weight:500;
  box-shadow:0 6px 18px rgba(0,0,0,0.08);
  transition:0.3s ease;
}

.about-tags span:hover{
  transform:translateY(-3px);
}

/* IMAGE */
.about-image img{
  width:100%;
  border-radius:20px;
  box-shadow:0 18px 45px rgba(0,0,0,0.18);
  transition:0.4s ease;
}

.about-image img:hover{
  transform:scale(1.03);
}

/* ================= WHY US ================= */

.why-us{
  padding:90px 20px;
  background:var(--beige);
}

.why-grid{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:30px;
}

.why-card{
  background:#fff;
  padding:35px 25px;
  border-radius:18px;
  text-align:center;
  box-shadow:0 12px 30px rgba(0,0,0,0.10);
  transition:0.3s ease;
}

.why-card:hover{
  transform:translateY(-10px);
  box-shadow:0 18px 40px rgba(0,0,0,0.15);
}

.why-card img{
  width:55px;
  margin-bottom:18px;
}

.why-card h4{
  font-family:'Playfair Display',serif;
  margin-bottom:12px;
  font-size:18px;
}

.why-card p{
  font-size:14px;
  color:#666;
  line-height:1.6;
}

/* ================= RESPONSIVE ================= */

@media(max-width:900px){

  .about-container{
    grid-template-columns:1fr;
    gap:40px;
  }

  .about-text{
    text-align:center;
  }

  .about-hero{
    height:40vh;
  }

}


/* ================= INFO ================= */

.info-section{
  padding:80px 20px;
}

.info-card{
  max-width:720px;
  margin:auto;
  background:#fff;
  padding:35px;
  border-radius:20px;
  box-shadow:0 15px 40px rgba(0,0,0,0.12);
}

.info-actions{
  display:flex;
  gap:15px;
  margin:18px 0;
  flex-wrap:wrap;
}

.info-actions a,
.info-actions button{
  padding:10px 18px;
  border-radius:30px;
  border:none;
  background:var(--saffron);
  color:#fff;
  cursor:pointer;
  font-size:14px;
}

/* TIMINGS */
.timing-list{
  list-style:none;
  margin-top:18px;
}

.timing-list li{
  display:flex;
  justify-content:space-between;
  padding:6px 0;
  font-size:14px;
}

.highlight{
  color:var(--saffron);
  font-weight:600;
}

/* ================= MOBILE ================= */

@media(max-width:768px){

  .about-hero{
    height:45vh;
  }

  .about-container{
    grid-template-columns:1fr;
    text-align:center;
  }

  .about-text h2{
    font-size:28px;
  }

  .about-text p{
    font-size:14px;
  }

  .about-tags{
    justify-content:center;
  }

  .info-card{
    padding:25px;
  }
}

@media(max-width:480px){

  .about-hero{
    height:40vh;
  }

  .about-text h2{
    font-size:24px;
  }

  .why-card{
    padding:22px;
  }

  .info-actions{
    flex-direction:column;
  }

  .info-actions a,
  .info-actions button{
    width:100%;
    text-align:center;
  }
}












/* ===== INFO SECTION ===== */

.info-section{
  padding:80px 20px;
  background:#f9fafb;
}

.info-card{
  max-width:650px;
  margin:auto;
  background:#fff;
  padding:35px;
  border-radius:20px;
  box-shadow:0 15px 40px rgba(0,0,0,0.12);
}

.info-card h2{
  font-size:28px;
  margin-bottom:15px;
}

.info-card p{
  font-size:16px;
  line-height:1.6;
  color:#333;
}

/* ACTION BUTTONS */
.info-actions{
  margin:20px 0;
  display:flex;
  gap:15px;
}

.info-actions a,
.info-actions button{
  border:none;
  background:#eef3ff;
  color:#1a73e8;
  padding:10px 16px;
  border-radius:10px;
  font-size:14px;
  cursor:pointer;
  text-decoration:none;
  font-weight:500;
}

.info-actions button:hover,
.info-actions a:hover{
  background:#e0e7ff;
}

/* TIMING BOX */
.timing-box{
  margin-top:25px;
  border:2px solid #e6e6e6;
  border-radius:14px;
  padding:20px;
}

.timing-header{
  margin-bottom:15px;
}

.status.open{
  color:#1e8e3e;
  font-weight:600;
}

/* TIMING LIST */
.timing-list{
  list-style:none;
  padding:0;
  margin:0;
}

.timing-list li{
  display:flex;
  justify-content:space-between;
  padding:8px 0;
  border-bottom:1px dashed #ddd;
  font-size:15px;
}

.timing-list li:last-child{
  border-bottom:none;
}

.highlight{
  font-weight:700;
  color:#1e8e3e;
}

/* MOBILE */
@media(max-width:600px){
  .info-card{
    padding:25px;
  }

  .info-card h2{
    font-size:24px;
  }

  .timing-list li{
    font-size:14px;
  }
}
/* ================= MOBILE NAV FIX ================= */

@media (max-width:768px){

  nav{
    position:absolute;
    top:70px;
    right:20px;
    background:#fff;
    width:220px;
    padding:20px;
    border-radius:14px;
    box-shadow:0 20px 50px rgba(0,0,0,0.2);

    display:none;
    flex-direction:column;
    gap:14px;
    z-index:3000;
  }

  nav.active{
    display:flex;
  }

  .hamburger{
    display:block;
    font-size:28px;
    cursor:pointer;
  }
}








/* ================= GALLERY PAGE ================= */

.gallery-hero{
  height:45vh;
  background:url("images/about/restaurant.jpg") center/cover no-repeat;
}

.gallery-grid{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:26px;
}

/* CARD */
.gallery-item{
  position:relative;
  overflow:hidden;
  border-radius:20px;
  cursor:pointer;
  box-shadow:0 15px 40px rgba(0,0,0,0.25);
  transition:.45s ease;
}

.gallery-item:hover{
  transform:translateY(-8px);
  box-shadow:0 30px 80px rgba(0,0,0,0.45);
}

/* IMAGE */
.gallery-item img{
  width:100%;
  height:260px;
  object-fit:cover;
  transition:transform .6s ease, filter .6s ease;
}

.gallery-item:hover img{
  transform:scale(1.15);
  filter:brightness(.8);
}

/* OVERLAY */
.gallery-item::after{
  content:"View Photo";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  letter-spacing:2px;
  color:#fff;
  background:linear-gradient(to bottom,rgba(0,0,0,.2),rgba(0,0,0,.75));
  opacity:0;
  transition:.4s ease;
  pointer-events:none; /* 🔥 THIS IS THE FIX */
}


.gallery-item:hover::after{
  opacity:1;
}

/* ================= LIGHTBOX ================= */

#lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.9);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

#lightbox img{
  max-width:92%;
  max-height:92%;
  border-radius:20px;
  animation:zoomIn .3s ease;
}

.lightbox-close{
  position:absolute;
  top:20px;
  right:30px;
  font-size:28px;
  color:#fff;
  cursor:pointer;
  opacity:.8;
}

.lightbox-close:hover{
  opacity:1;
}

@keyframes zoomIn{
  from{transform:scale(.85)}
  to{transform:scale(1)}
}

/* ACTIVE LINK */
nav a.active{
  color:var(--saffron);
  font-weight:700;
}

nav a.active::after{
  width:100%;
}

/* ================= MOBILE ================= */

@media(max-width:768px){
  .gallery-hero{
    height:38vh;
  }

  .gallery-item img{
    height:220px;
  }

  .gallery-item::after{
    font-size:12px;
    letter-spacing:1px;
  }
}

@media(max-width:480px){
  .gallery-item img{
    height:200px;
  }
}







/* ===== TOUCH CONTACT PAGE ===== */

.contact-touch{
  max-width:1100px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:30px;
  padding:0 20px;
}

.touch-card{
  background:#fff;
  padding:30px 25px;
  border-radius:20px;
  box-shadow:0 15px 40px rgba(0,0,0,0.12);
  text-align:center;
  transition:.3s;
}

.touch-card:hover{
  transform:translateY(-8px);
}

.touch-card .icon{
  font-size:34px;
}

.touch-card h4{
  font-family:'Playfair Display',serif;
  margin:10px 0;
}

.touch-card p{
  font-size:15px;
  color:#555;
  line-height:1.6;
}

.touch-btn{
  display:inline-block;
  margin-top:15px;
  padding:12px 22px;
  background:var(--saffron);
  color:#fff;
  border-radius:30px;
  font-weight:600;
}

/* CALL & WHATSAPP */
.touch-actions{
  display:flex;
  gap:15px;
  margin-top:18px;
  justify-content:center;
}

.call-btn,
.wa-btn{
  flex:1;
  padding:14px;
  border-radius:30px;
  font-weight:700;
  color:#fff;
  text-align:center;
}

.call-btn{ background:#ff8c00; }
.wa-btn{ background:#25d366; }

/* FORM */
.contact-form-touch{
  max-width:500px;
  margin:auto;
  padding:0 20px;
}

.contact-form-touch form{
  background:#fff;
  padding:30px;
  border-radius:20px;
  box-shadow:0 15px 40px rgba(0,0,0,0.15);
}

.contact-form-touch input,
.contact-form-touch textarea{
  width:100%;
  padding:14px;
  border-radius:12px;
  border:1px solid #ddd;
  margin-bottom:15px;
  font-size:15px;
}

/* MAP */
.map-box{
  max-width:1100px;
  margin:auto;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 15px 40px rgba(0,0,0,0.2);
}

.map-box iframe{
  width:100%;
  height:360px;
  border:0;
}

/* MOBILE EXTRA TOUCH */
@media(max-width:600px){
  .touch-actions{
    flex-direction:column;
  }
}

.contact-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:30px;
}

.touch-card{
  background:#fff;
  padding:30px;
  border-radius:18px;
  text-align:center;
  box-shadow:0 15px 40px rgba(0,0,0,0.12);
}

.touch-card .icon{
  font-size:34px;
  display:block;
  margin-bottom:12px;
}

.touch-card h4{
  font-family:'Playfair Display',serif;
  margin-bottom:10px;
}

.touch-card p{
  color:#555;
  line-height:1.6;
}

.touch-btn{
  display:inline-block;
  margin-top:15px;
  padding:10px 20px;
  background:#f39c12;
  color:#fff;
  border-radius:25px;
  font-weight:600;
}

.touch-btn.green{
  background:#25d366;
  margin-left:10px;
}

.map-box{
  max-width:1100px;
  margin:30px auto;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 15px 40px rgba(0,0,0,0.15);
}

.map-box iframe{
  width:100%;
  height:420px;
  border:0;
}









/* ================= RESERVATION PAGE (ULTRA PREMIUM) ================= */

.reservation-box{
  max-width:860px;
  margin:0 auto;
  background:#ffffff;
  padding:48px;
  border-radius:24px;
  box-shadow:
    0 25px 60px rgba(0,0,0,0.18),
    inset 0 1px 0 rgba(255,255,255,0.6);
  position:relative;
}

/* SOFT TOP ACCENT */
.reservation-box::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:5px;
  background:linear-gradient(90deg,#ff9f43,#ff7a18);
  border-radius:24px 24px 0 0;
}

/* ================= FORM GRID ================= */

.reservation-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

/* ================= FORM GROUP ================= */

.form-group{
  display:flex;
  flex-direction:column;
}

.form-group.full{
  grid-column:1 / -1;
}

/* LABEL */
.form-group label{
  font-weight:600;
  margin-bottom:8px;
  color:#333;
  font-size:14px;
  letter-spacing:.3px;
}

/* INPUTS */
.form-group input,
.form-group select,
.form-group textarea{
  padding:14px 16px;
  border-radius:14px;
  border:1px solid #e0e0e0;
  font-size:14px;
  background:#fafafa;
  transition:all .25s ease;
}

/* FOCUS */
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  outline:none;
  border-color:#ff9f43;
  background:#fff;
  box-shadow:0 0 0 4px rgba(255,159,67,0.22);
}

/* TEXTAREA */
.form-group textarea{
  resize:none;
  height:105px;
}

/* ================= SUBMIT BUTTON ================= */

.reserve-btn{
  grid-column:1 / -1;
  margin-top:18px;
  padding:16px;
  font-size:16px;
  font-weight:600;
  border:none;
  border-radius:40px;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(135deg,#ff9f43,#ff7a18);
  transition:all .35s ease;
}

.reserve-btn:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 40px rgba(255,122,24,0.45);
}

.reserve-btn:active{
  transform:scale(.97);
}

/* ================= QUICK CONTACT ================= */

.quick-contact{
  text-align:center;
  margin-top:32px;
}

.quick-contact p{
  margin-bottom:14px;
  font-weight:500;
  color:#666;
  font-size:14px;
}

/* ================= HEADER RESERVE BUTTON (MATCHING) ================= */

nav a.btn{
  background:linear-gradient(135deg,#ff9f43,#ff7a18);
  color:#fff;
  border-radius:30px;
  padding:10px 22px;
  font-weight:600;
  transition:.3s;
}

nav a.btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(255,122,24,0.4);
}

/* ================= MOBILE RESPONSIVE ================= */

@media(max-width:768px){

  .reservation-box{
    padding:28px 22px;
    border-radius:20px;
  }

  .reservation-form{
    grid-template-columns:1fr;
    gap:18px;
  }

  .form-group label{
    font-size:13px;
  }

  .form-group input,
  .form-group select,
  .form-group textarea{
    font-size:14px;
    padding:13px 14px;
  }

  .reserve-btn{
    font-size:15px;
    padding:14px;
  }
}








/* ===== COMMON HERO (ALL PAGES) ===== */
.page-hero{
  position:relative;
  height:45vh;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  display:flex;
  align-items:center;
  justify-content:center;
}

.page-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.55); /* dark overlay */
}

.page-hero .hero-overlay{
  position:relative;
  text-align:center;
  color:#fff;
  padding:20px;
}

.page-hero h1{
  font-family:'Playfair Display',serif;
  font-size:44px;
  margin-bottom:10px;
}

.page-hero p{
  font-size:16px;
  opacity:.9;
}

/* MOBILE */
@media(max-width:768px){
  .page-hero{
    height:35vh;
  }

  .page-hero h1{
    font-size:30px;
  }

  .page-hero p{
    font-size:14px;
  }
}




.menu-hero{
  background-image:url("../images/home.png");
}


.gallery-hero{
  background-image:url("../images/about/restaurant.jpg");
}


.contact-hero{
  background-image:url("../images/about/restaurant.jpg");
}


.reservation-hero{
 background-image:url("../images/about/restaurant.jpg");
}


















/* ===== HEADER CART ICON ONLY ===== */
.cart-icon {
  position: relative;
  margin-left: 20px;
  display: flex;
  align-items: center;
}

.cart-icon img {
  width: 28px;
  height: 28px;
  cursor: pointer;
}

/* Cart count badge */
.cart-icon span {
  position: absolute;
  top: -6px;
  right: -8px;
  background: #ff6a00;
  color: #fff;
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 50%;
  font-weight: bold;
}

/* ===== CART PAGE ===== */
.cart-section {
  max-width: 1100px;
  margin: auto;
  padding: 20px;
}

.cart-items {
  margin-bottom: 30px;
}

.cart-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
  gap: 10px;
}

.cart-item h4 {
  margin: 0;
  font-family: 'Playfair Display', serif;
  font-size: 18px;
}

.cart-item p {
  margin: 4px 0 0;
  font-size: 14px;
  color: #666;
}

.cart-item .price {
  font-weight: bold;
  font-size: 16px;
}

/* ===== SUMMARY ===== */
.cart-summary {
  background: #fafafa;
  padding: 20px;
  border-radius: 8px;
}

.summary-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 12px;
  font-size: 15px;
}

.summary-row.total {
  font-size: 18px;
  font-weight: bold;
}

.whatsapp-btn {
  width: 100%;
  padding: 14px;
  background: #25D366;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
}

.whatsapp-btn:hover {
  background: #1ebe5d;
}

/* ===== HERO ===== */
.cart-hero {
   background-image:url("../images/png.png");
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {
  .cart-item {
    flex-direction: column;
    align-items: flex-start;
  }
  .cart-item .price {
    align-self: flex-end;
  }
}











/* ===== OUR MENU HEADER ===== */
.menu-header {
  max-width: 1200px;
  margin: 0 auto 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* ======================================
   FILTER + SEARCH BAR FINAL
====================================== */

.menu-filter-wrapper{
  position: sticky;
  top:80px;                /* navbar height adjust if needed */
  z-index:999;
  background:#fff;
  padding:10px 15px;
  display:flex;
  justify-content:flex-end;
}

/* SEARCH + FILTER SIDE BY SIDE */
.search-filter-box{
  display:flex;
  align-items:center;
  gap:8px;
}

/* SEARCH BOX */
.search-box input{
  height:42px;
  border-radius:25px;
  border:none;
  padding:0 15px;
  width:220px;
  background:#f5f5f5;
  outline:none;
  font-size:14px;
}

/* FILTER BUTTON */
.menu-filter{
  position:relative;
}

.filter-btn{
  width:42px;
  height:42px;
  border:none;
  border-radius:10px;
  background:#ff7a1a;
  color:#fff;
  font-size:18px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:0.25s;
}

.filter-btn:hover{
  transform:scale(1.05);
}

/* DROPDOWN */
.filter-dropdown{
  position:absolute;
  top:110%;      /* button ke niche */
  right:0;
  background:#fff;
  width:260px;
  border-radius:14px;
  box-shadow:0 15px 40px rgba(0,0,0,0.15);
  display:none;
  max-height:70vh;
  overflow-y:auto;
  z-index:9999;
}

/* LINKS */
.filter-dropdown a{
  display:block;
  padding:12px 16px;
  text-decoration:none;
  color:#333;
  font-weight:500;
  transition:0.2s;
}

.filter-dropdown a:hover{
  background:#ff7a1a;
  color:#fff;
}
















/* ================= WHY PEOPLE LOVE SECTION ================= */

.section.beige{
  background: linear-gradient(180deg,#fff7ec,#fdf1df);
}

/* Card Grid spacing upgrade */
.section.beige .card-grid{
  gap:36px;
}

/* Individual Card Styling */
.section.beige .card{
  background:#ffffff;
  padding:34px 28px;
  border-radius:22px;
  text-align:center;
  box-shadow:0 18px 45px rgba(0,0,0,0.12);
  transition:all .35s ease;
  position:relative;
  overflow:hidden;
}

/* Soft top accent */
.section.beige .card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:5px;
  background:linear-gradient(90deg,#ff9f43,#ff7a18);
}

/* Hover Effect */
.section.beige .card:hover{
  transform:translateY(-10px) scale(1.02);
  box-shadow:0 30px 70px rgba(0,0,0,0.22);
}

/* Heading */
.section.beige .card h3{
  font-family:'Playfair Display',serif;
  font-size:22px;
  margin-bottom:14px;
  color:#8B4513;
}

/* Paragraph */
.section.beige .card p{
  font-size:15px;
  line-height:1.7;
  color:#555;
}

/* ================= MOBILE OPTIMIZATION ================= */

@media(max-width:768px){

  .section.beige .card{
    padding:26px 20px;
  }

  .section.beige .card h3{
    font-size:20px;
  }

  .section.beige .card p{
    font-size:14px;
  }
}

@media(max-width:480px){

  .section.beige{
    padding:70px 16px;
  }

  .section.beige .card{
    border-radius:18px;
  }
}









/* ================= ABOUT PREMIUM ================= */

.about-premium{
  background:linear-gradient(180deg,#fffaf3,#fdf1df);
}

/* MAIN WRAPPER */
.about-wrapper{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

/* IMAGE */
.about-image img{
  width:100%;
  border-radius:26px;
  box-shadow:0 25px 60px rgba(0,0,0,0.2);
  transition:.4s ease;
}

.about-image img:hover{
  transform:scale(1.03);
}

/* CONTENT */
.about-content{
  padding-right:20px;
}

/* TAG */
.about-tag{
  display:inline-block;
  background:linear-gradient(135deg,#ff9f43,#ff7a18);
  color:#fff;
  padding:6px 18px;
  border-radius:30px;
  font-size:13px;
  letter-spacing:1px;
  margin-bottom:14px;
  box-shadow:0 8px 22px rgba(255,122,24,.35);
}

/* HEADING */
.about-content h2{
  font-family:'Playfair Display',serif;
  font-size:38px;
  color:#8B4513;
  margin-bottom:18px;
}

/* PARAGRAPH */
.about-content p{
  font-size:16px;
  line-height:1.8;
  color:#555;
  margin-bottom:26px;
}

/* FEATURES GRID */
.about-features{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;
  margin-bottom:30px;
}

.about-features div{
  background:#fff;
  padding:14px 16px;
  border-radius:14px;
  font-size:14px;
  font-weight:500;
  box-shadow:0 8px 22px rgba(0,0,0,0.1);
  transition:.3s;
}

.about-features div:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 36px rgba(0,0,0,0.18);
}

/* ACTION BUTTONS */
.about-actions{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}

/* OUTLINE BUTTON */
.btn.outline{
  background:transparent;
  border:2px solid #ff9f43;
  color:#ff7a18;
  box-shadow:none;
}

.btn.outline:hover{
  background:#ff9f43;
  color:#fff;
}

/* ================= MOBILE ================= */

@media(max-width:900px){
  .about-wrapper{
    grid-template-columns:1fr;
    gap:40px;
    text-align:center;
  }

  .about-content{
    padding-right:0;
  }

  .about-actions{
    justify-content:center;
  }
}

@media(max-width:480px){
  .about-content h2{
    font-size:28px;
  }

  .about-content p{
    font-size:14px;
  }

  .about-features{
    grid-template-columns:1fr;
  }
}








/* ================= PREMIUM GALLERY ================= */

.gallery-premium{
  background:linear-gradient(180deg,#fff,#fff4e6);
  text-align:center;
}

/* HEADER */
.gallery-top{
  max-width:760px;
  margin:0 auto 50px;
}

.gallery-badge{
  display:inline-block;
  padding:6px 20px;
  font-size:12px;
  letter-spacing:1px;
  color:#fff;
  background:linear-gradient(135deg,#ff9f43,#ff7a18);
  border-radius:30px;
  margin-bottom:14px;
  box-shadow:0 10px 28px rgba(255,122,24,.35);
}

.gallery-title{
  font-family:'Playfair Display',serif;
  font-size:38px;
  color:#8B4513;
}

.gallery-desc{
  margin-top:12px;
  font-size:15px;
  color:#666;
  line-height:1.7;
}

/* GRID */
.gallery-layout{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:240px;
  gap:20px;
}

/* CARD */
.gallery-card{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 20px 45px rgba(0,0,0,0.25);
  cursor:pointer;
  transition:.4s ease;
}

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

/* OVERLAY */
.gallery-overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  padding:20px;
  background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,.1));
  opacity:0;
  transition:.4s ease;
}

.gallery-overlay span{
  color:#fff;
  font-size:14px;
  letter-spacing:1px;
  font-weight:500;
}

/* HOVER */
.gallery-card:hover img{
  transform:scale(1.12);
  filter:brightness(.85);
}

.gallery-card:hover .gallery-overlay{
  opacity:1;
}

.gallery-card:hover{
  transform:translateY(-8px);
}

/* SIZE VARIANTS */
.gallery-card.large{
  grid-row:span 2;
}

.gallery-card.wide{
  grid-column:span 2;
}

/* CTA */
.gallery-action{
  margin-top:50px;
}

/* ================= RESPONSIVE ================= */

@media(max-width:992px){
  .gallery-layout{
    grid-template-columns:repeat(2,1fr);
    grid-auto-rows:220px;
  }

  .gallery-card.large{
    grid-row:span 1;
  }

  .gallery-card.wide{
    grid-column:span 2;
  }
}

@media(max-width:600px){
  .gallery-layout{
    grid-template-columns:1fr;
    grid-auto-rows:220px;
  }

  .gallery-card.large,
  .gallery-card.wide{
    grid-column:auto;
    grid-row:auto;
  }

  .gallery-title{
    font-size:28px;
  }

  .gallery-desc{
    font-size:14px;
  }
}





/* ================= PREMIUM CTA ================= */

.cta-premium{
  position:relative;
  padding:130px 20px;
  background:
    linear-gradient(135deg,#ff9f43 0%, #ff7a18 40%, #d86b12 100%);
  color:#fff;
  text-align:center;
  overflow:hidden;
}

/* soft luxury glow */
.cta-premium::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.18), transparent 60%),
    radial-gradient(circle at bottom right, rgba(0,0,0,.25), transparent 55%);
  pointer-events:none;
}

/* CONTENT */
.cta-content{
  position:relative;
  max-width:1200px;
  margin:auto;
  z-index:2;
}

/* BADGE */
.cta-badge{
  display:inline-block;
  background:rgba(255,255,255,.22);
  backdrop-filter:blur(6px);
  padding:10px 22px;
  border-radius:40px;
  font-size:13px;
  font-weight:600;
  letter-spacing:1px;
  margin-bottom:22px;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
}

/* HEADING */
.cta-premium h2{
  font-family:'Playfair Display',serif;
  font-size:48px;
  line-height:1.2;
  margin-bottom:18px;
  text-shadow:0 6px 25px rgba(0,0,0,.25);
}

/* TEXT */
.cta-premium p{
  max-width:760px;
  margin:0 auto 55px;
  font-size:18px;
  line-height:1.8;
  opacity:.95;
}

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

.cta-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:32px;
  margin-bottom:55px;
}

.cta-card{
  background:rgba(255,255,255,.95);
  color:#2d2d2d;
  padding:38px 28px;
  border-radius:26px;
  box-shadow:
    0 25px 60px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.6);
  transition:all .45s cubic-bezier(.4,0,.2,1);
  text-align:center;
}

.cta-card .icon{
  font-size:38px;
  margin-bottom:14px;
  display:block;
}

.cta-card h4{
  font-family:'Playfair Display',serif;
  font-size:20px;
  margin-bottom:6px;
}

.cta-card p{
  font-size:14.5px;
  color:#555;
}

/* CLICKABLE CARD */
.cta-card.clickable{
  text-decoration:none;
  cursor:pointer;
}

.cta-card.clickable:hover{
  transform:translateY(-12px) scale(1.02);
  box-shadow:
    0 40px 90px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.8);
}

.cta-card.clickable:active{
  transform:scale(.96);
}

/* ================= BUTTONS ================= */

.cta-actions{
  display:flex;
  justify-content:center;
  gap:22px;
  flex-wrap:wrap;
}

/* PRIMARY */
.btn.primary{
  background:#ffffff;
  color:#ff7a18;
  padding:16px 42px;
  border-radius:50px;
  font-weight:700;
  font-size:15px;
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  transition:.35s ease;
}

/* OUTLINE */
.btn.outline{
  background:transparent;
  border:2px solid rgba(255,255,255,.9);
  color:#fff;
  padding:16px 42px;
  border-radius:50px;
  font-weight:700;
  font-size:15px;
  transition:.35s ease;
}

/* WHATSAPP SPECIAL */
.btn.whatsapp{
  border-color:#25D366;
  color:#25D366;
}

.btn.whatsapp:hover{
  background:#25D366;
  color:#fff;
  box-shadow:0 18px 45px rgba(37,211,102,.45);
}

/* BUTTON HOVER */
.btn:hover{
  transform:translateY(-4px);
}

/* ================= MOBILE ================= */

@media(max-width:768px){
  .cta-premium{
    padding:100px 16px;
  }

  .cta-premium h2{
    font-size:32px;
  }

  .cta-premium p{
    font-size:15.5px;
  }

  .cta-actions{
    flex-direction:column;
  }

  .btn{
    width:100%;
    text-align:center;
  }
}






/* ================= DELIVERY OVERLAY ================= */
.delivery-overlay{
  position:fixed;
  inset:0;
  background:#000;
  display:none;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  z-index:9999;
}

.delivery-overlay video{
  width:100%;
  height:100%;
  object-fit:cover;
}

.delivery-text{
  position:absolute;
  bottom:12%;
  text-align:center;
  color:#fff;
}

.delivery-text h2{
  font-size:22px;
  margin-bottom:6px;
}

.delivery-text p{
  font-size:14px;
  opacity:.85;
}





/* =================Zomato categories================= */
/* ===== CATEGORY BAR ===== */
.category-scroll-wrapper{
  position: sticky;
  top: 60px;
  z-index: 99;
  background: #fff;
  padding: 8px 0;
  border-bottom: 1px solid #eee;
}

.category-scroll{
  display: flex;
  gap: 16px;
  padding: 0 16px;
  overflow-x: auto;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

.category-scroll::-webkit-scrollbar{
  display: none;
}

/* ===== CATEGORY CARD ===== */
.category-card{
  min-width: 88px;
  text-align: center;
  text-decoration: none;
  color: #222;
  font-size: 12px;
  font-weight: 500;
  flex-shrink: 0;
}

.category-card img{
  width: 52px;
  height: 52px;
  object-fit: contain;
  margin-bottom: 6px;
  pointer-events: none;
}

.category-card span{
  display: block;
  line-height: 1.2;
}

/* ===== DESKTOP UPGRADE ===== */
@media (min-width: 768px){
  .category-scroll-wrapper{
    top: 80px;
    padding: 12px 0;
  }

  .category-scroll{
    gap: 22px;
    padding: 0 24px;
  }

  .category-card{
    min-width: 110px;
    font-size: 14px;
  }

  .category-card img{
    width: 64px;
    height: 64px;
  }
}




/* ===== TABLE ORDER LANDING ===== */
.table-order-premium{
  background:#faf7f3;
  padding:80px 20px;
}

.table-order-wrapper{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}

.table-order-image{
  position:relative;
}

.table-order-image img{
  width:100%;
  border-radius:22px;
  box-shadow:0 20px 50px rgba(0,0,0,.25);
}

.dinein-badge{
  position:absolute;
  top:20px;
  left:20px;
  background:#7a1f1f;
  color:#fff;
  padding:8px 14px;
  border-radius:20px;
  font-size:13px;
  font-weight:600;
}

.table-order-content h2{
  font-size:40px;
  margin:15px 0;
  color:#2b1b1b;
}

.order-tag{
  font-size:13px;
  color:#7a1f1f;
  font-weight:600;
  letter-spacing:1px;
}

.table-order-content p{
  font-size:16px;
  color:#555;
  line-height:1.7;
  margin-bottom:25px;
}

.order-features{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin-bottom:35px;
}

.order-features div{
  background:#fff;
  padding:14px 16px;
  border-radius:14px;
  font-weight:600;
  box-shadow:0 8px 20px rgba(0,0,0,.08);
}

.order-actions{
  display:flex;
  gap:15px;
}

.btn.primary{
  background:linear-gradient(135deg,#ff9f1a,#ff7a18);
  color:#fff;
  padding:14px 26px;
  border-radius:30px;
  font-weight:700;
  text-decoration:none;
}

.btn.outline{
  border:2px solid #7a1f1f;
  color:#7a1f1f;
  padding:14px 26px;
  border-radius:30px;
  font-weight:700;
  text-decoration:none;
}

/* ===== MOBILE ===== */
@media(max-width:900px){
  .table-order-wrapper{
    grid-template-columns:1fr;
  }

  .table-order-content h2{
    font-size:30px;
  }
}




/* ===== ADD MORE ITEMS BUTTON ===== */
/* ===== CART ITEM ===== */
.cart-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#fff;
  padding:18px 20px;
  border-radius:18px;
  margin-bottom:14px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.cart-left h4{
  margin:0 0 6px;
}

.cart-left p{
  font-size:14px;
  color:#777;
}

.cart-middle{
  display:flex;
  justify-content:center;
}

.cart-qty{
  display:flex;
  align-items:center;
  gap:10px;
}

.cart-qty button{
  width:34px;
  height:34px;
  border:none;
  border-radius:10px;
  background:#ff8c1a;
  color:#fff;
  font-size:18px;
  cursor:pointer;
}

.cart-qty span{
  font-weight:600;
}

.cart-price{
  font-weight:700;
}

/* ===== ADD MORE ITEMS (GLOBAL) ===== */
.add-more-wrapper{
  padding:14px 10px;
}

.add-more-global{
  color:#1b8f3c;
  font-weight:600;
  font-size:15px;
  text-decoration:none;
}

.add-more-global:hover{
  text-decoration:underline;
}

/* ===== MOBILE ===== */
@media(max-width:768px){
  .cart-item{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }

  .cart-price{
    align-self:flex-end;
  }
}

/* ================= MOBILE : ZOMATO STYLE SINGLE CART BOX ================= */
@media (max-width: 768px){

  /* ONE BIG WHITE BOX */
  .cart-items{
    background:#fff;
    border-radius:18px;
    padding:10px 14px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
  }

  /* EACH ITEM = ROW (NO CARD FEEL) */
  .cart-item{
    background:transparent;
    box-shadow:none;
    border-radius:0;
    padding:14px 0;
    margin:0;
    flex-direction:row;
    align-items:center;
    border-bottom:1px solid #eee;
  }

  .cart-item:last-of-type{
    border-bottom:none;
  }

  .cart-left h4{
    font-size:16px;
  }

  .cart-left p{
    font-size:13px;
  }

  .cart-middle{
    align-items:center;
  }

  .cart-price{
    font-size:15px;
  }

  /* ADD MORE ITEMS = SAME BOX LAST ROW */
  .add-more-wrapper{
    padding:14px 0 4px;
    margin-top:6px;
    border-top:1px solid #eee;
  }

  .add-more-global{
    font-size:15px;
    font-weight:600;
    color:#1b8f3c;
  }
}







