:root{
  --cream: #FDF4DD;
  --cream-deep: #F5E9C8;
  --brown: #753A13;
  --brown-deep: #4A250C;
  --line: rgba(117,58,19,0.18);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--cream);
  color:var(--brown-deep);
  font-family:'Work Sans', sans-serif;
  font-size:16px;
  line-height:1.6;
}
h1,h2,h3,.display{
  font-family:'Fraunces', serif;
  font-weight:600;
  color:var(--brown-deep);
  letter-spacing:-0.01em;
}
a{color:inherit;}
img{max-width:100%; display:block;}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}

/* ---------- NAV ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background 0.25s ease;
}
.nav .wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:84px;
}
.nav-brand{
  display:flex; align-items:center; gap:10px;
  text-decoration:none;
}
.nav-brand img{height:56px; width:56px; border-radius:50%; box-shadow:0 2px 10px rgba(0,0,0,0.18);}
.nav-links{display:flex; gap:36px; list-style:none; font-size:0.92rem; font-weight:500;}
.nav-links a{text-decoration:none; letter-spacing:0.01em; opacity:0.72; transition:opacity 0.2s ease, color 0.2s ease;}
.nav-links a.active{opacity:1; font-weight:600;}
.nav-cta{
  text-decoration:none;
  padding:12px 26px; border-radius:3px; font-size:0.88rem; font-weight:600;
  white-space:nowrap; letter-spacing:0.01em;
}
.nav-right{display:flex; align-items:center; gap:36px;}
.nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:6px;}
.nav-toggle span{display:block; width:24px; height:2px; margin:5px 0;}

/* Solid variant (default: after scroll, or any page without a hero image) */
.nav{
  background:rgba(253,244,221,0.94);
  backdrop-filter:blur(6px);
  border-bottom:none;
}
.nav .nav-links a, .nav .nav-brand span{color:var(--brown-deep);}
.nav .nav-links a.active{color:var(--brown);}
.nav .nav-cta{background:var(--brown-deep); color:var(--cream);}
.nav .nav-cta:hover{background:var(--brown);}
.nav-toggle span{background:var(--brown-deep);}

/* On-image variant: smoked shade over the hero, cream links, until scrolled */
.nav.on-image:not(.scrolled){
  background:linear-gradient(180deg, rgba(40,20,8,0.70) 0%, rgba(40,20,8,0.60) 50%, rgba(40,20,8,0) 100%);
  border-bottom:none;
  backdrop-filter:none;
}
.nav.on-image:not(.scrolled) .nav-links a,
.nav.on-image:not(.scrolled) .nav-brand span{color:#FDF4DD; opacity:0.88;}
.nav.on-image:not(.scrolled) .nav-links a.active{color:#FDF4DD; opacity:1;}
.nav.on-image:not(.scrolled) .nav-cta{background:var(--cream); color:var(--brown-deep);}
.nav.on-image:not(.scrolled) .nav-cta:hover{background:#fff;}
.nav.on-image:not(.scrolled) .nav-toggle span{background:#FDF4DD;}

@media (max-width:860px){
  .nav-links{
    position:fixed; top:84px; left:0; right:0; bottom:0;
    background:var(--cream); flex-direction:column; gap:0;
    padding:12px 28px; transform:translateX(100%); transition:transform 0.25s ease;
  }
  .nav-links.open{transform:translateX(0);}
  .nav-links a{color:var(--brown-deep) !important; display:block; padding:16px 0; border-bottom:1px solid var(--line); font-size:1.05rem;}
  .nav-right{gap:14px;}
  .nav-toggle{display:block;}
  .nav.on-image:not(.scrolled) .nav-toggle span{background:#FDF4DD;}
}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-block; text-decoration:none;
  padding:14px 28px; border-radius:3px;
  font-weight:500; font-size:1rem;
  border:1.5px solid var(--brown-deep);
}
.btn-primary{background:var(--brown-deep); color:var(--cream);}
.btn-primary:hover{background:var(--brown);}
.btn-ghost{background:transparent; color:var(--brown-deep);}
.btn-ghost:hover{background:rgba(117,58,19,0.06);}

#menu, #story, #catering{
  scroll-margin-top: 84px;
}

.hero-full{
  position:relative;
  height:100vh; min-height:640px;
  overflow:hidden;
}
.hero-full img{
  width:100%; height:100%; object-fit:cover; object-position:50% 42%;
}
.hero-scroll-cue{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  color:#FDF4DD; font-size:0.8rem; letter-spacing:0.06em; text-transform:uppercase;
  opacity:0.85;
}

/* ---------- SECTIONS ---------- */
.section{padding:96px 0;}
.section-tight{padding:72px 0;}
.section-head{margin-bottom:40px;}
.section-head h2{font-size:clamp(1.6rem,2.8vw,2.1rem); font-weight:600;}
.section-head .sub{color:var(--brown); max-width:44ch; font-size:1rem; margin-top:8px;}

/* ---------- OUR STORY (title + two-column story) ---------- */
.story-section{padding:88px 0 96px;}
.story-layout{display:grid; grid-template-columns:0.9fr 1.1fr; gap:72px; align-items:start;}
.story-head h1{font-size:clamp(1.9rem,3.3vw,2.6rem); line-height:1.15;}
.story-body p{color:var(--brown); font-size:1.03rem; line-height:1.7; margin-bottom:18px; max-width:58ch;}
@media (max-width:860px){
  .story-section{padding:56px 0 72px;}
  .story-layout{grid-template-columns:1fr; gap:28px;}
}
.story-actions{margin-top:64px; text-align:center;}
.story-actions .hero-actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:18px;}
.story-actions .menu-link{margin-bottom:28px; font-size:0.95rem;}
.story-actions .menu-link a{color:var(--brown-deep); text-decoration:underline; text-underline-offset:3px;}
.story-actions .hero-meta{display:flex; gap:32px; justify-content:center; font-size:0.9rem; color:var(--brown); flex-wrap:wrap;}
.story-actions .hero-meta strong{display:block; color:var(--brown-deep); font-weight:600;}

/* ---------- MENU ---------- */
.menu-tabs{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px; border-bottom:1px solid var(--line);}
.menu-tab{
  background:none; border:none; cursor:pointer;
  font-family:'Work Sans', sans-serif; font-weight:500; font-size:0.95rem;
  color:var(--brown); padding:10px 4px; margin-right:22px;
  border-bottom:2px solid transparent; position:relative; top:1px;
}
.menu-tab.active{color:var(--brown-deep); border-bottom-color:var(--brown-deep);}
.menu-panel{display:none;}
.menu-panel.active{display:block; animation:fadein .25s ease;}
@keyframes fadein{from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);}}
.menu-list{display:grid; grid-template-columns:1fr 1fr; gap:0 56px;}
@media (max-width:760px){.menu-list{grid-template-columns:1fr;}}
.menu-col{min-width:0;}
.menu-item{padding:20px 0; border-bottom:1px solid var(--line); display:flex; flex-direction:column; gap:6px;}
.menu-item-top{display:flex; justify-content:space-between; align-items:baseline; gap:12px;}
.menu-item-name{font-family:'Fraunces', serif; font-weight:600; font-size:1.08rem;}
.menu-item-price{font-weight:600; color:var(--brown); white-space:nowrap; font-size:0.98rem;}
.menu-item-desc{color:var(--brown); font-size:0.92rem; line-height:1.55;}
.tag-row{display:flex; gap:6px; margin-top:2px;}
.tag{font-size:0.68rem; text-transform:uppercase; letter-spacing:0.04em; padding:2px 7px; border-radius:2px; font-weight:600;}
.tag-nonveg{background:rgba(117,58,19,0.12); color:var(--brown-deep);}
.tag-veg{background:rgba(117,58,19,0.08); color:var(--brown);}
.tag-gf{background:rgba(117,58,19,0.06); color:var(--brown);}
.menu-price-note{margin-top:40px; font-size:0.9rem; line-height:1.55; color:var(--brown-deep); opacity:0.9; max-width:62ch; text-wrap:balance;}

/* ---------- SPLIT CARDS (Instagram + WhatsApp, Catering) ---------- */
.connect-section{padding:0;}
.catering-section{padding:56px 0 96px;}
.split-card{border:1px solid var(--line); border-radius:6px; padding:56px 32px 52px;}
.split-title{text-align:center; font-size:clamp(1.8rem,3.4vw,2.4rem); font-weight:600; margin-bottom:36px;}
.split-intro{text-align:center; color:var(--brown); font-size:1.03rem; line-height:1.65; max-width:46ch; margin:-12px auto 32px; text-wrap:balance;}
.split-grid{display:grid; grid-template-columns:1fr 1fr;}
.split-col{text-align:center; padding:8px 40px;}
.split-col + .split-col{border-left:1px solid var(--line);}
.split-col svg{width:30px; height:30px; color:var(--brown-deep); margin:0 auto 16px; display:block;}
.split-col h3{font-size:1.35rem; font-weight:600; margin-bottom:10px;}
.split-col p{color:var(--brown); font-size:1rem; line-height:1.6; max-width:34ch; margin:0 auto 22px; text-wrap:balance;}
.contact-label{font-family:'Fraunces', serif; font-weight:600; font-size:1.1rem; color:var(--brown-deep); margin-bottom:6px;}
.contact-link{display:inline-block; font-size:1.1rem; color:var(--brown-deep); text-decoration:none; border-bottom:1.5px solid var(--brown-deep); padding-bottom:1px; word-break:break-word;}
.contact-link:hover{color:var(--brown);}
@media (max-width:760px){
  .split-card{padding:44px 20px 40px;}
  .split-grid{grid-template-columns:1fr; gap:32px;}
  .split-col{padding:8px 12px;}
  .split-col + .split-col{border-left:none; border-top:1px solid var(--line); padding-top:32px;}
}

/* ---------- FOOTER ---------- */
footer{background:var(--brown-deep); color:rgba(253,244,221,0.65); padding:64px 0 32px;}
footer .wrap{max-width:1120px;}
.footer-grid{
  display:grid; grid-template-columns:1.05fr 1.3fr 0.9fr 1.35fr; gap:40px;
  padding-bottom:32px; border-bottom:1px solid rgba(253,244,221,0.14);
}
@media (max-width:760px){
  .footer-grid{grid-template-columns:1fr 1fr; row-gap:28px; column-gap:20px;}
  .footer-loc{grid-column:1 / -1; order:1;}
  .footer-hours{order:2;}
  .footer-follow{order:3;}
  .footer-brand-col{grid-column:1 / -1; order:4; border-top:1px solid rgba(253,244,221,0.14); padding-top:20px;}
}
.footer-col p{font-size:0.9rem; line-height:1.6; margin-bottom:6px;}
.footer-brand{font-family:'Fraunces', serif; font-weight:600; font-size:1.15rem; color:var(--cream); margin-bottom:10px;}
.footer-col h4{font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; color:rgba(253,244,221,0.62); font-weight:600; margin-bottom:12px;}
.footer-col a{color:rgba(253,244,221,0.85); text-decoration:none; font-size:0.9rem;}
.footer-col a:hover{color:var(--cream);}
.footer-note{opacity:0.8; font-size:0.85rem; margin-top:10px; max-width:26ch;}
.footer-link{display:flex; align-items:center; gap:8px; font-weight:600; margin-bottom:10px;}
.footer-link svg{width:18px; height:18px; flex-shrink:0;}
.footer-addr{display:flex; align-items:flex-start; gap:8px; font-size:0.9rem; line-height:1.6;}
.footer-addr svg{width:18px; height:18px; flex-shrink:0; margin-top:3px;}
.footer-dir{display:block; margin:8px 0 0 26px;}
footer .wrap > p{margin-top:24px; font-size:0.8rem; opacity:0.6;}