/* ══════════════════════════════════════════
   ROOT TOKENS
══════════════════════════════════════════ */
:root {
  --rose:      #C8847A;
  --rose-d:    #9E5A52;
  --maroon:    #5C1A2A;
  --maroon-d:  #3A0D18;
  --maroon-xl: #250810;
  --champ:     #F5E6CC;
  --champ-2:   #EAD5B3;
  --champ-dim: rgba(245,230,204,0.6);
  --gold:      #D4A855;
  --gold-l:    #EFC97A;
  --ink:       #0D0703;
  --ink-2:     #180A06;
  --ink-3:     #221008;
  --glass:     rgba(92,26,42,0.20);
  --gborder:   rgba(200,132,122,0.26);
  --wa:        #25D366;
  --wa-d:      #1aad53;
  --navy:      #0A1628;
  --navy-l:    #132240;
  --sage:      #3D5A4A;
  --r:         14px;
  --r2:        22px;
  --shadow:    0 18px 48px rgba(0,0,0,0.4);
  --font-serif: 'Cormorant Garamond', Georgia, serif;
  --font-body:  'DM Sans', system-ui, sans-serif;
}

/* ══════════════════════════════════════════
   RESET
══════════════════════════════════════════ */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  background: var(--ink);
  color: var(--champ);
  font-family: var(--font-body);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button { border:none; background:none; cursor:pointer; font-family:var(--font-body); }
ul { list-style:none; }

/* ══════════════════════════════════════════
   STRIP / TICKER
══════════════════════════════════════════ */
.strip {
  background: linear-gradient(90deg, var(--maroon-d), var(--maroon), var(--maroon-d));
  padding: 8px 0;
  overflow: hidden;
  border-bottom: 1px solid rgba(200,132,122,0.22);
  position: relative; z-index:300;
}
.strip-track {
  display: flex;
  white-space: nowrap;
  animation: ticker 24s linear infinite;
}
.strip-track span {
  padding: 0 32px;
  font-size: 10.5px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--champ);
  opacity: .9;
}
.strip-track span em { color: var(--gold-l); font-style:normal; font-weight:700; }
.strip-track::after { content: attr(data-dup); }
@keyframes ticker { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ══════════════════════════════════════════
   NAV
══════════════════════════════════════════ */
nav {
  position: sticky; top:0; z-index:400;
  display: flex; align-items:center; justify-content:space-between;
  padding: 13px 5%;
  background: linear-gradient(90deg, rgba(26,4,8,0.97), rgba(58,13,24,0.95), rgba(26,4,8,0.97));
  backdrop-filter: blur(22px);
  border-bottom: 1px solid rgba(200,132,122,0.22);
  gap: 12px;
}
.logo {
  font-family: var(--font-serif);
  font-size: clamp(20px, 3.5vw, 28px);
  font-weight: 700;
  letter-spacing: .5px;
  flex-shrink: 0;
  line-height: 1;
}
.logo em { color: var(--rose); font-style:italic; }

/* ── Logo image replacement ── */
.logo {
  font-size: 0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
/* Clipping wrapper — hides the excess black PNG padding,
   shows only the illustration + Bengali text area */
.logo-clip {
  display: block;
  width: 168px;
  height: 78px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}
.logo-img {
  position: absolute;
  width: 400px;
  height: auto;
  top: 50%;
  left: 50%;
  transform: translate(-58%, -46%);
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}
/* Tablet */
@media (max-width: 1024px) {
  .logo-clip { width: 144px; height: 66px; }
  .logo-img  { width: 3240px; }
}
/* Mobile */
@media (max-width: 768px) {
  .logo-clip { width: 116px; height: 54px; }
  .logo-img  { width: 145px; }
}
/* Mobile menu logo — inside the slide-out panel */
.logo-img--mobile-menu {
  position: static;
  width: 150px;
  height: auto;
  transform: none;
}
.nav-links {
  display: flex; gap: 28px; align-items:center;
}
.nav-links a {
  font-size: 11px; letter-spacing:2px; text-transform:uppercase;
  font-weight: 500; color: var(--champ-dim);
  position: relative; transition: color .25s ease;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0;
  width:0; height:1px; background:var(--rose);
  transition: width .3s ease;
  transform-origin: left center;
}
.nav-links a:hover { color:var(--champ); }
.nav-links a:hover::after { width:100%; }
.nav-cta {
  display: inline-flex; align-items:center; gap:7px;
  background: var(--wa); color:#fff;
  padding: 9px 18px; border-radius:50px;
  font-size: 11px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; transition: background .2s, transform .15s;
  flex-shrink: 0;
}
.nav-cta:hover { background:var(--wa-d); transform:translateY(-1px); }

/* ══ NAV COLLECTION DROPDOWN — premium floating card ══ */
.nav-dropdown-wrap {
  position: relative;
  list-style: none;
}
.nav-dropdown-trigger {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--champ-dim);
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px 0;
  position: relative;
  transition: color .25s ease;
  font-family: var(--font-body);
}
/* Matching underline — identical timing/origin to nav-links a */
.nav-dropdown-trigger::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--rose);
  transition: width .3s ease;
  transform-origin: left center;
}
.nav-dropdown-wrap.dd-hover .nav-dropdown-trigger,
.nav-dropdown-trigger[aria-expanded="true"] {
  color: var(--champ);
}
.nav-dropdown-wrap.dd-hover .nav-dropdown-trigger::after,
.nav-dropdown-trigger[aria-expanded="true"]::after {
  width: 100%;
}

/* Chevron arrow — smooth 180° rotation */
.nav-dd-arrow {
  transition: transform .3s cubic-bezier(.4,0,.2,1), opacity .25s ease;
  flex-shrink: 0;
  opacity: 0.5;
}
.nav-dropdown-trigger[aria-expanded="true"] .nav-dd-arrow,
.nav-dropdown-wrap.dd-hover .nav-dd-arrow {
  transform: rotate(180deg);
  opacity: 0.9;
}

/* ── Floating panel — premium card with blur ── */
.nav-dropdown-panel {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(-10px);
  min-width: 210px;
  background: linear-gradient(160deg,
    rgba(30, 8, 14, 0.96) 0%,
    rgba(48, 13, 22, 0.97) 100%
  );
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(200,132,122,0.18);
  border-radius: 14px;
  box-shadow:
    0 8px 32px rgba(0,0,0,0.55),
    0 2px 8px rgba(0,0,0,0.3),
    inset 0 1px 0 rgba(200,132,122,0.08);
  padding: 10px 0;
  opacity: 0;
  pointer-events: none;
  transition:
    opacity .3s cubic-bezier(.25,.46,.45,.94),
    transform .3s cubic-bezier(.25,.46,.45,.94);
  z-index: 500;
  /* Bridge gap between trigger and panel — prevents flicker */
}
/* Invisible hover bridge — fills gap between trigger bottom and panel top */
.nav-dropdown-panel::before {
  content: '';
  position: absolute;
  top: -18px;
  left: 0;
  right: 0;
  height: 18px;
  background: transparent;
}

.nav-dropdown-wrap.dd-hover .nav-dropdown-panel,
.nav-dropdown-panel.dd-open {
  opacity: 1;
  pointer-events: all;
  transform: translateX(-50%) translateY(0);
}

/* Thin decorative top line */
.nav-dropdown-panel::after {
  content: '';
  position: absolute;
  top: 0;
  left: 20%;
  right: 20%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,132,122,0.4), transparent);
  border-radius: 1px;
}

/* ── Each item — elegant, breathing space, underline animation ── */
.nav-dd-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 11px 24px;
  color: rgba(245,230,204,0.52);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: color .3s ease, background .25s ease;
  cursor: pointer;
  white-space: nowrap;
}
/* Hover background highlight */
.nav-dd-item:hover {
  color: var(--champ);
  background: rgba(200,132,122,0.07);
}
/* Underline that grows left → right */
.nav-dd-item::after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 24px;
  right: 24px;
  height: 1px;
  background: linear-gradient(90deg, var(--rose), var(--gold-l));
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .35s cubic-bezier(.25,.46,.45,.94);
  border-radius: 1px;
}
.nav-dd-item:hover::after {
  transform: scaleX(1);
}
/* Subtle left accent bar */
.nav-dd-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 20%;
  bottom: 20%;
  width: 2px;
  background: var(--rose);
  border-radius: 2px;
  transform: scaleY(0);
  transform-origin: center;
  transition: transform .25s cubic-bezier(.25,.46,.45,.94);
}
.nav-dd-item:hover::before {
  transform: scaleY(1);
}

/* Staggered slide-in per item when panel opens */
.nav-dropdown-panel.dd-open .nav-dd-item,
.nav-dropdown-wrap.dd-hover .nav-dd-item {
  animation: ddItemIn .3s ease forwards;
}
.nav-dropdown-panel.dd-open .nav-dd-item:nth-child(1),
.nav-dropdown-wrap.dd-hover .nav-dd-item:nth-child(1) { animation-delay: 0ms; }
.nav-dropdown-panel.dd-open .nav-dd-item:nth-child(2),
.nav-dropdown-wrap.dd-hover .nav-dd-item:nth-child(2) { animation-delay: 40ms; }
.nav-dropdown-panel.dd-open .nav-dd-item:nth-child(3),
.nav-dropdown-wrap.dd-hover .nav-dd-item:nth-child(3) { animation-delay: 80ms; }
.nav-dropdown-panel.dd-open .nav-dd-item:nth-child(4),
.nav-dropdown-wrap.dd-hover .nav-dd-item:nth-child(4) { animation-delay: 120ms; }
@keyframes ddItemIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Separator line between items */
.nav-dd-item + .nav-dd-item {
  border-top: 1px solid rgba(200,132,122,0.07);
}

/* Hide old icon/text helper classes (no longer in HTML, safety rule) */
.nav-dd-icon, .nav-dd-text, .nav-dd-label, .nav-dd-sub { display: none; }

/* ══ MOBILE ACCORDION — Collection ══ */
.mmn-accordion {
  display: flex;
  flex-direction: column;
}
.mmn-accordion-trigger {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  color: var(--champ-dim);
  font-size: 14px;
  font-weight: 500;
  font-family: var(--font-body);
  background: none;
  border: none;
  border-bottom: 1px solid rgba(200,132,122,0.1);
  text-align: left;
  cursor: pointer;
  width: 100%;
  transition: color .2s, background .2s;
}
.mmn-accordion-trigger .mmn-icon {
  /* reuse existing mmn-icon style */
}
.mmn-accordion-trigger:hover {
  color: var(--champ);
  background: rgba(200,132,122,0.06);
}
.mmn-acc-arrow {
  margin-left: auto;
  transition: transform .25s cubic-bezier(.4,0,.2,1);
  flex-shrink: 0;
  color: rgba(245,230,204,0.4);
}
.mmn-accordion-trigger[aria-expanded="true"] .mmn-acc-arrow {
  transform: rotate(180deg);
}
.mmn-accordion-trigger[aria-expanded="true"] {
  color: var(--champ);
  background: rgba(200,132,122,0.06);
}

/* Accordion panel */
.mmn-accordion-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height .32s cubic-bezier(.4,0,.2,1);
  background: rgba(0,0,0,0.25);
}
.mmn-accordion-panel.mmn-acc-open {
  max-height: 400px;
}
.mmn-accordion-panel a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 20px 13px 28px;
  color: rgba(245,230,204,0.6);
  border-bottom: 1px solid rgba(200,132,122,0.06);
  text-decoration: none;
  transition: background .18s, color .18s;
}
.mmn-accordion-panel a:last-child { border-bottom: none; }
.mmn-accordion-panel a:hover {
  background: rgba(200,132,122,0.08);
  color: var(--champ);
}
.mmn-sub-icon {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: rgba(200,132,122,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--rose);
  flex-shrink: 0;
}
.mmn-sub-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.mmn-sub-label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
}
.mmn-sub-desc {
  font-size: 10.5px;
  color: rgba(245,230,204,0.35);
  line-height: 1.2;
}

/* ══ COUPLE SET SECTION ACCENT ══ */
.couple-sec .panjabi-card,
.couple-card {
  /* inherits all .p-card styles, no override needed */
}

/* ══ WEDDING SECTION ACCENT ══ */
.wedding-sec {
  background: linear-gradient(180deg, transparent, rgba(212,168,85,.04), transparent);
}
.bdg-bridal {
  background: linear-gradient(135deg, #8B6914, #D4A855);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 4px;
}
.nav-order-wrap { position:relative; flex-shrink:0; }
.nav-order-btn {
  display: inline-flex; align-items:center; gap:7px;
  background: linear-gradient(135deg, var(--maroon), var(--rose-d));
  color: var(--champ);
  padding: 9px 18px 9px 16px; border-radius:50px;
  font-size: 11px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; transition: all .2s; cursor:pointer;
  border: 1px solid rgba(200,132,122,0.35);
  font-family: var(--font-body);
}
.nav-order-btn:hover { background: linear-gradient(135deg, var(--maroon-d), var(--rose)); transform:translateY(-1px); box-shadow: 0 6px 20px rgba(92,26,42,.4); }
.nav-order-btn .chevron {
  font-size:8px; transition:transform .25s; display:inline-block;
}
.nav-order-btn.active .chevron { transform:rotate(180deg); }
.nav-order-drop {
  position:absolute; top:calc(100% + 9px); right:0;
  background: var(--ink-2);
  border: 1px solid var(--gborder);
  border-radius: 14px;
  min-width: 210px;
  overflow:hidden;
  box-shadow: 0 20px 50px rgba(0,0,0,0.55);
  opacity:0; pointer-events:none;
  transform: translateY(-8px) scale(.97);
  transition: opacity .22s, transform .22s;
  z-index: 500;
}
.nav-order-drop.open { opacity:1; pointer-events:all; transform:translateY(0) scale(1); }
.nav-drop-item {
  display:flex; align-items:center; gap:11px;
  padding:14px 18px; color:var(--champ);
  font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:600; font-family:var(--font-body);
  transition: background .18s; cursor:pointer;
  border:none; width:100%; text-align:left;
}
.nav-drop-item:first-child { border-bottom:1px solid rgba(200,132,122,.12); }
.nav-drop-item:hover { background: rgba(200,132,122,.12); }
.nav-drop-item .drop-icon { font-size:16px; flex-shrink:0; }
.nav-drop-item .drop-label { flex:1; }
.nav-drop-item .drop-sub { font-size:9px; color:var(--champ-dim); letter-spacing:.5px; text-transform:none; font-weight:400; display:block; margin-top:1px; }

/* ══════════════════════════════════════════
   HERO
══════════════════════════════════════════ */
.hero {
  min-height: clamp(560px, 92svh, 900px);
  display: flex; align-items:center; justify-content:center;
  flex-direction: column; text-align:center;
  padding: 64px 5% 80px;
  position: relative; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 100% 80% at 50% 60%, rgba(92,26,42,.44) 0%, transparent 68%),
    radial-gradient(ellipse 55% 45% at 78% 22%, rgba(200,132,122,.09) 0%, transparent 60%),
    radial-gradient(ellipse 40% 60% at 15% 75%, rgba(212,168,85,.05) 0%, transparent 55%),
    var(--ink);
}
/* Subtle pattern overlay */
.hero-bg::after {
  content:'';
  position:absolute; inset:0;
  background-image: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 40px,
    rgba(200,132,122,0.018) 40px,
    rgba(200,132,122,0.018) 41px
  );
}
.hero-content { position:relative; z-index:1; max-width:780px; }
.hero-tag {
  display:inline-flex; align-items:center; gap:8px;
  background: rgba(92,26,42,.55); border:1px solid rgba(200,132,122,.32);
  padding: 6px 18px; border-radius:50px;
  font-size:10px; letter-spacing:3px; text-transform:uppercase;
  color:var(--gold-l); font-weight:600;
  margin-bottom:24px;
  animation: fadeUp .55s .05s both;
}
.hero-tag::before { content:'◆'; font-size:6px; color:var(--rose); }
.hero-title {
  font-family: var(--font-serif);
  font-size: clamp(42px, 10vw, 100px);
  font-weight: 700; line-height:1.04;
  color: var(--champ); margin-bottom:14px;
  animation: fadeUp .65s .18s both;
}
.hero-title em { color:var(--rose); font-style:italic; display:block; }
.hero-sub {
  font-size: clamp(11px, 1.8vw, 13px);
  letter-spacing:3px; text-transform:uppercase;
  color:var(--champ-dim); margin-bottom:38px;
  animation: fadeUp .65s .32s both;
  line-height:2;
}
.hero-btns {
  display:flex; flex-wrap:wrap; gap:13px; justify-content:center;
  animation: fadeUp .65s .46s both;
}
.btn-wa-lg {
  display:inline-flex; align-items:center; gap:10px;
  background:var(--wa); color:#fff;
  padding:15px 34px; border-radius:50px;
  font-size:13px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; box-shadow:0 8px 28px rgba(37,211,102,.28);
  transition: background .2s, transform .15s, box-shadow .2s;
  font-family:var(--font-body);
  position:relative; overflow:hidden;
}
.btn-wa-lg:hover { background:var(--wa-d); transform:translateY(-2px); box-shadow:0 14px 36px rgba(37,211,102,.38); }
.btn-outline {
  display:inline-flex; align-items:center; gap:9px;
  background:transparent; color:var(--champ);
  padding:15px 28px; border-radius:50px;
  border:1px solid rgba(200,132,122,.42);
  font-size:11px; letter-spacing:2px; text-transform:uppercase;
  font-weight:600; transition:all .2s;
  font-family:var(--font-body);
}
.btn-outline:hover { border-color:var(--rose); background:rgba(200,132,122,.1); transform:translateY(-2px); }
.hero-pills {
  display:flex; flex-wrap:wrap; gap:16px; justify-content:center;
  margin-top:36px; animation: fadeUp .65s .6s both;
}
.pill {
  display:flex; align-items:center; gap:6px;
  font-size:10.5px; letter-spacing:1px; text-transform:uppercase;
  color:var(--champ-dim);
}
.pill svg { opacity:.65; flex-shrink:0; }
/* Scroll indicator */
.scroll-hint {
  position:absolute; bottom:28px; left:50%;
  transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:6px;
  opacity:.35; z-index:1;
}
.scroll-line {
  width:1px; height:42px;
  background:linear-gradient(to bottom, transparent, var(--rose));
  animation: scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse { 0%,100%{opacity:.3;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(1.15)} }

/* ══════════════════════════════════════════
   SCARCITY BAR
══════════════════════════════════════════ */
.scarcity {
  background: linear-gradient(90deg, var(--maroon-d), rgba(92,26,42,.88), var(--maroon-d));
  padding:13px 5%;
  display:flex; align-items:center; justify-content:center;
  flex-wrap:wrap; gap:18px 28px;
  border-top:1px solid rgba(200,132,122,.18);
  border-bottom:1px solid rgba(200,132,122,.18);
}
.s-item {
  display:flex; align-items:center; gap:9px;
  font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:600; color:var(--champ);
}
.s-dot { width:7px; height:7px; border-radius:50%; background:var(--wa); flex-shrink:0; animation:blink 1.5s ease-in-out infinite; }
.cd-wrap { display:flex; align-items:center; gap:4px; }
.cd-box {
  background:var(--maroon); border:1px solid rgba(200,132,122,.28);
  padding:3px 9px; border-radius:6px;
  font-family:var(--font-serif); font-size:14px; font-weight:700;
  color:var(--gold-l); min-width:32px; text-align:center;
}
.cd-sep { color:var(--rose); font-weight:800; font-size:13px; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.28} }

/* ══════════════════════════════════════════
   SECTION SHARED
══════════════════════════════════════════ */
.sec { padding:72px 5%; position:relative; }
.sec-inner { max-width:1200px; margin:0 auto; }
.sec-head { text-align:center; margin-bottom:48px; }
.eyebrow {
  display:block; font-size:10px; letter-spacing:4px;
  text-transform:uppercase; color:var(--gold-l);
  font-weight:600; margin-bottom:12px;
}
.sec-title {
  font-family:var(--font-serif);
  font-size:clamp(28px, 4vw, 48px); font-weight:700;
  color:var(--champ); line-height:1.12;
}
.sec-title em { color:var(--rose); font-style:italic; }
.sec-line {
  width:48px; height:1px; margin:14px auto 0;
  background:linear-gradient(to right, transparent, var(--rose), transparent);
}
.sec-sub {
  margin-top:12px; font-size:13px;
  color:var(--champ-dim); letter-spacing:.5px;
}

/* ══════════════════════════════════════════
   PRODUCT GRID
══════════════════════════════════════════ */
.pgrid {
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:22px;
}
/* Hidden overflow cards */
.p-card.hidden-card { display:none; }
.p-card.hidden-card.revealed { display:flex; }
.see-more-row { text-align:center; margin-top:32px; }
.btn-see-more {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--glass); backdrop-filter:blur(12px);
  border:1px solid var(--gborder); color:var(--champ);
  padding:12px 30px; border-radius:50px;
  font-size:11px; letter-spacing:2px; text-transform:uppercase;
  font-weight:600; transition:all .25s;
}
.btn-see-more:hover { border-color:var(--rose); background:rgba(200,132,122,.12); }
.btn-see-more .arrow { transition:transform .3s; }
.btn-see-more.open .arrow { transform:rotate(180deg); }

/* ══════════════════════════════════════════
   PRODUCT CARD
══════════════════════════════════════════ */
.p-card {
  background:var(--glass);
  backdrop-filter:blur(16px);
  border:1px solid var(--gborder);
  border-radius:var(--r2);
  overflow:hidden;
  flex-direction:column;
  display:flex;
  transition:transform .3s, box-shadow .3s, border-color .3s;
}
.p-card:hover {
  transform:translateY(-5px);
  box-shadow:0 22px 50px rgba(92,26,42,.38);
  border-color:rgba(200,132,122,.45);
}
.p-img-wrap {
  width:100%; aspect-ratio:3/4;
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  font-size:clamp(56px, 8vw, 80px);
  transition:transform .4s;
}
.p-card:hover .p-img-wrap { transform:scale(1.03); }
.p-img-wrap img {
  width:100%; height:100%;
  object-fit:cover;
}
.p-img-placeholder { /* when no real image */
  width:100%; aspect-ratio:3/4;
  display:flex; align-items:center; justify-content:center;
  font-size:clamp(56px, 8vw, 80px);
  position:relative; overflow:hidden;
  transition:transform .4s;
}
.p-card:hover .p-img-placeholder { transform:scale(1.03); }
/* Ensure real product images fill the placeholder correctly */
.p-img-placeholder img {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:center top;
}
.p-badges {
  position:absolute; top:11px; left:0; right:0;
  display:flex; justify-content:space-between;
  padding:0 11px; z-index:2;
}
.bdg {
  font-size:8.5px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:800; padding:4px 11px; border-radius:50px;
  line-height:1;
}
.bdg-cat { background:rgba(58,13,24,.88); color:var(--champ); border:1px solid rgba(200,132,122,.25); }
.bdg-stock { background:rgba(200,132,122,.92); color:#fff; animation:blink 2s infinite; }
.bdg-eid { background:rgba(10,22,40,.9); color:#7BA4F0; border:1px solid rgba(123,164,240,.3); }
.bdg-couple { background:linear-gradient(90deg, var(--maroon), var(--navy-l)); color:var(--champ); border:1px solid rgba(200,132,122,.2); }
.bdg-new { background:rgba(212,168,85,.9); color:var(--ink); }
.p-body { padding:18px 18px 20px; flex:1; display:flex; flex-direction:column; }
.p-name {
  font-family:var(--font-serif); font-size:clamp(16px, 2vw, 19px);
  font-weight:600; color:var(--champ); margin-bottom:4px; line-height:1.3;
}
.p-meta { font-size:11px; color:var(--champ-dim); letter-spacing:.5px; margin-bottom:2px; }
.p-code { font-size:10px; color:rgba(245,230,204,.3); letter-spacing:1px; text-transform:uppercase; margin-bottom:10px; }
.p-price-row { display:flex; align-items:baseline; gap:7px; margin-bottom:14px; }
.p-price {
  font-family:var(--font-serif); font-size:clamp(18px, 2.5vw, 22px);
  font-weight:700; color:var(--champ);
}
.p-price-old {
  font-size:12px; color:rgba(245,230,204,.32);
  text-decoration:line-through;
}
.p-price-save {
  font-size:9px; letter-spacing:1px; text-transform:uppercase;
  background:rgba(37,211,102,.15); color:#25D366;
  border:1px solid rgba(37,211,102,.25);
  padding:2px 7px; border-radius:50px; font-weight:700;
}
.p-btns {
  display:flex; flex-direction:column; gap:8px;
  margin-top:auto;
}
.p-btns-row1 {
  display:grid; grid-template-columns:1fr auto; gap:8px;
}
.btn-wa-prod {
  display:flex; align-items:center; justify-content:center; gap:6px;
  background:var(--wa); color:#fff;
  padding:9px 12px; border-radius:10px;
  font-size:10.5px; letter-spacing:1.2px; text-transform:uppercase;
  font-weight:700; transition:background .2s, transform .15s;
  font-family:var(--font-body);
  white-space:nowrap;
}
.btn-wa-prod:hover { background:var(--wa-d); transform:scale(1.03); }
/* Cart drop wrapper */
.cart-drop-wrap { position:relative; }
.btn-order-direct {
  display:flex; align-items:center; justify-content:center;
  background:var(--glass); backdrop-filter:blur(10px);
  border:1px solid var(--gborder); color:var(--champ);
  padding:9px 11px; border-radius:10px;
  font-size:13px; transition:all .2s;
}
.btn-order-direct:hover { border-color:var(--rose); background:rgba(200,132,122,.15); }
.cart-mini-drop {
  position:absolute; bottom:calc(100% + 7px); right:0;
  background:var(--ink-2); border:1px solid var(--gborder);
  border-radius:12px; min-width:185px; overflow:hidden;
  box-shadow:0 12px 36px rgba(0,0,0,.55);
  opacity:0; pointer-events:none;
  transform:translateY(6px) scale(.97);
  transition:opacity .2s, transform .2s;
  z-index:100;
}
.cart-mini-drop.open { opacity:1; pointer-events:all; transform:translateY(0) scale(1); }
.cmd-item {
  display:flex; align-items:center; gap:9px;
  padding:11px 14px; color:var(--champ);
  font-size:11px; letter-spacing:1px; text-transform:uppercase;
  font-weight:600; font-family:var(--font-body);
  transition:background .15s; cursor:pointer;
  border:none; width:100%; text-align:left; background:none;
}
.cmd-item:first-child { border-bottom:1px solid rgba(200,132,122,.1); }
.cmd-item:hover { background:rgba(200,132,122,.1); }
/* View Details button */
.btn-view-details {
  display:flex; align-items:center; justify-content:center; gap:7px;
  background:transparent;
  border:1px solid rgba(200,132,122,.22);
  color:var(--champ-dim); border-radius:10px;
  padding:8px 12px; width:100%;
  font-size:10px; letter-spacing:1.8px; text-transform:uppercase;
  font-weight:600; font-family:var(--font-body);
  transition:all .2s; cursor:pointer;
}
.btn-view-details:hover { border-color:var(--gold); color:var(--gold-l); background:rgba(212,168,85,.06); }

/* ══════════════════════════════════════════
   PANJABI SECTION (distinct color)
══════════════════════════════════════════ */
.panjabi-sec {
  background:linear-gradient(180deg, transparent, rgba(10,22,40,.15), transparent);
}
.panjabi-sec .sec-title em { color:#7BA4F0; }
.panjabi-sec .sec-line { background:linear-gradient(to right, transparent, #7BA4F0, transparent); }
.panjabi-card {
  border-color:rgba(123,164,240,.22);
}
.panjabi-card:hover {
  box-shadow:0 22px 50px rgba(10,22,40,.55);
  border-color:rgba(123,164,240,.45);
}

/* ══════════════════════════════════════════
   OFFER BANNER
══════════════════════════════════════════ */
.offer-banner {
  background:linear-gradient(120deg, var(--maroon-d), var(--maroon), rgba(212,168,85,.12), var(--maroon-d));
  border-radius:var(--r2); padding:48px 5%;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; flex-wrap:wrap;
  border:1px solid rgba(200,132,122,.22);
  position:relative; overflow:hidden;
}
.offer-banner::before {
  content:'✦';
  position:absolute; right:5%; top:50%; transform:translateY(-50%);
  font-size:180px; color:rgba(200,132,122,.04); pointer-events:none;
}
.offer-text .tag { color:var(--gold-l); font-size:10px; letter-spacing:3px; text-transform:uppercase; font-weight:600; margin-bottom:10px; display:block; }
.offer-text h3 {
  font-family:var(--font-serif); font-size:clamp(22px, 3.5vw, 36px);
  font-weight:700; line-height:1.2; color:var(--champ);
}
.offer-text h3 em { color:var(--gold-l); font-style:italic; }
.offer-text p { font-size:13px; color:var(--champ-dim); margin-top:8px; }
.offer-actions { display:flex; flex-direction:column; gap:10px; align-items:flex-start; }
.offer-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(212,168,85,.15); border:1px solid rgba(212,168,85,.3);
  padding:8px 18px; border-radius:50px;
  font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--gold-l); font-weight:700;
}

/* ══════════════════════════════════════════
   ORDER STEPS
══════════════════════════════════════════ */
.steps-row {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;
  align-items:start;
}
.step-card {
  background:var(--glass); backdrop-filter:blur(12px);
  border:1px solid var(--gborder); border-radius:var(--r2);
  padding:32px 24px; text-align:center; position:relative;
}
.step-n {
  font-family:var(--font-serif); font-size:56px; font-weight:700;
  color:rgba(200,132,122,.1); position:absolute; top:8px; right:14px;
  line-height:1;
}
.step-ic { font-size:32px; margin-bottom:14px; display:block; }
.step-title { font-family:var(--font-serif); font-size:17px; font-weight:600; color:var(--champ); margin-bottom:7px; }
.step-desc { font-size:12px; color:var(--champ-dim); line-height:1.75; }
.step-arrow {
  display:flex; align-items:center; justify-content:center;
  font-size:22px; color:rgba(200,132,122,.35);
  padding-top:32px;
}

/* ══════════════════════════════════════════
   TRUST REVIEWS
══════════════════════════════════════════ */
.reviews-grid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;
}
.rev-card {
  background:var(--glass); backdrop-filter:blur(12px);
  border:1px solid var(--gborder); border-radius:var(--r2);
  padding:26px;
}
.rev-stars { color:var(--gold-l); font-size:13px; letter-spacing:2px; margin-bottom:6px; }
.rev-verified {
  display:inline-flex; align-items:center; gap:5px;
  background:rgba(37,211,102,.1); border:1px solid rgba(37,211,102,.25);
  color:#25D366; font-size:8.5px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; padding:3px 9px; border-radius:50px; margin-bottom:12px;
}
.rev-text {
  font-size:13px; color:var(--champ-dim); line-height:1.8;
  font-style:italic; margin-bottom:16px;
}
.rev-text::before { content:'"'; color:var(--rose); font-size:22px; font-family:var(--font-serif); line-height:0; vertical-align:-7px; margin-right:3px; }
.rev-author { display:flex; align-items:center; gap:11px; }
.rev-av {
  width:40px; height:40px; border-radius:50%;
  background:linear-gradient(135deg, var(--maroon), var(--rose));
  display:flex; align-items:center; justify-content:center;
  font-size:16px; flex-shrink:0; border:2px solid rgba(200,132,122,.28);
}
.rev-name { font-family:var(--font-serif); font-size:14px; color:var(--champ); font-weight:600; line-height:1.2; }
.rev-loc { font-size:9.5px; letter-spacing:1px; text-transform:uppercase; color:rgba(245,230,204,.28); margin-top:2px; }

/* Trust badge row */
.trust-badges {
  display:flex; flex-wrap:wrap; gap:12px; justify-content:center;
  margin-top:40px;
}
.t-bdg {
  display:flex; align-items:center; gap:8px;
  background:var(--glass); backdrop-filter:blur(10px);
  border:1px solid var(--gborder);
  border-radius:50px; padding:9px 20px;
  font-size:11px; letter-spacing:1.2px; text-transform:uppercase;
  font-weight:600;
}

/* ══════════════════════════════════════════
   DELIVERY GRID
══════════════════════════════════════════ */
.del-grid {
  display:grid; grid-template-columns:repeat(4, 1fr); gap:16px;
}
.del-card {
  background:var(--glass); backdrop-filter:blur(10px);
  border:1px solid var(--gborder); border-radius:var(--r);
  padding:24px 18px; text-align:center;
  transition:border-color .2s, transform .2s;
}
.del-card:hover { border-color:rgba(200,132,122,.45); transform:translateY(-3px); }
.del-ic { font-size:26px; margin-bottom:11px; display:block; }
.del-t { font-family:var(--font-serif); font-size:15px; color:var(--champ); margin-bottom:5px; font-weight:600; }
.del-d { font-size:12px; color:var(--champ-dim); line-height:1.65; }

/* ══════════════════════════════════════════
   BOTTOM CTA
══════════════════════════════════════════ */
.bcta {
  padding:80px 5%;
  text-align:center;
  background:linear-gradient(135deg, var(--maroon-d), rgba(92,26,42,.55), var(--maroon-d));
  border-top:1px solid rgba(200,132,122,.18);
  border-bottom:1px solid rgba(200,132,122,.18);
  position:relative; overflow:hidden;
}
.bcta::before {
  content:'✦';
  position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%);
  font-size:300px; color:rgba(200,132,122,.025);
  pointer-events:none;
}
.bcta-title {
  font-family:var(--font-serif);
  font-size:clamp(30px, 5vw, 56px); font-weight:700;
  color:var(--champ); margin-bottom:14px; position:relative;
}
.bcta-title em { color:var(--rose); font-style:italic; }
.bcta-sub {
  font-size:13px; color:var(--champ-dim); max-width:480px;
  margin:0 auto 38px; line-height:1.75; letter-spacing:.3px;
  position:relative;
}
.bcta-btns { display:flex; flex-wrap:wrap; gap:13px; justify-content:center; position:relative; }

/* ══════════════════════════════════════════
   FOOTER
══════════════════════════════════════════ */
footer {
  background: linear-gradient(180deg, var(--maroon-d), var(--ink-2));
  border-top: 1px solid rgba(200,132,122,.18);
  padding:56px 5% 110px;
  text-align:center;
}
.foot-logo {
  font-family:var(--font-serif);
  font-size:28px; font-weight:700; color:var(--champ); margin-bottom:6px;
}
.foot-logo em { color:var(--rose); font-style:italic; }
.foot-tag {
  font-size:10px; letter-spacing:3px; text-transform:uppercase;
  color:rgba(245,230,204,.28); display:block; margin-bottom:24px;
}
.foot-div { width:48px; height:1px; background:linear-gradient(to right, transparent, var(--rose), transparent); margin:0 auto 24px; }
.foot-links { display:flex; flex-wrap:wrap; gap:18px; justify-content:center; margin-bottom:24px; }
.foot-links a { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:rgba(245,230,204,.35); transition:color .2s; }
.foot-links a:hover { color:var(--rose); }
.foot-copy { font-size:11px; color:rgba(245,230,204,.18); }

/* ══════════════════════════════════════════
   STICKY MOBILE CTA
══════════════════════════════════════════ */
.sticky-mob {
  display:none;
  position:fixed; bottom:0; left:0; right:0; z-index:1000;
  background:rgba(10,4,2,.96);
  backdrop-filter:blur(20px);
  border-top:1px solid rgba(200,132,122,.18);
  padding:10px 16px;
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
}
.sticky-inner { display:flex; gap:9px; max-width:500px; margin:0 auto; }
.st-wa {
  flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--wa); color:#fff;
  padding:13px 16px; border-radius:12px;
  font-size:11.5px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; font-family:var(--font-body);
  transition:background .2s;
}
.st-wa:hover { background:var(--wa-d); }
.st-call {
  display:flex; align-items:center; justify-content:center;
  background:var(--glass); border:1px solid var(--gborder);
  color:var(--champ); padding:13px 16px; border-radius:12px;
  font-size:17px; transition:border-color .2s; flex-shrink:0;
}
.st-call:hover { border-color:var(--rose); }

/* ══════════════════════════════════════════
   ORDER POPUP / MODAL
══════════════════════════════════════════ */
.modal-overlay {
  position:fixed; inset:0; z-index:2000;
  background:rgba(0,0,0,.75);
  backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  padding:16px;
  opacity:0; pointer-events:none;
  transition:opacity .25s;
}
.modal-overlay.open { opacity:1; pointer-events:all; }
.modal {
  background:var(--ink-2); border:1px solid var(--gborder);
  border-radius:var(--r2); padding:36px 32px;
  width:100%; max-width:480px;
  max-height:92svh; overflow-y:auto;
  transform:translateY(24px);
  transition:transform .28s;
  position:relative;
}
.modal-overlay.open .modal { transform:translateY(0); }
.modal-close {
  position:absolute; top:14px; right:14px;
  font-size:20px; color:var(--champ-dim); cursor:pointer;
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; transition:background .2s;
}
.modal-close:hover { background:rgba(200,132,122,.15); color:var(--champ); }
.modal-title {
  font-family:var(--font-serif); font-size:22px; font-weight:700;
  color:var(--champ); margin-bottom:6px;
}
.modal-sub { font-size:12px; color:var(--champ-dim); margin-bottom:24px; letter-spacing:.5px; }
.modal-product-chip {
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(92,26,42,.5); border:1px solid var(--gborder);
  border-radius:10px; padding:10px 14px; margin-bottom:22px;
  width:100%;
}
.chip-icon { font-size:22px; }
.chip-name { font-family:var(--font-serif); font-size:15px; color:var(--champ); font-weight:600; }
.chip-code { font-size:10px; color:var(--champ-dim); letter-spacing:1px; }
.form-group { margin-bottom:16px; }
.form-label {
  display:block; font-size:10px; letter-spacing:2px; text-transform:uppercase;
  color:var(--champ-dim); margin-bottom:7px; font-weight:600;
}
.form-input {
  width:100%; background:rgba(0,0,0,.35); border:1px solid rgba(200,132,122,.22);
  border-radius:10px; padding:12px 16px;
  color:var(--champ); font-family:var(--font-body); font-size:14px;
  outline:none; transition:border-color .2s;
}
.form-input:focus { border-color:var(--rose); }
.form-input::placeholder { color:rgba(245,230,204,.28); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-submit {
  width:100%; display:flex; align-items:center; justify-content:center; gap:9px;
  background:linear-gradient(135deg, var(--maroon), var(--rose));
  color:var(--champ); padding:14px 24px; border-radius:12px;
  font-size:12px; letter-spacing:2px; text-transform:uppercase;
  font-weight:700; font-family:var(--font-body);
  transition:opacity .2s, transform .15s;
  margin-top:6px;
}
.form-submit:hover { opacity:.88; transform:translateY(-1px); }
.form-success {
  display:none; text-align:center; padding:20px 0;
}
.form-success.show { display:block; }
.success-icon { font-size:52px; margin-bottom:12px; animation:popIn .5s; }
.success-msg { font-family:var(--font-serif); font-size:20px; color:var(--champ); margin-bottom:8px; }
.success-sub { font-size:12px; color:var(--champ-dim); line-height:1.6; }
@keyframes popIn { 0%{transform:scale(0)} 70%{transform:scale(1.1)} 100%{transform:scale(1)} }

/* ══════════════════════════════════════════
   PRODUCT DETAIL MODAL
══════════════════════════════════════════ */
.pd-overlay {
  position:fixed; inset:0; z-index:3000;
  background:rgba(0,0,0,.82);
  backdrop-filter:blur(12px);
  display:flex; align-items:center; justify-content:center;
  padding:16px;
  opacity:0; pointer-events:none;
  transition:opacity .28s;
}
.pd-overlay.open { opacity:1; pointer-events:all; }
.pd-modal {
  background: linear-gradient(160deg, var(--ink-2), var(--ink-3));
  border:1px solid var(--gborder);
  border-radius:var(--r2); padding:0;
  width:100%; max-width:760px;
  max-height:90svh; overflow-y:auto;
  transform:translateY(28px) scale(.97);
  transition:transform .3s, opacity .3s;
  position:relative;
  display:flex; flex-direction:column;
}
.pd-overlay.open .pd-modal { transform:translateY(0) scale(1); }
.pd-modal-close {
  position:absolute; top:14px; right:14px; z-index:10;
  font-size:18px; color:var(--champ-dim); cursor:pointer;
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; border:1px solid var(--gborder);
  background:rgba(0,0,0,.5); transition:all .2s;
}
.pd-modal-close:hover { background:rgba(200,132,122,.2); color:var(--champ); border-color:var(--rose); }
.pd-body {
  display:grid; grid-template-columns:1fr 1fr; min-height:480px;
}
@media(max-width:640px){
  .pd-body { grid-template-columns:1fr; }
}
.pd-gallery {
  background:linear-gradient(145deg, rgba(92,26,42,.3), rgba(13,7,3,.8));
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:auto; min-height:280px;
  flex-direction:column; gap:16px; padding:32px 24px;
  border-radius:var(--r2) 0 0 var(--r2);
  position:relative; overflow:hidden;
}
@media(max-width:640px){
  .pd-gallery { border-radius:var(--r2) var(--r2) 0 0; min-height:200px; }
}
.pd-gallery-emoji { font-size:clamp(60px, 12vw, 90px); animation:floatEmoji 4s ease-in-out infinite; }
@keyframes floatEmoji { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-10px) scale(1.05)} }
.pd-gallery-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(92,26,42,.7); border:1px solid rgba(200,132,122,.35);
  padding:5px 14px; border-radius:50px;
  font-size:9px; letter-spacing:2px; text-transform:uppercase;
  color:var(--gold-l); font-weight:700;
}
.pd-info { padding:32px 28px; display:flex; flex-direction:column; gap:0; }
.pd-eyebrow { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--gold-l); font-weight:700; margin-bottom:8px; }
.pd-name { font-family:var(--font-serif); font-size:clamp(20px, 3vw, 27px); font-weight:700; color:var(--champ); line-height:1.2; margin-bottom:4px; }
.pd-code { font-size:9.5px; color:rgba(245,230,204,.3); letter-spacing:1.5px; text-transform:uppercase; margin-bottom:14px; }
.pd-price-row { display:flex; align-items:baseline; gap:8px; margin-bottom:16px; }
.pd-price { font-family:var(--font-serif); font-size:clamp(22px, 4vw, 30px); font-weight:700; color:var(--champ); }
.pd-price-old { font-size:13px; color:rgba(245,230,204,.35); text-decoration:line-through; }
.pd-price-save { font-size:9px; letter-spacing:1px; text-transform:uppercase; background:rgba(37,211,102,.15); color:#25D366; border:1px solid rgba(37,211,102,.25); padding:2px 8px; border-radius:50px; font-weight:700; }
.pd-desc { font-size:13px; color:var(--champ-dim); line-height:1.8; margin-bottom:18px; }
.pd-meta-row { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.pd-tag {
  display:inline-flex; align-items:center; gap:5px;
  background:rgba(92,26,42,.4); border:1px solid rgba(200,132,122,.18);
  padding:4px 12px; border-radius:50px;
  font-size:10px; letter-spacing:.5px; color:var(--champ-dim);
}
.pd-sizes-label { font-size:9.5px; letter-spacing:2px; text-transform:uppercase; color:var(--champ-dim); font-weight:700; margin-bottom:9px; }
.pd-sizes { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px; }
.pd-size-btn {
  padding:5px 14px; border-radius:8px; font-size:11px; font-weight:600;
  border:1px solid rgba(200,132,122,.25); color:var(--champ-dim);
  background:rgba(0,0,0,.25); cursor:pointer; transition:all .18s; font-family:var(--font-body);
}
.pd-size-btn:hover, .pd-size-btn.sel { border-color:var(--rose); color:var(--champ); background:rgba(200,132,122,.15); }
.pd-stock {
  display:inline-flex; align-items:center; gap:6px;
  font-size:10px; letter-spacing:1px; text-transform:uppercase;
  color:#f87171; font-weight:700; margin-bottom:20px;
}
.pd-stock .s-dot { background:#f87171; }
.pd-action-row { display:flex; gap:9px; flex-wrap:wrap; }
.pd-btn-wa {
  flex:1; min-width:140px;
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--wa); color:#fff;
  padding:12px 18px; border-radius:12px;
  font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; font-family:var(--font-body); transition:background .2s;
  white-space:nowrap;
}
.pd-btn-wa:hover { background:var(--wa-d); }
.pd-btn-direct {
  flex:1; min-width:130px;
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:linear-gradient(135deg, var(--maroon), var(--rose-d));
  color:var(--champ);
  padding:12px 18px; border-radius:12px;
  font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
  font-weight:700; font-family:var(--font-body); transition:opacity .2s; cursor:pointer;
  border:none;
}
.pd-btn-direct:hover { opacity:.88; }

/* ══════════════════════════════════════════
   ANIMATIONS
══════════════════════════════════════════ */
@keyframes fadeUp {
  from{opacity:0;transform:translateY(22px)}
  to  {opacity:1;transform:translateY(0)}
}
.reveal { opacity:0; transform:translateY(26px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in { opacity:1; transform:translateY(0); }
.d1{transition-delay:.08s} .d2{transition-delay:.16s}
.d3{transition-delay:.24s} .d4{transition-delay:.32s}

/* Ripple */
.rp { position:relative; overflow:hidden; }
.rp-drop {
  position:absolute; border-radius:50%;
  background:rgba(255,255,255,.2);
  transform:scale(0);
  animation:ripAnim .55s linear;
  pointer-events:none;
}
@keyframes ripAnim { to{transform:scale(4);opacity:0} }

/* ══════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
══════════════════════════════════════════ */

/* Large Desktop 1440+ */
@media (min-width:1440px) {
  .sec { padding:88px 6%; }
  .pgrid { grid-template-columns:repeat(4,1fr); }
}

/* Laptop 1024-1440 */
@media (max-width:1280px) {
  .pgrid { grid-template-columns:repeat(3,1fr); }
}

/* Tablet landscape 900-1024 */
@media (max-width:1024px) {
  .pgrid { grid-template-columns:repeat(3,1fr); }
  .del-grid { grid-template-columns:repeat(2,1fr); }
}

/* Tablet portrait 768-900 */
@media (max-width:900px) {
  .pgrid { grid-template-columns:repeat(2,1fr); }
  .reviews-grid { grid-template-columns:repeat(2,1fr); }
  .steps-row { grid-template-columns:1fr 1fr; }
  .nav-links { display:none; }
  .offer-banner { flex-direction:column; }
  .offer-actions { width:100%; }
}

/* Large mobile 600-768 */
@media (max-width:768px) {
  .pgrid { grid-template-columns:repeat(2,1fr); gap:14px; }
  .reviews-grid { grid-template-columns:1fr; }
  .steps-row { grid-template-columns:1fr; }
  .del-grid { grid-template-columns:repeat(2,1fr); }
  .sticky-mob { display:block; }
  footer { padding-bottom:110px; }
  .form-row { grid-template-columns:1fr; }
}

/* Standard mobile 375-600 */
@media (max-width:540px) {
  .pgrid { grid-template-columns:1fr; gap:16px; }
  .p-img-placeholder, .p-img-wrap { aspect-ratio:4/3; }
  .hero { min-height:auto; padding:52px 5% 90px; }
  .sec { padding:52px 5%; }
  .del-grid { grid-template-columns:1fr 1fr; }
  .hero-title { font-size:clamp(36px, 13vw, 52px); }
  .scarcity { gap:12px; }
  .trust-badges { gap:8px; }
  .modal { padding:26px 20px; }
}

/* Small mobile 320-375 */
@media (max-width:375px) {
  body { font-size:15px; }
  .pgrid { grid-template-columns:1fr; }
  .del-grid { grid-template-columns:1fr; }
  .hero-title { font-size:36px; }
  .bcta-title { font-size:28px; }
  .sticky-inner { gap:8px; }
  .st-wa { font-size:10.5px; padding:12px; }
}
/* ══════════════════════════════════════════════
   CATEGORY SHOWCASE
══════════════════════════════════════════════ */
.cat-sec {
  padding: 60px 5% 48px;
  background: linear-gradient(180deg, rgba(92,26,42,.08) 0%, transparent 100%);
}
.cat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  max-width: 1200px;
  margin: 0 auto;
}
.cat-card {
  background: var(--glass);
  backdrop-filter: blur(14px);
  border: 1px solid var(--gborder);
  border-radius: var(--r2);
  overflow: hidden;
  cursor: pointer;
  transition: transform .3s, box-shadow .3s, border-color .3s;
  text-decoration: none;
  display: flex;
  flex-direction: column;
}
.cat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 48px rgba(92,26,42,.42);
  border-color: rgba(200,132,122,.5);
}
.cat-img-wrap {
  width: 100%;
  aspect-ratio: 4/3;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(48px, 6vw, 68px);
  background: linear-gradient(145deg, rgba(92,26,42,.35), rgba(13,7,3,.7));
  position: relative;
  overflow: hidden;
  transition: transform .4s;
}
.cat-card:hover .cat-img-wrap { transform: scale(1.04); }
.cat-img-wrap img {
  width: 100%; height: 100%; object-fit: cover;
  position: absolute; inset: 0;
}
.cat-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cat-title {
  font-family: var(--font-serif);
  font-size: clamp(15px, 1.6vw, 18px);
  font-weight: 700;
  color: var(--champ);
  line-height: 1.2;
}
.cat-count {
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--champ-dim);
}
.cat-cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold-l);
  font-weight: 700;
  margin-top: 8px;
}
.cat-cta::after {
  content: '→';
  font-size: 12px;
  transition: transform .2s;
}
.cat-card:hover .cat-cta::after { transform: translateX(3px); }

@media (max-width: 900px) {
  .cat-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .cat-sec { padding: 40px 5% 32px; }
}

/* ══════════════════════════════════════════════
   FILTER TABS
══════════════════════════════════════════════ */
.filter-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 32px;
}
.ftab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--glass);
  backdrop-filter: blur(10px);
  border: 1px solid var(--gborder);
  color: var(--champ-dim);
  padding: 7px 16px;
  border-radius: 50px;
  font-size: 10.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
  font-family: var(--font-body);
}
.ftab:hover, .ftab.active {
  background: rgba(200,132,122,.18);
  border-color: var(--rose);
  color: var(--champ);
}
.ftab.active { color: var(--champ); }

/* ══════════════════════════════════════════════
   ASPECT RATIO UPDATE: 3/4 → 2/3 (taller portrait)
══════════════════════════════════════════════ */
.p-img-wrap {
  aspect-ratio: 2/3;
}
.p-img-placeholder {
  aspect-ratio: 2/3;
}
@media (max-width: 540px) {
  .p-img-placeholder, .p-img-wrap { aspect-ratio: 3/4; }
}

/* ══════════════════════════════════════════════
   ENHANCED FOOTER
══════════════════════════════════════════════ */
.foot-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 48px;
  max-width: 1100px;
  margin: 0 auto;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(200,132,122,.12);
  text-align: left;
}
.foot-brand .foot-logo { margin-bottom: 8px; }
.foot-brand .foot-tag { text-align: left; margin-bottom: 14px; }
.foot-brand-desc {
  font-size: 12px;
  color: var(--champ-dim);
  line-height: 1.75;
  max-width: 280px;
  margin-bottom: 20px;
}
.foot-social {
  display: flex;
  gap: 10px;
}
.foot-soc-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--glass);
  border: 1px solid var(--gborder);
  font-size: 15px;
  color: var(--champ-dim);
  transition: all .2s;
  text-decoration: none;
}
.foot-soc-btn:hover {
  border-color: var(--rose);
  color: var(--champ);
  background: rgba(200,132,122,.12);
}
.foot-col-title {
  font-family: var(--font-serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--champ);
  margin-bottom: 18px;
  letter-spacing: .5px;
}
.foot-col-links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.foot-col-links a {
  font-size: 11px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(245,230,204,.4);
  transition: color .2s;
}
.foot-col-links a:hover { color: var(--rose); }
.foot-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 11.5px;
  color: rgba(245,230,204,.45);
  margin-bottom: 10px;
  line-height: 1.5;
}
.foot-contact-item .ic { font-size: 14px; flex-shrink: 0; margin-top: 1px; }
.foot-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  max-width: 1100px;
  margin: 32px auto 0;
  padding-top: 0;
}
.foot-copy-new {
  font-size: 10.5px;
  color: rgba(245,230,204,.18);
}
.foot-payment {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(245,230,204,.22);
}
.foot-pay-chip {
  background: rgba(245,230,204,.06);
  border: 1px solid rgba(245,230,204,.1);
  border-radius: 6px;
  padding: 3px 8px;
  font-size: 9px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(245,230,204,.3);
}

@media (max-width: 768px) {
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .foot-grid { grid-template-columns: 1fr; gap: 28px; }
  .foot-bottom { flex-direction: column; align-items: flex-start; }
}
/* ══════════════════════════════════════════════════════════════
   ██████╗  █████╗ ██████╗ ██╗███╗   ██╗███████╗███████╗████████╗ █████╗
   ██╔══██╗██╔══██╗██╔══██╗██║████╗  ██║██╔════╝██╔════╝╚══██╔══╝██╔══██╗
   ██████╔╝███████║██████╔╝██║██╔██╗ ██║█████╗  █████╗     ██║   ███████║
   ██╔═══╝ ██╔══██║██╔══██╗██║██║╚██╗██║██╔══╝  ██╔══╝     ██║   ██╔══██║
   ██║     ██║  ██║██║  ██║██║██║ ╚████║███████╗███████╗   ██║   ██║  ██║
   FUTURISTIC UI + CART SYSTEM — PARINEETA BOUTIQUE 2025
══════════════════════════════════════════════════════════════ */

/* ── Extra design tokens ── */
:root {
  --glow-gold:   rgba(212,168,85,.32);
  --glow-rose:   rgba(200,132,122,.28);
  --glow-wa:     rgba(37,211,102,.28);
  --glow-blue:   rgba(123,164,240,.28);
  --glass-hi:    rgba(255,255,255,.04);
  --glass-hi2:   rgba(255,255,255,.07);
  --border-glow: rgba(200,132,122,.45);
  --border-gold: rgba(212,168,85,.4);
}

/* ══════════════════════════════════════════════
   FUTURISTIC NAV ENHANCEMENTS
══════════════════════════════════════════════ */
nav {
  background: linear-gradient(90deg,
    rgba(18,3,7,0.98),
    rgba(48,10,20,0.96),
    rgba(18,3,7,0.98)
  );
  border-bottom: 1px solid rgba(200,132,122,.28);
  box-shadow: 0 4px 40px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.04);
}

.nav-right-group {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

/* Cart button in nav */
.nav-cart-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  background: rgba(92,26,42,.35);
  border: 1px solid rgba(200,132,122,.32);
  border-radius: 12px;
  color: var(--champ);
  cursor: pointer;
  transition: all .22s;
}
.nav-cart-btn:hover {
  background: rgba(200,132,122,.22);
  border-color: var(--rose);
  transform: translateY(-1px);
  box-shadow: 0 6px 22px var(--glow-rose);
}
.cart-badge {
  position: absolute;
  top: -6px; right: -6px;
  min-width: 18px; height: 18px;
  background: linear-gradient(135deg, var(--gold), var(--gold-l));
  color: var(--ink);
  border-radius: 50px;
  font-size: 9px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 2px solid var(--ink);
  line-height: 1;
  pointer-events: none;
  transition: transform .2s;
}
.cart-badge.bump { animation: badgeBump .35s ease; }
@keyframes badgeBump {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.5); }
  100% { transform: scale(1); }
}

/* Enhanced nav order btn */
.nav-order-btn {
  background: linear-gradient(135deg, #3A0D18, #5C1A2A, #9E5A52);
  border-color: rgba(200,132,122,.4);
  box-shadow: 0 2px 14px rgba(92,26,42,.35);
}
.nav-order-btn:hover {
  background: linear-gradient(135deg, #5C1A2A, #9E5A52, #C8847A);
  box-shadow: 0 6px 24px var(--glow-rose);
  border-color: var(--rose);
}

/* ══════════════════════════════════════════════
   FUTURISTIC PRODUCT CARDS
══════════════════════════════════════════════ */
.p-card {
  background: linear-gradient(160deg,
    rgba(92,26,42,.22) 0%,
    rgba(13,7,3,.75) 50%,
    rgba(58,13,24,.28) 100%
  );
  border: 1px solid rgba(200,132,122,.24);
  box-shadow:
    0 8px 32px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.04),
    inset 0 -1px 0 rgba(0,0,0,.3);
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s, border-color .3s;
  position: relative;
}
.p-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.03) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}
.p-card:hover {
  transform: translateY(-8px) scale(1.012);
  box-shadow:
    0 28px 60px rgba(0,0,0,.5),
    0 0 0 1px rgba(200,132,122,.45),
    0 0 40px rgba(92,26,42,.25);
  border-color: rgba(200,132,122,.55);
}
.p-card .p-body { position: relative; z-index: 1; }
.p-card .p-img-placeholder { position: relative; z-index: 1; }

/* Panjabi card futuristic overrides */
.panjabi-card {
  background: linear-gradient(160deg,
    rgba(10,22,40,.4) 0%,
    rgba(13,7,3,.75) 50%,
    rgba(10,22,40,.3) 100%
  );
  border-color: rgba(123,164,240,.2);
}
.panjabi-card:hover {
  border-color: rgba(123,164,240,.5);
  box-shadow:
    0 28px 60px rgba(0,0,0,.5),
    0 0 0 1px rgba(123,164,240,.4),
    0 0 40px rgba(10,22,40,.3);
}

/* Image overlay shimmer */
.p-img-placeholder::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    transparent 30%,
    rgba(255,255,255,.04) 50%,
    transparent 70%
  );
  pointer-events: none;
  opacity: 0;
  transition: opacity .4s;
}
.p-card:hover .p-img-placeholder::after { opacity: 1; }

/* ── ADD TO CART BUTTON (primary card CTA) ── */
.btn-add-cart {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  background: linear-gradient(135deg, #5C1A2A 0%, #9E5A52 50%, #C8847A 100%);
  color: var(--champ);
  padding: 11px 16px;
  border-radius: 12px;
  font-size: 10.5px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  border: 1px solid rgba(200,132,122,.35);
  box-shadow:
    0 4px 16px rgba(92,26,42,.3),
    inset 0 1px 0 rgba(255,255,255,.08);
  transition: all .22s;
  position: relative;
  overflow: hidden;
}
.btn-add-cart::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent, rgba(255,255,255,.08), transparent);
  opacity: 0;
  transition: opacity .25s;
  pointer-events: none;
}
.btn-add-cart:hover {
  background: linear-gradient(135deg, #9E5A52 0%, #C8847A 50%, #EFC97A 100%);
  transform: translateY(-2px);
  box-shadow:
    0 8px 28px rgba(92,26,42,.45),
    0 0 20px rgba(200,132,122,.2),
    inset 0 1px 0 rgba(255,255,255,.12);
  border-color: rgba(239,201,122,.5);
}
.btn-add-cart:hover::before { opacity: 1; }
.btn-add-cart:active { transform: translateY(0); }

/* ── VIEW DETAILS BUTTON upgrade ── */
.btn-view-details {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(200,132,122,.2);
  color: rgba(245,230,204,.55);
  border-radius: 12px;
  padding: 9px 14px;
  font-size: 9.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 600;
  font-family: var(--font-body);
  transition: all .22s;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
}
.btn-view-details:hover {
  border-color: rgba(212,168,85,.45);
  color: var(--gold-l);
  background: rgba(212,168,85,.06);
  box-shadow: 0 0 16px rgba(212,168,85,.1);
}

/* ── Adjusted p-btns layout ── */
.p-btns {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}

/* ══════════════════════════════════════════════
   CATEGORY CARDS — FUTURISTIC UPGRADE
══════════════════════════════════════════════ */
.cat-card {
  background: linear-gradient(160deg,
    rgba(92,26,42,.28) 0%,
    rgba(13,7,3,.8) 60%,
    rgba(58,13,24,.2) 100%
  );
  border: 1px solid rgba(200,132,122,.2);
  box-shadow: 0 8px 28px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.04);
  position: relative;
  overflow: hidden;
}
.cat-card::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.04), transparent);
  transition: left .5s ease;
  pointer-events: none;
}
.cat-card:hover::after { left: 160%; }
.cat-card:hover {
  box-shadow: 0 22px 52px rgba(0,0,0,.45), 0 0 0 1px rgba(200,132,122,.4), 0 0 30px rgba(92,26,42,.2);
  border-color: rgba(200,132,122,.45);
}
.cat-cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 9.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold-l);
  font-weight: 700;
  margin-top: 10px;
  transition: gap .2s;
}
.cat-cta::after { content: '→'; font-size: 11px; transition: transform .2s; }
.cat-card:hover .cat-cta { gap: 8px; }
.cat-card:hover .cat-cta::after { transform: translateX(4px); }

/* ══════════════════════════════════════════════
   STEP CARDS — FUTURISTIC UPGRADE
══════════════════════════════════════════════ */
.step-card {
  background: linear-gradient(160deg,
    rgba(92,26,42,.25) 0%,
    rgba(13,7,3,.8) 100%
  );
  border: 1px solid rgba(200,132,122,.2);
  box-shadow: 0 8px 32px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.04);
  transition: transform .3s, box-shadow .3s, border-color .3s;
  position: relative;
  overflow: hidden;
}
.step-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,132,122,.4), transparent);
}
.step-card:hover {
  transform: translateY(-5px);
  border-color: rgba(200,132,122,.45);
  box-shadow: 0 20px 50px rgba(0,0,0,.4), 0 0 30px rgba(92,26,42,.18);
}
.step-ic {
  font-size: 36px;
  margin-bottom: 16px;
  display: block;
  filter: drop-shadow(0 0 8px rgba(212,168,85,.3));
  transition: filter .3s, transform .3s;
}
.step-card:hover .step-ic {
  filter: drop-shadow(0 0 14px rgba(212,168,85,.55));
  transform: scale(1.1) translateY(-2px);
}

/* ══════════════════════════════════════════════
   REVIEW CARDS — FUTURISTIC UPGRADE
══════════════════════════════════════════════ */
.rev-card {
  background: linear-gradient(160deg,
    rgba(92,26,42,.2) 0%,
    rgba(13,7,3,.8) 100%
  );
  border: 1px solid rgba(200,132,122,.18);
  box-shadow: 0 8px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03);
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.rev-card:hover {
  transform: translateY(-4px);
  border-color: rgba(200,132,122,.38);
  box-shadow: 0 18px 44px rgba(0,0,0,.38), 0 0 24px rgba(92,26,42,.15);
}

/* ══════════════════════════════════════════════
   DELIVERY CARDS — FUTURISTIC UPGRADE
══════════════════════════════════════════════ */
.del-card {
  background: linear-gradient(160deg,
    rgba(92,26,42,.2) 0%,
    rgba(13,7,3,.8) 100%
  );
  border: 1px solid rgba(200,132,122,.18);
  box-shadow: 0 6px 24px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.03);
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.del-card:hover {
  transform: translateY(-4px);
  border-color: rgba(200,132,122,.4);
  box-shadow: 0 16px 40px rgba(0,0,0,.35), 0 0 20px rgba(92,26,42,.15);
}
.del-ic {
  font-size: 28px;
  margin-bottom: 13px;
  display: block;
  filter: drop-shadow(0 0 6px rgba(212,168,85,.25));
  transition: filter .3s, transform .3s;
}
.del-card:hover .del-ic {
  filter: drop-shadow(0 0 12px rgba(212,168,85,.45));
  transform: scale(1.1);
}

/* ══════════════════════════════════════════════
   BUTTON SYSTEM — GLOBAL UPGRADES
══════════════════════════════════════════════ */

/* WhatsApp large button — hero / bcta */
.btn-wa-lg {
  background: linear-gradient(135deg, #128C7E 0%, #25D366 50%, #34D669 100%);
  border: 1px solid rgba(37,211,102,.3);
  box-shadow: 0 8px 32px rgba(37,211,102,.28), inset 0 1px 0 rgba(255,255,255,.15);
  transition: all .22s;
}
.btn-wa-lg:hover {
  background: linear-gradient(135deg, #25D366 0%, #34D669 50%, #5EE88A 100%);
  transform: translateY(-3px);
  box-shadow: 0 14px 42px rgba(37,211,102,.4), 0 0 30px rgba(37,211,102,.15);
}

/* Outline button upgrade */
.btn-outline {
  border: 1px solid rgba(200,132,122,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  transition: all .22s;
}
.btn-outline:hover {
  border-color: rgba(200,132,122,.65);
  background: rgba(200,132,122,.1);
  box-shadow: 0 6px 20px rgba(92,26,42,.25), 0 0 15px rgba(200,132,122,.08);
  transform: translateY(-2px);
}

/* Nav order button glow */
.nav-order-btn:hover {
  box-shadow: 0 6px 24px var(--glow-rose), 0 0 12px rgba(92,26,42,.2);
}

/* Form submit button upgrade */
.form-submit {
  background: linear-gradient(135deg, #3A0D18 0%, #5C1A2A 40%, #9E5A52 100%);
  border: 1px solid rgba(200,132,122,.3);
  box-shadow: 0 6px 24px rgba(92,26,42,.3), inset 0 1px 0 rgba(255,255,255,.08);
}
.form-submit:hover {
  background: linear-gradient(135deg, #5C1A2A 0%, #9E5A52 50%, #EFC97A 100%);
  box-shadow: 0 10px 32px rgba(92,26,42,.45), 0 0 20px rgba(200,132,122,.12);
  transform: translateY(-2px);
  border-color: rgba(239,201,122,.4);
}

/* See more button upgrade */
.btn-see-more {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(200,132,122,.25);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  transition: all .22s;
}
.btn-see-more:hover {
  background: rgba(200,132,122,.1);
  border-color: rgba(200,132,122,.5);
  box-shadow: 0 6px 22px rgba(92,26,42,.22);
  transform: translateY(-2px);
}

/* Filter tabs upgrade */
.ftab {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(200,132,122,.18);
  transition: all .22s;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.ftab:hover {
  background: rgba(200,132,122,.12);
  border-color: rgba(200,132,122,.38);
  box-shadow: 0 4px 14px rgba(92,26,42,.18);
  transform: translateY(-1px);
}
.ftab.active {
  background: linear-gradient(135deg, rgba(92,26,42,.6), rgba(200,132,122,.2));
  border-color: rgba(200,132,122,.55);
  color: var(--champ);
  box-shadow: 0 4px 16px rgba(92,26,42,.25), 0 0 10px rgba(200,132,122,.08);
}

/* ══════════════════════════════════════════════
   PRODUCT DETAIL MODAL — FUTURISTIC
══════════════════════════════════════════════ */
.pd-modal {
  background: linear-gradient(160deg,
    rgba(26,4,8,.98) 0%,
    rgba(13,7,3,.99) 50%,
    rgba(18,4,10,.98) 100%
  );
  border: 1px solid rgba(200,132,122,.3);
  box-shadow:
    0 32px 80px rgba(0,0,0,.7),
    0 0 0 1px rgba(255,255,255,.03),
    inset 0 1px 0 rgba(255,255,255,.05);
}
.pd-gallery {
  background: linear-gradient(145deg,
    rgba(92,26,42,.45) 0%,
    rgba(13,7,3,.9) 60%,
    rgba(58,13,24,.4) 100%
  );
  position: relative;
  overflow: hidden;
}
.pd-gallery::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(200,132,122,.08) 0%, transparent 70%);
}

/* pd-btn-cart (new Add to Cart in detail modal) */
.pd-btn-cart {
  flex: 1;
  min-width: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(135deg, #5C1A2A 0%, #9E5A52 50%, #C8847A 100%);
  color: var(--champ);
  padding: 12px 18px;
  border-radius: 12px;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  border: 1px solid rgba(200,132,122,.35);
  box-shadow: 0 4px 18px rgba(92,26,42,.35), inset 0 1px 0 rgba(255,255,255,.08);
  transition: all .22s;
  white-space: nowrap;
}
.pd-btn-cart:hover {
  background: linear-gradient(135deg, #9E5A52 0%, #C8847A 50%, #EFC97A 100%);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(92,26,42,.5), 0 0 20px rgba(200,132,122,.18);
  border-color: rgba(239,201,122,.5);
}

/* WA button in detail modal upgrade */
.pd-btn-wa {
  background: linear-gradient(135deg, #1aad53 0%, #25D366 60%, #34D669 100%);
  border: 1px solid rgba(37,211,102,.3);
  box-shadow: 0 4px 18px rgba(37,211,102,.25), inset 0 1px 0 rgba(255,255,255,.12);
  transition: all .22s;
}
.pd-btn-wa:hover {
  background: linear-gradient(135deg, #25D366 0%, #34D669 60%, #5EE88A 100%);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(37,211,102,.38);
}

/* ══════════════════════════════════════════════
   ORDER MODAL — FUTURISTIC
══════════════════════════════════════════════ */
.modal {
  background: linear-gradient(160deg,
    rgba(22,5,10,.99) 0%,
    rgba(13,7,3,.99) 60%,
    rgba(18,5,12,.99) 100%
  );
  border: 1px solid rgba(200,132,122,.28);
  box-shadow:
    0 28px 70px rgba(0,0,0,.65),
    0 0 0 1px rgba(255,255,255,.025),
    inset 0 1px 0 rgba(255,255,255,.04);
}
.modal-product-chip {
  background: linear-gradient(135deg, rgba(92,26,42,.45), rgba(58,13,24,.55));
  border-color: rgba(200,132,122,.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.form-input {
  background: rgba(0,0,0,.4);
  border-color: rgba(200,132,122,.2);
  box-shadow: inset 0 2px 8px rgba(0,0,0,.25);
  transition: border-color .2s, box-shadow .2s;
}
.form-input:focus {
  border-color: rgba(200,132,122,.6);
  box-shadow: inset 0 2px 8px rgba(0,0,0,.25), 0 0 0 3px rgba(200,132,122,.08);
}

/* ══════════════════════════════════════════════
   CART DRAWER
══════════════════════════════════════════════ */
.cart-overlay {
  position: fixed;
  inset: 0;
  z-index: 4000;
  background: rgba(0,0,0,.65);
  backdrop-filter: blur(10px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
}
.cart-overlay.open {
  opacity: 1;
  pointer-events: all;
}
.cart-drawer {
  position: absolute;
  top: 0; right: 0;
  width: 100%;
  max-width: 420px;
  height: 100%;
  background: linear-gradient(180deg,
    rgba(22,5,10,.99) 0%,
    rgba(13,7,3,.99) 100%
  );
  border-left: 1px solid rgba(200,132,122,.25);
  box-shadow: -20px 0 60px rgba(0,0,0,.55);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
}
.cart-overlay.open .cart-drawer {
  transform: translateX(0);
}

/* Cart Header */
.cart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(200,132,122,.14);
  background: linear-gradient(90deg, rgba(92,26,42,.25), transparent);
  flex-shrink: 0;
}
.cart-header-left {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--champ);
}
.cart-header-title {
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 700;
}
.cart-header-count {
  font-size: 9.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--champ-dim);
  background: rgba(200,132,122,.12);
  border: 1px solid rgba(200,132,122,.2);
  border-radius: 50px;
  padding: 2px 9px;
}
.cart-close-btn {
  width: 34px; height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(200,132,122,.1);
  border: 1px solid rgba(200,132,122,.2);
  border-radius: 10px;
  color: var(--champ-dim);
  cursor: pointer;
  transition: all .2s;
}
.cart-close-btn:hover {
  background: rgba(200,132,122,.22);
  color: var(--champ);
  border-color: var(--rose);
}

/* Cart Items */
.cart-items-wrap {
  flex: 1;
  overflow-y: auto;
  padding: 12px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  scrollbar-width: thin;
  scrollbar-color: rgba(200,132,122,.2) transparent;
}
.cart-items-wrap::-webkit-scrollbar { width: 4px; }
.cart-items-wrap::-webkit-scrollbar-track { background: transparent; }
.cart-items-wrap::-webkit-scrollbar-thumb { background: rgba(200,132,122,.25); border-radius: 2px; }

/* Cart Item Row */
.cart-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: linear-gradient(135deg, rgba(92,26,42,.18), rgba(13,7,3,.6));
  border: 1px solid rgba(200,132,122,.18);
  border-radius: 14px;
  padding: 13px 14px;
  transition: border-color .2s;
  animation: itemSlide .28s ease both;
}
@keyframes itemSlide {
  from { opacity:0; transform:translateX(20px); }
  to   { opacity:1; transform:translateX(0); }
}
.cart-item:hover { border-color: rgba(200,132,122,.32); }
.cart-item-emoji {
  font-size: 26px;
  width: 42px; height: 42px;
  background: linear-gradient(135deg, rgba(92,26,42,.4), rgba(58,13,24,.6));
  border: 1px solid rgba(200,132,122,.2);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.cart-item-info { flex: 1; min-width: 0; }
.cart-item-name {
  font-family: var(--font-serif);
  font-size: 14px;
  font-weight: 600;
  color: var(--champ);
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 2px;
}
.cart-item-code {
  font-size: 9px;
  color: rgba(245,230,204,.28);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.cart-item-price {
  font-family: var(--font-serif);
  font-size: 15px;
  font-weight: 700;
  color: var(--champ);
}
.cart-item-controls {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.cart-item-qty-btn {
  width: 26px; height: 26px;
  background: rgba(200,132,122,.12);
  border: 1px solid rgba(200,132,122,.22);
  border-radius: 7px;
  color: var(--champ);
  font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .18s;
  line-height: 1;
}
.cart-item-qty-btn:hover {
  background: rgba(200,132,122,.25);
  border-color: var(--rose);
}
.cart-item-qty {
  font-size: 12px;
  font-weight: 700;
  color: var(--champ);
  min-width: 18px;
  text-align: center;
}
.cart-item-remove {
  width: 26px; height: 26px;
  background: rgba(248,113,113,.08);
  border: 1px solid rgba(248,113,113,.2);
  border-radius: 7px;
  color: rgba(248,113,113,.6);
  font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .18s;
  margin-left: 2px;
}
.cart-item-remove:hover {
  background: rgba(248,113,113,.18);
  border-color: #f87171;
  color: #f87171;
}

/* Cart Empty State */
.cart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  padding: 40px 24px;
  text-align: center;
}
.cart-empty-icon {
  opacity: .22;
  margin-bottom: 18px;
}
.cart-empty-title {
  font-family: var(--font-serif);
  font-size: 18px;
  color: var(--champ);
  margin-bottom: 6px;
}
.cart-empty-sub {
  font-size: 12px;
  color: var(--champ-dim);
  margin-bottom: 24px;
}
.cart-browse-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: linear-gradient(135deg, rgba(92,26,42,.6), rgba(200,132,122,.2));
  border: 1px solid rgba(200,132,122,.35);
  color: var(--champ);
  padding: 11px 28px;
  border-radius: 50px;
  font-size: 10.5px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  transition: all .22s;
}
.cart-browse-btn:hover {
  background: linear-gradient(135deg, rgba(200,132,122,.3), rgba(239,201,122,.15));
  border-color: rgba(239,201,122,.4);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(92,26,42,.3);
}

/* Cart Footer */
.cart-footer {
  border-top: 1px solid rgba(200,132,122,.14);
  padding: 18px 20px 24px;
  flex-shrink: 0;
  background: linear-gradient(0deg, rgba(92,26,42,.15), transparent);
  display: none;
}
.cart-summary {
  margin-bottom: 14px;
}
.cart-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: var(--champ-dim);
  margin-bottom: 5px;
}
.cart-summary-price {
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--champ);
}
.cart-free-ship {
  font-size: 10px;
  letter-spacing: .5px;
  color: var(--wa);
  font-weight: 600;
  min-height: 16px;
}
.cart-checkout-btns {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.cart-btn-wa {
  display: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: linear-gradient(135deg, #1aad53, #25D366, #34D669);
  color: #fff;
  padding: 14px 20px;
  border-radius: 13px;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  border: 1px solid rgba(37,211,102,.3);
  box-shadow: 0 6px 24px rgba(37,211,102,.25), inset 0 1px 0 rgba(255,255,255,.15);
  transition: all .22s;
}
.cart-btn-wa:hover {
  background: linear-gradient(135deg, #25D366, #34D669, #5EE88A);
  box-shadow: 0 10px 32px rgba(37,211,102,.38);
  transform: translateY(-2px);
}
.cart-btn-direct {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: linear-gradient(135deg, rgba(92,26,42,.7), rgba(200,132,122,.35));
  color: var(--champ);
  padding: 15px 20px;
  border-radius: 13px;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  border: 1px solid rgba(200,132,122,.45);
  box-shadow: 0 6px 24px rgba(92,26,42,.3), inset 0 1px 0 rgba(255,255,255,.07);
  transition: all .22s;
}
.cart-btn-direct:hover {
  background: linear-gradient(135deg, rgba(200,132,122,.45), rgba(239,201,122,.2));
  border-color: rgba(212,168,85,.55);
  box-shadow: 0 10px 32px rgba(92,26,42,.4);
  transform: translateY(-2px);
}

/* ══════════════════════════════════════════════
   CART TOAST NOTIFICATION
══════════════════════════════════════════════ */
.cart-toast {
  position: fixed;
  bottom: 90px; right: 20px;
  z-index: 5000;
  display: flex;
  align-items: center;
  gap: 9px;
  background: linear-gradient(135deg, rgba(22,5,10,.98), rgba(58,13,24,.95));
  border: 1px solid rgba(200,132,122,.4);
  border-radius: 14px;
  padding: 12px 16px;
  color: var(--champ);
  font-size: 11.5px;
  font-weight: 600;
  box-shadow: 0 12px 40px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.03);
  transform: translateY(80px);
  opacity: 0;
  pointer-events: none;
  transition: transform .32s cubic-bezier(.34,1.56,.64,1), opacity .28s;
  max-width: 280px;
}
.cart-toast svg { flex-shrink: 0; color: var(--wa); }
.cart-toast.show {
  transform: translateY(0);
  opacity: 1;
  pointer-events: all;
}
.cart-toast-view {
  background: none;
  border: none;
  color: var(--gold-l);
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  padding: 4px 10px;
  border-radius: 6px;
  background: rgba(212,168,85,.1);
  border: 1px solid rgba(212,168,85,.25);
  transition: all .18s;
  white-space: nowrap;
}
.cart-toast-view:hover {
  background: rgba(212,168,85,.2);
  border-color: rgba(212,168,85,.45);
}

/* ══════════════════════════════════════════════
   STICKY MOBILE CTA — CART UPGRADE
══════════════════════════════════════════════ */
.st-cart {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: linear-gradient(135deg, rgba(92,26,42,.7), rgba(200,132,122,.25));
  border: 1px solid rgba(200,132,122,.35);
  color: var(--champ);
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 10.5px;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  transition: all .22s;
  white-space: nowrap;
  flex-shrink: 0;
  position: relative;
}
.st-cart:hover {
  background: rgba(200,132,122,.25);
  border-color: var(--rose);
  box-shadow: 0 4px 16px rgba(92,26,42,.3);
}
.st-cart-count {
  background: linear-gradient(135deg, var(--gold), var(--gold-l));
  color: var(--ink);
  border-radius: 50px;
  font-size: 8.5px;
  font-weight: 800;
  padding: 1px 6px;
  min-width: 16px;
  text-align: center;
  line-height: 1.4;
}

/* ══════════════════════════════════════════════
   HERO UPGRADES
══════════════════════════════════════════════ */
.hero-bg {
  background:
    radial-gradient(ellipse 100% 80% at 50% 60%, rgba(92,26,42,.52) 0%, transparent 68%),
    radial-gradient(ellipse 60% 50% at 78% 22%, rgba(200,132,122,.1) 0%, transparent 60%),
    radial-gradient(ellipse 45% 65% at 15% 75%, rgba(212,168,85,.06) 0%, transparent 55%),
    radial-gradient(ellipse 80% 60% at 30% 30%, rgba(58,13,24,.3) 0%, transparent 55%),
    var(--ink);
}

/* Hero pills upgrade */
.pill {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(245,230,204,.55);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(200,132,122,.14);
  border-radius: 50px;
  padding: 5px 12px;
  transition: all .22s;
}
.pill:hover {
  color: var(--champ-dim);
  border-color: rgba(200,132,122,.28);
  background: rgba(200,132,122,.06);
}

/* ══════════════════════════════════════════════
   SCARCITY BAR UPGRADE
══════════════════════════════════════════════ */
.scarcity {
  background: linear-gradient(90deg,
    rgba(26,4,8,.95) 0%,
    rgba(58,13,24,.92) 50%,
    rgba(26,4,8,.95) 100%
  );
  border-top: 1px solid rgba(200,132,122,.18);
  border-bottom: 1px solid rgba(200,132,122,.18);
  box-shadow: 0 2px 20px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.02);
}
.cd-box {
  background: linear-gradient(135deg, rgba(92,26,42,.8), rgba(58,13,24,.9));
  border-color: rgba(200,132,122,.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 2px 8px rgba(0,0,0,.3);
}

/* ══════════════════════════════════════════════
   TRUST BADGES UPGRADE
══════════════════════════════════════════════ */
.t-bdg {
  background: linear-gradient(135deg, rgba(92,26,42,.2), rgba(13,7,3,.7));
  border: 1px solid rgba(200,132,122,.2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  transition: all .22s;
}
.t-bdg:hover {
  border-color: rgba(200,132,122,.38);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(92,26,42,.2), inset 0 1px 0 rgba(255,255,255,.06);
}

/* ══════════════════════════════════════════════
   BOTTOM CTA UPGRADE
══════════════════════════════════════════════ */
.bcta {
  background: linear-gradient(135deg,
    rgba(26,4,8,.98) 0%,
    rgba(58,13,24,.88) 40%,
    rgba(26,4,8,.98) 100%
  );
  border-top: 1px solid rgba(200,132,122,.2);
  border-bottom: 1px solid rgba(200,132,122,.2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 0 80px rgba(92,26,42,.15) inset;
}

/* ══════════════════════════════════════════════
   MISC MOTION & PERFORMANCE
══════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}

/* ══════════════════════════════════════════════
   CART RESPONSIVE
══════════════════════════════════════════════ */
@media (max-width: 480px) {
  .cart-drawer { max-width: 100%; }
  .cart-toast { bottom: 110px; right: 12px; left: 12px; max-width: none; }
  .st-cart { padding: 12px 10px; font-size: 10px; }
}
/* ══════════════════════════════════════════════════════════════
   ██████╗ ██████╗ ███████╗███╗   ███╗██╗██╗   ██╗███╗   ███╗
   ██╔══██╗██╔══██╗██╔════╝████╗ ████║██║██║   ██║████╗ ████║
   ██████╔╝██████╔╝█████╗  ██╔████╔██║██║██║   ██║██╔████╔██║
   ██╔═══╝ ██╔══██╗██╔══╝  ██║╚██╔╝██║██║██║   ██║██║╚██╔╝██║
   ULTIMATE PRO UI — PARINEETA 2025 — FINAL UPGRADE
══════════════════════════════════════════════════════════════ */

/* ── PREMIUM FONT IMPORT ── */

:root {
  --crimson: #8B1A2A;
  --crimson-l: #C0394A;
  --silk: #F2E4D0;
  --silk-dim: rgba(242,228,208,0.55);
  --amber: #D4A030;
  --amber-l: #F0C060;
  --shadow-deep: 0 32px 80px rgba(0,0,0,0.65);
  --shadow-card: 0 12px 40px rgba(0,0,0,0.45);
  --glow-crimson: 0 0 30px rgba(139,26,42,0.4);
  --glow-amber: 0 0 20px rgba(212,160,48,0.3);
  --transition-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ══════════════════════════════════════════
   GLOBAL MICRO-TEXTURE OVERLAY
══════════════════════════════════════════ */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: 
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9999;
  opacity: 0.035;
}

/* ══════════════════════════════════════════
   ENHANCED STRIP
══════════════════════════════════════════ */
.strip {
  background: linear-gradient(90deg, #1A0308, #3A0D18, #5C1A2A, #3A0D18, #1A0308);
  border-bottom: 1px solid rgba(200,132,122,0.3);
  padding: 9px 0;
}
.strip-track span {
  font-size: 9.5px;
  letter-spacing: 3px;
}
.strip-track span em {
  color: var(--amber-l);
  font-style: normal;
  font-weight: 800;
}

/* ══════════════════════════════════════════
   NAV — PREMIUM UPGRADE
══════════════════════════════════════════ */
nav {
  background: linear-gradient(90deg,
    rgba(10,2,4,0.99),
    rgba(30,6,12,0.97),
    rgba(10,2,4,0.99)
  ) !important;
  border-bottom: 1px solid rgba(200,132,122,0.2) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.03), 0 4px 60px rgba(0,0,0,0.6) !important;
  padding: 14px 5%;
}

.logo {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(22px, 3.5vw, 30px);
  letter-spacing: 0.5px;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.logo em {
  font-style: italic;
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Nav link underline — consolidated. Single rule, no overrides. */
.nav-links a {
  font-size: 11px;
  letter-spacing: 2px;
  position: relative;
}
/* Single ::after definition — left-to-right grow, rose color, consistent timing */
.nav-links a::after {
  background: var(--rose);
  height: 1px;
  transition: width .3s ease;
  transform-origin: left center;
}

/* Nav cart premium */
.nav-cart-btn {
  background: linear-gradient(135deg, rgba(92,26,42,0.5), rgba(58,13,24,0.7)) !important;
  border: 1px solid rgba(200,132,122,0.3) !important;
  border-radius: 12px !important;
  width: 44px !important;
  height: 44px !important;
  transition: all 0.25s var(--transition-spring) !important;
}
.nav-cart-btn:hover {
  background: linear-gradient(135deg, rgba(200,132,122,0.3), rgba(92,26,42,0.6)) !important;
  border-color: rgba(200,132,122,0.6) !important;
  box-shadow: 0 0 0 3px rgba(200,132,122,0.08), 0 8px 24px rgba(92,26,42,0.4) !important;
  transform: translateY(-2px) scale(1.05) !important;
}
.cart-badge {
  background: linear-gradient(135deg, var(--amber), var(--amber-l)) !important;
  font-size: 8.5px !important;
  font-weight: 900 !important;
  min-width: 20px !important;
  height: 20px !important;
  border: 2px solid rgba(10,2,4,0.95) !important;
}

/* ══════════════════════════════════════════
   HERO — CINEMATIC UPGRADE
══════════════════════════════════════════ */
.hero {
  min-height: clamp(600px, 95svh, 960px);
}

.hero-bg {
  background:
    radial-gradient(ellipse 120% 90% at 50% 70%, rgba(92,26,42,0.6) 0%, transparent 65%),
    radial-gradient(ellipse 70% 55% at 82% 20%, rgba(200,132,122,0.12) 0%, transparent 58%),
    radial-gradient(ellipse 50% 70% at 12% 80%, rgba(212,168,85,0.07) 0%, transparent 52%),
    radial-gradient(ellipse 90% 70% at 25% 25%, rgba(58,13,24,0.35) 0%, transparent 58%),
    var(--ink) !important;
}

.hero-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 80px,
      rgba(200,132,122,0.012) 80px,
      rgba(200,132,122,0.012) 81px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 80px,
      rgba(200,132,122,0.008) 80px,
      rgba(200,132,122,0.008) 81px
    );
}

.hero-tag {
  background: linear-gradient(135deg, rgba(92,26,42,0.7), rgba(58,13,24,0.8));
  border: 1px solid rgba(212,168,85,0.25);
  color: var(--amber-l);
  font-size: 9.5px;
  letter-spacing: 4px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.06);
}
.hero-tag::before { color: var(--amber); }

.hero-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(48px, 11vw, 112px);
  font-weight: 800;
  letter-spacing: -1px;
  background: linear-gradient(135deg, var(--silk) 0%, rgba(245,230,204,0.8) 50%, var(--amber-l) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-style: italic;
  display: block;
}

.hero-sub {
  font-size: clamp(10.5px, 1.7vw, 12.5px);
  letter-spacing: 4px;
  color: rgba(242,228,208,0.5);
}

.btn-wa-lg {
  background: linear-gradient(135deg, #0B7A45 0%, #25D366 45%, #40E07A 100%) !important;
  border: 1px solid rgba(64,224,122,0.3) !important;
  box-shadow: 0 8px 32px rgba(37,211,102,0.3), 0 0 0 1px rgba(37,211,102,0.1), inset 0 1px 0 rgba(255,255,255,0.2) !important;
  font-size: 11.5px !important;
  letter-spacing: 2px !important;
  font-weight: 800 !important;
  padding: 16px 36px !important;
}
.btn-wa-lg:hover {
  background: linear-gradient(135deg, #25D366 0%, #40E07A 50%, #5EE88A 100%) !important;
  transform: translateY(-3px) scale(1.02) !important;
  box-shadow: 0 16px 48px rgba(37,211,102,0.45), 0 0 40px rgba(37,211,102,0.15) !important;
}

.btn-outline {
  border: 1px solid rgba(200,132,122,0.4) !important;
  font-size: 10.5px !important;
  letter-spacing: 2.5px !important;
  padding: 15px 30px !important;
}

/* ══════════════════════════════════════════
   SCARCITY BAR
══════════════════════════════════════════ */
.scarcity {
  background: linear-gradient(90deg,
    rgba(14,3,6,0.97),
    rgba(42,10,18,0.95),
    rgba(14,3,6,0.97)
  ) !important;
}
.cd-box {
  background: linear-gradient(135deg, rgba(92,26,42,0.9), rgba(30,6,12,0.95)) !important;
  border: 1px solid rgba(212,168,85,0.3) !important;
  color: var(--amber-l) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
.cd-sep { color: var(--amber) !important; }

/* ══════════════════════════════════════════
   SECTION HEADERS
══════════════════════════════════════════ */
.eyebrow {
  font-size: 9px;
  letter-spacing: 5px;
  color: var(--amber-l);
}
.sec-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 800;
  letter-spacing: -0.5px;
}
.sec-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.sec-line {
  width: 64px;
  height: 1.5px;
  background: linear-gradient(to right, transparent, var(--amber), var(--crimson-l), transparent);
  margin-top: 16px;
}

/* ══════════════════════════════════════════
   PRODUCT CARDS — ULTIMATE PREMIUM
══════════════════════════════════════════ */
.p-card {
  background: linear-gradient(175deg,
    rgba(42,8,16,0.85) 0%,
    rgba(8,3,2,0.92) 45%,
    rgba(30,8,14,0.88) 100%
  ) !important;
  border: 1px solid rgba(200,132,122,0.18) !important;
  border-radius: 20px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.04) inset,
    0 -1px 0 rgba(0,0,0,0.4) inset,
    0 12px 40px rgba(0,0,0,0.5) !important;
  transition: transform 0.4s var(--transition-spring), box-shadow 0.4s ease, border-color 0.3s ease !important;
  overflow: hidden;
}
/* Top shimmer line */
.p-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,85,0.5), rgba(200,132,122,0.3), transparent);
  pointer-events: none;
}
.p-card:hover {
  transform: translateY(-10px) scale(1.015) !important;
  box-shadow:
    0 30px 70px rgba(0,0,0,0.6),
    0 0 0 1px rgba(212,168,85,0.35),
    0 0 50px rgba(92,26,42,0.3) !important;
  border-color: rgba(212,168,85,0.4) !important;
}

/* Image area */
.p-img-placeholder, .p-img-wrap {
  aspect-ratio: 2/3 !important;
  overflow: hidden;
  position: relative;
}
.p-img-placeholder img, .p-img-wrap img {
  transition: transform 0.6s ease !important;
  object-position: center top;
}
.p-card:hover .p-img-placeholder img,
.p-card:hover .p-img-wrap img {
  transform: scale(1.08) !important;
}

/* Gradient overlay on image bottom */
.p-img-placeholder::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 55%;
  background: linear-gradient(to top, rgba(8,3,2,0.85) 0%, rgba(8,3,2,0.4) 50%, transparent 100%);
  z-index: 1;
  pointer-events: none;
}

/* Card body */
.p-body {
  padding: 16px 18px 20px !important;
  position: relative;
}
.p-name {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(15px, 1.8vw, 18px) !important;
  font-weight: 700;
  letter-spacing: -0.2px;
  line-height: 1.25;
  color: var(--silk);
}
.p-meta {
  font-size: 10.5px;
  letter-spacing: 0.3px;
  color: rgba(242,228,208,0.45);
  margin-top: 3px;
  margin-bottom: 3px;
}
.p-code {
  font-size: 9px;
  letter-spacing: 2px;
  color: rgba(212,168,85,0.3);
  margin-bottom: 10px;
}
.p-price {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(18px, 2.4vw, 23px) !important;
  font-weight: 800;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.p-price-save {
  background: rgba(37,211,102,0.12) !important;
  color: #4DE888 !important;
  border: 1px solid rgba(37,211,102,0.2) !important;
  font-size: 8.5px !important;
  letter-spacing: 1.5px !important;
  font-weight: 800 !important;
}

/* Badges */
.bdg {
  font-size: 8px !important;
  letter-spacing: 1.5px !important;
  font-weight: 800 !important;
  padding: 3px 10px !important;
  border-radius: 50px !important;
}
.bdg-stock {
  background: linear-gradient(135deg, rgba(248,113,113,0.9), rgba(200,40,40,0.85)) !important;
  animation: blinkPulse 2s ease-in-out infinite;
  box-shadow: 0 0 10px rgba(248,113,113,0.3);
}
@keyframes blinkPulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 10px rgba(248,113,113,0.3); }
  50% { opacity: 0.75; box-shadow: 0 0 6px rgba(248,113,113,0.1); }
}
.bdg-new {
  background: linear-gradient(135deg, rgba(212,168,85,0.95), rgba(239,201,122,0.9)) !important;
  color: rgba(13,7,3,0.95) !important;
  box-shadow: 0 0 10px rgba(212,168,85,0.25);
}
.bdg-eid {
  background: linear-gradient(135deg, rgba(10,22,40,0.92), rgba(30,55,100,0.88)) !important;
  color: #7BA4F0 !important;
  border: 1px solid rgba(123,164,240,0.3) !important;
}

/* ── ADD TO CART BUTTON ── FINAL PREMIUM */
.btn-add-cart {
  background: linear-gradient(135deg, #3A0D18 0%, #6B1E2C 40%, #A04050 80%, #C8847A 100%) !important;
  border: 1px solid rgba(212,168,85,0.2) !important;
  border-radius: 13px !important;
  padding: 12px 16px !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
  font-weight: 800 !important;
  box-shadow:
    0 4px 18px rgba(92,26,42,0.35),
    0 1px 0 rgba(255,255,255,0.1) inset,
    0 -1px 0 rgba(0,0,0,0.3) inset !important;
  position: relative;
  overflow: hidden;
  transition: all 0.25s var(--transition-spring) !important;
}
.btn-add-cart::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.12), transparent);
  transition: left 0.5s ease;
  pointer-events: none;
}
.btn-add-cart:hover {
  background: linear-gradient(135deg, #6B1E2C 0%, #A04050 40%, #C8847A 70%, #EFC97A 100%) !important;
  transform: translateY(-3px) !important;
  box-shadow:
    0 10px 32px rgba(92,26,42,0.55),
    0 0 24px rgba(200,132,122,0.2),
    0 1px 0 rgba(255,255,255,0.15) inset !important;
  border-color: rgba(239,201,122,0.4) !important;
}
.btn-add-cart:hover::before { left: 160%; }
.btn-add-cart:active { transform: translateY(0) scale(0.98) !important; }

.btn-view-details {
  border-radius: 13px !important;
  font-size: 9px !important;
  letter-spacing: 2.5px !important;
  font-weight: 700 !important;
  transition: all 0.22s ease !important;
  color: rgba(242,228,208,0.45) !important;
  border: 1px solid rgba(200,132,122,0.15) !important;
}
.btn-view-details:hover {
  color: var(--amber-l) !important;
  border-color: rgba(212,168,85,0.4) !important;
  background: rgba(212,168,85,0.06) !important;
}

/* ══════════════════════════════════════════
   PANJABI SECTION
══════════════════════════════════════════ */
.panjabi-card::after {
  background: linear-gradient(90deg, transparent, rgba(123,164,240,0.4), transparent);
}
.panjabi-card:hover {
  border-color: rgba(123,164,240,0.5) !important;
  box-shadow:
    0 30px 70px rgba(0,0,0,0.6),
    0 0 0 1px rgba(123,164,240,0.4),
    0 0 50px rgba(10,22,40,0.35) !important;
}

/* ══════════════════════════════════════════
   FILTER TABS
══════════════════════════════════════════ */
.ftab {
  background: rgba(255,255,255,0.025) !important;
  border: 1px solid rgba(200,132,122,0.14) !important;
  font-size: 9.5px !important;
  letter-spacing: 2px !important;
  padding: 8px 18px !important;
  border-radius: 50px !important;
  transition: all 0.22s ease !important;
}
.ftab:hover {
  background: rgba(200,132,122,0.1) !important;
  border-color: rgba(200,132,122,0.35) !important;
  transform: translateY(-1px) !important;
}
.ftab.active {
  background: linear-gradient(135deg, rgba(92,26,42,0.7), rgba(200,132,122,0.25)) !important;
  border-color: rgba(212,168,85,0.5) !important;
  color: var(--amber-l) !important;
  box-shadow: 0 4px 16px rgba(92,26,42,0.3), 0 0 14px rgba(212,168,85,0.08) !important;
}

/* ══════════════════════════════════════════
   OFFER BANNER
══════════════════════════════════════════ */
.offer-banner {
  background: linear-gradient(130deg,
    rgba(20,4,8,0.98),
    rgba(58,13,24,0.9),
    rgba(42,18,4,0.8),
    rgba(20,4,8,0.98)
  ) !important;
  border: 1px solid rgba(212,168,85,0.2) !important;
  box-shadow: 0 16px 60px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
.offer-banner::before {
  content: '✦';
  font-size: 220px;
  color: rgba(212,168,85,0.03);
}
.offer-text h3 {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 800;
}
.offer-text h3 em {
  background: linear-gradient(135deg, var(--amber), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ══════════════════════════════════════════
   CATEGORY CARDS
══════════════════════════════════════════ */
.cat-card {
  border-radius: 18px !important;
  transition: transform 0.4s var(--transition-spring), box-shadow 0.35s ease, border-color 0.3s ease !important;
}
.cat-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 700;
}

/* ══════════════════════════════════════════
   STEP CARDS
══════════════════════════════════════════ */
.step-card {
  border-radius: 20px !important;
}
.step-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 18px;
  font-weight: 700;
}

/* ══════════════════════════════════════════
   REVIEW CARDS
══════════════════════════════════════════ */
.rev-card {
  border-radius: 20px !important;
}
.rev-name {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
}
.rev-stars {
  color: var(--amber-l);
  letter-spacing: 3px;
  font-size: 12px;
}

/* ══════════════════════════════════════════
   DELIVERY CARDS
══════════════════════════════════════════ */
.del-card {
  border-radius: 16px !important;
}
.del-t {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 700;
}

/* ══════════════════════════════════════════
   BOTTOM CTA
══════════════════════════════════════════ */
.bcta-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 800;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.bcta-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ══════════════════════════════════════════
   PRODUCT DETAIL MODAL — PREMIUM
══════════════════════════════════════════ */
.pd-modal {
  border-radius: 24px !important;
  border: 1px solid rgba(212,168,85,0.2) !important;
}
.pd-name {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 800;
}
.pd-price {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 800;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.pd-btn-cart {
  border-radius: 14px !important;
  background: linear-gradient(135deg, #3A0D18, #6B1E2C, #A04050, #C8847A) !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  transition: all 0.25s var(--transition-spring) !important;
}
.pd-btn-cart:hover {
  background: linear-gradient(135deg, #6B1E2C, #C8847A, #EFC97A) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 10px 30px rgba(92,26,42,0.5), 0 0 20px rgba(200,132,122,0.2) !important;
}

/* ══════════════════════════════════════════
   ORDER MODAL — PREMIUM
══════════════════════════════════════════ */
.modal {
  border-radius: 24px !important;
  border: 1px solid rgba(212,168,85,0.18) !important;
}
.modal-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 24px;
  font-weight: 800;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.form-submit {
  background: linear-gradient(135deg, #2A0610, #5C1A2A, #9E5A52) !important;
  border: 1px solid rgba(212,168,85,0.2) !important;
  border-radius: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  transition: all 0.25s var(--transition-spring) !important;
}
.form-submit:hover {
  background: linear-gradient(135deg, #5C1A2A, #C8847A, #EFC97A) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 36px rgba(92,26,42,0.5) !important;
}

/* ══════════════════════════════════════════
   CART DRAWER — ULTIMATE
══════════════════════════════════════════ */
.cart-drawer {
  background: linear-gradient(175deg,
    rgba(14,3,6,0.99) 0%,
    rgba(8,2,4,0.99) 100%
  ) !important;
  border-left: 1px solid rgba(200,132,122,0.2) !important;
  box-shadow: -30px 0 80px rgba(0,0,0,0.7) !important;
}

.cart-header {
  background: linear-gradient(90deg, rgba(92,26,42,0.3), rgba(58,13,24,0.2), transparent) !important;
  border-bottom: 1px solid rgba(200,132,122,0.12) !important;
  padding: 22px 24px !important;
}
.cart-header-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 18px;
  font-weight: 700;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.cart-header-count {
  background: rgba(212,168,85,0.1) !important;
  border: 1px solid rgba(212,168,85,0.2) !important;
  color: var(--amber-l) !important;
}

.cart-item {
  background: linear-gradient(135deg, rgba(42,8,16,0.7), rgba(8,3,2,0.85)) !important;
  border: 1px solid rgba(200,132,122,0.14) !important;
  border-radius: 16px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
.cart-item:hover {
  border-color: rgba(212,168,85,0.28) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3) !important;
}
.cart-item-emoji {
  background: linear-gradient(135deg, rgba(92,26,42,0.5), rgba(30,6,12,0.7)) !important;
  border: 1px solid rgba(200,132,122,0.18) !important;
  border-radius: 12px !important;
}
.cart-item-name {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 700;
}
.cart-item-price {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.cart-btn-wa {
  display: none !important;
}

.cart-btn-direct {
  background: linear-gradient(135deg, rgba(92,26,42,0.7), rgba(200,132,122,0.35)) !important;
  border: 1px solid rgba(200,132,122,0.45) !important;
  border-radius: 14px !important;
  font-weight: 700 !important;
  padding: 15px 20px !important;
  transition: all 0.22s ease !important;
  box-shadow: 0 6px 24px rgba(92,26,42,0.3) !important;
}
.cart-btn-direct:hover {
  background: linear-gradient(135deg, rgba(92,26,42,0.5), rgba(200,132,122,0.2)) !important;
  border-color: rgba(212,168,85,0.4) !important;
  transform: translateY(-2px) !important;
}

.cart-summary-price {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 22px;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.cart-browse-btn {
  background: linear-gradient(135deg, rgba(92,26,42,0.6), rgba(200,132,122,0.2)) !important;
  border: 1px solid rgba(200,132,122,0.3) !important;
  border-radius: 50px !important;
}

/* ══════════════════════════════════════════
   CART TOAST
══════════════════════════════════════════ */
.cart-toast {
  background: linear-gradient(135deg, rgba(14,3,6,0.99), rgba(42,8,16,0.97)) !important;
  border: 1px solid rgba(212,168,85,0.3) !important;
  border-radius: 16px !important;
  box-shadow: 0 16px 50px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.025) !important;
}
.cart-toast svg { color: #40E07A !important; }
.cart-toast-view {
  background: rgba(212,168,85,0.12) !important;
  border: 1px solid rgba(212,168,85,0.28) !important;
  color: var(--amber-l) !important;
  border-radius: 8px !important;
}

/* ══════════════════════════════════════════
   STICKY MOBILE CTA
══════════════════════════════════════════ */
.sticky-mob {
  background: rgba(6,1,3,0.98) !important;
  border-top: 1px solid rgba(200,132,122,0.14) !important;
  backdrop-filter: blur(30px) !important;
}
.st-wa {
  background: linear-gradient(135deg, #0B7A45, #25D366, #40E07A) !important;
  border-radius: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 1.5px !important;
  box-shadow: 0 4px 20px rgba(37,211,102,0.28) !important;
}
.st-cart {
  background: linear-gradient(135deg, rgba(42,8,16,0.8), rgba(92,26,42,0.4)) !important;
  border: 1px solid rgba(200,132,122,0.3) !important;
  border-radius: 14px !important;
}

/* ══════════════════════════════════════════
   FOOTER
══════════════════════════════════════════ */
.foot-logo {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-weight: 800;
  background: linear-gradient(135deg, var(--silk), var(--amber-l));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.foot-logo em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ══════════════════════════════════════════
   RIPPLE EFFECT UPGRADE
══════════════════════════════════════════ */
.rp-drop {
  background: rgba(255,255,255,0.15) !important;
  animation: ripAnim 0.65s linear !important;
}

/* ══════════════════════════════════════════
   SCROLLBAR
══════════════════════════════════════════ */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: rgba(10,3,5,0.5); }
::-webkit-scrollbar-thumb { 
  background: linear-gradient(to bottom, rgba(200,132,122,0.4), rgba(92,26,42,0.5));
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(to bottom, rgba(200,132,122,0.6), rgba(92,26,42,0.7));

scrollbar-width: thin;
scrollbar-color: rgba(200,132,122,0.4) transparent;
}
/* ══════════════════════════════════════════
   SELECTION
══════════════════════════════════════════ */
::selection {
  background: rgba(92,26,42,0.6);
  color: var(--silk);
}

/* ══════════════════════════════════════════
   SEE MORE BUTTON
══════════════════════════════════════════ */
.btn-see-more {
  border-radius: 50px !important;
  font-size: 9.5px !important;
  letter-spacing: 2.5px !important;
  font-weight: 700 !important;
  padding: 13px 34px !important;
  transition: all 0.25s var(--transition-spring) !important;
}
.btn-see-more:hover {
  transform: translateY(-3px) !important;
}

/* ══════════════════════════════════════════
   TRUST BADGES
══════════════════════════════════════════ */
.t-bdg {
  border-radius: 50px !important;
  padding: 10px 22px !important;
  font-size: 10.5px !important;
  transition: all 0.25s var(--transition-spring) !important;
}
.t-bdg:hover {
  transform: translateY(-3px) scale(1.02) !important;
}

/* ══════════════════════════════════════════
   NAV ORDER DROP
══════════════════════════════════════════ */
.nav-order-drop {
  border-radius: 18px !important;
  border: 1px solid rgba(212,168,85,0.18) !important;
  background: linear-gradient(160deg, rgba(20,4,8,0.99), rgba(10,2,4,0.99)) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.025) !important;
}
.nav-drop-item {
  font-size: 11px !important;
  letter-spacing: 1.5px !important;
}
.nav-drop-item:hover {
  background: rgba(212,168,85,0.07) !important;
}
.drop-label { color: var(--silk); }
.drop-sub { color: rgba(212,168,85,0.5) !important; }

/* ══════════════════════════════════════════
   FOCUS STYLES
══════════════════════════════════════════ */
.form-input:focus {
  border-color: rgba(212,168,85,0.5) !important;
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.3), 0 0 0 3px rgba(212,168,85,0.06) !important;
  outline: none;
}

/* Product detail modal gallery */
.pd-gallery-badge {
  background: linear-gradient(135deg, rgba(42,8,16,0.8), rgba(22,4,8,0.85)) !important;
  border: 1px solid rgba(212,168,85,0.3) !important;
  color: var(--amber-l) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4) !important;
}

/* pd-gallery image support */
.pd-gallery img {
  max-width: 100%;
  max-height: 320px;
  object-fit: cover;
  border-radius: 12px;
  position: relative;
  z-index: 2;
}

/* Ensure no gradient text on elements that need colors set */
.pill svg { opacity: 0.6; }

/* Size button upgrades */
.pd-size-btn {
  border-radius: 10px !important;
  font-size: 10.5px !important;
  letter-spacing: 0.5px !important;
  transition: all 0.18s var(--transition-spring) !important;
}
.pd-size-btn:hover, .pd-size-btn.sel {
  background: linear-gradient(135deg, rgba(92,26,42,0.5), rgba(200,132,122,0.2)) !important;
  border-color: rgba(212,168,85,0.5) !important;
  color: var(--amber-l) !important;
  box-shadow: 0 0 12px rgba(212,168,85,0.1) !important;
}

/* Modal close button */
.pd-modal-close {
  border-radius: 12px !important;
  border: 1px solid rgba(200,132,122,0.2) !important;
  transition: all 0.2s ease !important;
}
.pd-modal-close:hover {
  background: rgba(200,132,122,0.2) !important;
  border-color: rgba(212,168,85,0.4) !important;
  transform: scale(1.05) !important;
}
.modal-close {
  border-radius: 10px !important;
  transition: all 0.2s ease !important;
}


/* ════════════════════════════════════════════════════════════
   PARINEETA — FINAL REFINEMENT CSS v2
   1. Navbar fixes (badge, Order Now, hamburger, mobile menu)
   2. Category card image replacements
   3. Product detail gallery slider
   4. Review submission form
   5. pd-btn-view-cart button
════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════
   1. NAVBAR — FINAL FIXES
══════════════════════════════════════════ */

/* Fix cart badge — fully contained, never clipped */
.nav-cart-btn {
  position: relative !important;
  overflow: visible !important; /* allow badge to extend outside button visually */
  padding: 0 !important;
  flex-shrink: 0;
}

/* Badge fully inside visible area — repositioned to top-right */
.nav-cart-btn .cart-badge {
  position: absolute !important;
  top: -5px !important;
  right: -5px !important;
  left: auto !important;
  min-width: 18px !important;
  height: 18px !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  z-index: 10 !important;
  pointer-events: none !important;
  border: 2px solid rgba(8,2,4,0.95) !important;
  border-radius: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #D4A030, #F0C060) !important;
  color: #080204 !important;
  padding: 0 3px !important;
  line-height: 1 !important;
  /* Ensure it's never clipped */
  clip-path: none !important;
  overflow: visible !important;
}

/* Nav right group — proper padding for badge overflow */
.nav-right-group {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0;
  padding: 0 2px; /* give room for badge */
}

/* Order Now button — streamlined (no dropdown) */
.nav-order-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  background: linear-gradient(135deg, #3A0D18, #6B1E2C, #A04050) !important;
  color: var(--champ) !important;
  padding: 9px 18px !important;
  border-radius: 50px !important;
  font-size: 10.5px !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  font-weight: 800 !important;
  border: 1px solid rgba(200,132,122,0.4) !important;
  box-shadow: 0 4px 16px rgba(92,26,42,0.3), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  cursor: pointer !important;
  font-family: var(--font-body) !important;
  transition: all 0.25s cubic-bezier(0.34,1.56,0.64,1) !important;
  flex-shrink: 0;
}
.nav-order-btn:hover {
  background: linear-gradient(135deg, #6B1E2C, #C8847A, #EFC97A) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(92,26,42,0.45), 0 0 18px rgba(200,132,122,0.15) !important;
  border-color: rgba(212,168,85,0.5) !important;
}

/* ── HAMBURGER BUTTON ── */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: rgba(92,26,42,0.3);
  border: 1px solid rgba(200,132,122,0.25);
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
  transition: all 0.2s ease;
  flex-shrink: 0;
}
.nav-hamburger span {
  display: block;
  width: 18px;
  height: 1.5px;
  background: var(--champ);
  border-radius: 2px;
  transition: all 0.3s ease;
  transform-origin: center;
}
.nav-hamburger.active span:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}
.nav-hamburger.active span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav-hamburger.active span:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}
.nav-hamburger:hover {
  background: rgba(200,132,122,0.2);
  border-color: rgba(200,132,122,0.45);
}

/* Hide nav-links on tablet/mobile, show hamburger */
@media (max-width: 900px) {
  .nav-links { display: none !important; }
  .nav-hamburger { display: flex !important; }
  .nav-order-btn { display: none !important; }
}
@media (max-width: 480px) {
  nav { padding: 12px 4%; }
}

/* ── MOBILE MENU ── */
.mobile-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 1800;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.mobile-menu-overlay.open {
  opacity: 1;
  pointer-events: all;
}

.mobile-menu {
  position: fixed;
  top: 0;
  right: 0;
  width: min(340px, 88vw);
  height: 100%;
  z-index: 1900;
  background: linear-gradient(175deg, rgba(14,3,6,0.99), rgba(22,5,10,0.99));
  border-left: 1px solid rgba(200,132,122,0.2);
  box-shadow: -20px 0 60px rgba(0,0,0,0.65);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
  overflow-y: auto;
}
.mobile-menu.open {
  transform: translateX(0);
}

.mobile-menu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(200,132,122,0.12);
  background: linear-gradient(90deg, rgba(92,26,42,0.3), transparent);
}
.mobile-menu-logo {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 22px;
  font-weight: 800;
  background: linear-gradient(135deg, #F2E4D0, #F0C060);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.mobile-menu-logo em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-style: italic;
}
.mobile-menu-close {
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(200,132,122,0.1);
  border: 1px solid rgba(200,132,122,0.22);
  border-radius: 10px;
  color: var(--champ-dim);
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
}
.mobile-menu-close:hover {
  background: rgba(200,132,122,0.22);
  color: var(--champ);
  border-color: var(--rose);
}

.mobile-nav-links {
  display: flex;
  flex-direction: column;
  padding: 12px 0;
  flex: 1;
}
.mobile-nav-links a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 15px 22px;
  color: var(--champ);
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(200,132,122,0.07);
  transition: background 0.18s, padding-left 0.18s;
  position: relative;
}
.mobile-nav-links a:hover {
  background: rgba(200,132,122,0.08);
  padding-left: 28px;
}
.mmn-icon {
  font-size: 18px;
  flex-shrink: 0;
  width: 28px;
  text-align: center;
}
.mmn-arrow {
  margin-left: auto;
  color: rgba(245,230,204,0.3);
  font-size: 16px;
  transition: transform 0.18s, color 0.18s;
}
.mobile-nav-links a:hover .mmn-arrow {
  transform: translateX(3px);
  color: var(--rose);
}

.mobile-menu-actions {
  padding: 18px 22px 32px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-top: 1px solid rgba(200,132,122,0.12);
}
.mmn-cart-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: linear-gradient(135deg, #3A0D18, #6B1E2C, #A04050);
  color: var(--champ);
  padding: 14px 20px;
  border-radius: 14px;
  font-size: 11px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 800;
  font-family: var(--font-body);
  border: 1px solid rgba(212,168,85,0.2);
  cursor: pointer;
  transition: all 0.22s ease;
  box-shadow: 0 4px 18px rgba(92,26,42,0.3), inset 0 1px 0 rgba(255,255,255,0.08);
}
.mmn-cart-btn:hover {
  background: linear-gradient(135deg, #6B1E2C, #C8847A, #EFC97A);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(92,26,42,0.45);
}
.mmn-wa-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: linear-gradient(135deg, #0B7A45, #25D366, #40E07A);
  color: #fff;
  padding: 13px 20px;
  border-radius: 14px;
  font-size: 11px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 800;
  font-family: var(--font-body);
  border: 1px solid rgba(64,224,122,0.25);
  text-decoration: none;
  transition: all 0.22s ease;
  box-shadow: 0 4px 18px rgba(37,211,102,0.25), inset 0 1px 0 rgba(255,255,255,0.18);
}
.mmn-wa-btn:hover {
  background: linear-gradient(135deg, #25D366, #40E07A, #6AEDA0);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(37,211,102,0.38);
}

/* ══════════════════════════════════════════
   2. CATEGORY CARDS — IMAGE-BASED
══════════════════════════════════════════ */

/* Reset the cat-img-wrap to be image container (no more emoji) */
.cat-img-wrap {
  width: 100% !important;
  aspect-ratio: 4/3 !important;
  position: relative !important;
  overflow: hidden !important;
  display: block !important;
  font-size: unset !important;
  align-items: unset !important;
  justify-content: unset !important;
  background: linear-gradient(145deg, rgba(42,8,16,0.8), rgba(8,3,2,0.9)) !important;
}

/* Cover image fills the card */
.cat-cover-img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  transition: transform 0.55s ease !important;
  display: block !important;
}
.cat-card:hover .cat-cover-img {
  transform: scale(1.07) !important;
}

/* Overlay with category label on hover */
.cat-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(8,2,4,0.82) 0%,
    rgba(8,2,4,0.35) 45%,
    rgba(42,8,16,0.15) 100%
  );
  display: flex;
  align-items: flex-end;
  padding: 14px 16px;
  transition: background 0.3s ease;
  z-index: 2;
}
.cat-card:hover .cat-img-overlay {
  background: linear-gradient(
    to top,
    rgba(8,2,4,0.88) 0%,
    rgba(42,8,16,0.5) 50%,
    rgba(42,8,16,0.2) 100%
  );
}
.cat-overlay-label {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 13px;
  font-weight: 700;
  color: rgba(242,228,208,0.85);
  letter-spacing: 0.5px;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.cat-card:hover .cat-overlay-label {
  opacity: 1;
  transform: translateY(0);
}

/* ══════════════════════════════════════════
   3. PRODUCT DETAIL GALLERY SLIDER
══════════════════════════════════════════ */

/* Gallery container */
.pd-gallery {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 0 !important;
  background: linear-gradient(145deg, rgba(42,8,16,0.95), rgba(8,3,2,0.98)) !important;
  border-radius: var(--r2) 0 0 var(--r2) !important;
  overflow: hidden;
  position: relative;
}
@media(max-width:640px){
  .pd-gallery { border-radius: var(--r2) var(--r2) 0 0 !important; }
}

/* Main image container */
.pd-gallery-main {
  position: relative;
  flex: 1;
  min-height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: rgba(8,2,4,0.6);
}

/* Main product image */
.pd-main-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: opacity 0.18s ease, transform 0.18s ease;
}

/* Gallery badge positioned inside main */
.pd-gallery-badge {
  position: absolute !important;
  bottom: 14px !important;
  left: 14px !important;
  top: auto !important;
  z-index: 5;
}

/* Arrow navigation */
.pd-gal-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6;
  width: 34px;
  height: 34px;
  background: rgba(8,2,4,0.7);
  border: 1px solid rgba(200,132,122,0.3);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--champ);
  cursor: pointer;
  transition: all 0.2s ease;
  backdrop-filter: blur(8px);
}
.pd-gal-arrow:hover {
  background: rgba(92,26,42,0.8);
  border-color: rgba(212,168,85,0.5);
  transform: translateY(-50%) scale(1.1);
}
.pd-gal-prev { left: 10px; }
.pd-gal-next { right: 10px; }

/* Thumbnail strip */
.pd-gallery-thumbs {
  display: flex;
  gap: 6px;
  padding: 10px 12px;
  background: rgba(4,1,2,0.9);
  border-top: 1px solid rgba(200,132,122,0.1);
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(200,132,122,0.25) transparent;
  flex-shrink: 0;
}
.pd-gallery-thumbs::-webkit-scrollbar { height: 3px; }
.pd-gallery-thumbs::-webkit-scrollbar-thumb { background: rgba(200,132,122,0.3); border-radius: 2px; }

.pd-thumb {
  flex-shrink: 0;
  width: 54px;
  height: 54px;
  border-radius: 9px;
  overflow: hidden;
  border: 2px solid rgba(200,132,122,0.18);
  cursor: pointer;
  transition: all 0.2s ease;
  background: rgba(8,2,4,0.6);
  padding: 0;
}
.pd-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.3s ease;
}
.pd-thumb:hover {
  border-color: rgba(200,132,122,0.5);
  transform: scale(1.05);
}
.pd-thumb:hover img { transform: scale(1.1); }
.pd-thumb.active {
  border-color: rgba(212,168,85,0.7) !important;
  box-shadow: 0 0 10px rgba(212,168,85,0.2);
}

/* ── pd-btn-view-cart ── */
.pd-btn-view-cart {
  flex: 1;
  min-width: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(135deg, rgba(42,8,16,0.8), rgba(92,26,42,0.4));
  color: var(--champ);
  padding: 12px 18px;
  border-radius: 12px;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  border: 1px solid rgba(200,132,122,0.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
  transition: all 0.25s ease;
  white-space: nowrap;
}
.pd-btn-view-cart:hover {
  background: linear-gradient(135deg, rgba(92,26,42,0.6), rgba(200,132,122,0.25));
  border-color: rgba(212,168,85,0.45);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(92,26,42,0.4);
  color: var(--amber-l, #F0C060);
}

/* ══════════════════════════════════════════
   4. REVIEW SUBMISSION FORM
══════════════════════════════════════════ */

.review-form-wrap {
  margin-top: 56px;
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}
.review-form-header {
  text-align: center;
  margin-bottom: 28px;
}
.review-form-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  color: var(--champ);
  margin-bottom: 6px;
}
.review-form-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.review-form-sub {
  font-size: 12.5px;
  color: var(--champ-dim);
  letter-spacing: 0.4px;
}

.review-form-card {
  background: linear-gradient(160deg, rgba(42,8,16,0.75), rgba(8,3,2,0.9));
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 22px;
  padding: 30px 28px;
  box-shadow: 0 12px 44px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.04);
}
@media(max-width:540px){
  .review-form-card { padding: 22px 18px; }
}

.rf-group {
  margin-bottom: 18px;
}
.rf-label {
  display: block;
  font-size: 9.5px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--champ-dim);
  margin-bottom: 8px;
  font-weight: 700;
}
.rf-input {
  width: 100%;
  background: rgba(0,0,0,0.4);
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 12px;
  padding: 12px 16px;
  color: var(--champ);
  font-family: var(--font-body);
  font-size: 13.5px;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.25);
}
.rf-input:focus {
  border-color: rgba(212,168,85,0.5);
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.25), 0 0 0 3px rgba(212,168,85,0.06);
}
.rf-input::placeholder { color: rgba(245,230,204,0.28); }
.rf-textarea {
  resize: vertical;
  min-height: 90px;
  line-height: 1.6;
}

.rf-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media(max-width:480px){
  .rf-row { grid-template-columns: 1fr; }
}

/* Star rating input */
.rf-stars {
  display: flex;
  gap: 6px;
  margin-bottom: 6px;
}
.rf-star {
  font-size: 28px;
  background: none;
  border: none;
  color: rgba(245,230,204,0.2);
  cursor: pointer;
  transition: color 0.15s, transform 0.15s;
  padding: 0;
  line-height: 1;
  font-family: 'Playfair Display', serif;
}
.rf-star:hover,
.rf-star.hover-active,
.rf-star.active {
  color: var(--amber-l, #F0C060);
  transform: scale(1.15);
}
.rf-rating-label {
  font-size: 10.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(245,230,204,0.4);
  font-weight: 600;
}

/* Submit button */
.rf-submit {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: linear-gradient(135deg, #2A0610, #5C1A2A, #9E5A52);
  color: var(--champ);
  padding: 14px 24px;
  border-radius: 14px;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 800;
  font-family: var(--font-body);
  border: 1px solid rgba(212,168,85,0.2);
  cursor: pointer;
  margin-top: 4px;
  box-shadow: 0 6px 24px rgba(92,26,42,0.3), inset 0 1px 0 rgba(255,255,255,0.08);
  transition: all 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.rf-submit:hover {
  background: linear-gradient(135deg, #5C1A2A, #C8847A, #EFC97A);
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(92,26,42,0.5);
  border-color: rgba(239,201,122,0.4);
}

/* Review success state */
.review-success {
  display: none;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 40px 24px;
  background: linear-gradient(160deg, rgba(42,8,16,0.75), rgba(8,3,2,0.9));
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 22px;
  box-shadow: 0 12px 44px rgba(0,0,0,0.45);
  animation: fadeUp 0.5s ease both;
}
.review-success-icon { font-size: 48px; margin-bottom: 14px; animation: popIn .5s; }
.review-success-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 22px;
  font-weight: 800;
  color: var(--champ);
  margin-bottom: 8px;
}
.review-success-sub { font-size: 13px; color: var(--champ-dim); line-height: 1.7; }

/* Dynamic review cards wrapper */
.dynamic-reviews {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
/* New review initial avatar */
.rev-av-initial {
  background: linear-gradient(135deg, var(--maroon), var(--rose)) !important;
  font-family: 'Playfair Display', serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--champ) !important;
}

/* ══════════════════════════════════════════
   5. SCROLLBAR for pd-gallery-thumbs
══════════════════════════════════════════ */
.pd-gallery-thumbs::-webkit-scrollbar { height: 3px; }
.pd-gallery-thumbs::-webkit-scrollbar-track { background: transparent; }
.pd-gallery-thumbs::-webkit-scrollbar-thumb { background: rgba(200,132,122,0.35); border-radius: 2px; }

/* ══════════════════════════════════════════
   6. RESPONSIVE FIXES
══════════════════════════════════════════ */

/* On mobile, gallery appears above info */
@media(max-width:640px){
  .pd-gallery { min-height: 240px; }
  .pd-gallery-main { min-height: 220px; }
  .pd-gallery-thumbs { padding: 8px 10px; gap: 5px; }
  .pd-thumb { width: 46px; height: 46px; }
}

/* Category card images on small screens */
@media(max-width:480px){
  .cat-img-wrap { aspect-ratio: 3/2 !important; }
}

/* ══════════════════════════════════════════
   7. SCROLLED NAV — subtle scroll shadow
══════════════════════════════════════════ */
nav.scrolled {
  box-shadow: 0 4px 40px rgba(0,0,0,0.55), 0 1px 0 rgba(200,132,122,0.15) !important;
}


/* ════════════════════════════════════════════════════════════
   PARINEETA — MICRO REFINEMENT CSS v3
   1. Hero headline single-line fix
   2. Unified "Order Now" button system (hero / std / bcta)
   3. Reviews dual-column layout + carousel + counter
   4. View All Reviews toggle panel
   5. Review counter badge
════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════
   1. HERO HEADLINE — SINGLE LINE
══════════════════════════════════════════ */

/* Force single line, responsive font-size using clamp */
.hero-title-single {
  white-space: nowrap !important;
  font-size: clamp(28px, 4.5vw, 72px) !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}

/* On very small screens, allow wrapping at natural point */
@media (max-width: 480px) {
  .hero-title-single {
    white-space: normal !important;
    font-size: clamp(26px, 7.5vw, 44px) !important;
  }
}

/* ══════════════════════════════════════════
   2. UNIFIED "ORDER NOW" BUTTON SYSTEM
   All variants share the same core gradient/glow as the navbar btn
══════════════════════════════════════════ */

/* ── Shared base for all Order Now variants ── */
.btn-order-now-hero,
.btn-order-now-std,
.btn-order-now-bcta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  border-radius: 50px;
  cursor: pointer;
  border: 1px solid rgba(200,132,122,0.4);
  background: linear-gradient(135deg, #3A0D18, #6B1E2C, #A04050);
  color: var(--champ, #F2E4D0);
  box-shadow:
    0 4px 16px rgba(92,26,42,0.35),
    0 0 0 0 rgba(200,132,122,0),
    inset 0 1px 0 rgba(255,255,255,0.08);
  transition:
    background 0.25s ease,
    transform 0.25s cubic-bezier(0.34,1.56,0.64,1),
    box-shadow 0.25s ease,
    border-color 0.25s ease;
  position: relative;
  overflow: hidden;
  text-decoration: none;
}

/* Shared sweep-light shimmer on hover */
.btn-order-now-hero::before,
.btn-order-now-std::before,
.btn-order-now-bcta::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(
    105deg,
    transparent 20%,
    rgba(255,255,255,0.07) 50%,
    transparent 80%
  );
  transition: left 0.45s ease;
}

.btn-order-now-hero:hover::before,
.btn-order-now-std:hover::before,
.btn-order-now-bcta:hover::before {
  left: 160%;
}

.btn-order-now-hero:hover,
.btn-order-now-std:hover,
.btn-order-now-bcta:hover {
  background: linear-gradient(135deg, #6B1E2C, #C8847A, #EFC97A);
  border-color: rgba(212,168,85,0.55);
  transform: translateY(-3px) scale(1.02);
  box-shadow:
    0 10px 30px rgba(92,26,42,0.5),
    0 0 22px rgba(200,132,122,0.18),
    inset 0 1px 0 rgba(255,255,255,0.12);
}

.btn-order-now-hero:active,
.btn-order-now-std:active,
.btn-order-now-bcta:active {
  transform: translateY(-1px) scale(0.99);
}

/* Size variants */
.btn-order-now-hero {
  font-size: 12.5px;
  padding: 14px 30px;
}

.btn-order-now-std {
  font-size: 11px;
  padding: 12px 26px;
}

.btn-order-now-bcta {
  font-size: 14px;
  padding: 17px 42px;
  letter-spacing: 2.2px;
  border-radius: 50px;
  box-shadow:
    0 6px 24px rgba(92,26,42,0.4),
    0 0 40px rgba(200,132,122,0.08),
    inset 0 1px 0 rgba(255,255,255,0.09);
}
.btn-order-now-bcta:hover {
  box-shadow:
    0 14px 40px rgba(92,26,42,0.55),
    0 0 50px rgba(200,132,122,0.2),
    inset 0 1px 0 rgba(255,255,255,0.12);
}

/* ══════════════════════════════════════════
   3. REVIEWS — DUAL COLUMN LAYOUT
══════════════════════════════════════════ */

.reviews-dual-layout {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 40px;
  align-items: start;
  margin-top: 36px;
}

@media (max-width: 1100px) {
  .reviews-dual-layout {
    grid-template-columns: 1fr 380px;
    gap: 28px;
  }
}

@media (max-width: 900px) {
  .reviews-dual-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
}

/* ── LEFT COLUMN ── */
.reviews-left-col {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* ── REVIEW CAROUSEL ── */
.rev-carousel-wrap {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
}

.rev-carousel-track {
  display: flex;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.rev-slide {
  flex: 0 0 100%;
  min-width: 100%;
  padding: 0;
}

/* Carousel-specific card styling */
.rev-carousel-card {
  margin: 0 !important;
  border-radius: 0 !important;
  min-height: 200px;
}

/* Carousel dots */
.rev-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 14px 0 10px;
  background: linear-gradient(0deg, rgba(8,2,4,0.7), transparent);
}

.rc-dot-btn {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(200,132,122,0.25);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: all 0.25s ease;
}
.rc-dot-btn.active {
  background: linear-gradient(135deg, #D4A030, #F0C060);
  width: 22px;
  border-radius: 4px;
  box-shadow: 0 0 8px rgba(212,160,48,0.4);
}
.rc-dot-btn:hover:not(.active) {
  background: rgba(200,132,122,0.55);
}

/* Carousel nav arrows */
.rev-carousel-nav {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 0 4px;
}

.rc-nav-btn {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(42,8,16,0.8);
  border: 1px solid rgba(200,132,122,0.25);
  border-radius: 50%;
  color: var(--champ);
  cursor: pointer;
  transition: all 0.2s ease;
  backdrop-filter: blur(8px);
}
.rc-nav-btn:hover {
  background: rgba(92,26,42,0.7);
  border-color: rgba(212,168,85,0.45);
  transform: scale(1.1);
}

/* ── VIEW ALL REVIEWS BUTTON ── */
.view-all-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
}

.btn-view-all-reviews {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 1px solid rgba(200,132,122,0.28);
  border-radius: 50px;
  padding: 11px 22px;
  font-size: 10.5px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  color: var(--champ-dim, rgba(245,230,204,0.65));
  cursor: pointer;
  transition: all 0.25s ease;
}
.btn-view-all-reviews:hover {
  border-color: rgba(212,168,85,0.45);
  color: var(--champ);
  background: rgba(200,132,122,0.08);
  transform: translateY(-2px);
}
.vab-count {
  background: linear-gradient(135deg, #8B1A2A, #C0394A);
  color: #F2E4D0;
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 20px;
  font-weight: 900;
  letter-spacing: 0.5px;
}

/* ── ALL REVIEWS EXPANDED PANEL ── */
.all-reviews-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.55s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.35s ease;
  opacity: 0;
}
.all-reviews-panel.open {
  max-height: 2000px;
  opacity: 1;
}

.reviews-grid-expanded {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 20px 0 0;
}

@media (max-width: 680px) {
  .reviews-grid-expanded {
    grid-template-columns: 1fr;
  }
}

.btn-collapse-reviews {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 20px auto 0;
  background: transparent;
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 50px;
  padding: 10px 20px;
  font-size: 10.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  color: var(--champ-dim);
  cursor: pointer;
  transition: all 0.2s ease;
}
.btn-collapse-reviews:hover {
  color: var(--champ);
  border-color: rgba(200,132,122,0.4);
  background: rgba(200,132,122,0.07);
}

/* Close button at top of all-reviews-panel */
.all-reviews-panel-header {
  display: flex;
  justify-content: flex-end;
  padding: 8px 0 12px;
}
.btn-close-all-reviews {
  display: flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: 1px solid rgba(200,132,122,0.25);
  border-radius: 50px;
  padding: 8px 16px;
  font-size: 10.5px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  color: var(--champ-dim);
  cursor: pointer;
  transition: all 0.2s ease;
}
.btn-close-all-reviews:hover {
  color: var(--champ);
  border-color: rgba(200,132,122,0.45);
  background: rgba(200,132,122,0.07);
}
@media (max-width: 600px) {
  .btn-close-all-reviews {
    position: sticky;
    top: 10px;
    z-index: 10;
    background: rgba(20,10,15,0.9);
    backdrop-filter: blur(6px);
  }
}

/* When "View All" is open, hide carousel to avoid redundancy */
.reviews-left-col.all-open .rev-carousel-wrap {
  display: none;
}

/* ── RIGHT COLUMN — INLINE REVIEW FORM ── */
.reviews-right-col {
  position: sticky;
  top: 90px;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.reviews-right-col.hidden {
  opacity: 0;
  transform: translateX(20px);
  pointer-events: none;
}

.review-form-wrap-inline {
  background: linear-gradient(160deg, rgba(42,8,16,0.75), rgba(8,3,2,0.9));
  border: 1px solid rgba(200,132,122,0.18);
  border-radius: 24px;
  padding: 28px 24px 24px;
  box-shadow: 0 16px 50px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.04);
}
@media (max-width: 900px) {
  .reviews-right-col {
    position: static;
  }
  .review-form-wrap-inline {
    padding: 22px 18px;
  }
}

/* ══════════════════════════════════════════
   4. REVIEW COUNTER BADGE
══════════════════════════════════════════ */

.review-counter {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, rgba(42,8,16,0.7), rgba(92,26,42,0.45));
  border: 1px solid rgba(200,132,122,0.22);
  border-radius: 50px;
  padding: 9px 20px;
  margin: 12px auto 18px;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.05);
}

.rc-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #3DDA6E;
  box-shadow: 0 0 8px rgba(61,218,110,0.7);
  animation: pulse 2s infinite;
  flex-shrink: 0;
}

.rc-num {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 18px;
  font-weight: 800;
  background: linear-gradient(135deg, #F2E4D0, #F0C060);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

.rc-label {
  font-size: 11px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--champ-dim);
}

.rc-stars {
  color: #F0C060;
  font-size: 13px;
  letter-spacing: 1px;
}

.rc-rating {
  font-size: 11.5px;
  font-weight: 700;
  color: rgba(245,230,204,0.75);
}

/* Separator dots */
.review-counter::before { display: none; }
@media (max-width: 600px) {
  .review-counter {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 12px;
    border-radius: 18px;
    padding: 12px 18px;
  }
  .rc-label { text-align: center; }
}
/* ══════════════════════════════════════════
   PROFESSIONAL ICON SYSTEM (Font Awesome)
══════════════════════════════════════════ */

/* Mobile menu icons */
.mmn-icon i {
  font-size: 16px;
  color: var(--rose);
  transition: color 0.2s ease;
  width: 18px;
  text-align: center;
}
.mobile-nav-links a:hover .mmn-icon i {
  color: var(--gold-l);
}

/* Scarcity section icons */
.s-item i {
  color: var(--gold-l);
  font-size: 12px;
  margin-right: 3px;
  vertical-align: middle;
}

/* Filter tab icons */
.ftab i {
  font-size: 11px;
  vertical-align: middle;
  margin-right: 2px;
  color: var(--gold-l);
}
.ftab.active i { color: inherit; }

/* Offer badge icon */
.offer-badge i {
  margin-right: 4px;
  color: var(--gold-l);
  vertical-align: middle;
}

/* Step card icons */
.step-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, rgba(92,26,42,0.5), rgba(42,8,16,0.7));
  border: 1px solid rgba(200,132,122,0.28);
  border-radius: 16px;
  margin-bottom: 14px;
  transition: all 0.3s ease;
}
.step-card:hover .step-ic {
  background: linear-gradient(135deg, rgba(92,26,42,0.8), rgba(200,132,122,0.25));
  border-color: rgba(212,168,85,0.45);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(92,26,42,0.4);
}
.step-ic i {
  font-size: 22px;
  color: var(--rose);
  transition: color 0.3s ease;
}
.step-card:hover .step-ic i {
  color: var(--gold-l);
}

/* Trust badges icons */
.t-bdg i {
  margin-right: 6px;
  color: var(--gold-l);
  font-size: 12px;
  vertical-align: middle;
  transition: transform 0.2s ease;
}
.t-bdg:hover i {
  transform: scale(1.2);
}

/* Delivery card icons */
.del-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background: linear-gradient(135deg, rgba(92,26,42,0.45), rgba(20,4,8,0.7));
  border: 1px solid rgba(200,132,122,0.24);
  border-radius: 18px;
  margin-bottom: 16px;
  transition: all 0.3s ease;
}
.del-card:hover .del-ic {
  background: linear-gradient(135deg, rgba(92,26,42,0.75), rgba(200,132,122,0.2));
  border-color: rgba(212,168,85,0.4);
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(92,26,42,0.35);
}
.del-ic i {
  font-size: 24px;
  color: var(--rose);
  transition: color 0.3s ease;
}
.del-card:hover .del-ic i {
  color: var(--gold-l);
}

/* Footer contact icons */
.foot-contact-item .ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: rgba(92,26,42,0.3);
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 8px;
  flex-shrink: 0;
  margin-top: 2px;
}
.foot-contact-item .ic i {
  font-size: 13px;
  color: var(--rose);
}

/* Order modal icons */
.chip-icon i {
  font-size: 16px;
  color: var(--gold-l);
}
.success-icon i {
  font-size: 52px;
  color: #4ADE80;
  filter: drop-shadow(0 0 12px rgba(74,222,128,0.5));
}
.review-success-icon i {
  font-size: 44px;
  color: var(--gold-l);
  filter: drop-shadow(0 0 10px rgba(240,192,96,0.4));
}

/* CTA call icon */
.btn-outline i,
.bcta-btns .btn-outline i {
  font-size: 14px;
  vertical-align: middle;
}

/* ══════════════════════════════════════════
   REVIEW AVATAR INITIALS SYSTEM
══════════════════════════════════════════ */
.rev-av {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
  border: 2px solid rgba(200,132,122,0.3);
}
.rev-av-P { background: linear-gradient(135deg, #7B2D4A, #C8547A); }
.rev-av-N { background: linear-gradient(135deg, #2D5A3A, #4EA86A); }
.rev-av-A { background: linear-gradient(135deg, #3A2D7B, #7B6AC8); }
.rev-av-R { background: linear-gradient(135deg, #7B4A2D, #C87A54); }
.rev-av-M { background: linear-gradient(135deg, #2D4A7B, #548AC8); }
.rev-av-S { background: linear-gradient(135deg, #7B7B2D, #C8C854); }

/* ══════════════════════════════════════════
   PREMIUM REVIEW SECTION REDESIGN
══════════════════════════════════════════ */

/* ── Enhanced Review Counter ── */
.review-counter {
  position: relative;
  overflow: hidden;
}
.review-counter::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(212,168,85,0.05), transparent);
  pointer-events: none;
}

/* ── Layout Enhancement ── */
.reviews-dual-layout {
  display: grid;
  grid-template-columns: 65% 1fr;
  gap: 48px;
  margin-top: 48px;
  position: relative;
  align-items: start;
}
@media (max-width: 1100px) {
  .reviews-dual-layout { grid-template-columns: 60% 1fr; gap: 32px; }
}
@media (max-width: 900px) {
  .reviews-dual-layout { grid-template-columns: 1fr; gap: 36px; }
}

/* ── Section Header Enhancement ── */
#trust .sec-head {
  position: relative;
}

/* ── Premium Carousel Redesign ── */
.rev-carousel-wrap {
  border-radius: 24px;
  background: linear-gradient(160deg, rgba(30,6,12,0.95), rgba(10,3,2,0.98));
  border: 1px solid rgba(200,132,122,0.18);
  box-shadow: 
    0 20px 60px rgba(0,0,0,0.5),
    0 0 0 1px rgba(255,255,255,0.03),
    inset 0 1px 0 rgba(255,255,255,0.06);
  overflow: hidden;
  position: relative;
}
.rev-carousel-wrap::before {
  content: '';
  position: absolute;
  top: -1px; left: -1px; right: -1px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(212,168,85,0.5), rgba(200,132,122,0.4), transparent);
  border-radius: 24px 24px 0 0;
  pointer-events: none;
}

/* ── Premium carousel card ── */
.rev-carousel-card {
  padding: 36px 32px 28px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 240px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.rev-carousel-card .rev-stars {
  font-size: 16px;
  letter-spacing: 4px;
  margin-bottom: 4px;
  background: linear-gradient(90deg, #F0C060, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.rev-carousel-card .rev-verified {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 9.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #4ADE80;
  margin-bottom: 16px;
  font-weight: 700;
}
.rev-carousel-card .rev-verified::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #4ADE80;
  box-shadow: 0 0 6px rgba(74,222,128,0.6);
  flex-shrink: 0;
}

.rev-carousel-card .rev-text {
  font-size: 15px;
  line-height: 1.75;
  color: rgba(245,230,204,0.88);
  font-style: italic;
  font-family: var(--font-serif);
  flex: 1;
  margin-bottom: 20px;
  position: relative;
  padding-left: 20px;
}
.rev-carousel-card .rev-text::before {
  content: '"';
  font-size: 60px;
  color: rgba(200,132,122,0.18);
  position: absolute;
  left: -8px;
  top: -12px;
  font-family: 'Cormorant Garamond', Georgia, serif;
  line-height: 1;
}

.rev-carousel-card .rev-author {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid rgba(200,132,122,0.12);
}

.rev-carousel-card .rev-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--champ);
}
.rev-carousel-card .rev-loc {
  font-size: 10px;
  letter-spacing: 1.5px;
  color: rgba(245,230,204,0.35);
  margin-top: 3px;
}

/* Bottom of carousel - dots + nav combined row */
.rev-carousel-dots {
  background: transparent;
  padding: 16px 24px 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(200,132,122,0.08);
}

/* Slide counter text */
.rev-carousel-dots::after {
  content: 'Swipe to explore';
  font-size: 9px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(245,230,204,0.2);
  font-weight: 600;
}

/* ── Enhanced carousel dots ── */
.rc-dot-btn {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(200,132,122,0.2);
  border: 1px solid rgba(200,132,122,0.15);
  transition: all 0.3s ease;
}
.rc-dot-btn.active {
  background: linear-gradient(135deg, #D4A030, #F0C060);
  width: 28px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(212,160,48,0.5);
  border-color: transparent;
}

/* ── Enhanced nav arrows ── */
.rev-carousel-nav {
  padding: 0;
  gap: 8px;
}
.rc-nav-btn {
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, rgba(42,8,16,0.9), rgba(92,26,42,0.5));
  border: 1px solid rgba(200,132,122,0.3);
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}
.rc-nav-btn:hover {
  background: linear-gradient(135deg, rgba(92,26,42,0.9), rgba(200,132,122,0.3));
  border-color: rgba(212,168,85,0.5);
  box-shadow: 0 6px 20px rgba(92,26,42,0.4);
  transform: scale(1.12) translateY(-1px);
}

/* ── View All button enhancement ── */
.view-all-wrap {
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}
.btn-view-all-reviews {
  border-radius: 50px;
  padding: 12px 24px;
  border-color: rgba(200,132,122,0.3);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.btn-view-all-reviews::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(92,26,42,0), rgba(200,132,122,0.08));
  opacity: 0;
  transition: opacity 0.3s ease;
}
.btn-view-all-reviews:hover::before { opacity: 1; }

/* ── All reviews expanded grid ── */
.reviews-grid-expanded {
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 24px 0 0;
}
.all-reviews-panel .rev-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.all-reviews-panel .rev-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.4), 0 0 0 1px rgba(212,168,85,0.12);
}

/* ── RIGHT COLUMN — Premium Form Card ── */
.reviews-right-col {
  top: 100px;
  align-self: start;
}

.review-form-wrap-inline {
  background: linear-gradient(160deg,
    rgba(30,6,12,0.95) 0%,
    rgba(10,3,2,0.98) 100%
  );
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 28px;
  padding: 32px 28px 28px;
  box-shadow:
    0 24px 64px rgba(0,0,0,0.55),
    0 0 0 1px rgba(255,255,255,0.03),
    inset 0 1px 0 rgba(255,255,255,0.06);
  position: relative;
  overflow: hidden;
}
.review-form-wrap-inline::before {
  content: '';
  position: absolute;
  top: -1px; left: -1px; right: -1px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(200,132,122,0.5), rgba(212,168,85,0.4), transparent);
  border-radius: 28px 28px 0 0;
  pointer-events: none;
}
.review-form-wrap-inline::after {
  content: '"';
  position: absolute;
  right: 20px;
  bottom: -10px;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 160px;
  color: rgba(200,132,122,0.04);
  line-height: 1;
  pointer-events: none;
  user-select: none;
}

/* ── Form header ── */
.review-form-header {
  margin-bottom: 24px;
  position: relative;
}

.review-form-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.1;
  background: linear-gradient(135deg, #F2E4D0, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 8px;
}
.review-form-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-style: italic;
}
.review-form-sub {
  font-size: 12px;
  color: rgba(245,230,204,0.45);
  line-height: 1.6;
  letter-spacing: 0.3px;
}

/* ── Form fields enhancement ── */
.review-form-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.rf-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.rf-label {
  font-size: 9.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(245,230,204,0.5);
}
.rf-input {
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(200,132,122,0.18);
  border-radius: 12px;
  padding: 12px 14px;
  color: var(--champ);
  font-family: var(--font-body);
  font-size: 13.5px;
  transition: all 0.2s ease;
  outline: none;
  width: 100%;
}
.rf-input:focus {
  border-color: rgba(212,168,85,0.45);
  background: rgba(255,255,255,0.055);
  box-shadow: 0 0 0 3px rgba(212,168,85,0.08);
}
.rf-input::placeholder { color: rgba(245,230,204,0.22); font-size: 12.5px; }
.rf-textarea { resize: vertical; min-height: 90px; }

/* ── Star selector ── */
.rf-stars {
  display: flex;
  gap: 4px;
  align-items: center;
}
.rf-star {
  font-size: 26px;
  color: rgba(200,132,122,0.3);
  cursor: pointer;
  transition: all 0.15s ease;
  padding: 0 1px;
  line-height: 1;
  background: none;
  border: none;
}
.rf-star:hover,
.rf-star.active { 
  color: #F0C060;
  transform: scale(1.15);
}
.rf-rating-label {
  font-size: 10px;
  letter-spacing: 1px;
  color: rgba(245,230,204,0.3);
  text-transform: uppercase;
  font-weight: 600;
  margin-left: 8px;
  transition: color 0.2s ease;
}

/* ── Submit button ── */
.rf-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 24px;
  background: linear-gradient(135deg, #2A0610, #5C1A2A, #9E5A52);
  border: 1px solid rgba(212,168,85,0.2);
  border-radius: 14px;
  color: var(--champ);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
  margin-top: 4px;
  position: relative;
  overflow: hidden;
}
.rf-submit::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(200,132,122,0), rgba(212,168,85,0.12));
  opacity: 0;
  transition: opacity 0.3s ease;
}
.rf-submit:hover {
  background: linear-gradient(135deg, #5C1A2A, #C8847A, #EFC97A);
  transform: translateY(-3px);
  box-shadow: 0 12px 36px rgba(92,26,42,0.55), 0 0 20px rgba(200,132,122,0.15);
  border-color: rgba(212,168,85,0.35);
}
.rf-submit:hover::before { opacity: 1; }
.rf-submit:active { transform: translateY(-1px); }

/* ── Review success state ── */
.review-success {
  display: none;
  text-align: center;
  padding: 32px 16px;
  animation: popIn 0.5s ease;
}
.review-success.shown { display: block; }
.review-success-icon {
  margin-bottom: 16px;
}
.review-success-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 26px;
  font-weight: 800;
  background: linear-gradient(135deg, #F2E4D0, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 10px;
}
.review-success-sub {
  font-size: 13px;
  color: rgba(245,230,204,0.55);
  line-height: 1.7;
}

/* ── Trust badges strip redesign ── */
.trust-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 56px;
  padding: 28px;
  background: linear-gradient(135deg, rgba(20,4,8,0.8), rgba(10,2,4,0.9));
  border: 1px solid rgba(200,132,122,0.14);
  border-radius: 20px;
  position: relative;
  overflow: hidden;
}
.trust-badges::before {
  content: '';
  position: absolute;
  top: -1px; left: 10%; right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,85,0.4), transparent);
}
.t-bdg {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(200,132,122,0.16);
  border-radius: 50px;
  padding: 9px 18px;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(245,230,204,0.7);
  transition: all 0.25s ease;
  cursor: default;
}
.t-bdg:hover {
  background: rgba(92,26,42,0.2);
  border-color: rgba(200,132,122,0.32);
  color: var(--champ);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.25);
}

/* ── Mobile responsive for right col form ── */
@media (max-width: 900px) {
  .review-form-wrap-inline {
    padding: 24px 20px;
  }
  .review-form-title { font-size: 24px; }
  .reviews-grid-expanded { grid-template-columns: 1fr; }
}

/* ── Rev card base enhancement (expanded grid) ── */
.rev-card {
  background: linear-gradient(160deg, rgba(30,6,12,0.85), rgba(8,3,2,0.95)) !important;
  border: 1px solid rgba(200,132,122,0.15) !important;
  padding: 20px 20px 18px !important;
  border-radius: 18px !important;
  position: relative;
  overflow: hidden;
}
.rev-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,132,122,0.3), transparent);
}
.rev-card .rev-stars {
  font-size: 13px;
  letter-spacing: 2.5px;
}
.rev-card .rev-verified {
  font-size: 9px;
  letter-spacing: 1.5px;
  color: rgba(74,222,128,0.75);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.rev-card .rev-verified::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(74,222,128,0.6);
  box-shadow: 0 0 4px rgba(74,222,128,0.5);
  flex-shrink: 0;
}
.rev-card .rev-text {
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(245,230,204,0.8);
  margin-bottom: 14px;
}


/* ── Reviews column header ── */
.reviews-col-header {
  padding-bottom: 4px;
}
.reviews-col-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  line-height: 1.15;
  background: linear-gradient(135deg, #F2E4D0, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 6px;
}
.reviews-col-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-style: italic;
}
.reviews-col-sub {
  font-size: 12px;
  color: rgba(245,230,204,0.38);
  letter-spacing: 0.3px;
  line-height: 1.6;
}

/* ── Dots row new layout ── */
.rev-carousel-dots {
  justify-content: space-between;
}
.rev-carousel-nav {
  display: flex;
  gap: 8px;
}
/* ════════════════════════════════════════════════════════════
   PARINEETA — PART 1: SUBMIT REVIEW BUTTON + REVIEW MODAL
   PART 2: DIRECT MESSAGE PANEL (STICKY CTA UPGRADE)
════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════
   SUBMIT REVIEW CTA BUTTON
══════════════════════════════════════════ */

.btn-submit-review-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #2A0610, #5C1A2A, #9E5A52);
  color: var(--champ);
  border: 1px solid rgba(212,168,85,0.22);
  border-radius: 50px;
  padding: 12px 24px;
  font-size: 10.5px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight: 800;
  font-family: var(--font-body);
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(92,26,42,0.35), inset 0 1px 0 rgba(255,255,255,0.08);
  transition: all 0.28s cubic-bezier(0.34,1.56,0.64,1);
  position: relative;
  overflow: hidden;
}
.btn-submit-review-cta::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,0.1), transparent);
  transition: left 0.5s ease;
  pointer-events: none;
}
.btn-submit-review-cta:hover {
  background: linear-gradient(135deg, #5C1A2A, #C8847A, #EFC97A);
  border-color: rgba(239,201,122,0.45);
  transform: translateY(-3px);
  box-shadow: 0 10px 32px rgba(92,26,42,0.55), 0 0 20px rgba(200,132,122,0.18);
}
.btn-submit-review-cta:hover::before { left: 160%; }
.btn-submit-review-cta:active { transform: translateY(-1px); }

/* ══════════════════════════════════════════
   REVIEW MODAL OVERLAY
══════════════════════════════════════════ */

.review-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 6000;
  background: rgba(0,0,0,0.78);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}
.review-modal-overlay.open {
  opacity: 1;
  pointer-events: all;
}

.review-modal {
  background: linear-gradient(160deg, rgba(26,5,10,0.99) 0%, rgba(10,3,3,0.99) 100%);
  border: 1px solid rgba(212,168,85,0.2);
  border-radius: 28px;
  padding: 0;
  width: 100%;
  max-width: 520px;
  max-height: 90svh;
  overflow-y: auto;
  transform: translateY(28px) scale(0.96);
  transition: transform 0.32s cubic-bezier(0.34,1.56,0.64,1), opacity 0.28s ease;
  position: relative;
  scrollbar-width: thin;
  scrollbar-color: rgba(200,132,122,0.2) transparent;
  box-shadow:
    0 32px 80px rgba(0,0,0,0.75),
    0 0 0 1px rgba(255,255,255,0.025),
    inset 0 1px 0 rgba(255,255,255,0.06);
}
.review-modal-overlay.open .review-modal {
  transform: translateY(0) scale(1);
}
/* Gold shimmer top edge */
.review-modal::before {
  content: '';
  position: absolute;
  top: -1px; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(212,168,85,0.6), rgba(200,132,122,0.5), transparent);
  border-radius: 28px 28px 0 0;
  pointer-events: none;
}
/* Decorative quote watermark */
.review-modal::after {
  content: '"';
  position: absolute;
  right: 20px;
  bottom: -8px;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 180px;
  color: rgba(200,132,122,0.035);
  line-height: 1;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}

.review-modal-close {
  position: absolute;
  top: 16px; right: 16px;
  z-index: 10;
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(200,132,122,0.1);
  border: 1px solid rgba(200,132,122,0.22);
  border-radius: 12px;
  color: var(--champ-dim);
  cursor: pointer;
  transition: all 0.2s ease;
}
.review-modal-close:hover {
  background: rgba(200,132,122,0.22);
  border-color: var(--rose);
  color: var(--champ);
  transform: scale(1.08);
}

/* ── Modal header ── */
#reviewModalForm {
  position: relative;
  z-index: 1;
}

.rmo-header {
  padding: 32px 32px 0;
  text-align: left;
}
.rmo-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(24px, 3.5vw, 32px);
  font-weight: 800;
  line-height: 1.1;
  background: linear-gradient(135deg, #F2E4D0, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 8px;
}
.rmo-title em {
  background: linear-gradient(135deg, #C8847A, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-style: italic;
}
.rmo-sub {
  font-size: 12px;
  color: rgba(245,230,204,0.42);
  line-height: 1.65;
  letter-spacing: 0.3px;
}

/* ── Modal body / form ── */
.rmo-body {
  padding: 24px 32px 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  z-index: 1;
}

.rmo-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.rmo-label {
  font-size: 9.5px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(245,230,204,0.48);
}

.rmo-input {
  width: 100%;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(200,132,122,0.2);
  border-radius: 14px;
  padding: 13px 16px;
  color: var(--champ);
  font-family: var(--font-body);
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.2);
}
.rmo-input:focus {
  border-color: rgba(212,168,85,0.5);
  background: rgba(255,255,255,0.06);
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.2), 0 0 0 3px rgba(212,168,85,0.07);
}
.rmo-input::placeholder { color: rgba(245,230,204,0.22); }
.rmo-textarea {
  resize: vertical;
  min-height: 96px;
  line-height: 1.65;
}

/* ── Modal star selector ── */
.rmo-stars {
  display: flex;
  gap: 6px;
  align-items: center;
}
.rmo-star {
  font-size: 32px;
  background: none;
  border: none;
  color: rgba(245,230,204,0.18);
  cursor: pointer;
  transition: color 0.15s ease, transform 0.2s cubic-bezier(0.34,1.56,0.64,1);
  padding: 0 2px;
  line-height: 1;
}
.rmo-star:hover,
.rmo-star.active {
  color: #F0C060;
  transform: scale(1.22);
  text-shadow: 0 0 14px rgba(240,192,96,0.5);
}
.rmo-rating-label {
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(245,230,204,0.32);
  font-weight: 600;
  margin-left: 6px;
  transition: color 0.2s ease;
}

/* ── Submit button ── */
.rmo-submit {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: linear-gradient(135deg, #2A0610, #5C1A2A, #9E5A52);
  color: var(--champ);
  border: 1px solid rgba(212,168,85,0.22);
  border-radius: 16px;
  padding: 16px 24px;
  font-size: 11px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 800;
  font-family: var(--font-body);
  cursor: pointer;
  box-shadow: 0 6px 28px rgba(92,26,42,0.4), inset 0 1px 0 rgba(255,255,255,0.09);
  transition: all 0.28s cubic-bezier(0.34,1.56,0.64,1);
  position: relative;
  overflow: hidden;
  margin-top: 4px;
}
.rmo-submit::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(200,132,122,0), rgba(212,168,85,0.14));
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.rmo-submit:hover {
  background: linear-gradient(135deg, #5C1A2A, #C8847A, #EFC97A);
  transform: translateY(-3px);
  box-shadow: 0 14px 40px rgba(92,26,42,0.6), 0 0 24px rgba(200,132,122,0.2);
  border-color: rgba(239,201,122,0.4);
}
.rmo-submit:hover::before { opacity: 1; }
.rmo-submit:active { transform: translateY(-1px); }

.rmo-privacy {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10.5px;
  color: rgba(245,230,204,0.28);
  text-align: center;
  justify-content: center;
  letter-spacing: 0.3px;
  margin-top: -6px;
}

/* ── Success state ── */
.rmo-success {
  display: none;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 56px 32px 48px;
  position: relative;
  z-index: 1;
}
.rmo-success.shown { display: flex; }

.rmo-success-icon {
  font-size: 52px;
  color: var(--gold-l);
  filter: drop-shadow(0 0 16px rgba(212,168,85,0.5));
  margin-bottom: 20px;
  animation: popIn 0.55s ease;
}
.rmo-success-title {
  font-family: 'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  font-size: 32px;
  font-weight: 800;
  background: linear-gradient(135deg, #F2E4D0, #EFC97A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 12px;
}
.rmo-success-sub {
  font-size: 13px;
  color: rgba(245,230,204,0.48);
  line-height: 1.75;
  max-width: 340px;
  margin-bottom: 28px;
}
.rmo-done-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, rgba(92,26,42,0.6), rgba(200,132,122,0.2));
  border: 1px solid rgba(200,132,122,0.35);
  color: var(--champ);
  padding: 12px 32px;
  border-radius: 50px;
  font-size: 10.5px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  transition: all 0.22s ease;
}
.rmo-done-btn:hover {
  background: linear-gradient(135deg, rgba(200,132,122,0.3), rgba(212,168,85,0.15));
  border-color: rgba(212,168,85,0.45);
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(92,26,42,0.3);
}

/* Responsive */
@media (max-width: 540px) {
  .rmo-header { padding: 28px 22px 0; }
  .rmo-body { padding: 20px 22px 28px; }
  .rmo-title { font-size: 24px; }
  .rmo-star { font-size: 28px; }
}

/* ══════════════════════════════════════════
   DIRECT MESSAGE PANEL — STICKY MOBILE CTA
   Hidden: floating .sticky-contact handles messaging on desktop.
   On mobile, sticky-mob only shows Cart button.
══════════════════════════════════════════ */

/* Wrap the DM button + panel — hidden on mobile (floating button replaced this) */
.st-dm-wrap {
  position: relative;
  flex-shrink: 0;
  display: none !important; /* Removed: floating sticky-contact is the only message entry */
}

/* Main DM trigger button */
.st-dm-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: linear-gradient(135deg, rgba(42,8,16,0.85), rgba(92,26,42,0.5));
  border: 1px solid rgba(200,132,122,0.32);
  color: var(--champ);
  padding: 12px 16px;
  border-radius: 14px;
  font-size: 10.5px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  font-family: var(--font-body);
  cursor: pointer;
  transition: all 0.22s ease;
  white-space: nowrap;
}
.st-dm-btn:hover {
  background: linear-gradient(135deg, rgba(92,26,42,0.75), rgba(200,132,122,0.3));
  border-color: rgba(212,168,85,0.45);
  box-shadow: 0 4px 16px rgba(92,26,42,0.35);
}
.st-dm-btn.active {
  background: linear-gradient(135deg, rgba(92,26,42,0.85), rgba(200,132,122,0.35));
  border-color: rgba(212,168,85,0.5);
  box-shadow: 0 4px 18px rgba(92,26,42,0.4);
}
.st-dm-chevron {
  transition: transform 0.25s ease;
  flex-shrink: 0;
}
.st-dm-btn.active .st-dm-chevron {
  transform: rotate(180deg);
}

/* Expandable panel (slides upward) */
.st-dm-panel {
  position: absolute;
  bottom: calc(100% + 10px);
  right: 0;
  min-width: 230px;
  background: linear-gradient(160deg, rgba(22,5,10,0.99), rgba(10,3,3,0.99));
  border: 1px solid rgba(200,132,122,0.22);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 -8px 40px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.025);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.96);
  transition: opacity 0.25s ease, transform 0.28s cubic-bezier(0.34,1.56,0.64,1);
  z-index: 500;
}
/* Gold shimmer top */
.st-dm-panel::before {
  content: '';
  position: absolute;
  top: -1px; left: 10%; right: 10%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,85,0.5), transparent);
  pointer-events: none;
}
.st-dm-panel.open {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0) scale(1);
}

/* Panel items */
.st-dm-item {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 15px 18px;
  text-decoration: none;
  color: var(--champ);
  transition: background 0.18s ease;
  border-bottom: 1px solid rgba(200,132,122,0.08);
}
.st-dm-item:last-child { border-bottom: none; }
.st-dm-item:hover { background: rgba(200,132,122,0.1); }

.st-dm-item-label {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  line-height: 1;
}
.st-dm-item-sub {
  font-size: 10px;
  letter-spacing: 0.5px;
  color: rgba(245,230,204,0.38);
  margin-top: 3px;
}

/* WhatsApp item */
.st-dm-wa svg { color: var(--wa); flex-shrink: 0; }
.st-dm-wa:hover { background: rgba(37,211,102,0.08) !important; }
.st-dm-wa:hover .st-dm-item-label { color: #4ADE80; }

/* Messenger / Facebook item */
.st-dm-fb svg { color: #7BA4F0; flex-shrink: 0; }
.st-dm-fb:hover { background: rgba(123,164,240,0.08) !important; }
.st-dm-fb:hover .st-dm-item-label { color: #7BA4F0; }

/* Keep sticky-inner flex layout intact */
.sticky-inner {
  align-items: center;
}

/* Desktop: also show a floating DM button (optional persistent) */
@media (min-width: 769px) {
  .st-dm-panel {
    right: 0;
    bottom: calc(100% + 12px);
  }
}
/* ══════════════════════════════════════════════════════
   REVIEWS — FULL WIDTH LAYOUT (Right col removed)
══════════════════════════════════════════════════════ */

.reviews-fullwidth-layout {
  display: block;
  margin-top: 48px;
}

.reviews-full-col {
  max-width: 860px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

/* Widen the carousel card for full-width context */
.reviews-full-col .rev-carousel-wrap {
  max-width: 100%;
}

.reviews-full-col .rev-carousel-card {
  min-height: 220px;
}

/* Center the header */
.reviews-full-col .reviews-col-header {
  text-align: center;
  padding-bottom: 8px;
}

/* Center the view-all + write review button row */
.reviews-full-col .view-all-wrap {
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}

/* Expanded grid: 3-col on desktop, 2-col on tablet, 1-col mobile */
.reviews-full-col .reviews-grid-expanded {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 860px) {
  .reviews-full-col .reviews-grid-expanded {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 540px) {
  .reviews-full-col .reviews-grid-expanded {
    grid-template-columns: 1fr;
  }
}

/* Hide the old dual-layout right col just in case */
.reviews-right-col { display: none !important; }

/* ══════════════════════════════════════════════════════
   STICKY CONTACT FLOAT BUTTON
══════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════
   STICKY CONTACT — REPOSITIONED BOTTOM-LEFT (DESKTOP)
   Hidden on mobile — sticky-mob handles contact there
══════════════════════════════════════════════════════ */

.sticky-contact {
  position: fixed;
  bottom: 32px;
  left: 24px;           /* ← Bottom-LEFT: no conflict with cart/order/toast */
  right: auto;
  z-index: 4500;
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* options open to the right */
  gap: 12px;
}

/* ── TRIGGER BUTTON ── */
.sc-trigger {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: linear-gradient(135deg, #5C1A2A, #8B1A2A, #C8847A);
  border: 1px solid rgba(212,168,85,0.35);
  color: #F2E4D0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    0 8px 28px rgba(92,26,42,0.55),
    0 0 0 0 rgba(200,132,122,0.4);
  transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
  position: relative;
  flex-shrink: 0;
  animation: sc-pulse 3s ease-in-out infinite;
}

@keyframes sc-pulse {
  0%, 100% { box-shadow: 0 8px 28px rgba(92,26,42,0.55), 0 0 0 0 rgba(200,132,122,0.35); }
  50%       { box-shadow: 0 8px 28px rgba(92,26,42,0.55), 0 0 0 10px rgba(200,132,122,0); }
}

.sc-trigger:hover {
  transform: scale(1.1);
  box-shadow: 0 12px 36px rgba(92,26,42,0.7), 0 0 0 6px rgba(200,132,122,0.12);
  animation: none;
}

/* Chat ↔ Close icon swap */
.sc-icon-chat,
.sc-icon-close {
  position: absolute;
  transition: opacity 0.2s ease, transform 0.25s cubic-bezier(0.34,1.56,0.64,1);
}
.sc-icon-close {
  opacity: 0;
  transform: rotate(-90deg) scale(0.7);
}
.sc-trigger.open .sc-icon-chat {
  opacity: 0;
  transform: rotate(90deg) scale(0.7);
}
.sc-trigger.open .sc-icon-close {
  opacity: 1;
  transform: rotate(0) scale(1);
}

/* ── OPTIONS PANEL — opens upward, anchored left ── */
.sc-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  transform-origin: bottom left;  /* anchor to left side */
  transform: scale(0.85) translateY(10px);
  opacity: 0;
  pointer-events: none;
  transition:
    transform 0.3s cubic-bezier(0.34,1.56,0.64,1),
    opacity 0.25s ease;
}

.sc-options.open {
  transform: scale(1) translateY(0);
  opacity: 1;
  pointer-events: auto;
}

/* ── INDIVIDUAL OPTION PILL ── */
.sc-option {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 18px 10px 12px;
  border-radius: 50px;
  text-decoration: none;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
  white-space: nowrap;
  border: 1px solid transparent;
}

/* Hover slides right (away from left edge) */
.sc-option:hover {
  transform: translateX(4px) scale(1.04);
  box-shadow: 0 10px 30px rgba(0,0,0,0.45);
  filter: brightness(1.12);
}

/* WhatsApp option */
.sc-option.sc-wa {
  background: linear-gradient(135deg, #0B7A45, #128C7E, #25D366);
  color: #fff;
  border-color: rgba(37,211,102,0.2);
}

/* Messenger option */
.sc-option.sc-msg {
  background: linear-gradient(135deg, #0068FF, #4393F5, #00C6FF);
  color: #fff;
  border-color: rgba(64,147,245,0.2);
}

/* Icon circle */
.sc-opt-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  backdrop-filter: blur(4px);
}

.sc-opt-label {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

/* ── MOBILE: hide floating button — sticky-mob handles messaging ── */
@media (max-width: 768px) {
  .sticky-contact {
    display: none !important;
  }
}

/* ── DESKTOP: ensure bottom clears page content comfortably ── */
@media (min-width: 769px) {
  .sticky-contact {
    bottom: 36px;
    left: 28px;
  }
}

/* ── SMALL DESKTOP / tablet 769–1024 ── */
@media (min-width: 769px) and (max-width: 1024px) {
  .sticky-contact {
    bottom: 28px;
    left: 20px;
  }
  .sc-trigger {
    width: 52px;
    height: 52px;
  }
}

/* ══════════════════════════════════════════
   STICKY MOB — Cart-only layout
   st-dm-wrap is hidden; Cart button takes full width
══════════════════════════════════════════ */
@media (max-width: 768px) {
  .sticky-inner .st-cart {
    flex: 1;            /* expand to fill full bar */
    letter-spacing: 1.8px;
    font-size: 11px;
    padding: 14px 20px;
  }
  .sticky-inner .st-cart-count {
    font-size: 9px;
    padding: 2px 7px;
  }
}

/* ══════════════════════════════════════════════════════
   CART ITEM — PRODUCT THUMBNAIL UPGRADE
══════════════════════════════════════════════════════ */

/* Thumbnail container — replaces emoji circle */
.cart-item-thumb {
  width: 52px;
  height: 52px;
  border-radius: 10px;
  overflow: hidden;
  flex-shrink: 0;
  border: 1px solid rgba(200,132,122,0.22);
  background: linear-gradient(135deg, rgba(92,26,42,0.4), rgba(58,13,24,0.6));
  position: relative;
}

.cart-item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform 0.3s ease;
}

.cart-item:hover .cart-item-thumb img {
  transform: scale(1.07);
}

/* Emoji fallback (shown when no image or image fails) */
.cart-item-thumb--emoji {
  display: flex;
  align-items: center;
  justify-content: center;
}

.cart-item-emoji-fb {
  font-size: 24px;
  line-height: 1;
}

/* Shimmer loading state while image loads */
.cart-item-thumb::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,0.04) 50%,
    transparent 100%
  );
  background-size: 200% 100%;
  animation: thumb-shimmer 1.6s ease infinite;
  pointer-events: none;
}

@keyframes thumb-shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position:  200% 0; }
}

/* Once image has loaded, remove shimmer */
.cart-item-thumb img[src]::before { animation: none; }

/* ── FLY-TO-CART GHOST ── */
.cart-fly-ghost {
  position: fixed;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  border: 2px solid rgba(212,168,85,0.6);
  box-shadow: 0 4px 18px rgba(92,26,42,0.55);
  pointer-events: none;
  z-index: 99999;
  will-change: transform, opacity;
  opacity: 1;
  transform: scale(1);
}

/* ── CART BADGE — fly-land bounce ── */
@keyframes badge-land {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.55); }
  65%  { transform: scale(0.88); }
  85%  { transform: scale(1.18); }
  100% { transform: scale(1); }
}

.cart-badge.fly-land {
  animation: badge-land 0.45s cubic-bezier(0.34,1.56,0.64,1) both;
}

/* Mobile responsive — slightly smaller thumbnail */
@media (max-width: 480px) {
  .cart-item-thumb {
    width: 46px;
    height: 46px;
    border-radius: 8px;
  }
  .cart-item-emoji-fb {
    font-size: 20px;
  }
}

/* Legacy emoji div no longer rendered — safety hide */
.cart-item-emoji { display: none !important; }
/* ═══════════════════════════════════════════════════════════
   LIGHTBOX ZOOM SYSTEM v2 — Card-Modal Architecture
   Fix: backdrop + isolated card. Zoom contained in card.
═══════════════════════════════════════════════════════════ */

/* Zoom trigger button on gallery main image */
.pd-zoom-btn {
  position: absolute;
  bottom: 12px;
  right: 12px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px;
  background: rgba(10, 5, 2, 0.72);
  color: #f5e6c8;
  border: 1px solid rgba(198, 164, 100, 0.35);
  border-radius: 20px;
  font-size: 11px;
  font-family: var(--font-dm, 'DM Sans', sans-serif);
  letter-spacing: 0.04em;
  cursor: pointer;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background 0.2s, border-color 0.2s, opacity 0.2s;
  opacity: 0;
  z-index: 4;
}
.pd-gallery-main:hover .pd-zoom-btn,
.pd-gallery-main:focus-within .pd-zoom-btn {
  opacity: 1;
}
.pd-zoom-btn:hover {
  background: rgba(198, 164, 100, 0.25);
  border-color: rgba(198, 164, 100, 0.7);
}
/* Always visible on touch devices */
@media (hover: none) {
  .pd-zoom-btn { opacity: 1; }
}

/* ── Lightbox Overlay ── */
/* ─────────────────────────────────────────────────────────
   BACKDROP — full-screen fixed overlay, pure dimmer.
   No flex layout here — card is absolutely centered inside.
   DOM-portaled to <body> by JS on open to guarantee escape
   from any stacking context created by backdrop-filter or
   transform on parent modals (pd-overlay, etc.)
───────────────────────────────────────────────────────── */
.lbx-backdrop {
  /* Critical layout isolation properties */
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;

  /* Stacking: must beat pd-overlay(3000), cart(6000), sticky(4500) */
  z-index: 999999 !important;

  /* Dimmer background */
  background: rgba(5, 3, 1, 0.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  /* Hidden by default */
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  outline: none;

  /* Prevent any internal scrolling */
  overflow: hidden;
}
.lbx-backdrop.lbx-open {
  opacity: 1;
  pointer-events: all;
  visibility: visible;
}

/* ── Clickable dimmer layer (behind card, closes on click) ── */
.lbx-dimmer {
  position: absolute;
  inset: 0;
  z-index: 0;
  cursor: default;
}

/* ─────────────────────────────────────────────────────────
   CARD — centered modal container.
   overflow:hidden is the KEY — it clips zoom overflow so
   scaled image cannot bleed outside the card boundary.
───────────────────────────────────────────────────────── */
.lbx-card {
  /* Absolute centering inside backdrop */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.96);
  z-index: 1;

  /* Card dimensions — height MUST be explicit so stage has
     a concrete pixel value to fill; without this, flex:1
     on .lbx-stage resolves to 0 and crops the image.
     We use svh (small viewport height) with vh fallback. */
  width: calc(100vw - 32px);
  max-width: 920px;
  height: calc(100vh - 32px);
  height: calc(100svh - 32px);
  max-height: calc(100vh - 32px);
  max-height: calc(100svh - 32px);

  /* Card appearance */
  background: #0d0906;
  border: 1px solid rgba(198, 164, 100, 0.18);
  border-radius: 16px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.6),
    0 32px 80px rgba(0,0,0,0.75),
    0 8px 24px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,255,255,0.04);

  /* Layout — column flex so header/footer shrink, stage fills */
  display: flex;
  flex-direction: column;
  overflow: hidden; /* clips zoom overflow at card boundary */

  /* Animation */
  transition: transform 0.32s cubic-bezier(0.34, 1.4, 0.64, 1);
}
.lbx-backdrop.lbx-open .lbx-card {
  transform: translate(-50%, -50%) scale(1);
}

/* ─────────────────────────────────────────────────────────
   CARD HEADER — back button + counter + zoom controls
   3-column layout: [back] [counter] [zoom+close]
───────────────────────────────────────────────────────── */
.lbx-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(198, 164, 100, 0.1);
  background: rgba(0,0,0,0.3);
  flex-shrink: 0;
}

/* ── Back / Close button — left, prominent ── */
.lbx-back-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px 6px 9px;
  border-radius: 8px;
  border: 1px solid rgba(198, 164, 100, 0.22);
  background: rgba(255,255,255,0.06);
  color: rgba(245, 230, 200, 0.82);
  font-family: var(--font-dm, 'DM Sans', sans-serif);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background 0.18s, border-color 0.18s, color 0.18s, transform 0.12s;
  flex-shrink: 0;
  white-space: nowrap;
}
.lbx-back-btn:hover {
  background: rgba(198, 164, 100, 0.18);
  border-color: rgba(198, 164, 100, 0.5);
  color: #f5e6c8;
  transform: translateX(-2px);
}
.lbx-back-btn svg {
  flex-shrink: 0;
  transition: transform 0.18s;
}
.lbx-back-btn:hover svg {
  transform: translateX(-2px);
}

.lbx-counter {
  font-family: var(--font-dm, 'DM Sans', sans-serif);
  font-size: 11px;
  font-weight: 500;
  color: rgba(245, 230, 200, 0.4);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  flex-shrink: 0;
}
.lbx-header-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.lbx-ctrl-btn {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid rgba(198, 164, 100, 0.15);
  background: rgba(255,255,255,0.05);
  color: rgba(245, 230, 200, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.18s, border-color 0.18s, color 0.18s, transform 0.12s;
  flex-shrink: 0;
}
.lbx-ctrl-btn:hover {
  background: rgba(198, 164, 100, 0.15);
  border-color: rgba(198, 164, 100, 0.4);
  color: rgba(245, 230, 200, 0.95);
  transform: scale(1.08);
}
.lbx-close-btn {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid rgba(198, 164, 100, 0.25);
  background: rgba(255,255,255,0.06);
  color: rgba(245, 230, 200, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin-left: 4px;
  transition: background 0.18s, border-color 0.18s, color 0.18s, transform 0.12s;
  flex-shrink: 0;
}
.lbx-close-btn:hover {
  background: rgba(180, 60, 50, 0.25);
  border-color: rgba(220, 80, 70, 0.5);
  color: #ffb8b0;
  transform: scale(1.08);
}

/* ─────────────────────────────────────────────────────────
   IMAGE STAGE — fills remaining card height after
   header (≈54px) and footer (≈90px).
   overflow:hidden clips zoom so it never bleeds outside card.
───────────────────────────────────────────────────────── */
.lbx-stage {
  position: relative;
  /* flex:1 + min-height:0 is the correct pattern to fill
     remaining space in a flex column without overflowing */
  flex: 1 1 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden; /* clips zoom overflow */
  background: #080503;
  cursor: default;
}

/* ── Image wrapper — touch/drag target ── */
.lbx-img-wrap {
  /* Must match stage exactly so overflow:hidden clips correctly */
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  touch-action: none;
  overflow: hidden; /* belt-and-suspenders clip */
}
.lbx-img-wrap img {
  /* contain within wrapper — full image always visible,
     no cropping, aspect ratio preserved.
     max-width/max-height reference the wrapper's concrete
     pixel dimensions (set via position:absolute inset:0) */
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  transform-origin: center center;
  transform: scale(1) translate(0px, 0px);
  transition: transform 0.12s ease, opacity 0.22s ease;
  user-select: none;
  -webkit-user-drag: none;
  will-change: transform;
}
.lbx-img-wrap img.lbx-dragging {
  transition: none;
  cursor: grabbing;
}
.lbx-img-wrap img.lbx-zoomed {
  cursor: grab;
}

/* ── Nav arrows — inside stage ── */
.lbx-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(198, 164, 100, 0.22);
  background: rgba(10, 5, 2, 0.7);
  color: rgba(245, 230, 200, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background 0.18s, border-color 0.18s, color 0.18s, opacity 0.2s, transform 0.15s;
  opacity: 0;
}
.lbx-stage:hover .lbx-arrow,
.lbx-arrow:focus {
  opacity: 1;
}
.lbx-arrow:hover {
  background: rgba(198, 164, 100, 0.22);
  border-color: rgba(198, 164, 100, 0.6);
  color: #f5e6c8;
  transform: translateY(-50%) scale(1.08);
}
.lbx-arrow-prev { left: 12px; }
.lbx-arrow-next { right: 12px; }
.lbx-arrow.lbx-hidden { display: none !important; }

/* ─────────────────────────────────────────────────────────
   CARD FOOTER — thumbnails + hint
───────────────────────────────────────────────────────── */
.lbx-card-footer {
  flex-shrink: 0;
  padding: 10px 14px 12px;
  border-top: 1px solid rgba(198, 164, 100, 0.08);
  background: rgba(0,0,0,0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.lbx-thumbs-wrap {
  width: 100%;
  overflow: hidden;
}
.lbx-thumbs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  overflow-x: auto;
  padding: 3px 4px;
  scrollbar-width: none;
}
.lbx-thumbs::-webkit-scrollbar { display: none; }
.lbx-thumb-btn {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  border-radius: 7px;
  border: 2px solid rgba(198, 164, 100, 0.15);
  background: rgba(255,255,255,0.04);
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.18s, transform 0.18s, opacity 0.18s, box-shadow 0.18s;
  opacity: 0.5;
  padding: 0;
}
.lbx-thumb-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lbx-thumb-btn:hover {
  opacity: 0.82;
  transform: scale(1.06);
}
.lbx-thumb-btn.lbx-thumb-active {
  border-color: rgba(198, 164, 100, 0.9);
  opacity: 1;
  transform: scale(1.1);
  box-shadow: 0 0 0 1px rgba(198, 164, 100, 0.3);
}
/* Hide thumb strip if only 1 image */
.lbx-thumbs-wrap.lbx-single { display: none; }

/* Hint */
.lbx-hint {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-dm, 'DM Sans', sans-serif);
  font-size: 10.5px;
  color: rgba(245, 230, 200, 0.28);
  letter-spacing: 0.04em;
  pointer-events: none;
  white-space: nowrap;
  transition: opacity 0.5s;
}
.lbx-hint.lbx-hint-hidden { opacity: 0; }

/* ─────────────────────────────────────────────────────────
   RESPONSIVE
───────────────────────────────────────────────────────── */

/* Always show arrows on touch */
@media (hover: none) {
  .lbx-arrow { opacity: 0.75; }
}

/* Mobile — full-bleed card */
@media (max-width: 600px) {
  .lbx-card {
    width: calc(100vw - 12px);
    height: calc(100vh - 12px);
    height: calc(100svh - 12px);
    max-height: calc(100vh - 12px);
    max-height: calc(100svh - 12px);
    border-radius: 12px;
  }
  .lbx-card-header { padding: 8px 10px; gap: 6px; }
  .lbx-back-btn { padding: 5px 10px 5px 7px; font-size: 11px; }
  .lbx-ctrl-btn { width: 30px; height: 30px; }
  .lbx-close-btn { width: 32px; height: 32px; }
  .lbx-arrow { width: 38px; height: 38px; opacity: 0.8; }
  .lbx-arrow-prev { left: 8px; }
  .lbx-arrow-next { right: 8px; }
  .lbx-card-footer { padding: 8px 12px 10px; }
  .lbx-thumb-btn { width: 42px; height: 42px; }
  .lbx-hint { display: none; }
}

/* Tablet */
@media (min-width: 601px) and (max-width: 900px) {
  .lbx-card {
    max-width: calc(100vw - 48px);
    height: calc(100vh - 48px);
    height: calc(100svh - 48px);
  }
}

/* Large desktop */
@media (min-width: 1200px) {
  .lbx-card {
    max-width: 960px;
  }
}

/* ═══════════════════════════════════════════════════════════
   SCROLL PROGRESS BAR
═══════════════════════════════════════════════════════════ */
#scrollProgress {
  position: fixed;
  top: 0;
  left: 0;
  width: 0%;
  height: 3px;
  z-index: 999999;
  /* Brand gradient: rose → gold */
  background: linear-gradient(90deg, var(--rose), var(--gold-l, #EFC97A), var(--rose));
  background-size: 200% 100%;
  /* Smooth fill — no jitter */
  transition: width 0.1s linear;
  /* Subtle glow */
  box-shadow: 0 0 8px rgba(200,132,122,0.55), 0 0 2px rgba(200,132,122,0.3);
  /* Rounded right cap */
  border-radius: 0 2px 2px 0;
  /* No layout shift — outside flow */
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════
   EMPTY COLLECTION STATE
═══════════════════════════════════════════════════════════ */
.grid-empty-state {
  /* Span full grid width */
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 64px 32px;
  margin: 8px auto;
  max-width: 440px;
  width: 100%;
  text-align: center;

  /* Card styling — minimal, elegant */
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(200,132,122,0.12);
  border-radius: 20px;
  box-shadow:
    0 4px 24px rgba(0,0,0,0.2),
    inset 0 1px 0 rgba(255,255,255,0.03);

  /* Fade in when revealed */
  animation: emptyFadeIn .45s ease forwards;
}
@keyframes emptyFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.empty-state-icon {
  font-size: 32px;
  color: rgba(200,132,122,0.25);
  line-height: 1;
  letter-spacing: -2px;
  /* Subtle pulse */
  animation: emptyIconPulse 3s ease-in-out infinite;
}
@keyframes emptyIconPulse {
  0%, 100% { opacity: 0.25; transform: scale(1); }
  50%       { opacity: 0.45; transform: scale(1.06); }
}
.empty-state-title {
  font-family: var(--font-serif);
  font-size: 18px;
  font-weight: 600;
  color: rgba(245,230,204,0.6);
  letter-spacing: 0.04em;
  margin: 0;
}
.empty-state-sub {
  font-size: 12.5px;
  color: rgba(245,230,204,0.32);
  letter-spacing: 0.03em;
  line-height: 1.6;
  margin: 0;
}
.empty-state-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 9px 22px;
  border-radius: 50px;
  border: 1px solid rgba(200,132,122,0.25);
  background: rgba(200,132,122,0.08);
  color: rgba(245,230,204,0.6);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background .22s, border-color .22s, color .22s, transform .18s;
}
.empty-state-btn:hover {
  background: rgba(200,132,122,0.18);
  border-color: rgba(200,132,122,0.5);
  color: var(--champ);
  transform: translateY(-1px);
}
/* ══════════════════════════════════════════════════════════════
   MOBILE FIX v3 — Logo clip + Bengali text visibility
   ─────────────────────────────────────────────────────────────
   ROOT CAUSE:
   .logo-clip at 116px wide only shows the saree illustration
   portion of the logo image. The Bengali "পরিনীতা" text sits
   on the right side of the image and gets clipped off.
   The later CSS block also overrides font-size:0 on .logo
   with clamp(22px…) + -webkit-background-clip:text, which on
   real WebKit mobile breaks overflow:hidden containment.

   FIX:
   1. Widen logo-clip to 160px so Bengali text is visible
   2. Keep font-size:0 and strip -webkit-background-clip:text
   3. Hard-lock html/body/nav against overflow
══════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {

  html {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }
  body {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }

  nav {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    max-width: 100vw !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  /* Strip the conflicting later-rule that overrides font-size:0
     and breaks WebKit mobile overflow containment */
  .logo {
    font-size: 0 !important;
    line-height: 0 !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
    display: flex !important;
    align-items: center !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
    max-width: 55vw !important;
    overflow: hidden !important;
  }

  /* WIDER clip — 160px shows both saree illustration + Bengali text */
  .logo-clip {
    display: block !important;
    position: relative !important;
    width: 160px !important;
    height: 54px !important;
    max-width: 160px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
  }

  /* Logo image: same transform as original, wider clip does the work */
  .logo-img {
    position: absolute !important;
    width: 134px !important;
    height: auto !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-58%, -46%) !important;
    max-width: none !important;
    display: block !important;
  }

  .nav-right-group {
    flex-shrink: 0 !important;
    min-width: 0 !important;
    overflow: visible !important;
  }
}

/* Very small phones — slightly narrower but still shows text */
@media (max-width: 375px) {
  .logo-clip {
    width: 140px !important;
    height: 48px !important;
    max-width: 140px !important;
  }
  .logo-img {
    width: 120px !important;
  }
}

/* ════════════════════════════════════
   ISSUE 2 — PRODUCT DETAIL IMAGE MOBILE FIX
   Targets: @media max-width 640px
════════════════════════════════════ */
@media (max-width: 640px) {

  .pd-overlay {
    padding: 8px !important;
    align-items: flex-start !important;
    overflow-y: auto !important;
  }

  .pd-modal {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    width: 100% !important;
    border-radius: 18px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .pd-body {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: unset !important;
    min-height: unset !important;
  }

  .pd-gallery {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    padding: 0 !important;
    gap: 0 !important;
    min-height: unset !important;
    overflow: hidden !important;
    border-radius: 18px 18px 0 0 !important;
    flex-shrink: 0 !important;
  }

  .pd-gallery-main {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 3 / 4 !important;
    min-height: unset !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
  }

  .pd-main-img {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center top !important;
    margin: 0 !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
  }

  .pd-gallery-badge {
    position: absolute !important;
    bottom: 10px !important;
    left: 12px !important;
    top: auto !important;
    right: auto !important;
    z-index: 6 !important;
    max-width: calc(50% - 16px) !important;
  }

  .pd-zoom-btn {
    position: absolute !important;
    bottom: 10px !important;
    right: 12px !important;
    top: auto !important;
    left: auto !important;
    z-index: 6 !important;
    opacity: 1 !important;
  }

  .pd-gal-prev { left: 8px !important; }
  .pd-gal-next { right: 8px !important; }

  .pd-gallery-thumbs {
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 12px !important;
    gap: 8px !important;
    min-height: 72px !important;
    flex-shrink: 0 !important;
    background: rgba(4,1,2,0.9) !important;
    border-top: 1px solid rgba(200,132,122,0.1) !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .pd-thumb {
    flex-shrink: 0 !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    display: block !important;
  }

  .pd-thumb img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  .pd-info {
    display: flex !important;
    flex-direction: column !important;
    padding: 20px 18px 28px !important;
    overflow: visible !important;
  }
}
/* ═══════════════════════════════════════════════════════════
   CART SELECTION SYSTEM — v5
   Checkboxes · Buy Now · Unselected dim · Selection error
═══════════════════════════════════════════════════════════ */

/* ── Checkbox label wrapper ── */
.cart-item-sel {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  cursor: pointer;
  padding: 2px 0;
  margin-right: -2px;
}

/* Hide native checkbox */
.cart-sel-cb {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}

/* Custom checkbox box */
.cart-sel-box {
  width: 18px;
  height: 18px;
  border: 1.5px solid rgba(200,132,122,0.35);
  border-radius: 5px;
  background: rgba(0,0,0,0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: border-color 0.18s, background 0.18s;
  position: relative;
}

/* Checked state */
.cart-sel-cb:checked + .cart-sel-box {
  background: linear-gradient(135deg, var(--maroon), var(--rose));
  border-color: var(--rose);
}

/* Checkmark tick */
.cart-sel-cb:checked + .cart-sel-box::after {
  content: '';
  display: block;
  width: 5px;
  height: 9px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(42deg) translate(0px, -1px);
}

/* Hover glow */
.cart-item-sel:hover .cart-sel-box {
  border-color: rgba(200,132,122,0.65);
}

/* ── Unselected item dimming ── */
.cart-item--unsel {
  opacity: 0.48;
  filter: saturate(0.5);
  transition: opacity 0.2s, filter 0.2s;
}
.cart-item--unsel:hover {
  opacity: 0.65;
}

/* ── Buy Now button per item ── */
.cart-item-buy-now {
  height: 26px;
  padding: 0 9px;
  background: linear-gradient(135deg, rgba(92,26,42,.7), rgba(200,132,122,.35));
  border: 1px solid rgba(200,132,122,.45);
  border-radius: 7px;
  color: var(--champ);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-family: var(--font-body);
  cursor: pointer;
  white-space: nowrap;
  display: flex;
  align-items: center;
  transition: all .18s;
  flex-shrink: 0;
}
.cart-item-buy-now:hover {
  background: linear-gradient(135deg, rgba(200,132,122,.45), rgba(239,201,122,.2));
  border-color: rgba(212,168,85,.55);
  transform: translateY(-1px);
}

/* ── Selection error message ── */
.cart-selection-error {
  display: flex;
  align-items: center;
  gap: 7px;
  background: rgba(248,113,113,.1);
  border: 1px solid rgba(248,113,113,.3);
  border-radius: 9px;
  padding: 9px 13px;
  margin-bottom: 12px;
  font-size: 11px;
  font-weight: 600;
  color: #f87171;
  font-family: var(--font-body);
  letter-spacing: 0.3px;
  transition: opacity 0.3s;
}

/* ── Mobile: tighten controls row on small screens ── */
@media (max-width: 400px) {
  .cart-item-controls {
    gap: 4px;
  }
  .cart-item-buy-now {
    padding: 0 7px;
    font-size: 8.5px;
  }
}