*{margin:0;padding:0;box-sizing:border-box}
:root{
  --cream:#FDF6ED;--cream2:#F5EAD8;--cream3:#EDD9BF;
  --terra:#C96B3A;--terra-d:#A0522D;--terra-l:#E8956D;
  --gold:#C9A84C;--gold-l:#EDD17A;
  --choc:#2C1810;--choc-m:#4A2E20;--choc-l:#7A4F3A;
  --rose:#E8A0A0;--sage:#8BAF8D;
  --ink:#1A0F08;--ink-m:#5C3D2E;--ink-l:#9C7B6B;
  --wh:#FFFFFF;
  --page-bg:#FDF6ED;
  --surface:#2C1810;
  --surface-text:#FFFFFF;
  --surface-soft:#F5EAD8;
  --text:#1A0F08;
  --text-muted:#5C3D2E;
  --text-soft:#9C7B6B;
  --accent:#C96B3A;
  --accent-dark:#A0522D;
  --accent-soft:#E8956D;
  --nav-bg:rgba(253,246,237,.88);
  --nav-border:rgba(201,107,58,.15);
  --nav-icon-border:rgba(201,107,58,.25);
  --nav-icon-hover:var(--cream2);
  --btn-primary-bg:var(--surface);
  --btn-primary-color:var(--surface-text);
  --btn-primary-hover:var(--terra-d);
  --btn-secondary-bg:transparent;
  --btn-secondary-color:var(--surface);
  --btn-secondary-border:rgba(44,24,16,.25);
  --btn-secondary-hover:var(--cream2);
  --hero-bg-start:var(--cream);
  --hero-bg-mid:var(--cream2);
  --hero-bg-end:rgba(201,107,58,.08);
  --hero-pattern-1:rgba(201,168,76,.18);
  --hero-pattern-2:rgba(201,107,58,.12);
  --hero-ring-border:rgba(201,107,58,.15);
  --hero-tag-bg:rgba(201,107,58,.1);
  --hero-tag-border:rgba(201,107,58,.25);
  --hero-tag-color:var(--terra);
  --logo-text:var(--choc);
  --card-shadow:0 8px 32px rgba(44,24,16,.10);
  --card-hover:0 24px 56px rgba(44,24,16,.20);
}/* ═══════════════════════════════════
   ALT THEME (DARK PURPLE) — Full Fix
═══════════════════════════════════ */

:root[data-theme='alt'] {

  /* ── Page & surfaces ── */
  --page-bg: #120318;
  --wh: #1E0A30;
  --cream: #1A0B2E;
  --cream2: #2F1560;
  --cream3: #4A2080;

  /* ── Text ── */
  --ink: #F8F7FF;
  --ink-m: #C7B8E9;
  --ink-l: #B8A7D2;

  /* ── Chocolate (used on cards, headers, text) ── */
  --choc: #F8F7FF;
  --choc-m: #EAE7FF;
  --choc-l: #D1C6FF;

  /* ── Accent ── */
  --terra: #FF4B8B;
  --terra-d: #C01F75;
  --terra-l: #FF83C1;
  --gold: #FFC048;
  --gold-l: #FEE0A4;

  /* ── Component tokens ── */
  --card-shadow: 0 8px 32px rgba(0,0,0,.45);
  --card-hover: 0 24px 56px rgba(0,0,0,.6);
}

/* ── Body & background ── */
[data-theme='alt'] body {
  background: #120318;
  color: #F8F7FF;
}

/* ── Nav ── */
[data-theme='alt'] nav {
  background: rgba(18,3,24,.92);
  border-bottom-color: rgba(255,75,139,.18);
}
[data-theme='alt'] .mobile-menu {
  background: rgba(18,3,24,.98);
  border-bottom-color: rgba(255,75,139,.15);
}
[data-theme='alt'] .mobile-menu a {
  color: #C7B8E9;
  border-bottom-color: rgba(255,75,139,.1);
}
[data-theme='alt'] .mobile-menu a:hover {
  background: #2F1560;
  color: #FF4B8B;
}

/* ── Logo ── */
[data-theme='alt'] .logo {
  color: #F8F7FF;
}

/* ── Nav links ── */
[data-theme='alt'] .nav-links a {
  color: #C7B8E9;
}
[data-theme='alt'] .nav-links a:hover,
[data-theme='alt'] .nav-links a.active {
  color: #FF4B8B;
}

/* ── Nav icons ── */
[data-theme='alt'] .nav-icon {
  border-color: rgba(255,75,139,.3);
  color: #C7B8E9;
}
[data-theme='alt'] .nav-icon:hover {
  background: rgba(255,75,139,.12);
  border-color: #FF4B8B;
  color: #FF83C1;
}

/* ── Cart button ── */
[data-theme='alt'] .cart-btn {
  background: #F8F7FF;
  color: #1B0A2A;
}
[data-theme='alt'] .cart-btn:hover {
  background: #FF4B8B;
  color: #fff;
}

/* ── Hero section ── */
[data-theme='alt'] .hero-bg {
  background: linear-gradient(135deg, #120318 0%, #2F0F49 50%, rgba(255,75,139,.12) 100%);
}
[data-theme='alt'] .hero h1,
[data-theme='alt'] .hero h1 span {
  color: #F8F7FF;
}
[data-theme='alt'] .hero h1 em {
  color: #FF4B8B;
}
[data-theme='alt'] .hero-sub {
  color: #C7B8E9;
}
[data-theme='alt'] .hero-tag {
  background: rgba(255,75,139,.12);
  border-color: rgba(255,75,139,.35);
  color: #FFC0E1;
}
[data-theme='alt'] .trust-item {
  color: #B8A7D2;
}
[data-theme='alt'] .btn-primary {
  background: #F8F7FF;
  color: #1B0A2A;
}
[data-theme='alt'] .btn-primary:hover {
  background: #FF4B8B;
  color: #fff;
}
[data-theme='alt'] .btn-secondary {
  background: rgba(248,247,255,.08);
  color: #F8F7FF;
  border-color: rgba(248,247,255,.25);
}
[data-theme='alt'] .btn-secondary:hover {
  background: rgba(255,75,139,.12);
}

/* ── Float cards (hero) ── */
[data-theme='alt'] .float-card {
  background: #2F0F49;
  border-color: rgba(255,75,139,.2);
  box-shadow: 0 8px 32px rgba(0,0,0,.4);
}
[data-theme='alt'] .fc-main {
  background: linear-gradient(145deg, #2F0F49, #3C1A63);
  border-color: rgba(255,75,139,.25);
}
[data-theme='alt'] .fc-main .fc-name,
[data-theme='alt'] .fc-main .fc-price { color: #F8F7FF; }
[data-theme='alt'] .fc-main .fc-price span { color: #B8A7D2; }
[data-theme='alt'] .fc-rating { background: #1A0B2E; border-color: #4A2080; color: #F8F7FF; }
[data-theme='alt'] .fc-sm .fc-name-sm { color: #F8F7FF; }
[data-theme='alt'] .fc-sm .fc-p-sm { color: #FF83C1; }
[data-theme='alt'] .delivery-pill {
  background: #F8F7FF;
  color: #1B0A2A;
}

/* ── Stats bar ── */
[data-theme='alt'] .stats {
  background: #0F0C16;
}
[data-theme='alt'] .stat-item {
  border-right-color: rgba(248,247,255,.08);
}
[data-theme='alt'] .stat-num { color: #FEE0A4; }
[data-theme='alt'] .stat-lbl { color: rgba(248,247,255,.5); }

/* ── Section headings ── */
[data-theme='alt'] .sec-eyebrow { color: #FF4B8B; }
[data-theme='alt'] .sec-eyebrow::before { background: #FF4B8B; }
[data-theme='alt'] .sec-head { color: #F8F7FF; }
[data-theme='alt'] .sec-sub { color: #B8A7D2; }

/* ── Category pills ── */
[data-theme='alt'] .cat-pill {
  background: #2F0F49;
  border-color: rgba(255,75,139,.25);
  color: #C7B8E9;
  box-shadow: none;
}
[data-theme='alt'] .cat-pill:hover {
  border-color: #FF4B8B;
  color: #FF83C1;
  background: rgba(255,75,139,.1);
}
[data-theme='alt'] .cat-pill.active {
  background: #FF4B8B;
  color: #fff;
  border-color: #FF4B8B;
}

/* ── Product cards ── */
[data-theme='alt'] .pcard {
  background: #1E0A30;
  border-color: rgba(255,75,139,.12);
  box-shadow: 0 8px 32px rgba(0,0,0,.35);
}
[data-theme='alt'] .pcard:hover {
  border-color: rgba(255,75,139,.35);
  box-shadow: 0 24px 56px rgba(0,0,0,.55);
}
[data-theme='alt'] .pcat { color: #FF83C1; }
[data-theme='alt'] .pname { color: #F8F7FF; }
[data-theme='alt'] .pdesc { color: #B8A7D2; }
[data-theme='alt'] .pprice { color: #F8F7FF; }
[data-theme='alt'] .pprice-old { color: #B8A7D2; }
[data-theme='alt'] .pstars { color: #FFC048; }
[data-theme='alt'] .pstars-count { color: #B8A7D2; }
[data-theme='alt'] .add-btn {
  background: #FF4B8B;
  color: #fff;
}
[data-theme='alt'] .add-btn:hover { background: #C01F75; }
[data-theme='alt'] .wish-btn {
  background: rgba(30,10,48,.85);
}
[data-theme='alt'] .wish-btn:hover { background: #2F0F49; }

/* ── Sort bar ── */
[data-theme='alt'] .prod-count { color: #B8A7D2; }
[data-theme='alt'] .sort-sel {
  background: #1E0A30;
  border-color: rgba(255,75,139,.25);
  color: #C7B8E9;
}
[data-theme='alt'] .sort-sel:focus { border-color: #FF4B8B; }

/* ── Promo banner ── */
[data-theme='alt'] .promo {
  background: #0F0C16;
}
[data-theme='alt'] .promo-eyebrow { color: #FFC048; }
[data-theme='alt'] .promo h2 { color: #F8F7FF; }
[data-theme='alt'] .promo p { color: rgba(248,247,255,.65); }
[data-theme='alt'] .promo-code {
  background: rgba(255,192,72,.1);
  border-color: rgba(255,192,72,.4);
  color: #FEE0A4;
}
[data-theme='alt'] .promo-btn {
  background: linear-gradient(135deg, #FFC048, #FEE0A4);
  color: #1B0A2A;
}

/* ── UPI panel ── */
[data-theme='alt'] .upi-card {
  background: #1E0A30;
  border-color: rgba(255,75,139,.18);
}
[data-theme='alt'] .upi-info-row {
  background: #2F0F49;
}
[data-theme='alt'] .upi-info-row span { color: #B8A7D2; }
[data-theme='alt'] .upi-info-row strong { color: #F8F7FF; }

/* ── Product modal ── */
[data-theme='alt'] .modal {
  background: #1E0A30;
}
[data-theme='alt'] .modal-close {
  background: #2F0F49;
  color: #C7B8E9;
}
[data-theme='alt'] .modal-close:hover { background: #4A2080; }
[data-theme='alt'] .modal-cat { color: #FF83C1; }
[data-theme='alt'] .modal h2 { color: #F8F7FF; }
[data-theme='alt'] .modal-desc { color: #C7B8E9; }
[data-theme='alt'] .modal-price { color: #F8F7FF; }
[data-theme='alt'] .modal-price s { color: #B8A7D2; }
[data-theme='alt'] .qty-btn {
  background: #2F0F49;
  border-color: #4A2080;
  color: #F8F7FF;
}
[data-theme='alt'] .qty-btn:hover { background: #4A2080; }
[data-theme='alt'] .qty-num { color: #F8F7FF; }
[data-theme='alt'] .modal-add {
  background: #FF4B8B;
  color: #fff;
}
[data-theme='alt'] .modal-add:hover { background: #C01F75; }

/* ── Cart drawer ── */
[data-theme='alt'] .cart-drawer {
  background: #1A0B2E;
}
[data-theme='alt'] .cart-head {
  background: #120318;
  border-bottom-color: rgba(255,75,139,.15);
}
[data-theme='alt'] .cart-head h2 { color: #F8F7FF; }
[data-theme='alt'] .cart-close {
  background: #2F0F49;
  color: #C7B8E9;
}
[data-theme='alt'] .cart-close:hover { background: #4A2080; }
[data-theme='alt'] .cart-item { border-bottom-color: rgba(255,75,139,.1); }
[data-theme='alt'] .ci-name { color: #F8F7FF; }
[data-theme='alt'] .ci-price { color: #FF83C1; }
[data-theme='alt'] .cq-btn {
  background: #2F0F49;
  border-color: rgba(255,75,139,.2);
  color: #F8F7FF;
}
[data-theme='alt'] .cq-btn:hover { background: #4A2080; }
[data-theme='alt'] .cq-num { color: #F8F7FF; }
[data-theme='alt'] .ci-del { color: #B8A7D2; }
[data-theme='alt'] .ci-del:hover { color: #FF4B8B; }
[data-theme='alt'] .cart-foot {
  background: #120318;
  border-top-color: rgba(255,75,139,.12);
}
[data-theme='alt'] .cart-total span { color: #C7B8E9; }
[data-theme='alt'] .cart-total strong { color: #F8F7FF; }
[data-theme='alt'] .checkout-btn {
  background: #FF4B8B;
  color: #fff;
}
[data-theme='alt'] .checkout-btn:hover { background: #C01F75; }
[data-theme='alt'] .cart-empty { color: #B8A7D2; }

/* ── Checkout modal ── */
[data-theme='alt'] #checkoutModal h2 { color: #F8F7FF; }
[data-theme='alt'] .co-field label { color: #C7B8E9; }
[data-theme='alt'] .co-field input,
[data-theme='alt'] .co-field select,
[data-theme='alt'] .co-field textarea {
  background: #2F0F49;
  border-color: #4A2080;
  color: #F8F7FF;
}
[data-theme='alt'] .co-field input:focus,
[data-theme='alt'] .co-field select:focus,
[data-theme='alt'] .co-field textarea:focus {
  border-color: #FF4B8B;
  box-shadow: 0 0 0 3px rgba(255,75,139,.15);
}
[data-theme='alt'] .co-field .ph-pre { color: #B8A7D2; }
[data-theme='alt'] .co-summary {
  background: #2F0F49;
  border-color: rgba(255,75,139,.2);
}
[data-theme='alt'] .co-summary-title { color: #C7B8E9; }
[data-theme='alt'] .co-item { color: #C7B8E9; }
[data-theme='alt'] .co-divider { background: rgba(255,75,139,.2); }
[data-theme='alt'] .co-total { color: #F8F7FF; }
[data-theme='alt'] .place-btn {
  background: linear-gradient(135deg, #FF4B8B, #C01F75);
}

/* ── Account popup ── */
[data-theme='alt'] #accPopup {
  background: #1E0A30;
  border-color: rgba(255,75,139,.2);
  box-shadow: 0 24px 64px rgba(0,0,0,.55);
}
[data-theme='alt'] .acc-tabs { border-bottom-color: #4A2080; }
[data-theme='alt'] .acc-tab { color: #B8A7D2; background: none; }
[data-theme='alt'] .acc-tab.active { color: #FF4B8B; }
[data-theme='alt'] .acc-tab.active::after { background: #FF4B8B; }
[data-theme='alt'] .acc-form h3 { color: #F8F7FF; }
[data-theme='alt'] .acc-form p.sub { color: #B8A7D2; }
[data-theme='alt'] .fgroup label { color: #C7B8E9; }
[data-theme='alt'] .fgroup input {
  background: #2F0F49;
  border-color: #4A2080;
  color: #F8F7FF;
}
[data-theme='alt'] .fgroup input:focus {
  border-color: #FF4B8B;
  box-shadow: 0 0 0 3px rgba(255,75,139,.15);
}
[data-theme='alt'] .fgroup .prefix { color: #B8A7D2; }
[data-theme='alt'] .acc-submit {
  background: linear-gradient(135deg, #FF4B8B, #C01F75);
}
[data-theme='alt'] .acc-logged h3 { color: #F8F7FF; }
[data-theme='alt'] .acc-logged .mob-show { color: #B8A7D2; }
[data-theme='alt'] .acc-menu a { color: #C7B8E9; }
[data-theme='alt'] .acc-menu a:hover { background: #2F0F49; color: #FF83C1; }
[data-theme='alt'] .acc-divider { background: #4A2080; }
[data-theme='alt'] .acc-logout { color: #FF83C1; }
[data-theme='alt'] .acc-logout:hover { background: rgba(255,75,139,.1); }

/* ── About modal ── */
[data-theme='alt'] .about-modal { background: #1A0B2E; }
[data-theme='alt'] .am-header { background: #0F0C16; }
[data-theme='alt'] .am-header h2 { color: #F8F7FF; }
[data-theme='alt'] .am-header p { color: rgba(248,247,255,.55); }
[data-theme='alt'] .am-stats { border-bottom-color: rgba(255,75,139,.15); }
[data-theme='alt'] .am-stat { border-right-color: rgba(255,75,139,.12); }
[data-theme='alt'] .am-stat-num { color: #FF4B8B; }
[data-theme='alt'] .am-stat-lbl { color: #B8A7D2; }
[data-theme='alt'] .am-card {
  background: #2F0F49;
  border-color: rgba(255,75,139,.15);
}
[data-theme='alt'] .am-card h3 { color: #F8F7FF; }
[data-theme='alt'] .am-card p { color: #B8A7D2; }
[data-theme='alt'] .am-tagline {
  background: rgba(255,75,139,.08);
  border-color: rgba(255,192,72,.25);
}
[data-theme='alt'] .am-tagline p { color: #C7B8E9; }
[data-theme='alt'] .am-tagline p strong { color: #FF83C1; }

/* ── Contact modal ── */
[data-theme='alt'] #contactModal .about-modal { background: #1A0B2E; }
[data-theme='alt'] #contactModal input,
[data-theme='alt'] #contactModal textarea {
  background: #2F0F49 !important;
  border-color: #4A2080 !important;
  color: #F8F7FF !important;
}
[data-theme='alt'] #contactModal input::placeholder,
[data-theme='alt'] #contactModal textarea::placeholder { color: #B8A7D2; }

/* ── Privacy / Terms modals ── */
[data-theme='alt'] #privacyModalBg .modal,
[data-theme='alt'] #termsModalBg .modal {
  background: #1E0A30;
}
[data-theme='alt'] #privacyModalBg .modal h2,
[data-theme='alt'] #privacyModalBg .modal h3,
[data-theme='alt'] #termsModalBg .modal h2,
[data-theme='alt'] #termsModalBg .modal h3 { color: #F8F7FF; }
[data-theme='alt'] #privacyModalBg .modal p,
[data-theme='alt'] #termsModalBg .modal p { color: #C7B8E9; }

/* ── Custom order modal ── */
[data-theme='alt'] #customOrderBg .modal { background: #1E0A30; }
[data-theme='alt'] #customOrderBg .modal h2 { color: #F8F7FF; }
[data-theme='alt'] #customOrderBg .modal p { color: #C7B8E9; }
[data-theme='alt'] #customOrderBg .co-field label { color: #C7B8E9; }
[data-theme='alt'] #customOrderBg .co-field input,
[data-theme='alt'] #customOrderBg .co-field select,
[data-theme='alt'] #customOrderBg .co-field textarea {
  background: #2F0F49;
  border-color: #4A2080;
  color: #F8F7FF;
}

/* ── Search modal ── */
[data-theme='alt'] #searchModalBg .modal { background: #1E0A30; }
[data-theme='alt'] #searchInput {
  background: #2F0F49 !important;
  border-color: #4A2080 !important;
  color: #F8F7FF !important;
}
[data-theme='alt'] #searchInput::placeholder { color: #B8A7D2; }
[data-theme='alt'] #searchResults { color: #C7B8E9; }
[data-theme='alt'] #searchResults a { color: #F8F7FF; }
[data-theme='alt'] #searchResults a:hover { background: #2F0F49; }

/* ── Tracking modal ── */
[data-theme='alt'] .track-modal {
  background: #1E0A30;
}
[data-theme='alt'] .track-modal h2 { color: #F8F7FF; }
[data-theme='alt'] .track-sub { color: #B8A7D2; }
[data-theme='alt'] .courier-card {
  background: #2F0F49;
  border-color: rgba(255,75,139,.18);
}
[data-theme='alt'] .courier-card:hover {
  box-shadow: 0 12px 24px rgba(255,75,139,.15);
}
[data-theme='alt'] .courier-card strong { color: #F8F7FF; }
[data-theme='alt'] .courier-card span { color: #B8A7D2; }
[data-theme='alt'] .delhivery .courier-icon { background: rgba(255,75,139,.15); }
[data-theme='alt'] .dtdc .courier-icon { background: rgba(255,75,139,.12); }
[data-theme='alt'] .blue .courier-icon { background: rgba(45,212,191,.12); }
[data-theme='alt'] .orange .courier-icon { background: rgba(255,192,72,.12); }
[data-theme='alt'] .purple .courier-icon { background: rgba(106,61,234,.18); }
[data-theme='alt'] .india .courier-icon { background: rgba(255,192,72,.14); }

/* ── Toast ── */
[data-theme='alt'] .toast {
  background: #FF4B8B;
  color: #fff;
  border-color: rgba(255,192,72,.25);
}

/* ── Footer ── */
[data-theme='alt'] footer { background: #0F0C16; }
[data-theme='alt'] .footer-brand .fl { color: #F8F7FF; }
[data-theme='alt'] .footer-brand p { color: rgba(248,247,255,.45); }
[data-theme='alt'] .footer-col h4 { color: rgba(248,247,255,.4); }
[data-theme='alt'] .footer-col a { color: rgba(248,247,255,.6); }
[data-theme='alt'] .footer-col a:hover { color: #FEE0A4; }
[data-theme='alt'] .footer-bot { border-top-color: rgba(248,247,255,.08); }
[data-theme='alt'] .footer-bot p { color: rgba(248,247,255,.3); }
[data-theme='alt'] .soc-btn {
  border-color: rgba(248,247,255,.15);
}
[data-theme='alt'] .soc-btn:hover {
  border-color: #FFC048;
  background: rgba(255,192,72,.1);
}

/* ── Order success screen ── */
[data-theme='alt'] #orderSuccess h2 { color: #F8F7FF; }
[data-theme='alt'] #orderSuccess p { color: #C7B8E9; }
[data-theme='alt'] #successOrderId { color: #FF83C1; }
[data-theme='alt'] .ok-btn { background: #FF4B8B; color: #fff; }
[data-theme='alt'] .ok-btn:hover { background: #C01F75; }

/* ── Skeleton cards ── */
[data-theme='alt'] .sk-card { background: #1E0A30; border-color: rgba(255,75,139,.08); }
[data-theme='alt'] .sk-img { background: linear-gradient(90deg, #2F0F49 0%, #4A2080 45%, #2F0F49 100%); }
[data-theme='alt'] .sk-line { background: #2F0F49; }

/* ── Product image gradient backgrounds in dark mode ── */
[data-theme='alt'] .bg1 { background: linear-gradient(145deg, #2F0F49, #4A2080) !important; }
[data-theme='alt'] .bg2 { background: linear-gradient(145deg, #3C0A2E, #6B1245) !important; }
[data-theme='alt'] .bg3 { background: linear-gradient(145deg, #0A2E1A, #154530) !important; }
[data-theme='alt'] .bg4 { background: linear-gradient(145deg, #2E2A0A, #4A4015) !important; }
[data-theme='alt'] .bg5 { background: linear-gradient(145deg, #1A0A3C, #2D1560) !important; }
[data-theme='alt'] .bg6 { background: linear-gradient(145deg, #3C0A0A, #5C1515) !important; }

/* ── Orbs in dark theme ── */
[data-theme='alt'] .orb1 { background: rgba(255,75,139,.12); }
[data-theme='alt'] .orb2 { background: rgba(106,61,234,.12); }
[data-theme='alt'] .orb3 { background: rgba(45,212,191,.08); }

html{scroll-behavior:smooth;overflow-x:clip;overflow-y:auto;}

/* CURSOR — hidden on touch */
.cursor{position:fixed;pointer-events:none;z-index:99999;mix-blend-mode:multiply}
.cur-dot{width:8px;height:8px;background:var(--terra);border-radius:50%;transform:translate(-50%,-50%);transition:transform .1s}
.cur-ring{width:36px;height:36px;border:1.5px solid var(--terra);border-radius:50%;transform:translate(-50%,-50%);transition:all .18s cubic-bezier(.4,0,.2,1);opacity:.6}
.cursor.hover .cur-ring{width:54px;height:54px;opacity:.3}
.cursor.hover .cur-dot{transform:translate(-50%,-50%) scale(1.8)}
@media(hover:none){.cursor{display:none}body{cursor:auto}}

/* NOISE */

/* ORBS */
.orb{position:fixed;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:0;overflow:hidden;max-width:50vw;max-height:50vw;}.orb1{width:500px;height:500px;background:rgba(201,107,58,.14);top:-200px;left:-150px;animation:drift1 18s ease-in-out infinite}
.orb2{width:400px;height:400px;background:rgba(201,168,76,.12);bottom:-150px;right:-100px;animation:drift2 22s ease-in-out infinite}
.orb3{width:300px;height:300px;background:rgba(139,175,141,.10);top:50%;left:60%;animation:drift3 15s ease-in-out infinite}
@keyframes drift1{0%,100%{transform:translate(0,0)}50%{transform:translate(60px,40px)}}
@keyframes drift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-40px,-60px)}}
@keyframes drift3{0%,100%{transform:translate(0,0)}50%{transform:translate(30px,-40px)}}


nav{
  position:sticky;top:0;z-index:1000;
  background:var(--nav-bg);
  backdrop-filter:blur(20px) saturate(1.6);
  border-bottom:1px solid var(--nav-border);
  padding:0 64px;height:90px;
  display:flex;align-items:center;justify-content:space-between;
  animation:slideDown .7s cubic-bezier(.4,0,.2,1) both;
  margin:0;
  left:0;
  right:0;
  width:100%;
  box-sizing:border-box;
    isolation:isolate;  /* ADD THIS */

}


/* ═══════════════════════════════════
   MOBILE CONTAINER FIX — No Overflow
═══════════════════════════════════ */
html, body {
  margin: 0;
  padding: 0;
  overflow-x: clip;
  overflow-y: auto;
  width: 100%;
}
body::before {
  left: 0;
  width: 100%;
  box-sizing: border-box;
}.orb {
  pointer-events: none;
  z-index: 0;
  max-width: 100vw;
  overflow: hidden;
  /* prevent orbs from creating horizontal scroll */
  left: clamp(-200px, var(--orb-left, -150px), 50vw);
}

.orb1 { top: -200px; left: -150px; overflow: hidden; }
.orb2 { bottom: -150px; right: -100px; overflow: hidden; }
.orb3 { top: 50%; left: 60%; overflow: hidden; }
/* All images must be responsive */
img {
  max-width: 100%;
  height: auto;
}

/* ── Mobile: 767px and below ── */
@media (max-width: 767px) {

  /* Global section padding — no negative margins */
  .section-wrap,
  .products-section,
  .upi-panel {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  /* Promo banner */
  .promo {
    margin-left: 16px !important;
    margin-right: 16px !important;
    width: calc(100% - 32px) !important;
    box-sizing: border-box;
    padding: 28px 20px !important;
  }

  /* Stats */
  .stats {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
  }

  /* Hero */
  .hero {
    width: 100% !important;
    padding: 36px 16px 40px !important;
    box-sizing: border-box;
    overflow: hidden;
  }

  /* Nav */
  nav {
    width: 100% !important;
    padding: 0 14px !important;
    box-sizing: border-box;
  }
.mobile-menu,
.mobile-menu *,
.mobile-menu-foot,
.mm-cart-btn{
    box-sizing:border-box;
}

.mobile-menu{
    width:100%;
    max-width:100vw;
    overflow-x:hidden;
}

.mobile-menu-foot{
    padding:16px 24px 0;
    width:100%;
}

.mm-cart-btn{
    width:100%;
    max-width:100%;
}
  /* Products grid */
  .grid {
    width: 100% !important;
    box-sizing: border-box;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  /* Product cards */
  .pcard {
    width: 100% !important;
    box-sizing: border-box;
    min-width: 0 !important;
  }

  /* Category pills scroll row */
  .cats-wrap {
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  .cat-pills {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: max-content;
    padding-bottom: 6px;
  }

  /* Footer */
  footer {
    width: 100% !important;
    padding: 36px 16px 20px !important;
    box-sizing: border-box;
  }

  .footer-grid {
    width: 100% !important;
    box-sizing: border-box;
  }

  /* Cart drawer */
  .cart-drawer {
    width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box;
  }

  /* Modals */
  .modal {
    width: calc(100vw - 32px) !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    box-sizing: border-box;
    padding: 20px 16px !important;
  }

  .modal-bg {
    padding: 16px !important;
    align-items: flex-end !important; /* slide up from bottom on mobile */
  }

  /* About / Track / Contact modals */
  .about-modal,
  .track-modal {
    width: calc(100vw - 24px) !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .about-modal-bg,
  .track-modal-bg {
    padding: 12px !important;
    align-items: flex-end !important;
  }

  /* Account popup */
  #accPopup {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    top: 68px !important;
    box-sizing: border-box;
  }

  /* Checkout modal */
  #checkoutModal {
    width: calc(100vw - 32px) !important;
    max-width: 100% !important;
    padding: 20px 16px !important;
    box-sizing: border-box;
  }

  /* UPI grid */
  .upi-grid {
    grid-template-columns: 1fr !important;
  }

  .upi-info-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px;
  }

  /* Hero rings — clip so they don't bleed */
  .hero-ring {
    overflow: hidden;
    max-width: 100vw;
  }

  /* Float buttons — keep in viewport */
  .float-btn {
    right: 14px !important;
  }

  /* Toast — full width with margins */
  .toast {
    left: 12px !important;
    right: 12px !important;
    bottom: 14px !important;
    width: auto !important;
    box-sizing: border-box;
  }
/* FIND this in your existing @media (max-width:767px) block and REPLACE: */
.logo-img {
  height: 48px !important;
  width: auto !important;
  max-width: 140px;
}

  /* Nav right — prevent overflow */
  .nav-right {
    gap: 8px !important;
    flex-shrink: 0;
  }

  /* Prod count bar */
  .prod-bar {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .sort-sel {
    width: 100% !important;
    box-sizing: border-box;
  }

  /* Promo right button */
  .promo-right {
    width: 100% !important;
  }

  .promo-btn {
    width: 100% !important;
    box-sizing: border-box;
  }

  /* Courier grid */
  .courier-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* About modal grid */
  .am-grid {
    grid-template-columns: 1fr !important;
  }

  .am-cta {
    flex-direction: column !important;
  }

  .am-btn {
    width: 100% !important;
    box-sizing: border-box;
  }

  /* Co-row fields stacked */
  .co-row {
    grid-template-columns: 1fr !important;
  }

  /* Product image area */
  .pimg {
    height: 140px !important;
  }

  .pimg-emoji {
    font-size: 48px !important;
  }

  /* Card body padding */
  .pbody {
    padding: 10px 12px 12px !important;
  }

  .pname {
    font-size: 14px !important;
  }

  .pprice {
    font-size: 15px !important;
  }

  .add-btn {
    width: 30px !important;
    height: 30px !important;
    font-size: 16px !important;
    border-radius: 10px !important;
  }

  /* Section headings */
  .sec-head {
    font-size: 26px !important;
  }

  /* Hero h1 */
  .hero h1 {
    font-size: 36px !important;
    letter-spacing: -0.5px !important;
  }

  /* Stat items */
  .stat-item {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    padding: 14px 10px !important;
  }

  .stat-num {
    font-size: 24px !important;
  }
}

/* ── Extra small: 400px and below ── */
@media (max-width: 400px) {

  .hero h1 {
    font-size: 28px !important;
  }

  .grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .pimg {
    height: 120px !important;
  }

  .pimg-emoji {
    font-size: 40px !important;
  }

  .pbody {
    padding: 8px 10px 10px !important;
  }

  .pname {
    font-size: 13px !important;
  }

  .pprice {
    font-size: 14px !important;
  }

  .promo {
    margin-left: 10px !important;
    margin-right: 10px !important;
    width: calc(100% - 20px) !important;
    padding: 22px 16px !important;
  }

  nav {
    padding: 0 10px !important;
  }

  .logo-img {
    height: 40px !important;
    max-width: 120px !important;
  }

  .cart-btn {
    padding: 7px 10px !important;
    font-size: 12px !important;
  }

  .section-wrap,
  .products-section {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  footer {
    padding: 28px 10px 16px !important;
  }
/* Also update nav height for mobile */
@media (max-width: 767px) {
  nav {
    height: 76px !important;
    padding: 0 14px !important;
  }

  .mobile-menu {
    top: 76px !important;
  }

  #accPopup {
    top: 82px !important;
  }
}
  .footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
  }
}
@keyframes slideDown{from{transform:translateY(-100%);opacity:0}to{transform:none;opacity:1}}
.logo{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:700;color:var(--logo-text);letter-spacing:-0.5px;display:flex;align-items:center;gap:10px;}
.logo-img{height:100px;width:auto;display:block;object-fit:contain}
.logo-mark{width:36px;height:36px;background:linear-gradient(135deg,var(--accent),var(--gold));border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;}
.logo em{font-style:italic;color:var(--accent)}
.nav-links{display:flex;gap:36px;align-items:center}
.nav-links a{text-decoration:none;font-size:14px;font-weight:500;color:var(--text-muted);transition:color .2s;position:relative;letter-spacing:.02em;}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;right:100%;height:1.5px;background:var(--accent);transition:right .3s cubic-bezier(.4,0,.2,1);}
.nav-links a:hover,.nav-links a.active{color:var(--accent)}
.nav-links a:hover::after,.nav-links a.active::after{right:0}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-icon{width:38px;height:38px;border-radius:50%;background:transparent;border:1px solid var(--nav-icon-border);display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;transition:all .2s;}
.nav-icon:hover{background:var(--nav-icon-hover);border-color:var(--accent)}
.cart-btn{background:var(--surface);color:var(--surface-text);border:none;padding:10px 24px;border-radius:24px;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:'Outfit',sans-serif;transition:all .25s cubic-bezier(.4,0,.2,1);letter-spacing:.02em;}
.cart-btn:hover{background:var(--btn-primary-hover);transform:translateY(-1px);box-shadow:0 8px 20px rgba(44,24,16,.25)}
.cbadge{background:var(--gold);color:var(--choc);width:20px;height:20px;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;}

/* Hamburger */
.ham-btn{display:none;width:38px;height:38px;border-radius:50%;background:transparent;border:1px solid rgba(201,107,58,.25);align-items:center;justify-content:center;cursor:pointer;flex-direction:column;gap:5px;padding:10px;transition:all .2s}
.ham-btn span{display:block;width:16px;height:1.5px;background:var(--choc);border-radius:2px;transition:all .3s cubic-bezier(.4,0,.2,1)}
.ham-btn.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.ham-btn.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.ham-btn.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
/* ===================================
   PERFECT MOBILE VIEW
=================================== */
@media (max-width:768px){

  .topbar{
    height:auto;
    min-height:60px;
    padding:12px 14px;
    flex-wrap:wrap;
    gap:10px;
  }

  .topbar-left,
  .topbar-right{
    width:100%;
  }

  .topbar-right{
    justify-content:flex-end;
  }

  .page-title{
    font-size:15px;
  }

  .page-subtitle{
    display:none;
  }

  .content{
    padding:14px;
  }

  .stats-grid{
    grid-template-columns:1fr;
    gap:12px;
  }

  .table-card{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  table{
    min-width:800px;
  }

  .btn{
    font-size:12px;
    padding:8px 12px;
  }

  .modal{
    width:0;
    max-width:0;
    max-height:90vh;
    overflow:auto;
  }

  .modal-footer{
    flex-direction:column;
  }

  .modal-footer .btn{
    width:100%;
  }

  .form-grid{
    grid-template-columns:1fr !important;
  }

  .settings-card-header{
    padding:14px;
  }

  .settings-card-body{
    padding:14px;
  }

  .status-update-box{
    flex-direction:column;
    align-items:stretch;
  }

  .status-update-box select{
    width:100%;
  }

  .sidebar-brand .brand-logo{
    width:50px;
    height:50px;
  }

  .brand-name{
    font-size:18px;
  }
}

/* Small Phones */
@media (max-width:480px){

  .sidebar{
    width:240px !important;
  }

  .nav-item{
    font-size:12px;
    padding:10px;
  }

  .topbar{
    padding:10px 12px;
  }

  .page-title{
    font-size:14px;
  }

  .btn{
    width:100%;
    justify-content:center;
  }

  .topbar-right{
    width:100%;
  }

  .settings-card-title{
    font-size:14px;
  }

  .settings-card-sub{
    font-size:11px;
  }

  .modal-title{
    font-size:16px;
  }

  .toast{
    left:10px;
    right:10px;
    width:auto;
    max-width:none;
  }
}



/* Mobile Login/Register Popup Fix */
@media (max-width: 768px){

  .auth-modal,
  .login-modal,
  .register-modal,
  .modal-content{
    width: calc(100% - 24px) !important;
    max-width: 380px !important;
    margin: 12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }

  .modal-body{
    padding: 20px 16px !important;
  }

  .modal-body input,
  .modal-body select,
  .modal-body textarea{
    width: 100% !important;
    box-sizing: border-box;
  }

  .modal-footer .btn,
  .auth-btn{
    width: 100% !important;
  }
}

@media (max-width:480px){

  .auth-modal,
  .login-modal,
  .register-modal,
  .modal-content{
    width: calc(100vw - 20px) !important;
    max-width: none !important;
    border-radius: 20px !important;
  }
}.mobile-menu{
  position: fixed;
  top: 72px;
  left: 0;
  width: 100%;
  max-width: 100vw;
  box-sizing: border-box;

  background: rgba(253,246,237,.98);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(201,107,58,.15);

  padding: 0;
  max-height: 0;
  overflow: hidden;
  z-index: 999;
}
.mobile-menu.open{max-height:400px;padding:16px 0 20px}
.mobile-menu a{display:block;padding:14px 24px;font-size:15px;font-weight:500;color:var(--ink-m);text-decoration:none;border-bottom:1px solid rgba(201,107,58,.08);transition:background .2s,color .2s}
.mobile-menu a:last-child{border-bottom:none}
.mobile-menu a:active,.mobile-menu a:hover{background:var(--cream2);color:var(--terra)}
.mobile-menu-foot{padding:16px 24px 0;display:flex;gap:12px}
.mm-cart-btn{flex:1;background:var(--choc);color:var(--cream);border:none;padding:13px;border-radius:14px;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;display:flex;align-items:center;justify-content:center;gap:8px}

/* Account popup */
.acc-wrap{position:relative}
#accPopup{display:none;position:absolute;top:calc(100% + 14px);right:0;width:340px;background:var(--wh);border:1px solid rgba(201,107,58,.2);border-radius:20px;box-shadow:0 24px 64px rgba(44,24,16,.18);overflow:hidden;z-index:500;animation:popIn .22s cubic-bezier(.34,1.56,.64,1);}
@keyframes popIn{from{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}
#accPopup.open{display:block}
.acc-tabs{display:flex;border-bottom:1px solid var(--cream3)}
.acc-tab{flex:1;padding:14px;font-size:13px;font-weight:600;color:var(--ink-l);background:none;border:none;cursor:pointer;font-family:'Outfit',sans-serif;transition:color .2s;position:relative;}
.acc-tab.active{color:var(--terra)}
.acc-tab.active::after{content:'';position:absolute;bottom:-1px;left:20%;right:20%;height:2px;background:var(--terra);border-radius:2px}
.acc-form{padding:24px}
.acc-form h3{font-family:'Cormorant Garamond',serif;font-size:21px;font-weight:600;color:var(--ink);margin-bottom:3px}
.acc-form p.sub{font-size:12px;color:var(--ink-l);margin-bottom:18px}
.fgroup{margin-bottom:14px}
.fgroup label{display:block;font-size:11px;font-weight:600;color:var(--ink-m);text-transform:uppercase;letter-spacing:.7px;margin-bottom:6px}
.fgroup input{width:100%;padding:10px 14px;border:1.5px solid var(--cream3);border-radius:10px;font-size:13px;font-family:'Outfit',sans-serif;color:var(--ink);background:var(--cream);transition:border .2s,box-shadow .2s;outline:none;}
.fgroup input:focus{border-color:var(--terra);box-shadow:0 0 0 3px rgba(201,107,58,.12)}
.fgroup .input-wrap{position:relative}
.fgroup .prefix{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--ink-l);pointer-events:none}
.fgroup input.has-prefix{padding-left:36px}
.ferr{font-size:11px;color:#D9534F;margin-top:4px;display:none}
.ferr.show{display:block}
.acc-submit{width:100%;padding:12px;background:linear-gradient(135deg,var(--terra),var(--terra-d));color:#fff;border:none;border-radius:11px;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .2s;margin-top:4px;display:flex;align-items:center;justify-content:center;gap:8px;}
.acc-submit:hover{filter:brightness(1.08);transform:translateY(-1px)}
.acc-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;display:none}
@keyframes spin{to{transform:rotate(360deg)}}
.acc-submit.loading .spin{display:block}
.acc-submit.loading .btn-txt{display:none}
.acc-logged{padding:22px 24px;display:none}
.acc-avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--terra),var(--gold));display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;font-weight:700;margin:0 auto 12px;font-family:'Cormorant Garamond',serif;}
.acc-logged h3{text-align:center;font-family:'Cormorant Garamond',serif;font-size:18px;color:var(--ink);margin-bottom:2px}
.acc-logged .mob-show{text-align:center;font-size:12px;color:var(--ink-l);margin-bottom:18px}
.acc-menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font-size:13px;font-weight:500;color:var(--ink-m);text-decoration:none;transition:background .2s}
.acc-menu a:hover{background:var(--cream);color:var(--terra)}
.acc-menu a .ico{font-size:16px;width:22px;text-align:center}
.acc-divider{height:1px;background:var(--cream3);margin:10px 0}
.acc-logout{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font-size:13px;font-weight:500;color:#D9534F;cursor:pointer;border:none;background:none;font-family:'Outfit',sans-serif;width:100%;transition:background .2s}
.acc-logout:hover{background:#FFF5F5}

/* ═══ TRACK MODAL ═══ */
.track-modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.6);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:20px;z-index:99999;}
.track-modal-bg.show{display:flex}
.track-modal{width:100%;max-width:720px;background:#fff;border-radius:30px;padding:32px;position:relative;animation:trackPop .25s ease;max-height:90vh;overflow-y:auto;}
@keyframes trackPop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
.track-close{position:absolute;top:18px;right:18px;width:38px;height:38px;border:none;border-radius:50%;background:#EFF6FF;color:#1D4ED8;cursor:pointer;font-size:16px;font-weight:bold;}
.track-modal h2{font-size:28px;margin-bottom:8px;color:#14213D;font-family:'Cormorant Garamond',serif}
.track-sub{color:#6B7280;margin-bottom:28px;font-size:14px}
.courier-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.courier-card{text-decoration:none;background:#F8FAFF;border:1px solid #E2E8F0;border-radius:22px;padding:18px;display:flex;align-items:center;gap:16px;transition:.25s ease;}
.courier-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(37,99,235,.12)}
.courier-icon{width:56px;height:56px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:26px;background:#DBEAFE;flex-shrink:0;}
.courier-card strong{display:block;color:#14213D;font-size:15px;margin-bottom:4px}
.courier-card span{color:#6B7280;font-size:12px}
.delhivery .courier-icon{background:#DBEAFE}.dtdc .courier-icon{background:#FEE2E2}.blue .courier-icon{background:#DCFCE7}.orange .courier-icon{background:#FFEDD5}.purple .courier-icon{background:#EDE9FE}.india .courier-icon{background:#FEF3C7}

/* ═══ ABOUT MODAL ═══ */
.about-modal-bg{position:fixed;inset:0;background:rgba(26,15,8,.65);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:16px;z-index:99999;}
.about-modal-bg.show{display:flex}
.about-modal{width:100%;max-width:580px;background:var(--cream);border-radius:28px;overflow:hidden;position:relative;box-shadow:0 32px 80px rgba(44,24,16,.35);animation:aboutPop .28s cubic-bezier(.34,1.56,.64,1);max-height:92vh;overflow-y:auto;}
@keyframes aboutPop{from{opacity:0;transform:scale(.9) translateY(16px)}to{opacity:1;transform:none}}
.am-header{background:var(--choc);padding:36px 36px 28px;position:relative;overflow:hidden;}
.am-ring{position:absolute;border-radius:50%;border:1px solid rgba(201,168,76,.15);pointer-events:none;}
.am-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:50%;background:rgba(253,246,237,.12);border:1px solid rgba(253,246,237,.2);color:rgba(253,246,237,.75);font-size:14px;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;transition:background .2s;}
.am-close:hover{background:rgba(253,246,237,.22)}
.am-logo-wrap{width:60px;height:60px;border-radius:18px;background:rgba(201,168,76,.18);border:1px solid rgba(201,168,76,.35);display:flex;align-items:center;justify-content:center;font-size:30px;margin-bottom:16px;position:relative;z-index:1;}
.am-header h2{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:700;color:var(--cream);letter-spacing:-.5px;margin-bottom:6px;position:relative;z-index:1;}
.am-header p{font-size:13px;color:rgba(253,246,237,.58);line-height:1.65;max-width:360px;font-weight:300;position:relative;z-index:1;}
.am-stats{display:flex;border-bottom:1px solid rgba(201,107,58,.15);}
.am-stat{flex:1;text-align:center;padding:14px 8px;border-right:1px solid rgba(201,107,58,.12);}
.am-stat:last-child{border-right:none}
.am-stat-num{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:700;color:var(--terra);}
.am-stat-lbl{font-size:10px;color:var(--ink-l);margin-top:2px;letter-spacing:.03em;font-weight:400;}
.am-body{padding:26px 32px 30px}
.am-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px}
.am-card{background:var(--wh);border:1px solid rgba(201,107,58,.12);border-radius:16px;padding:18px;transition:transform .25s,box-shadow .25s;}
.am-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(44,24,16,.1)}
.am-card-icon{width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:12px;}
.aci-terra{background:rgba(201,107,58,.12)}.aci-gold{background:rgba(201,168,76,.14)}.aci-sage{background:rgba(139,175,141,.16)}.aci-rose{background:rgba(232,160,160,.18)}
.am-card h3{font-size:13px;font-weight:600;color:var(--choc);margin-bottom:5px;}
.am-card p{font-size:12px;color:var(--ink-l);line-height:1.65;font-weight:300;}
.am-tagline{background:linear-gradient(135deg,rgba(201,107,58,.08),rgba(201,168,76,.1));border:1px solid rgba(201,168,76,.28);border-radius:14px;padding:14px 18px;margin-bottom:20px;display:flex;align-items:center;gap:12px;}
.am-tagline span.am-bow{font-size:22px;flex-shrink:0}
.am-tagline p{font-size:13px;color:var(--choc-m);line-height:1.55;font-weight:400;}
.am-tagline p strong{color:var(--terra);font-weight:600}
.am-cta{display:flex;gap:10px}
.am-btn{flex:1;padding:13px 10px;border-radius:13px;border:none;font-size:13px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .22s;letter-spacing:.02em;text-decoration:none;}
.am-btn-call{background:var(--choc);color:var(--cream)}
.am-btn-call:hover{background:var(--choc-m);transform:translateY(-2px);box-shadow:0 8px 22px rgba(44,24,16,.22)}
.am-btn-wa{background:#1FA855;color:#fff}
.am-btn-wa:hover{background:#188a44;transform:translateY(-2px);box-shadow:0 8px 22px rgba(31,168,85,.28)}

/* ═══ HERO ═══ */
.hero{position:relative;overflow:hidden;min-height:88vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:0 64px;gap:60px;}
.hero-bg{position:absolute;inset:0;background:linear-gradient(135deg,var(--hero-bg-start) 0%,var(--hero-bg-mid) 50%,var(--hero-bg-end) 100%);z-index:0;}
.hero-pattern{position:absolute;right:0;top:0;bottom:0;width:55%;background:radial-gradient(circle at 70% 30%,var(--hero-pattern-1) 0%,transparent 50%),radial-gradient(circle at 30% 80%,var(--hero-pattern-2) 0%,transparent 40%);z-index:0;}
.hero-ring{position:absolute;border-radius:50%;border:1px solid var(--hero-ring-border);pointer-events:none}
.hr1{width:600px;height:600px;right:-200px;top:-200px}.hr2{width:400px;height:400px;right:-50px;top:-50px}.hr3{width:200px;height:200px;right:100px;top:100px;background:rgba(201,168,76,.06)}
.hero-left{position:relative;z-index:1;animation:heroEnter .9s cubic-bezier(.4,0,.2,1) both}
@keyframes heroEnter{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
.hero-tag{display:inline-flex;align-items:center;gap:8px;background:var(--hero-tag-bg);border:1px solid var(--hero-tag-border);border-radius:100px;padding:6px 16px;font-size:12px;font-weight:600;color:var(--hero-tag-color);letter-spacing:.06em;text-transform:uppercase;margin-bottom:24px;}
.hero-tag::before{content:'';width:6px;height:6px;background:var(--accent);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.hero h1{font-family:'Cormorant Garamond',serif;font-size:68px;font-weight:700;line-height:1.02;letter-spacing:-2px;color:var(--text);margin-bottom:22px;}
.hero h1 em{font-style:italic;color:var(--accent);display:block}
.hero-sub{font-size:16px;color:var(--text-muted);line-height:1.8;max-width:420px;margin-bottom:36px;font-weight:300;}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap}
.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-color);border:none;padding:15px 36px;border-radius:50px;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:.04em;}
.btn-primary:hover{background:var(--btn-primary-hover);transform:translateY(-3px);box-shadow:0 16px 40px rgba(44,24,16,.25)}
.btn-secondary{background:var(--btn-secondary-bg);color:var(--btn-secondary-color);border:1.5px solid var(--btn-secondary-border);padding:15px 36px;border-radius:50px;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .25s;letter-spacing:.04em;}
.btn-secondary:hover{background:var(--btn-secondary-hover);border-color:var(--btn-secondary-color)}
.hero-trust{display:flex;gap:24px;margin-top:40px;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted)}
.trust-item span:first-child{font-size:18px}
.hero-right{position:relative;z-index:1;height:520px;animation:heroRightEnter 1s .2s cubic-bezier(.4,0,.2,1) both}
@keyframes heroRightEnter{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:40px;opacity:.92;filter:brightness(1.02);z-index:0;pointer-events:none;}
.float-card{position:absolute;background:var(--wh);border-radius:24px;padding:20px;box-shadow:var(--card-shadow);transition:transform .4s cubic-bezier(.4,0,.2,1);}
.float-card:hover{transform:translateY(-8px) !important}
.fc-main{width:240px;top:40px;left:50px;background:linear-gradient(145deg,var(--wh),var(--cream));border:1px solid rgba(201,107,58,.15);}
.fc-main .fc-ico{font-size:56px;text-align:center;margin-bottom:14px;display:block}
.fc-main .fc-name{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--choc);margin-bottom:4px}
.fc-main .fc-cat{font-size:11px;color:var(--terra);font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
.fc-main .fc-price{font-size:22px;font-weight:700;color:var(--choc)}
.fc-main .fc-price span{font-size:13px;color:var(--ink-l);font-weight:400;text-decoration:line-through;margin-left:6px}
.fc-tag{position:absolute;top:-10px;right:-10px;background:var(--terra);color:#fff;font-size:10px;font-weight:700;padding:4px 10px;border-radius:8px;letter-spacing:.05em;}
.fc-sm{width:160px;border:1px solid rgba(201,107,58,.1);}
.fc-sm .fc-ico-sm{font-size:32px;margin-bottom:8px;display:block}
.fc-sm .fc-name-sm{font-size:13px;font-weight:600;color:var(--choc);margin-bottom:2px}
.fc-sm .fc-p-sm{font-size:14px;font-weight:700;color:var(--terra)}
.fc2{bottom:80px;left:10px;animation:float1 4s ease-in-out infinite}
.fc3{top:10px;right:10px;animation:float2 5s ease-in-out infinite .5s}
.fc4{bottom:20px;right:30px;animation:float1 3.5s ease-in-out infinite 1s}
@keyframes float1{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes float2{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.fc-main{animation:float2 5s ease-in-out infinite}
.fc-rating{display:inline-flex;align-items:center;gap:5px;background:var(--cream);border:1px solid var(--cream3);border-radius:100px;padding:5px 12px;font-size:12px;font-weight:600;color:var(--choc);margin-top:10px;}
.delivery-pill{position:absolute;bottom:60px;left:160px;background:var(--choc);color:var(--cream);border-radius:100px;padding:10px 18px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:8px;box-shadow:0 8px 24px rgba(44,24,16,.3);animation:float1 4s 1.5s ease-in-out infinite;white-space:nowrap;}

/* ═══ STATS ═══ */
.stats{background:var(--choc);padding:28px 64px;display:flex;justify-content:center;gap:0;position:relative;overflow:hidden;width:100%;box-sizing:border-box;}
.stat-item{flex:1;max-width:200px;text-align:center;padding:0 32px;border-right:1px solid rgba(253,246,237,.08);position:relative;z-index:1;}
.stat-item:last-child{border-right:none}
.stat-num{font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:700;color:var(--gold-l);letter-spacing:-1px;}
.stat-lbl{font-size:12px;color:rgba(253,246,237,.55);margin-top:3px;letter-spacing:.04em}

/* ═══ SECTIONS ═══ */
.section-wrap{padding:72px 64px 0}
.sec-eyebrow{font-size:11px;font-weight:700;color:var(--terra);text-transform:uppercase;letter-spacing:.12em;margin-bottom:10px;display:flex;align-items:center;gap:10px;}
.sec-eyebrow::before{content:'';display:block;width:24px;height:1.5px;background:var(--terra)}
.sec-head{font-family:'Cormorant Garamond',serif;font-size:42px;font-weight:700;color:var(--choc);letter-spacing:-1px;margin-bottom:6px;line-height:1.1;}
.sec-sub{font-size:14px;color:var(--ink-l);margin-bottom:36px;font-weight:300}

/* ═══ CATEGORY PILLS ═══ */
.cats-wrap{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:48px}
.cat-pills{display:flex;gap:10px;flex-wrap:wrap}
.cat-pill{background:var(--wh);border:1.5px solid rgba(201,107,58,.2);border-radius:100px;padding:10px 22px;font-size:13px;font-weight:500;color:var(--ink-m);cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:8px;box-shadow:0 2px 8px rgba(44,24,16,.05);}



.cat-pill-icon {
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
}


.cat-pill:hover{border-color:var(--terra);color:var(--terra);transform:translateY(-2px);box-shadow:0 6px 18px rgba(201,107,58,.15)}
.cat-pill.active{background:var(--choc);color:var(--cream);border-color:var(--choc);box-shadow:0 6px 20px rgba(44,24,16,.22)}

/* ═══ PRODUCTS ═══ */
.products-section{padding:0 64px 80px}
.prod-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;}
.prod-count{font-size:13px;color:var(--ink-l)}
.sort-sel{border:1.5px solid rgba(201,107,58,.2);border-radius:10px;padding:9px 16px;font-size:13px;color:var(--ink-m);background:var(--wh);cursor:pointer;font-family:'Outfit',sans-serif;outline:none;transition:border .2s;}
.sort-sel:focus{border-color:var(--terra)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:28px;}
.empty-msg{grid-column:1/-1;text-align:center;padding:64px;color:var(--ink-l);font-size:15px}
.sk-card{background:var(--wh);border-radius:30px;overflow:hidden;border:1px solid rgba(201,107,58,.08);}
.sk-img{height:220px;background:linear-gradient(90deg,var(--cream2) 0%,var(--cream3) 45%,var(--cream2) 100%);background-size:600px 100%;animation:skShimmer 1.4s infinite;}
@keyframes skShimmer{0%{background-position:-600px 0}100%{background-position:600px 0}}
.sk-body{padding:20px}
.sk-line{height:12px;border-radius:6px;background:var(--cream2);margin-bottom:10px}
.sk-line.w80{width:80%}.sk-line.w60{width:60%}.sk-line.w40{width:40%}
.pcard{background:var(--wh);border-radius:32px;overflow:hidden;border:1px solid rgba(201,107,58,.08);cursor:pointer;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;box-shadow:0 18px 38px rgba(44,24,16,.08);position:relative;display:flex;flex-direction:column;}
.pcard:hover{transform:translateY(-10px);box-shadow:0 24px 50px rgba(44,24,16,.14);border-color:rgba(201,107,58,.22)}
.pimg{height:240px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.bg1{background:linear-gradient(145deg,#FDF0E8,#F5D8C0)}.bg2{background:linear-gradient(145deg,#FDE8EC,#F5C0C8)}.bg3{background:linear-gradient(145deg,#E8F5E8,#C0E8C0)}.bg4{background:linear-gradient(145deg,#FFFBEB,#F5E8C0)}.bg5{background:linear-gradient(145deg,#F0EBF8,#D8C5F0)}.bg6{background:linear-gradient(145deg,#FDE8E8,#F0C0C0)}
.pimg-emoji{font-size:72px;transition:transform .4s cubic-bezier(.34,1.56,.64,1);filter:drop-shadow(0 8px 16px rgba(0,0,0,.15))}
.pcard:hover .pimg-emoji{transform:scale(1.12) rotate(-4deg)}
.pimg-photo{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .5s ease}
.pcard:hover .pimg-photo{transform:scale(1.06)}
.ptag{position:absolute;top:14px;left:14px;font-size:10px;font-weight:700;padding:4px 10px;border-radius:8px;letter-spacing:.06em;color:#fff;z-index:1;}
.ptag.hot{background:#C84B31}.ptag.new{background:#3A6B9A}.ptag.sale{background:#C9A84C;color:var(--choc)}.ptag.best{background:var(--choc)}
.wish-btn{position:absolute;top:12px;right:12px;width:34px;height:34px;background:rgba(253,246,237,.9);border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;transition:all .25s;z-index:1;backdrop-filter:blur(8px);}
.wish-btn:hover{transform:scale(1.15);background:var(--wh)}
.pcard-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(44,24,16,.7) 0%,transparent 50%);opacity:0;transition:opacity .35s ease;display:flex;align-items:flex-end;padding:16px;pointer-events:none;}
.pcard:hover .pcard-overlay{opacity:1}
.overlay-add{background:var(--cream);color:var(--choc);border:none;border-radius:20px;padding:8px 18px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Outfit',sans-serif;pointer-events:all;letter-spacing:.03em;transition:all .2s;}
.overlay-add:hover{background:var(--gold-l)}
.pbody{padding:22px 22px 22px;display:flex;flex-direction:column;flex:1;}
.pcat{font-size:11px;font-weight:700;color:var(--terra);text-transform:uppercase;letter-spacing:.12em;margin-bottom:10px}
.pname{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:700;color:var(--choc);margin-bottom:8px;line-height:1.2}
.pdesc{font-size:13px;color:var(--ink-l);line-height:1.75;margin-bottom:16px;font-weight:300;min-height:56px}
.pstars{font-size:13px;color:var(--gold);margin-bottom:16px;display:flex;align-items:center;gap:6px}
.pstars-count{font-size:11px;color:var(--ink-l)}
.pfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}
.pprice{font-size:22px;font-weight:700;color:var(--choc)}
.pprice-old{font-size:12px;color:var(--ink-l);text-decoration:line-through;margin-left:8px;font-weight:400}
.add-btn{width:44px;height:44px;background:var(--choc);color:var(--cream);border:none;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:20px;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);flex-shrink:0;}
.add-btn:hover{background:var(--terra-d);transform:scale(1.06)}

/* ═══ PROMO ═══ */
.promo{margin:0 64px 72px;background:var(--choc);border-radius:28px;padding:56px 64px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;}
.promo-pattern{position:absolute;right:0;top:0;bottom:0;width:50%;background:radial-gradient(circle at 70% 50%,rgba(201,168,76,.2) 0%,transparent 60%),radial-gradient(circle at 30% 80%,rgba(201,107,58,.15) 0%,transparent 40%);}
.promo-deco{position:absolute;font-size:180px;right:180px;top:50%;transform:translateY(-50%);opacity:.07}
.promo-left{position:relative;z-index:1}
.promo-eyebrow{font-size:11px;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.12em;margin-bottom:12px}
.promo h2{font-family:'Cormorant Garamond',serif;font-size:42px;font-weight:700;color:var(--cream);letter-spacing:-1px;line-height:1.1;margin-bottom:14px;}
.promo p{font-size:15px;color:rgba(253,246,237,.7);line-height:1.7;max-width:420px;font-weight:300}
.promo-code{display:inline-block;background:rgba(201,168,76,.15);border:1.5px dashed rgba(201,168,76,.5);border-radius:12px;padding:10px 24px;font-size:22px;font-weight:700;letter-spacing:5px;color:var(--gold-l);margin-top:20px;}
.promo-right{position:relative;z-index:1}
.promo-btn{background:linear-gradient(135deg,var(--gold),var(--gold-l));color:var(--choc);border:none;padding:16px 40px;border-radius:50px;font-size:15px;font-weight:700;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .25s;letter-spacing:.04em;box-shadow:0 8px 24px rgba(201,168,76,.35);}
.promo-btn:hover{transform:scale(1.05) translateY(-2px);box-shadow:0 16px 40px rgba(201,168,76,.4)}
/* Replace the .upi-card background */
.upi-card {
  background: var(--surface-soft);
  border-color: var(--nav-border);
}
.upi-panel{margin:0 64px 60px;}
.upi-card{background:rgba(253,246,237,.95);border:1px solid rgba(201,107,58,.14);border-radius:28px;padding:30px;display:grid;gap:20px;box-shadow:0 18px 40px rgba(44,24,16,.08)}
.upi-grid{display:grid;grid-template-columns:minmax(240px,280px) 1fr;gap:24px;align-items:center}
.upi-qr-img{width:100%;border-radius:22px;border:1px solid rgba(201,107,58,.18);box-shadow:0 14px 30px rgba(44,24,16,.06);}
.upi-info-row{display:flex;justify-content:space-between;gap:12px;padding:18px 20px;border-radius:20px;background:#fff;box-shadow:0 8px 20px rgba(44,24,16,.05)}
.upi-info-row span{color:var(--ink4);font-size:13px}
.upi-info-row strong{font-size:16px;color:var(--ink);word-break:break-word;}
@media(max-width:960px){.upi-panel{margin:0 32px 48px}.upi-grid{grid-template-columns:1fr}.upi-info-row{flex-direction:column;align-items:flex-start}}

/* ═══ FOOTER ═══ */
footer{background:var(--choc);padding:64px 64px 36px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.footer-brand .fl{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:700;color:var(--cream);margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.footer-brand p{font-size:13px;color:rgba(253,246,237,.5);line-height:1.8;max-width:240px;font-weight:300}
.footer-col h4{font-size:11px;font-weight:700;color:rgba(253,246,237,.4);text-transform:uppercase;letter-spacing:.08em;margin-bottom:18px}
.footer-col a{display:block;font-size:13px;color:rgba(253,246,237,.6);text-decoration:none;margin-bottom:12px;transition:color .2s;font-weight:300}
.footer-col a:hover{color:var(--gold-l)}
.footer-bot{border-top:1px solid rgba(253,246,237,.08);padding-top:28px;display:flex;justify-content:space-between;align-items:center;}
.footer-bot p{font-size:12px;color:rgba(253,246,237,.35);font-weight:300}
.footer-socials{display:flex;gap:12px}
.soc-btn{width:34px;height:34px;border:1px solid rgba(253,246,237,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer;transition:all .2s;background:transparent;}
.soc-btn:hover{border-color:var(--gold);background:rgba(201,168,76,.1)}

/* ═══ PRODUCT MODAL ═══ */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(26,15,8,.6);backdrop-filter:blur(4px);z-index:10050;align-items:center;justify-content:center;padding:16px;}
.modal-bg.open{display:flex}



.modal{background:var(--wh);border-radius:28px;max-width:520px;width:100%;padding:36px;position:relative;animation:modalIn .3s cubic-bezier(.34,1.56,.64,1);max-height:90vh;overflow-y:auto;overflow-x:visible;}




@keyframes modalIn{from{opacity:0;transform:scale(.92) translateY(20px)}to{opacity:1;transform:none}}


.modal-close{position:sticky;top:0;float:right;margin-left:auto;margin-bottom:8px;background:var(--cream);border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:100;flex-shrink:0;}



.modal-close:hover{background:var(--cream3)}
.modal-img-wrap{height:200px;border-radius:18px;overflow:hidden;position:relative;margin-bottom:24px;background:var(--cream2);}
.modal-img-slider{display:flex;height:100%;width:100%;transition:transform .35s ease;touch-action:pan-y;}
.modal-img-slide{flex:0 0 100%;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.modal-img-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.modal-img-slide .modal-ico{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);font-size:72px;pointer-events:none;}
.modal-img-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--choc);border:none;cursor:pointer;transition:transform .2s,background .2s;z-index:2;}
.modal-img-nav:hover{transform:translateY(-50%) scale(1.05);background:rgba(255,255,255,.96);}
.modal-img-prev{left:14px;}
.modal-img-next{right:14px;}
.modal-img-dots{display:flex;gap:8px;justify-content:center;margin-bottom:18px;}
.modal-img-dot{width:10px;height:10px;border-radius:50%;background:rgba(26,15,8,.18);border:none;cursor:pointer;transition:transform .2s,background .2s;}
.modal-img-dot.active{background:var(--terra);transform:scale(1.2);}
.modal-cat{font-size:11px;font-weight:700;color:var(--terra);text-transform:uppercase;letter-spacing:.09em;margin-bottom:6px}
.modal h2{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:700;color:var(--choc);margin-bottom:8px;letter-spacing:-.5px}
.modal-desc{font-size:14px;color:var(--ink-m);line-height:1.7;margin-bottom:22px;font-weight:300}
.modal-price{font-size:32px;font-weight:700;color:var(--choc);margin-bottom:22px;font-family:'Cormorant Garamond',serif}
.modal-price s{font-size:18px;color:var(--ink-l);margin-left:10px;font-weight:400;font-family:'Outfit',sans-serif}
.qty-row{display:flex;align-items:center;gap:16px;margin-bottom:26px}
.qty-btn{background:var(--cream);border:1.5px solid var(--cream3);width:38px;height:38px;border-radius:12px;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.qty-btn:hover{background:var(--cream2)}
.qty-num{font-size:18px;font-weight:700;min-width:28px;text-align:center;color:var(--choc);font-family:'Cormorant Garamond',serif}
.stock-badge{font-size:12px;color:var(--sage);font-weight:600;display:flex;align-items:center;gap:5px}
.modal-add{background:var(--choc);color:var(--cream);border:none;width:100%;padding:15px;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .25s;letter-spacing:.04em;}
.modal-add:hover{background:var(--terra-d);transform:translateY(-2px);box-shadow:0 12px 30px rgba(44,24,16,.25)}

/* ═══ CART DRAWER ═══ */
.cart-overlay{position:fixed;inset:0;background:rgba(26,15,8,.5);backdrop-filter:blur(3px);z-index:900;display:none;}
.cart-overlay.open{display:block}
.cart-drawer{position:fixed;top:0;right:0;width:420px;max-width:100vw;height:100vh;background:var(--cream);z-index:901;display:flex;flex-direction:column;transform:translateX(110%);transition:transform .4s cubic-bezier(.4,0,.2,1);box-shadow:-12px 0 60px rgba(44,24,16,.2);}
.cart-drawer.open{transform:translateX(0)}
.cart-head{padding:24px 26px;border-bottom:1px solid rgba(201,107,58,.15);display:flex;align-items:center;justify-content:space-between;background:var(--wh);}
.cart-head h2{font-family:'Cormorant Garamond',serif;font-size:24px;color:var(--choc);font-weight:700}
.cart-close{background:var(--cream2);border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .2s;}
.cart-close:hover{background:var(--cream3)}
.cart-items{flex:1;overflow-y:auto;padding:20px 26px}
.cart-empty{text-align:center;padding:64px 0;color:var(--ink-l)}
.cart-empty span{font-size:52px;display:block;margin-bottom:14px}
.cart-empty p{font-size:14px}
.cart-item{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid rgba(201,107,58,.1);}
.cart-item:last-child{border-bottom:none}
.ci-img{width:60px;height:60px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;}
.ci-img.bg1{background:linear-gradient(145deg,#FDF0E8,#F5D8C0)}.ci-img.bg2{background:linear-gradient(145deg,#FDE8EC,#F5C0C8)}.ci-img.bg3{background:linear-gradient(145deg,#E8F5E8,#C0E8C0)}.ci-img.bg4{background:linear-gradient(145deg,#FFFBEB,#F5E8C0)}.ci-img.bg5{background:linear-gradient(145deg,#F0EBF8,#D8C5F0)}.ci-img.bg6{background:linear-gradient(145deg,#FDE8E8,#F0C0C0)}
.ci-info{flex:1}
.ci-name{font-size:14px;font-weight:600;color:var(--choc);margin-bottom:2px}
.ci-price{font-size:13px;color:var(--terra);font-weight:600}
.ci-row{display:flex;align-items:center;gap:8px;margin-top:10px}
.ci-qty{display:flex;align-items:center;gap:7px}
.cq-btn{width:26px;height:26px;border-radius:7px;border:1px solid rgba(201,107,58,.2);background:var(--wh);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.cq-btn:hover{background:var(--cream2)}
.cq-num{font-size:13px;font-weight:700;min-width:18px;text-align:center;color:var(--choc)}
.ci-del{background:none;border:none;cursor:pointer;font-size:16px;color:var(--ink-l);margin-left:auto;transition:color .2s}
.ci-del:hover{color:#C84B31}
.cart-foot{padding:22px 26px;border-top:1px solid rgba(201,107,58,.12);background:var(--wh)}
.cart-total{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.cart-total span{font-size:14px;color:var(--ink-m)}
.cart-total strong{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:700;color:var(--choc)}
.checkout-btn{width:100%;padding:15px;background:var(--choc);color:var(--cream);border:none;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .25s;letter-spacing:.04em;}
.checkout-btn:hover{background:var(--terra-d);transform:translateY(-1px);box-shadow:0 10px 28px rgba(44,24,16,.25)}
.checkout-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}

/* ═══ CHECKOUT ═══ */
#checkoutModal{max-width:500px}
#checkoutModal h2{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:700;color:var(--choc);margin-bottom:22px;letter-spacing:-.5px}
.co-field{margin-bottom:16px}
.co-field label{display:block;font-size:11px;font-weight:700;color:var(--ink-m);text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px}
.co-field input,.co-field select,.co-field textarea{width:100%;padding:11px 14px;border:1.5px solid var(--cream3);border-radius:11px;font-size:14px;font-family:'Outfit',sans-serif;color:var(--ink);background:var(--cream);outline:none;transition:border .2s,box-shadow .2s;}
.co-field input:focus,.co-field select:focus,.co-field textarea:focus{border-color:var(--terra);box-shadow:0 0 0 3px rgba(201,107,58,.1)}
.co-field textarea{min-height:72px;resize:vertical}
.co-field .ph-wrap{position:relative}
.co-field .ph-pre{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--ink-l);pointer-events:none}
.co-field input.ph-in{padding-left:36px}
.co-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.co-summary{background:var(--cream);border:1px solid rgba(201,107,58,.15);border-radius:14px;padding:16px;margin-bottom:18px;}
.co-summary-title{font-size:12px;font-weight:700;color:var(--ink-m);margin-bottom:12px;text-transform:uppercase;letter-spacing:.06em}
.co-item{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-m);margin-bottom:6px;font-weight:300}
.co-divider{height:1px;background:rgba(201,107,58,.15);margin:10px 0}
.co-total{display:flex;justify-content:space-between;font-size:16px;font-weight:700;color:var(--choc)}
.place-btn{width:100%;padding:15px;background:linear-gradient(135deg,var(--terra),var(--terra-d));color:#fff;border:none;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;margin-top:8px;transition:all .25s;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.04em;}
.place-btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(201,107,58,.35)}
.place-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.place-btn .spin{display:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}
.place-btn.loading .spin{display:block}
.place-btn.loading .btn-txt{display:none}
.co-err{font-size:12px;color:#C84B31;margin-bottom:10px;display:none}
.co-err.show{display:block}
#orderSuccess{text-align:center;padding:12px 0}
#orderSuccess .big{font-size:72px;margin-bottom:16px;animation:bounce .6s cubic-bezier(.34,1.56,.64,1)}
@keyframes bounce{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
#orderSuccess h2{font-family:'Cormorant Garamond',serif;font-size:28px;color:var(--choc);margin-bottom:8px}
#orderSuccess p{font-size:14px;color:var(--ink-m);line-height:1.75;margin-bottom:20px;font-weight:300}
.ok-btn{background:var(--choc);color:var(--cream);border:none;padding:13px 32px;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;transition:all .2s;letter-spacing:.04em;}
.ok-btn:hover{background:var(--terra-d)}

/* ═══ TOAST ═══ */
.toast{position:fixed;bottom:32px;right:32px;background:var(--choc);color:var(--cream);padding:14px 24px;border-radius:16px;font-size:14px;font-weight:500;opacity:0;transform:translateY(16px) scale(.95);transition:all .35s cubic-bezier(.34,1.56,.64,1);pointer-events:none;z-index:9999;display:flex;align-items:center;gap:10px;box-shadow:0 12px 32px rgba(44,24,16,.3);border:1px solid rgba(201,168,76,.2);}
.toast.show{opacity:1;transform:translateY(0) scale(1)}
.toast-icon{font-size:18px}

/* ═══ FLOAT BUTTONS ═══ */
.float-btn{position:fixed;right:22px;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;text-decoration:none;color:#fff;z-index:700;box-shadow:0 6px 20px rgba(44,24,16,.25);transition:transform .25s,box-shadow .25s;}
.float-btn:hover{transform:scale(1.1) translateY(-2px);box-shadow:0 12px 32px rgba(44,24,16,.35)}
.whatsapp{bottom:88px;background:#1FA855}
.backtop{bottom:22px;background:var(--choc)}

/* ═══════════════════════════════════
   MOBILE RESPONSIVE — 767px and below
═══════════════════════════════════ */


@media(max-width:767px){

  /* NAV */
.mobile-menu { top: 80px; } .prod-bar { flex-direction: column; align-items: flex-start; gap: 10px; }
  .sort-sel { width: 100%; }nav{padding:0 14px;height:80px}
.logo{font-size:22px}
.logo-img{height:70px !important;width:auto !important;max-width:200px !important;object-fit:contain !important;}
  .logo-mark{width:30px;height:30px;font-size:15px;border-radius:8px}
  .nav-links{display:none}
  .cart-btn .cart-label{display:none}
  .cart-btn{padding:8px 14px;border-radius:20px;font-size:13px}
  .ham-btn{display:flex}
  #checkoutModal { padding: 20px 16px; }
  .co-row { grid-template-columns: 1fr; }
  @media(max-width:767px){
  #accPopup {
    position: fixed;
    left: 12px;
    right: 12px;
    width: auto;
    top: 72px;
  }
}

#accPopup {
  top: 86px !important;
}


@media(max-width:767px){
  .cart-head::before {
    content: '';
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 4px;
    background: rgba(44,24,16,.15);
    border-radius: 2px;
  }
  .cart-head { position: relative; }
}


@media(max-width:767px){
  .about-modal-bg,
  .track-modal-bg { padding: 12px; }
}
  /* Account popup — full width on mobile */
  #accPopup{width:calc(100vw - 32px);right:-8px;border-radius:16px}

  /* HERO — single column */
  .hero{
    grid-template-columns:1fr;
    padding:40px 20px 48px;
    min-height:auto;
    text-align:center;
    gap:0;
  }
  .hero h1{font-size:40px;letter-spacing:-1px;margin-bottom:16px}
  .hero h1 em{display:inline}
  .hero-sub{font-size:14px;margin:0 auto 28px;max-width:100%}
  .hero-btns{justify-content:center;gap:10px}
  .btn-primary,.btn-secondary{padding:13px 24px;font-size:13px}
  .hero-trust{justify-content:center;gap:14px;margin-top:28px}
  .trust-item{font-size:11px}
  .trust-item span:first-child{font-size:15px}
  .hero-right{display:none}
  .hero-tag{font-size:10px;padding:5px 12px;margin-bottom:16px}

  /* STATS */
  .stats{padding:0;flex-wrap:wrap}
  .stat-item{flex:0 0 50%;max-width:50%;padding:16px 12px;border-bottom:1px solid rgba(253,246,237,.08)}
  .stat-item:nth-child(2n){border-right:none}
  .stat-item:nth-last-child(-n+2){border-bottom:none}
  .stat-num{font-size:26px}
  .stat-lbl{font-size:11px}

  /* SECTIONS */
  .section-wrap{padding:40px 16px 0}
  .sec-head{font-size:30px}

  /* CATEGORY PILLS — horizontal scroll */
  .cats-wrap{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:8px;
    margin-bottom:28px;
    gap:8px;
  }
  .cats-wrap::-webkit-scrollbar{display:none}
  .cat-pill{flex-shrink:0;padding:9px 16px;font-size:12px;white-space:nowrap}

  /* PRODUCTS */
  .products-section{padding:0 16px 48px}
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .pimg{height:150px}
  .pimg-emoji{font-size:52px}
  .pbody{padding:12px 14px 14px}
  .pname{font-size:16px}
  .pdesc{display:none}
  .pstars{margin-bottom:8px}
  .pprice{font-size:17px}
  .add-btn{width:32px;height:32px;font-size:17px}
  .prod-bar{flex-direction:column;align-items:flex-start;gap:10px}
  .sort-sel{width:100%}
  /* Overlay on touch — always show */
  .pcard-overlay{opacity:1;background:linear-gradient(to top,rgba(44,24,16,.6) 0%,transparent 40%)}

  /* PROMO */
  .promo{margin:0 16px 48px;padding:32px 24px;flex-direction:column;gap:20px;text-align:center;border-radius:20px}
  .promo h2{font-size:28px}
  .promo p{font-size:13px;max-width:100%}
  .promo-code{font-size:18px;letter-spacing:4px;padding:8px 18px}
  .promo-deco{display:none}
  .promo-btn{padding:14px 32px;font-size:14px;width:100%}

  /* FOOTER */
  footer{padding:40px 16px 24px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
  .footer-brand{grid-column:1/-1}
  .footer-brand .fl{font-size:22px}
  .footer-col h4{font-size:10px;margin-bottom:12px}
  .footer-col a{font-size:12px;margin-bottom:10px}
  .footer-bot{flex-direction:column;gap:16px;align-items:center;text-align:center}

  /* MODALS */
  .modal,.modal-bg{padding:12px}
  .modal{padding:24px 20px;border-radius:20px}
  .modal h2{font-size:22px}
  .modal-price{font-size:26px}
  .co-row{grid-template-columns:1fr}
  #checkoutModal h2{font-size:22px}

  /* TRACKING MODAL */
  .track-modal{padding:24px 18px;border-radius:20px}
  .track-modal h2{font-size:22px}
  .courier-grid{grid-template-columns:1fr}
  .courier-card{padding:14px}
  .courier-icon{width:44px;height:44px;font-size:20px;border-radius:12px}

  /* ABOUT MODAL */
  .about-modal{border-radius:20px}
  .am-header{padding:28px 20px 22px}
  .am-header h2{font-size:20px}
  .am-body{padding:18px 16px 20px}
  .am-grid{grid-template-columns:1fr}
  .am-stat-num{font-size:17px}
  .am-stat-lbl{font-size:9px}
  .am-card{padding:14px}

  /* CART DRAWER */
  .cart-drawer{width:100vw;border-radius:24px 24px 0 0;top:auto;bottom:0;height:85vh;transform:translateY(110%)}
  .cart-drawer.open{transform:translateY(0)}
  .cart-head{padding:18px 20px}
  .cart-items{padding:16px 20px}
  .cart-foot{padding:16px 20px}
  .cart-total strong{font-size:24px}

  /* FLOAT BUTTONS */
  .float-btn{width:46px;height:46px;font-size:19px;right:14px}
  .whatsapp{bottom:74px}
  .backtop{bottom:18px}

  /* TOAST */
  .toast{bottom:16px;right:16px;left:16px;border-radius:12px;font-size:13px}

  .lock-overlay{
    position:fixed;inset:0;z-index:10050;
    display:none;align-items:center;justify-content:center;
    background:rgba(15,23,42,.96);
    padding:24px;
    backdrop-filter: blur(8px);
  }
  .lock-overlay.show{display:flex}
  body.site-locked{overflow:hidden}
  .lock-panel{
    max-width:520px;width:100%;background:#0f172a;border-radius:24px;
    box-shadow:0 30px 80px rgba(0,0,0,.45);padding:32px;
    text-align:center;
  }
  .lock-panel h2{font-size:28px;margin-bottom:14px;color:#f8fafc}
  .lock-panel p{font-size:16px;line-height:1.8;margin-bottom:24px;color:#cbd5e1}
  .lock-panel button{background:#2563eb;color:#fff;border:none;border-radius:14px;padding:12px 24px;font-size:15px;cursor:pointer;transition:transform .2s}
  .lock-panel button:hover{transform:translateY(-1px)}
}

/* ═══════════════════════════════════
   TABLET — 768px to 1024px
═══════════════════════════════════ */
@media(min-width:768px) and (max-width:1024px){
  nav{padding:0 28px}
  .nav-links{gap:20px}
  .hero{padding:48px 28px;gap:32px;min-height:auto}
  .hero h1{font-size:48px}
  .hero-right{height:400px}
  .fc-main{width:200px;left:20px;top:20px}
  .fc2{left:0;bottom:40px}
  .fc3{top:0;right:0}
  .fc4{bottom:10px;right:10px}
  .delivery-pill{left:130px;bottom:50px;font-size:11px;padding:8px 14px}
  .section-wrap{padding:52px 28px 0}
  .products-section{padding:0 28px 60px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
  .promo{margin:0 28px 60px;padding:40px 36px}
  .promo h2{font-size:32px}
  footer{padding:48px 28px 28px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
  .footer-brand{grid-column:1/-1}
  .stats{padding:20px 28px}
  .stat-item{padding:0 16px}
  .stat-num{font-size:26px}
  .ham-btn{display:none}
}

/* ═══════════════════════════════════
   SMALL MOBILE — below 400px
═══════════════════════════════════ */
@media(max-width:399px){
  .hero h1{font-size:32px}
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .pimg{height:200px}
  .pimg-emoji{font-size:72px}
  .pdesc{display:block}
  .promo h2{font-size:24px}
  .am-stats{flex-wrap:wrap}
  .am-stat{flex:0 0 50%;border-bottom:1px solid rgba(201,107,58,.12)}
  .am-stat:nth-child(2n){border-right:none}
}



/* ── LOGO CIRCLE - FINAL FIX ── */
.logo-circle {
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.logo-circle .logo-img {
  width: 60px !important;
  height: 60px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
}

/* Alt theme — subtle pink glow */
[data-theme='alt'] .logo-circle {
  box-shadow: 0 0 0 2px rgba(255,75,139,0.35) !important;
}

/* Mobile */
@media (max-width: 767px) {
  .logo-circle {
    width: 46px !important;
    height: 46px !important;
  }
  .logo-circle .logo-img {
    width: 46px !important;
    height: 46px !important;
  }
}
.logo-circle .logo-img {
  height: 44px !important;
  width: 44px !important;
  object-fit: contain;
  border-radius: 0;
}

/* 4×4 Photo frame box on hero card */
.fc-frame-box {
  width: 100%;
  aspect-ratio: 1 / 1;
  border: 3px solid rgba(44,24,16,0.18);
  border-radius: 10px;
  margin-bottom: 12px;
  overflow: hidden;
  background: #f5ead8;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-shadow: inset 0 0 0 4px rgba(201,107,58,0.12);
}
.fc-frame-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.fc-frame-placeholder {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px;
  font-weight: 600;
  color: rgba(44,24,16,0.3);
  letter-spacing: 2px;
}

/* Small cards — no emoji gap */
.fc-sm { padding: 14px 16px; }


.pimg-emoji { display: none !important; }


@media (max-width: 768px) {
    .pimg-emoji {
        display: none !important;
    }
}
/* Fix close button on mobile */
@media (max-width: 768px) {
  .modal-close {
    position: sticky !important;
    top: 0px !important;
    right: 0px !important;
    float: right !important;
    z-index: 9999 !important;
    width: 36px !important;
    height: 36px !important;
    font-size: 18px !important;
    background: rgba(255,255,255,0.95) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2) !important;
    margin-bottom: 8px !important;
  }
}


/* Fixed close button - always visible */
.modal-close-fixed {
  display: none;
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 99999;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: none;
  background: #fff;
  font-size: 18px;
  cursor: pointer;
  box-shadow: 0 2px 12px rgba(0,0,0,0.25);
  align-items: center;
  justify-content: center;
}

.modal-bg.open .modal-close-fixed {
  display: flex;
}

/* Hide old close button inside modal on mobile */
@media (max-width: 768px) {
  .modal > .modal-close {
    display: none !important;
  }
  .modal-close-fixed {
    display: none;
  }
  .modal-bg.open .modal-close-fixed {
    display: flex;
  }
  /* Remove emoji from Add to Cart button */
  .modal-add {
    font-size: 15px;
  }
  /* Hide product card emojis */
  .pimg-emoji {
    display: none !important;
  }
}

/* ── FINAL CLOSE BUTTON FIX ── */
.modal-bg {
  position: fixed !important;
}

.modal-close {
  position: fixed !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 999999 !important;
  width: 42px !important;
  height: 42px !important;
  background: white !important;
  border: 2px solid #ccc !important;
  border-radius: 50% !important;
  font-size: 20px !important;
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4) !important;
  color: #2C1810 !important;
}

.modal-bg.open .modal-close {
  display: flex !important;
}

.modal-ico {
  display: none !important;
}

/* ── FINAL CLOSE BUTTON FIX ── */
.modal-bg {
  position: fixed !important;
}

.modal-close {
  position: fixed !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 999999 !important;
  width: 42px !important;
  height: 42px !important;
  background: white !important;
  border: 2px solid #ccc !important;
  border-radius: 50% !important;
  font-size: 20px !important;
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4) !important;
  color: #2C1810 !important;
}

.modal-bg.open .modal-close {
  display: flex !important;
}

.modal-ico {
  display: none !important;
}


/* ── CLOSE BUTTON - FINAL ── */
.modal-close {
  position: fixed !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 999999 !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  background: #fff !important;
  border: 2px solid #ddd !important;
  border-radius: 50% !important;
  font-size: 18px !important;
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
  color: #2C1810 !important;
  padding: 0 !important;
  line-height: 1 !important;
  float: none !important;
  margin: 0 !important;
}

.modal-bg.open .modal-close {
  display: flex !important;
}

.modal-ico {
  display: none !important;
}

/* Fix category pill icon - perfect circle */
.cat-pill-icon {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  display: block !important;
}

/* Fix category pill itself - consistent size on mobile */
.cat-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  height: 40px !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
}

@media (max-width: 767px) {
  .cat-pill {
    height: 38px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }

  .cat-pill-icon {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
  }
}

/* All pills same shape */
.cat-pill {
  border-radius: 100px !important;
  height: 42px !important;
  padding: 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}

.cat-pill.active {
  border-radius: 100px !important;
}

@media (max-width: 767px) {
  .cat-pill {
    border-radius: 100px !important;
    height: 38px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }
}

/* ── CATEGORY PILLS FINAL FIX ── */
.cat-pill,
.cat-pill.active {
  border-radius: 100px !important;
  height: 40px !important;
  padding: 0 18px !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
}
/* ── CATEGORY PILLS ONE TRUE FIX ── */
.cat-pill,
.cat-pill.active {
  border-radius: 100px !important;
  height: 38px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  width: auto !important;
  min-width: unset !important;
  max-width: unset !important;
}

.cat-pill img,
.cat-pill img.cat-pill-icon {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  aspect-ratio: 1 !important;
}
/* Fix active pill shape - no transform on touch */
.cat-pill,
.cat-pill.active {
  border-radius: 100px !important;
  height: 40px !important;
  padding: 0 18px !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  width: auto !important;
  min-width: unset !important;
  max-width: unset !important;
  transform: none !important;        /* ADD THIS */
  -webkit-transform: none !important; /* ADD THIS */
}

/* Only allow hover transform on real hover devices */
@media (hover: hover) {
  .cat-pill:hover {
    transform: translateY(-2px) !important;
  }
}

@media (max-width: 767px) {
  .cat-pill,
  .cat-pill.active {
    height: 38px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
    transform: none !important;
  }
}

/* ── LOGO SIZE FIX ── */

/* Desktop */
.logo-img {
  height: 76px !important;
  width: auto !important;
  max-width: 220px !important;
  object-fit: contain !important;
  display: block !important;
}
/* ── LOGO CIRCLE FIX ── */
.logo-circle {
  width: 70px !important;
  height: 70px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 2px solid rgba(255,255,255,0.25) !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.logo-circle .logo-img {
  height: 64px !important;
  width: 64px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
}

/* Nav height to fit bigger logo */
nav {
  height: 90px !important;
}

/* Mobile */
@media (max-width: 767px) {
  .logo-circle {
    width: 50px !important;
    height: 50px !important;
  }

  .logo-circle .logo-img {
    height: 50px !important;
    width: 50px !important;
  }

  nav {
    height: 76px !important;
  }
}
.logo-circle {
  background: transparent !important;
  border: 2px solid rgba(255, 75, 139, 0.5) !important;
  box-shadow: 0 0 12px rgba(255, 75, 139, 0.2) !important;
}



/* Perfect 4×4 square image area */
.pimg {
  height: 200px !important;
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}

.pimg-photo {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Mobile */

@media (max-width: 767px) {
  .pimg {
    height: 170px !important;
    aspect-ratio: 1 / 1 !important;
  }
}

/* Small phones */
@media (max-width: 400px) {
  .pimg {
    height: 150px !important;
    aspect-ratio: 1 / 1 !important;
  }
}

.pimg {
  height: 180px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 12px 12px 0 0 !important;
}

/* Force true square image */
.pimg {
  width: 100% !important;
  height: 0 !important;
  padding-bottom: 100% !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 16px 16px 0 0 !important;
}

.pimg-photo {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Fix tag and wish button position after padding trick */
.ptag {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  z-index: 2 !important;
}

.wish-btn {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 2 !important;
}

.pcard-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
}


@media (max-width: 767px) {

  /* Square image */
  .pimg {
    width: 100% !important;
    height: 0 !important;
    padding-bottom: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    border-radius: 16px 16px 0 0 !important;
  }

  .pimg-photo {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  /* Hide description on mobile */
  .pdesc {
    display: none !important;
  }

  /* Compact card body */
  .pbody {
    padding: 10px 10px 12px !important;
  }

  /* Category label */
  .pcat {
    font-size: 10px !important;
    margin-bottom: 4px !important;
  }

  /* Product name */
  .pname {
    font-size: 13px !important;
    margin-bottom: 6px !important;
    line-height: 1.3 !important;
  }

  /* Stars */
  .pstars {
    font-size: 11px !important;
    margin-bottom: 8px !important;
  }

  .pstars-count {
    font-size: 10px !important;
  }

  /* Price row */
  .pfoot {
    margin-top: 6px !important;
  }

  .pprice {
    font-size: 15px !important;
  }

  .pprice-old {
    font-size: 11px !important;
  }

  /* Add button */
  .add-btn {
    width: 32px !important;
    height: 32px !important;
    font-size: 16px !important;
    border-radius: 10px !important;
    flex-shrink: 0 !important;
  }

  /* Grid gap */
  .grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  /* Card border radius */
  .pcard {
    border-radius: 18px !important;
  }
}


/* ── MODAL NAV ARROWS - DARK THEME FIX ── */
[data-theme='alt'] .modal-img-nav {
  background: rgba(47, 15, 73, 0.9) !important;
  color: #FF4B8B !important;
  border: 1px solid rgba(255, 75, 139, 0.35) !important;
  backdrop-filter: blur(8px) !important;
}

[data-theme='alt'] .modal-img-nav:hover {
  background: rgba(255, 75, 139, 0.25) !important;
  border-color: #FF4B8B !important;
  color: #fff !important;
}

/* ── CLOSE BUTTON - VISIBLE ON DESKTOP ── */
.modal-close {
  position: fixed !important;
  top: 20px !important;
  right: 20px !important;
  z-index: 999999 !important;
  width: 42px !important;
  height: 42px !important;
  background: #fff !important;
  border: 2px solid #ddd !important;
  border-radius: 50% !important;
  font-size: 18px !important;
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
  color: #2C1810 !important;
}

.modal-bg.open .modal-close {
  display: flex !important;
}

/* Dark theme close button */
[data-theme='alt'] .modal-close {
  background: #2F0F49 !important;
  border-color: rgba(255, 75, 139, 0.4) !important;
  color: #F8F7FF !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.5) !important;
}

[data-theme='alt'] .modal-close:hover {
  background: #FF4B8B !important;
  border-color: #FF4B8B !important;
  color: #fff !important;
}

/* Light theme close button */
[data-theme='default'] .modal-close,
:root:not([data-theme='alt']) .modal-close {
  background: #fff !important;
  border-color: #ddd !important;
  color: #2C1810 !important;
}

/* ── MODAL ARROWS - FORCE VISIBLE ON MOBILE ── */
@media (max-width: 767px) {
  .modal-img-nav {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    width: 32px !important;
    height: 32px !important;
    font-size: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 999 !important;
  }

  .modal-img-prev {
    left: 8px !important;
  }

  .modal-img-next {
    right: 8px !important;
  }

  /* Dark theme arrows on mobile */
  [data-theme='alt'] .modal-img-nav {
    background: rgba(47, 15, 73, 0.92) !important;
    color: #FF4B8B !important;
    border: 1px solid rgba(255, 75, 139, 0.4) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
  }

  [data-theme='alt'] .modal-img-nav:hover,
  [data-theme='alt'] .modal-img-nav:active {
    background: #FF4B8B !important;
    color: #fff !important;
  }

  /* Light theme arrows on mobile */
  .modal-img-nav {
    background: rgba(255,255,255,0.92) !important;
    color: #2C1810 !important;
    border: 1px solid rgba(44,24,16,0.15) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
  }
}

.cursor {
  display: none !important;
}



/* ── FOOTER MOBILE FIX ── */
@media (max-width: 767px) {
  footer {
    padding: 36px 16px 24px !important;
  }

  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px 16px !important;
    margin-bottom: 32px !important;
  }

  /* Brand spans full width */
  .footer-brand {
    grid-column: 1 / -1 !important;
    margin-bottom: 4px !important;
  }

  /* Shop, Help, Company — 2 per row, then last alone */
  .footer-col {
    min-width: 0 !important;
  }

  .footer-col h4 {
    font-size: 10px !important;
    margin-bottom: 10px !important;
    letter-spacing: 0.08em !important;
  }

  .footer-col a {
    font-size: 13px !important;
    margin-bottom: 9px !important;
    display: block !important;
  }

  /* Social buttons row */
  .footer-social {
    display: flex !important;
    gap: 10px !important;
    margin-top: 14px !important;
    flex-wrap: wrap !important;
  }

  .social-btn {
    padding: 9px 14px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
    flex: 1 !important;
    text-align: center !important;
    justify-content: center !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
  }

  /* Footer bottom */
  .footer-bot {
    flex-direction: column !important;
    gap: 12px !important;
    align-items: flex-start !important;
    padding-top: 20px !important;
  }

  .footer-bot p {
    font-size: 11px !important;
  }
}

/* ST Courier */
.stcourier .courier-icon { background: rgba(37,99,235,0.12); }
[data-theme='alt'] .stcourier .courier-icon { background: rgba(99,179,237,0.15); }

/* Professional Courier */
.procourier .courier-icon { background: rgba(16,185,129,0.12); }
[data-theme='alt'] .procourier .courier-icon { background: rgba(16,185,129,0.15); }



.nav-right {
  display: flex !important;
  align-items: center;
  gap: 6px;
}

.nav-right .nav-icon,
.nav-right .cart-btn {
  display: flex !important;
}


/* Find your .cart-btn style and replace/update it */
.cart-btn {
  background: transparent !important;
  border: 1.5px solid rgba(255,255,255,0.25) !important;
  border-radius: 50% !important;
  width: 38px !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  color: inherit !important;
}

.cart-btn:hover {
  border-color: rgba(255,255,255,0.6) !important;
  background: rgba(255,255,255,0.08) !important;
}



/* ── MODAL IMAGE DOTS - VISIBLE FIX ── */
.modal-img-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.35) !important;
  border: none !important;
  cursor: pointer !important;
  transition: all .2s !important;
  padding: 0 !important;
}

.modal-img-dot.active {
  background: var(--terra) !important;
  transform: scale(1.3) !important;
  box-shadow: 0 0 6px rgba(201,107,58,.5) !important;
}

[data-theme='alt'] .modal-img-dot {
  background: rgba(255,255,255,0.25) !important;
}

[data-theme='alt'] .modal-img-dot.active {
  background: #FF4B8B !important;
  box-shadow: 0 0 6px rgba(255,75,139,.5) !important;
}

.modal-img-dots {
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  padding: 8px 0 4px !important;
}


/* ── FORCE HAMBURGER ON MOBILE ── */
@media (max-width: 767px) {
  .ham-btn {
    display: flex !important;
    order: -1;
  }
}

/* ══════════════════════════════
   MOBILE SIDEBAR - ONE TRUE VERSION
══════════════════════════════ */
.ham-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: transparent;
  border: 1.5px solid rgba(201,107,58,.3);
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.ham-btn span {
  display: block;
  width: 16px;
  height: 2px;
  background: var(--choc);
  border-radius: 2px;
  transition: all .3s;
}
[data-theme='alt'] .ham-btn { border-color: rgba(255,75,139,.35); }
[data-theme='alt'] .ham-btn span { background: #F8F7FF; }
.ham-btn.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.ham-btn.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.ham-btn.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  z-index: 1100;
}
.sidebar-overlay.open { display: block; }

.mobile-sidebar {
  position: fixed;
  top: 0; left: 0;
  width: 280px;
  height: 100vh;
  background: #FDF6ED;
  z-index: 1200;
  display: flex;
  flex-direction: column;
  transform: translateX(-110%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  box-shadow: 8px 0 40px rgba(44,24,16,.2);
  overflow-y: auto;
}
.mobile-sidebar.open { transform: translateX(0); }
[data-theme='alt'] .mobile-sidebar {
  background: #1A0B2E;
  box-shadow: 8px 0 40px rgba(0,0,0,.5);
}

.msb-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(201,107,58,.15);
  background: rgba(201,107,58,.06);
  flex-shrink: 0;
}
[data-theme='alt'] .msb-head {
  background: rgba(0,0,0,.2);
  border-bottom-color: rgba(255,75,139,.2);
}

.msb-brand {
  font-family: 'Cormorant Garamond', serif;
  font-size: 17px;
  font-weight: 700;
  color: #2C1810;
  flex: 1;
}
[data-theme='alt'] .msb-brand { color: #F8F7FF; }

.msb-close {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(201,107,58,.25);
  background: var(--cream2);
  color: var(--choc);
  font-size: 13px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .2s;
}
[data-theme='alt'] .msb-close {
  background: #2F0F49;
  border-color: rgba(255,75,139,.3);
  color: #FF83C1;
}
.msb-close:hover { background: var(--terra); color: #fff; }

.msb-links {
  flex: 1;
  display: block;
  padding: 8px 0;
  overflow-y: auto;
}

.msb-links a {
  display: block !important;
  padding: 14px 20px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #5C3D2E !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(201,107,58,.08) !important;
  transition: background .15s, color .15s !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  width: 100% !important;
}
.msb-links a:last-child { border-bottom: none !important; }
.msb-links a:active { background: #F5EAD8 !important; color: #C96B3A !important; }

[data-theme='alt'] .msb-links a {
  color: #C7B8E9 !important;
  border-bottom-color: rgba(255,75,139,.08) !important;
}
[data-theme='alt'] .msb-links a:active {
  background: rgba(255,75,139,.1) !important;
  color: #FF83C1 !important;
}

.msb-foot {
  padding: 16px 18px;
  border-top: 1px solid rgba(201,107,58,.12);
  flex-shrink: 0;
}
[data-theme='alt'] .msb-foot { border-top-color: rgba(255,75,139,.12); }

.msb-wa {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px;
  background: #1FA855;
  color: #fff;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  font-family: 'Outfit', sans-serif;
}

@media (max-width: 767px) {
  .ham-btn { display: flex !important; }
  .nav-links { display: none !important; }
}
@media (min-width: 768px) {
  .mobile-sidebar { display: none !important; }
  .sidebar-overlay { display: none !important; }
}


/* ── NAV ICON SVG COLORS ── */
.nav-icon svg {
  stroke: var(--ink-m);
  transition: stroke .2s;
}
.nav-icon:hover svg {
  stroke: var(--terra);
}
[data-theme='alt'] .nav-icon svg {
  stroke: #C7B8E9;
}
[data-theme='alt'] .nav-icon:hover svg {
  stroke: #FF83C1;
}

/* Cart btn special */
.cart-btn svg {
  stroke: var(--choc) !important;
}
[data-theme='alt'] .cart-btn svg {
  stroke: #1B0A2A !important;
}
[data-theme='alt'] .cart-btn:hover svg {
  stroke: #fff !important;
}

/* Hide old emoji theme icon when SVG is present */
#themeBtn svg { display: block; }



/* ── MOBILE NAV: keep only hamburger, search, cart ── */
@media (max-width: 767px) {

  /* Hide theme toggle */
  .theme-toggle,
  #themeBtn {
    display: none !important;
  }


  /* Hide wishlist button */
  .nav-right > button:has(#wc) {
    display: none !important;
  }

  /* Keep only these 3 visible */
  .ham-btn,
  .search-icon,
  .cart-btn {
    display: flex !important;
  }


}

@media (max-width: 767px) {
  .nav-right {
    gap: 4px !important;
    flex-shrink: 0 !important;
    overflow: visible !important;
  }

  .nav-icon,
  .cart-btn,
  .acc-wrap,
  .ham-btn {
    flex-shrink: 0 !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
  }

  nav {
    padding: 0 10px !important;
  }
}

@media (max-width: 767px) {

  /* Nav layout */
  nav {
    padding: 0 10px !important;
    height: 64px !important;
  }

  /* Nav right — fit everything */
  .nav-right {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex-shrink: 0 !important;
  }

  /* All icons same small size */
  .nav-icon,
  .ham-btn,
  .cart-btn,
  .acc-wrap > button {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    flex-shrink: 0 !important;
  }

  /* Hide these on mobile */
  #themeBtn,
  .theme-toggle,
  .wishlist-btn,
  .nav-right > button:has(#wc) {
    display: none !important;
  }

  /* Show these on mobile */
  .ham-btn,
  .search-icon,
  .acc-wrap,
  .cart-btn {
    display: flex !important;
  }

  /* Logo */
  .logo-circle {
    width: 44px !important;
    height: 44px !important;
  }
  .logo-circle .logo-img {
    width: 44px !important;
    height: 44px !important;
  }
}

@media (max-width: 767px) {
  nav {
    padding: 0 10px !important;
    overflow: visible !important;
  }

  .nav-right {
    gap: 2px !important;
    padding-right: 4px !important;
  }

  .nav-icon,
  .ham-btn,
  .cart-btn,
  .acc-wrap > button {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
  }
}


.cart-btn{
    position: relative;
    overflow: visible;
}

.cbadge{
    position: absolute;
    top: -6px;
    right: -6px;

    min-width: 18px;
    height: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0 4px;
    border-radius: 999px;

    background: #f5b942;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
}
.product-img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:inherit;
}


/* Cart button - visible in both themes */
.cart-btn {
  background: transparent !important;
  border: 1.5px solid var(--nav-icon-border) !important;
  border-radius: 50% !important;
  width: 38px !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
}

.cart-btn svg {
  stroke: var(--ink-m) !important;
}

.cart-btn:hover svg {
  stroke: var(--terra) !important;
}

[data-theme='alt'] .cart-btn {
  border-color: rgba(255,75,139,.3) !important;
}

[data-theme='alt'] .cart-btn svg {
  stroke: #C7B8E9 !important;
}

[data-theme='alt'] .cart-btn:hover svg {
  stroke: #FF83C1 !important;
}

/* ── MODAL IMAGE DOTS - VISIBLE FIX ── */
.modal-img-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: rgba(44, 24, 16, 0.25) !important;  /* darker in light mode */
  border: none !important;
  cursor: pointer !important;
  transition: all .2s !important;
  padding: 0 !important;
}

.modal-img-dot.active {
  background: var(--terra) !important;
  transform: scale(1.3) !important;
  box-shadow: 0 0 6px rgba(201,107,58,.5) !important;
}

[data-theme='alt'] .modal-img-dot {
  background: rgba(255,255,255,0.3) !important;
}

[data-theme='alt'] .modal-img-dot.active {
  background: #FF4B8B !important;
  box-shadow: 0 0 6px rgba(255,75,139,.5) !important;
}


/* ── DARK THEME PRODUCT CARD TEXT FIX ── */
[data-theme='alt'] .pcard {
  background: #1E0A30 !important;
}

[data-theme='alt'] .pcat {
  color: #FF83C1 !important;
}

[data-theme='alt'] .pname {
  color: #F8F7FF !important;
}

[data-theme='alt'] .pdesc {
  color: #B8A7D2 !important;
}

[data-theme='alt'] .pprice {
  color: #F8F7FF !important;
}

[data-theme='alt'] .pprice-old {
  color: #B8A7D2 !important;
}

[data-theme='alt'] .pstars {
  color: #FFC048 !important;
}

[data-theme='alt'] .pstars-count {
  color: #B8A7D2 !important;
}

[data-theme='alt'] .pbody {
  background: #1E0A30 !important;
  color: #F8F7FF !important;
}

/* Tag badges */
[data-theme='alt'] .ptag.best,
[data-theme='alt'] .ptag.hot {
  background: #FF4B8B !important;
  color: #fff !important;
}

[data-theme='alt'] .ptag.new {
  background: #6A3DEA !important;
  color: #fff !important;
}

[data-theme='alt'] .ptag.sale {
  background: #FFC048 !important;
  color: #1B0A2A !important;
}

/* Wishlist button */
[data-theme='alt'] .wish-btn {
  background: rgba(30,10,48,0.85) !important;
  color: #FF83C1 !important;
}



/* ── MODAL IMAGE - SQUARE 1:1 LIKE PRODUCT CARDS ── */
.modal-img-wrap {
  width: 100% !important;
  height: 0 !important;
  padding-bottom: 100% !important;
  position: relative !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  margin-bottom: 20px !important;
}

.modal-img-slider {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  transition: transform .35s ease !important;
}

.modal-img-slide {
  flex: 0 0 100% !important;
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

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

/* Nav arrows - reposition for padding-bottom trick */
.modal-img-nav {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 10 !important;
}

.modal-img-prev { left: 12px !important; }
.modal-img-next { right: 12px !important; }


/* ── MODAL CLOSE BUTTON - OUTSIDE TOP RIGHT ── */
#modalBg .modal {
  position: relative !important;
  overflow: visible !important;
  padding-top: 20px !important;
}

#modalBg .modal-close,
.modal-close-fixed {
  position: fixed !important;
  top: 16px !important;
  right: 16px !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: #fff !important;
  border: 2px solid #ddd !important;
  color: #2C1810 !important;
  font-size: 16px !important;
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.35) !important;
  z-index: 999999 !important;
}

#modalBg.open .modal-close,
#modalBg.open ~ .modal-close-fixed,
.modal-bg.open .modal-close {
  display: flex !important;
}

/* Dark theme */
[data-theme='alt'] #modalBg .modal-close,
[data-theme='alt'] .modal-close-fixed {
  background: #2F0F49 !important;
  border-color: rgba(255,75,139,0.4) !important;
  color: #F8F7FF !important;
}

[data-theme='alt'] #modalBg .modal-close:hover {
  background: #FF4B8B !important;
  color: #fff !important;
}

/* Light theme hover */
#modalBg .modal-close:hover {
  background: #f5ead8 !important;
  border-color: #C96B3A !important;
  color: #C96B3A !important;
}


/* ── PRODUCT MODAL - COMPACT SIZE ── */
.modal-bg {
  padding: 16px !important;
  align-items: center !important;
  justify-content: center !important;
}

#modalBg .modal {
  max-width: 380px !important;
  width: 100% !important;
  padding: 16px !important;
  border-radius: 24px !important;
  max-height: 92vh !important;
  overflow-y: auto !important;
}

/* Compact image area */
#modalBg .modal-img-wrap {
  border-radius: 16px !important;
  margin-bottom: 14px !important;
}

/* Compact text */
#modalBg .modal-cat {
  font-size: 10px !important;
  margin-bottom: 4px !important;
}

#modalBg h2 {
  font-size: 22px !important;
  margin-bottom: 6px !important;
}

#modalBg .modal-desc {
  font-size: 13px !important;
  margin-bottom: 14px !important;
  line-height: 1.6 !important;
}

#modalBg .modal-price {
  font-size: 26px !important;
  margin-bottom: 14px !important;
}

/* Compact qty row */
#modalBg .qty-row {
  margin-bottom: 16px !important;
  gap: 12px !important;
}

#modalBg .qty-btn {
  width: 34px !important;
  height: 34px !important;
}

/* Add to cart button */
#modalBg .modal-add {
  padding: 13px !important;
  font-size: 14px !important;
  border-radius: 12px !important;
}

/* Mobile - even more compact */
@media (max-width: 767px) {
  #modalBg .modal {
    max-width: 340px !important;
    padding: 14px !important;
    max-height: 88vh !important;
  }

  #modalBg h2 {
    font-size: 20px !important;
  }

  #modalBg .modal-price {
    font-size: 22px !important;
  }
}

/* ── PRODUCT MODAL - NO SCROLL, ALL VISIBLE ── */
#modalBg .modal {
  max-width: 360px !important;
  width: calc(100vw - 32px) !important;
  padding: 14px !important;
  border-radius: 22px !important;
  max-height: 95vh !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Smaller image - not full square */
#modalBg .modal-img-wrap {
  width: 100% !important;
  height: 0 !important;
  padding-bottom: 55% !important;  /* shorter, not 100% square */
  position: relative !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin-bottom: 10px !important;
  flex-shrink: 0 !important;
}

/* Dots */
.modal-img-dots {
  padding: 4px 0 !important;
  margin-bottom: 8px !important;
}

/* Category */
#modalBg .modal-cat {
  font-size: 10px !important;
  margin-bottom: 3px !important;
}

/* Title */
#modalBg h2 {
  font-size: 18px !important;
  margin-bottom: 4px !important;
  line-height: 1.2 !important;
}

/* Description */
#modalBg .modal-desc {
  font-size: 12px !important;
  line-height: 1.5 !important;
  margin-bottom: 8px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Price */
#modalBg .modal-price {
  font-size: 22px !important;
  margin-bottom: 10px !important;
}

/* Qty row */
#modalBg .qty-row {
  margin-bottom: 10px !important;
  gap: 10px !important;
}

#modalBg .qty-btn {
  width: 30px !important;
  height: 30px !important;
  font-size: 16px !important;
}

#modalBg .qty-num {
  font-size: 15px !important;
}

#modalBg .stock-badge {
  font-size: 11px !important;
}

/* Add to Cart button */
#modalBg .modal-add {
  padding: 11px !important;
  font-size: 13px !important;
  border-radius: 11px !important;
  flex-shrink: 0 !important;
}

/* ── PRODUCT MODAL - SQUARE IMAGE + NO SCROLL ── */
#modalBg .modal {
  max-width: 340px !important;
  width: calc(100vw - 32px) !important;
  padding: 12px !important;
  border-radius: 22px !important;
  max-height: 96vh !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Perfect square image */
#modalBg .modal-img-wrap {
  width: 100% !important;
  height: 0 !important;
  padding-bottom: 100% !important;
  position: relative !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin-bottom: 8px !important;
  flex-shrink: 0 !important;
}

/* Dots compact */
.modal-img-dots {
  padding: 4px 0 2px !important;
  margin-bottom: 6px !important;
  gap: 6px !important;
}

.modal-img-dot {
  width: 7px !important;
  height: 7px !important;
}

/* Category */
#modalBg .modal-cat {
  font-size: 10px !important;
  margin-bottom: 2px !important;
}

/* Title */
#modalBg h2 {
  font-size: 17px !important;
  margin-bottom: 4px !important;
  line-height: 1.2 !important;
}

/* Description - 2 lines max */
#modalBg .modal-desc {
  font-size: 12px !important;
  line-height: 1.5 !important;
  margin-bottom: 6px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Price */
#modalBg .modal-price {
  font-size: 20px !important;
  margin-bottom: 8px !important;
}

/* Qty row */
#modalBg .qty-row {
  margin-bottom: 8px !important;
  gap: 8px !important;
}

#modalBg .qty-btn {
  width: 28px !important;
  height: 28px !important;
  font-size: 15px !important;
  border-radius: 8px !important;
}

#modalBg .qty-num {
  font-size: 14px !important;
}

#modalBg .stock-badge {
  font-size: 11px !important;
}

/* Add to Cart */
#modalBg .modal-add {
  padding: 12px !important;
  font-size: 14px !important;
  border-radius: 12px !important;
}


/* ── CLOSE BUTTON - ABOVE MODAL, ALWAYS VISIBLE ── */
#modalBg {
  flex-direction: column !important;
  gap: 10px !important;
  padding: 16px !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Hide the inside close button */
#modalBg .modal .modal-close {
  display: none !important;
}

/* Show the fixed outside close button */
.modal-close-fixed {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: #fff !important;
  border: 2px solid rgba(255,255,255,0.4) !important;
  color: #2C1810 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.3) !important;
  z-index: 999999 !important;
  flex-shrink: 0 !important;
  align-self: flex-end !important;
  margin-right: 4px !important;
}

#modalBg.open .modal-close-fixed {
  display: flex !important;
}

/* Dark theme */
[data-theme='alt'] .modal-close-fixed {
  background: rgba(255,75,139,0.15) !important;
  border-color: rgba(255,75,139,0.5) !important;
  color: #fff !important;
}

[data-theme='alt'] .modal-close-fixed:hover {
  background: #FF4B8B !important;
}

/* ── HERO MESH + PARTICLES BACKGROUND ── */
[data-theme='alt'] .hero-bg {
  background: #120318 !important;
}

[data-theme='alt'] .hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,75,139,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,75,139,0.04) 1px, transparent 1px);
  background-size: 40px 40px;
  z-index: 0;
  pointer-events: none;
}

[data-theme='alt'] .orb1 { background: rgba(107,33,168,0.55) !important; filter: blur(80px) !important; }
[data-theme='alt'] .orb2 { background: rgba(255,75,139,0.5) !important; filter: blur(80px) !important; }
[data-theme='alt'] .orb3 { background: rgba(76,29,149,0.45) !important; filter: blur(80px) !important; }


/* ── HERO MESH + PARTICLES BACKGROUND ── */
[data-theme='alt'] .hero-bg {
  background: #120318 !important;
}

[data-theme='alt'] .hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,75,139,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,75,139,0.04) 1px, transparent 1px);
  background-size: 40px 40px;
  z-index: 0;
  pointer-events: none;
}

[data-theme='alt'] .orb1 {
  background: rgba(107,33,168,0.65) !important;
  filter: blur(80px) !important;
  width: 400px !important;
  height: 400px !important;
}

[data-theme='alt'] .orb2 {
  background: rgba(255,75,139,0.55) !important;
  filter: blur(80px) !important;
  width: 320px !important;
  height: 320px !important;
}

[data-theme='alt'] .orb3 {
  background: rgba(76,29,149,0.5) !important;
  filter: blur(80px) !important;
  width: 260px !important;
  height: 260px !important;
}

/* ── HIDE HERO RINGS IN DARK THEME ── */
[data-theme='alt'] .hero-ring {
  display: none !important;
}


/* ── SINGLE UNIFIED BACKGROUND ── */
[data-theme='alt'] body {
  background: #120318 !important;
}

[data-theme='alt'] .hero {
  background: transparent !important;
}

[data-theme='alt'] .hero-bg {
  background: transparent !important;
}

[data-theme='alt'] .hero-pattern {
  display: none !important;
}

[data-theme='alt'] .stats {
  background: rgba(255,255,255,0.04) !important;
}

/* ── STATS BACKGROUND FIX ── */
[data-theme='alt'] .stats {
  background: transparent !important;
  border-top: 1px solid rgba(255,75,139,0.1) !important;
  border-bottom: 1px solid rgba(255,75,139,0.1) !important;
}

/* ── CONTAIN GRID LINES TO HERO ONLY ── */
[data-theme='alt'] .hero {
  isolation: isolate !important;
}

[data-theme='alt'] .hero::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image:
    linear-gradient(rgba(255,75,139,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,75,139,0.04) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
  z-index: 0 !important;
  pointer-events: none !important;
}


/* ── REMOVE GRID LINES COMPLETELY ── */
[data-theme='alt'] .hero::after {
  display: none !important;
}

/* ── NAV SEAMLESS ── */
[data-theme='alt'] nav {
  background: rgba(18,3,24,0.85) !important;
  border-bottom-color: rgba(255,75,139,0.12) !important;
}