:root{
  --maroon:#731919;
  --maroon-2:#5a1414;
  --gold:#c8a94a;
  --ivory:#f8f5ef;
  --ink:#2b2b2b;
}

/* ✅ Global container */
.container {
  max-width: 1200px;  /* standard desktop width */
  margin: 0 auto;
  padding: 0 20px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:var(--ivory);
  line-height:1.6;
}

/* Header */
.site-header{
  position:sticky;top:0;z-index:50;
  background:linear-gradient(180deg, #fff, rgba(255,255,255,.92));
  backdrop-filter:saturate(180%) blur(6px);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.header-wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-img img{height:55px;width:auto;display:block;border-radius:8px}
.brand.text-logo .brand-text{display:inline}
.brand-text{font-family:'Marcellus',serif;font-weight:600;color:var(--maroon);font-size:1.75rem;display:flex}

/* Nav */
.nav{position:relative}
.nav-links{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.nav-links a{color:var(--ink);text-decoration:none;font-weight:600}
.nav-links a:hover{color:var(--maroon)}
.cart-link{background:var(--maroon);color:#fff !important;padding:8px 12px;border-radius:999px}
.hamburger{display:none;cursor:pointer;padding:8px}
.hamburger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}

#nav-toggle{display:none}
@media(max-width:840px){
  .hamburger{display:block}

  .nav-links {
    position: fixed;             /* ✅ overlay the whole viewport */
    top: 60px;                   /* ✅ just below the header (adjust if header taller) */
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid rgba(0,0,0,.08);
    padding: 20px;
    display: none;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    height: auto;                /* menu grows with items */
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
    z-index: 1000;               /* ✅ above everything */
  }

  #nav-toggle:checked ~ .nav-links {
    display: flex;
  }

  .nav-links a {
    padding: 12px 0;
    font-size: 1.1rem;
  }
}



.grid.three {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* Always 3 cards in desktop */
  gap: 20px;
}

.panel.image-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  transition: transform 0.3s;
}
.panel.image-card:hover {
  transform: translateY(-5px);
}

/* Mobile view: enable horizontal scroll */
@media (max-width: 860px) {
  .grid.three {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;
  }

  .panel.image-card {
    flex: 0 0 75%;          /* Card size (smaller on mobile) */
    scroll-snap-align: start;
  }
}


/* Buttons */
.btn{display:inline-block;text-decoration:none;padding:12px 18px;border-radius:999px;border:2px solid transparent;font-weight:600;transition:all .2s}
.btn.primary{background:var(--maroon);color:#fff;border-color:var(--maroon)}
.btn.primary:hover{background:var(--maroon-2);border-color:var(--maroon-2)}
.btn.ghost {
  background: transparent;
  color: #fff;           /* ✅ White text */
  border: 2px solid #fff;/* ✅ White border */
}

.btn.ghost:hover {
  background: rgba(255, 255, 255, 0.1); /* ✅ Subtle white hover */
}

.btn.small {
  padding: 8px 14px;
  background: #fff;
  color: var(--maroon);
  border: 2px solid #fff;
  border-radius: 6px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.btn.small:hover {
  background: var(--maroon);
  color: #fff;
  border-color: var(--maroon);
}

.btn.tiny{padding:6px 12px;font-size:.9rem}

/* Hero */
.hero{position:relative}
.hero-media{height:62vh;min-height:420px;max-height:840px;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(105%) contrast(98%)}
.hero-content{position:relative;margin-top:-120px;padding:24px;background:linear-gradient(135deg, rgba(115,25,25,.93), rgba(200,169,74,.88));color:#fff;border-radius:24px;box-shadow:0 12px 40px rgba(0,0,0,.18)}
.hero h1{font-family:'Marcellus',serif;font-size: clamp(28px, 4vw, 48px);margin:0 0 8px}
.hero p{opacity:.95;margin:0 0 16px}
.cta-group{display:flex;gap:12px;flex-wrap:wrap}

/* Feature strip */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:48px auto}
.feature{background:#fff;padding:18px;border-radius:16px;border:1px solid rgba(0,0,0,.06);box-shadow:0 6px 18px rgba(0,0,0,.05);text-align:center}
.feature .icon{font-size:24px}
@media(max-width:860px){.features{grid-template-columns:1fr}}

/* Image cards */
.image-card{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.image-card img{width:100%;height:340px;object-fit:cover;display:block}
.image-card .overlay{position:absolute;inset:auto 0 0 0;padding:18px;background:linear-gradient(180deg, transparent, rgba(0,0,0,.65));color:#fff}
.image-card h3{font-family:'Marcellus',serif;margin:0 0 8px}

/* Ribbon */
.ribbon{background:var(--maroon);color:#fff;margin:48px 0}
.ribbon-flex{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0}
.ribbon .btn.ghost.light:hover{background:rgba(255,255,255,.12)}

/* Testimonials */
.testimonials .slider{position:relative;overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:24px;box-shadow:0 10px 32px rgba(0,0,0,.06)}
.slide{display:none;text-align:center}
.slide.active{display:block}
.testimonials h2.center{text-align:center;margin-bottom:16px}

/* Shop */
.page-title{font-family:'Marcellus',serif;color:var(--maroon)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.chip{display:inline-block;padding:8px 12px;border-radius:999px;border:1px solid rgba(0,0,0,.12);text-decoration:none;color:var(--ink)}
.chip.active,.chip:hover{background:var(--maroon);color:#fff;border-color:var(--maroon)}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:1000px){.product-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.product-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.product-grid{grid-template-columns:1fr}}
.product-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:16px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.05)}
.product-card img{width:100%;height:210px;object-fit:cover}
.product-card h3{margin:12px 12px 6px}
.product-card p{margin:0 12px 12px;color:#555}
.price-row{display:flex;align-items:center;justify-content:space-between;padding:12px;border-top:1px solid rgba(0,0,0,.06)}
.price{font-weight:700;color:var(--maroon)}

/* Forms */
.form input,.form textarea{width:100%;padding:12px;border-radius:12px;border:1px solid rgba(0,0,0,.15);margin-bottom:12px;background:#fff}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:720px){.form .row{grid-template-columns:1fr}}
.mt{margin-top:12px}
.tick{padding-left:18px}
.tick li{margin-bottom:6px}

/* Gallery */
.masonry{columns:3 280px;column-gap:16px}
.masonry img{width:100%;margin:0 0 16px;border-radius:16px;display:block}

/* Contact */
.map{width:100%;height:260px;border:0;border-radius:16px}

/* Footer */
.site-footer{background:#121212;color:#d9d9d9;margin-top:54px;padding:36px 0 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px;padding-bottom:18px}
.footer-links,.footer-contact{list-style:none;padding:0;margin:0}
.footer-links li,.footer-contact li{margin:6px 0}
.footer-links a{color:#d9d9d9;text-decoration:none}
.footer-links a:hover{color:#fff}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.08);font-size:.9rem}
.newsletter{display:flex;gap:8px;margin-top:10px}
.newsletter input{flex:1;border-radius:999px;border:1px solid rgba(255,255,255,.18);padding:10px;background:#1d1d1d;color:#fff}
.newsletter button{border-radius:999px;border:1px solid var(--gold);background:transparent;color:var(--gold);padding:10px 14px;cursor:pointer}
.whatsapp-float{position:fixed;right:16px;bottom:16px;background:#25D366;color:#fff;padding:12px 14px;border-radius:999px;text-decoration:none;box-shadow:0 10px 30px rgba(0,0,0,.2)}

.center{text-align:center}

/* ✅ FSSAI License section */
.fssai-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 1.2rem;
  color: #d9d9d9;
}

.fssai-logo {
  width: 80px;
  height: auto;
}

/* Make it stack nicely on mobile */
@media (max-width: 768px) {
  .fssai-info {
    flex-direction: column;
    text-align: center;
  }
}

/* ✅ FSSAI License section */
.msme-info {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 1.2rem;
  color: #d9d9d9;
}

.msme-logo {
  width: 80px;
  height:40px;
}

/* Make it stack nicely on mobile */
@media (max-width: 768px) {
  .fssai-info {
    flex-direction: column;
    text-align: center;
  }
}


/* Cart badge */
.cart-badge{display:inline-flex;min-width:18px;height:18px;padding:0 6px;margin-right:6px;align-items:center;justify-content:center;border-radius:999px;background:#ffd166;color:#000;font-size:.75rem;font-weight:700}

.cart-table{width:100%;background:#fff;border-radius:16px;border:1px solid rgba(0,0,0,.06);overflow:hidden}
.cart-table th,.cart-table td{padding:12px;border-bottom:1px solid rgba(0,0,0,.06);text-align:left}
.cart-summary{margin-top:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.form-select{width:100%;padding:12px;border-radius:12px;border:1px solid rgba(0,0,0,.15);background:#fff;margin-bottom:12px}
.inline{display:inline-flex;gap:8px;align-items:center}


.policy.container {
  max-width: 900px;
  margin: auto;
  padding: 40px 20px;
}
.policy-card {
  background: #fff;
  border-radius: 12px;
  padding: 25px;
  margin-bottom: 25px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.policy-card h2 {
  font-size: 1.3rem;
  margin-bottom: 12px;
  color: #007bff;
}
.policy-card p, .policy-card ul, .policy-card ol {
  font-size: 1rem;
  line-height: 1.6;
  color: #333;
}
.policy-card ul, .policy-card ol {
  margin-left: 20px;
}


/* Prevent global horizontal scroll */
html, body {
  overflow-x: hidden;
}



/* Mobile: allow scroll ONLY for the 3 product cards */
@media (max-width: 860px) {
  .grid.three {
    display: flex;
    gap: 16px;
    overflow-x: auto;          /* ✅ Only this section scrolls */
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 12px;
    margin: 0 -10px;           /* ✅ Keeps layout aligned */
    padding-left: 10px;
  }

  .grid.three .panel.image-card {
    flex: 0 0 75%;             /* ✅ Show partial next card */
    scroll-snap-align: start;
  }
}


/* Footer responsive fix */
@media (max-width: 768px) {
  .footer-grid {
    grid-template-columns: 1fr;   /* stack in one column */
    text-align: center;
  }
  .footer-contact li {
    word-break: break-word;       /* break long words if needed */
    overflow-wrap: anywhere;
  }
  .footer-bottom {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }
}

body {
  margin: 0; /* reset default */
}



