:root{
  --cream:#faf6ee;
  --cream-2:#f3ecdd;
  --ink:#2f2a22;
  --muted:#7a6f5d;
  --craft:#a8663b;      /* terracotta */
  --craft-dark:#8a5330;
  --olive:#6e7a4f;
  --line:#e6ddc9;
  --card:#fffdf8;
}
*{box-sizing:border-box}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
}
h1,h2,h3,h4,h5,.serif{font-family:'Fraunces','Georgia',serif;font-weight:500;color:var(--ink);letter-spacing:-.01em}
a{color:var(--craft);text-decoration:none}
a:hover{color:var(--craft-dark)}
.text-muted{color:var(--muted)!important}
.eyebrow{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--craft);font-weight:600}

/* Buttons */
.btn-craft{background:var(--craft);border-color:var(--craft);color:#fff}
.btn-craft:hover{background:var(--craft-dark);border-color:var(--craft-dark);color:#fff}
.btn-outline-craft{border:1px solid var(--craft);color:var(--craft);background:transparent}
.btn-outline-craft:hover{background:var(--craft);color:#fff}
.btn-dark-craft{background:var(--ink);color:#fff;border:none}
.btn-dark-craft:hover{background:#000;color:#fff}

/* Topbar + nav */
.topbar{background:var(--cream-2);color:var(--muted);border-bottom:1px solid var(--line)}
.topbar a{color:var(--craft)}
.site-nav{background:rgba(250,246,238,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.navbar-brand{font-family:'Fraunces',serif;font-size:1.4rem;font-weight:600;color:var(--ink)!important;display:flex;align-items:center;gap:.4rem}
.brand-mark{color:var(--craft)}
.brand-sub{font-family:'Inter';font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-left:.4rem}
.site-nav .nav-link{color:var(--ink);font-weight:500;padding:.4rem .85rem;font-size:.95rem}
.site-nav .nav-link:hover{color:var(--craft)}
.nav-search .form-control{border-radius:20px;border-color:var(--line);background:#fff;min-width:150px}
.btn-icon{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:var(--ink);font-size:1.1rem;position:relative}
.btn-icon:hover{background:var(--cream-2);color:var(--craft)}
.cart-badge{position:absolute;top:2px;right:2px;background:var(--craft);color:#fff;font-size:.62rem;font-weight:600;border-radius:10px;padding:1px 5px;line-height:1}


@media (min-width: 1200px) and (max-width: 1360px) {
  .site-nav .navbar-nav .nav-link {
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
    font-size: 0.84rem !important;
    white-space: nowrap !important;
  }
  .site-nav .nav-search input {
    width: 100px !important;
  }
}



/* Hero */
.hero{background:linear-gradient(180deg,var(--cream) 0%,var(--cream-2) 100%);padding:4.5rem 0 3rem}
.hero h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;margin-bottom:1rem}
.hero-lead{font-size:1.12rem;color:var(--muted);max-width:34rem}
.hero-img{border-radius:18px;overflow:hidden;box-shadow:0 20px 50px -20px rgba(90,60,30,.35)}
.hero-img img{width:100%;height:100%;object-fit:cover}
.hero-quote{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem;margin-top:-2.5rem;position:relative;z-index:2;font-family:'Fraunces',serif;font-style:italic}
.stat h3{font-size:2rem;color:var(--craft);margin:0}
.stat span{font-size:.82rem;color:var(--muted)}

/* Sections */
.section{padding:3.5rem 0}
.section-head .eyebrow{display:block;margin-bottom:.4rem}
.section-head h2{font-size:clamp(1.6rem,3.5vw,2.4rem)}

/* Value cards */
.value-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.6rem;height:100%}
.value-card .ic{width:48px;height:48px;border-radius:12px;background:var(--cream-2);display:flex;align-items:center;justify-content:center;color:var(--craft);font-size:1.4rem;margin-bottom:.9rem}

/* Product cards */
.product-card{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;height:100%;transition:.18s;display:flex;flex-direction:column}
.product-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(90,60,30,.4);border-color:#dcceb0}
.product-thumb{aspect-ratio:1/1;overflow:hidden;background:var(--cream-2);position:relative}
.product-thumb img{width:100%;height:100%;object-fit:cover;transition:.35s}
.product-card:hover .product-thumb img{transform:scale(1.05)}
.product-cat{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--craft);font-weight:600}
.product-body{padding:.9rem 1rem 1.1rem;display:flex;flex-direction:column;flex:1}
.product-title{font-family:'Fraunces',serif;font-size:1.02rem;margin:.15rem 0 .3rem;color:var(--ink)}
.product-desc{font-size:.82rem;color:var(--muted);flex:1}
.product-price{font-weight:600;color:var(--ink);font-size:1.05rem}
.badge-soft{background:var(--cream-2);color:var(--craft);font-weight:500;border:1px solid var(--line)}
.wish-btn{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.9);border:none;border-radius:50%;width:36px;height:36px;color:var(--craft)}
.wish-btn:hover{background:#fff}

/* Category pills */
.cat-pills{display:flex;flex-wrap:wrap;gap:.5rem}
.cat-pill{border:1px solid var(--line);background:var(--card);border-radius:30px;padding:.4rem 1rem;font-size:.88rem;color:var(--ink)}
.cat-pill.active,.cat-pill:hover{background:var(--craft);color:#fff;border-color:var(--craft)}

/* Banners */
.banner{background:var(--cream-2);border-radius:18px;overflow:hidden}
.banner img{width:100%;height:100%;object-fit:cover;min-height:280px}

/* FAQ / accordion */
.accordion-button:not(.collapsed){background:var(--cream-2);color:var(--craft)}
.accordion-button:focus{box-shadow:none}

/* Product detail */
.detail-gallery {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--cream-2);
}

.detail-gallery img {
  width: 100%;
  max-height: 80vh; /* Keeps extra tall images from running off the screen */
  object-fit: contain; /* Prevents awkward cropping of your bags & pouches */
  display: block;
}

/* Sticky on desktop screens */
@media (min-width: 992px) {
  .detail-gallery {
    position: -webkit-sticky;
    position: sticky;
    top: 90px;
    align-self: flex-start;
  }
}
.qty-input{width:80px}
.price-lg{font-size:1.8rem;font-weight:600;font-family:'Fraunces',serif}
.mrp{color:var(--muted);text-decoration:line-through;font-size:1.1rem;margin-left:.5rem}
.off-badge{background:var(--olive);color:#fff;font-size:.75rem;border-radius:6px;padding:.15rem .5rem;margin-left:.5rem}

/* Footer */
.site-footer{background:var(--cream-2);border-top:1px solid var(--line)}
.footer-brand{font-family:'Fraunces',serif}
.footer-links a{color:var(--muted);font-size:.9rem;display:inline-block;padding:.12rem 0}
.footer-links a:hover{color:var(--craft)}
.site-footer h6{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin-bottom:.8rem}

/* Tables / account */
.card-craft{background:var(--card);border:1px solid var(--line);border-radius:14px}
.table thead th{color:var(--muted);font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}

/* Steps / checkout */
.summary-box{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1.4rem;position:sticky;top:90px}

/* Utility */
.form-control:focus,.form-select:focus{border-color:var(--craft);box-shadow:0 0 0 .2rem rgba(168,102,59,.15)}
.rounded-craft{border-radius:14px}
.divider{height:1px;background:var(--line);margin:1.5rem 0}

/* ============================================================
   Floating WhatsApp + Call buttons (with blink / pulse)
   ============================================================ */
.floating-actions{
  position:fixed; right:18px; bottom:18px; z-index:1050;
  display:flex; flex-direction:column; gap:12px;
}
.fab{
  width:56px; height:56px; border-radius:50%;
  display:grid; place-items:center;
  color:#fff; font-size:1.5rem; text-decoration:none;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  transition:transform .15s ease, box-shadow .15s ease;
  position:relative;
}
.fab:hover{ transform:translateY(-3px) scale(1.06); color:#fff; box-shadow:0 10px 24px rgba(0,0,0,.3); }
.fab-whatsapp{ background:#25d366; }
.fab-call{ background:var(--craft); }

/* Blink = soft pulsing glow ring + gentle opacity blink */
.fab.blink::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow:0 0 0 0 currentColor; opacity:.6;
  animation:fabPulse 1.8s infinite;
}
.fab-whatsapp.blink::before{ color:#25d366; }
.fab-call.blink::before{ color:var(--craft); }
.fab.blink{ animation:fabBlink 1.8s infinite; }
@keyframes fabPulse{
  0%{ box-shadow:0 0 0 0 rgba(37,211,102,.55); }
  70%{ box-shadow:0 0 0 16px rgba(37,211,102,0); }
  100%{ box-shadow:0 0 0 0 rgba(37,211,102,0); }
}
.fab-call.blink::before{ animation:fabPulseCraft 1.8s infinite; }
@keyframes fabPulseCraft{
  0%{ box-shadow:0 0 0 0 rgba(168,102,59,.55); }
  70%{ box-shadow:0 0 0 16px rgba(168,102,59,0); }
  100%{ box-shadow:0 0 0 0 rgba(168,102,59,0); }
}
@keyframes fabBlink{
  0%,100%{ filter:brightness(1); }
  50%{ filter:brightness(1.18); }
}
@media (max-width:576px){
  .fab{ width:50px; height:50px; font-size:1.3rem; }
  .floating-actions{ right:12px; bottom:12px; }
}
@media (prefers-reduced-motion: reduce){
  .fab.blink, .fab.blink::before{ animation:none; }
}

/* ============================================================
   Blog
   ============================================================ */
.blog-card{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  overflow:hidden; height:100%; display:flex; flex-direction:column;
  transition:box-shadow .18s ease, transform .18s ease;
}
.blog-card:hover{ box-shadow:0 12px 30px rgba(47,42,34,.10); transform:translateY(-3px); }
.blog-card .thumb{ aspect-ratio:16/9; overflow:hidden; background:var(--cream-2); }
.blog-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.blog-card .body{ padding:1.1rem 1.2rem 1.3rem; display:flex; flex-direction:column; gap:.4rem; }
.blog-card .cat{ font-size:.72rem; letter-spacing:.05em; text-transform:uppercase; color:var(--craft); font-weight:600; }
.blog-card h3{ font-size:1.1rem; margin:0; line-height:1.3; }
.blog-card h3 a{ color:var(--ink); text-decoration:none; }
.blog-card h3 a:hover{ color:var(--craft); }
.blog-card .excerpt{ color:var(--muted); font-size:.92rem; margin:0; }
.blog-card .meta{ color:#a99; font-size:.78rem; margin-top:auto; }
.post-hero{ background:var(--cream-2); }
.post-cover{ max-height:440px; width:100%; object-fit:cover; border-radius:14px; }
.post-content{ font-size:1.08rem; line-height:1.8; color:#3a3428; }
.post-content h2,.post-content h3{ font-family:'Fraunces',Georgia,serif; margin-top:1.6rem; }
.post-content img{ max-width:100%; border-radius:10px; }
.post-content blockquote{ border-left:4px solid var(--craft); margin:1.2rem 0; padding:.4rem 0 .4rem 1rem; color:var(--muted); font-style:italic; }