/* =========================================================
   TOKENS — derived from DESIGN-clickhouse.md
========================================================= */
:root{
  --primary:#B86478;
  --primary-active:#A3546A;
  --primary-disabled:#E4C6CD;
  --coral:#E0A579;
  --sage:#7C8B5F;
  --ink:#1F1B1A;
  --body:#6E6360;
  --body-strong:#4A413E;
  --muted:#8F8079;
  --muted-soft:#D6C9C4;
  --hairline:#EFDDD8;
  --hairline-strong:#E0C4BC;
  --canvas:#FBF5F2;
  --surface-soft:#F5EBE6;
  --surface-card:#FFFFFF;
  --surface-elevated:#FDF8F5;
  --on-primary:#FFFFFF;
  --on-dark:#1F1B1A;
  --success:#16803D;
  --error:#DC2626;
  --warning:#B45309;

  --r-xs:4px; --r-sm:6px; --r-md:8px; --r-lg:12px; --r-pill:9999px;

  --sp-xxs:4px; --sp-xs:8px; --sp-sm:12px; --sp-md:16px; --sp-lg:24px; --sp-xl:32px; --sp-xxl:48px; --sp-section:96px;

  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} *{animation-duration:.01ms !important;transition-duration:.01ms !important;} }
body{
  font-family:'Inter',sans-serif;
  background:var(--canvas);
  color:var(--body);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,select,textarea{font-family:inherit;}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
ul{list-style:none;}

/* ===== Glassmorphism + motion utilities ===== */
.glass{
  background:rgba(255,255,255,0.55);
  backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%);
  border:1px solid rgba(201,123,140,0.14);
}
.glass-light{
  background:rgba(255,255,255,0.32);
  backdrop-filter:blur(14px) saturate(150%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  border:1px solid rgba(201,123,140,0.10);
}
.glow-primary{ box-shadow:0 0 0 rgba(201,123,140,0); transition:box-shadow .3s var(--ease), transform .2s var(--ease); }
.glow-primary:hover{ box-shadow:0 8px 28px rgba(201,123,140,0.28); }

.reveal{ opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }

@keyframes kenburns{ 0%{transform:scale(1);} 100%{transform:scale(1.09);} }
@keyframes pulseGlow{ 0%,100%{box-shadow:0 0 0 0 rgba(201,123,140,.35);} 50%{box-shadow:0 0 0 8px rgba(201,123,140,0);} }
@keyframes heartPop{ 0%{transform:scale(1);} 40%{transform:scale(1.5);} 100%{transform:scale(1);} }
@keyframes badgeBounce{ 0%,100%{transform:scale(1);} 30%{transform:scale(1.45);} 60%{transform:scale(.9);} }
@keyframes fadeSlideIn{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }
@keyframes shimmer{ 0%{background-position:-400px 0;} 100%{background-position:400px 0;} }

#app{ animation:fadeSlideIn .45s var(--ease); }
.badge-bounce{ animation:badgeBounce .4s var(--ease); }
.heart-pop{ animation:heartPop .4s var(--ease); }

.wrap{max-width:1280px;margin:0 auto;padding:0 24px;}
@media (max-width:768px){ .wrap{padding:0 20px;} }

.section{padding:96px 0;}
@media (max-width:768px){ .section{padding:56px 0;} }
.section-tight{padding:56px 0;}

h1,h2,h3,h4{font-weight:700;color:var(--ink);letter-spacing:-0.5px;}
.eyebrow{
  font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--primary);display:inline-block;margin-bottom:12px;
}
.h-display{font-size:clamp(34px,5vw,64px);line-height:1.08;letter-spacing:-2px;}
.h-lg{font-size:clamp(28px,3.4vw,40px);line-height:1.15;letter-spacing:-1px;}
.h-md{font-size:clamp(20px,2.2vw,24px);line-height:1.3;letter-spacing:-0.3px;}
.lede{color:var(--body);font-size:16px;max-width:60ch;}
.center{text-align:center;margin-left:auto;margin-right:auto;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:44px;padding:0 22px;border-radius:var(--r-md);
  font-size:14px;font-weight:600;white-space:nowrap;
  transition:background .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease);
}
.btn-primary{background:var(--primary);color:var(--on-primary);box-shadow:0 0 0 rgba(201,123,140,0);transition:background .15s var(--ease), box-shadow .25s var(--ease), transform .15s var(--ease);}
.btn-primary:hover{background:var(--primary-active);box-shadow:0 6px 24px rgba(201,123,140,.35);transform:translateY(-1px);}
.btn-primary:active{transform:translateY(0) scale(.97);}
.btn-primary:disabled{background:var(--primary-disabled);color:var(--muted);cursor:not-allowed;}
.btn-secondary{background:var(--surface-card);color:var(--on-dark);border:1px solid var(--hairline);}
.btn-secondary:hover{background:var(--surface-elevated);}
.btn-outline{background:transparent;color:var(--on-dark);border:1px solid var(--hairline-strong);}
.btn-outline:hover{border-color:var(--primary);color:var(--primary);}
.btn-text{background:none;color:var(--on-dark);text-decoration:underline;text-underline-offset:3px;}
.btn-link-accent{color:var(--primary);text-decoration:underline;text-underline-offset:3px;font-weight:600;font-size:14px;}
.btn-block{width:100%;}
.btn-sm{height:36px;padding:0 16px;font-size:13px;}
.btn-icon{width:40px;height:40px;border-radius:var(--r-pill);background:var(--surface-card);display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--hairline);position:relative;}
.btn-icon:hover{background:var(--surface-elevated);}
.badge-count{position:absolute;top:-4px;right:-4px;background:var(--primary);color:var(--on-primary);font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:var(--r-pill);display:flex;align-items:center;justify-content:center;padding:0 3px;}

/* ---------- Badges/pills ---------- */
.badge{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;padding:4px 10px;border-radius:var(--r-pill);background:var(--surface-card);color:var(--on-dark);border:1px solid var(--hairline);}
.badge-accent{background:var(--primary);color:var(--on-primary);border:none;}
.badge-rose{background:rgba(239,68,68,.14);color:#f87171;border:1px solid rgba(239,68,68,.3);}
.badge-coral{background:var(--coral);color:var(--ink);border:none;}

/* ---------- Header ---------- */
#site-header{position:sticky;top:0;z-index:60;background:rgba(251,245,242,.75);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border-bottom:1px solid transparent;transition:border-color .2s var(--ease), background .2s var(--ease);}
#site-header.scrolled{border-bottom-color:var(--hairline);}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:76px;}
.logo{font-size:20px;font-weight:700;letter-spacing:-.5px;color:var(--ink);}
.logo span{color:var(--primary);}
.main-nav{display:flex;align-items:center;gap:28px;}
.main-nav a{font-size:14px;font-weight:500;color:var(--body-strong);transition:color .15s;}
.main-nav a:hover{color:var(--primary);}
.header-actions{display:flex;align-items:center;gap:10px;}
.hamburger{display:none;}
@media (max-width:960px){
  .main-nav{display:none;}
  .hamburger{display:inline-flex;}
}

/* ---------- Mobile menu ---------- */
#mobile-menu{position:fixed;inset:0;background:rgba(251,245,242,.85);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);z-index:90;transform:translateX(100%);transition:transform .3s var(--ease);overflow-y:auto;}
#mobile-menu.open{transform:translateX(0);}
.mobile-menu-head{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--hairline);}
.mobile-menu-split{display:grid;grid-template-columns:1.3fr 1fr;}
.mobile-menu-links{padding:12px 14px 12px 20px;border-right:1px solid var(--hairline);}
.mobile-menu-links a{display:block;padding:14px 0;font-size:16px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--hairline);}
.mobile-menu-categories{padding:12px 20px 12px 14px;background:var(--surface-soft);}
.mobile-menu-cat-heading{display:block;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding:10px 0 6px;}
.mobile-menu-categories a{display:block;padding:12px 0;font-size:14px;font-weight:600;color:var(--body-strong);border-bottom:1px solid var(--hairline);}
@media (max-width:420px){
  .mobile-menu-split{grid-template-columns:1fr 1fr;}
  .mobile-menu-links a{font-size:14px;padding:12px 0;}
  .mobile-menu-categories a{font-size:13px;}
}

/* ---------- Announcement bar ---------- */
.announce{background:var(--surface-card);text-align:center;padding:10px 16px;font-size:13px;color:var(--body-strong);border-bottom:1px solid var(--hairline);}

/* ---------- Hero Slider (full-width, no text, auto-plays) ---------- */
.hero-slider{position:relative;width:100%;overflow:hidden;background:var(--surface-soft);}
.hero-slider-track{position:relative;width:100%;height:52vh;min-height:320px;max-height:560px;}
@media (max-width:768px){ .hero-slider-track{height:34vh;min-height:200px;} }
@media (max-width:560px){ .hero-slider-track{height:28vh;min-height:170px;} }
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;pointer-events:none;display:block;}
.hero-slide.active{opacity:1;pointer-events:auto;}
.hero-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-slider-dots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:8px;z-index:2;}
.hero-slider-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.8);padding:0;}
.hero-slider-dot.active{background:#fff;width:22px;border-radius:5px;transition:width .25s var(--ease);}

/* ---------- Grid & cards ---------- */
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:960px){ .grid-3,.grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:680px){ .grid-2{grid-template-columns:1fr;} }
@media (max-width:560px){ .grid-3,.grid-4{grid-template-columns:repeat(2,1fr);gap:14px;} }

.card{background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:32px;}
.card-tight{padding:24px;}

/* product card */
.p-card{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--surface-card);border:1px solid var(--hairline);transition:transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);}
.p-card:hover{transform:translateY(-6px);border-color:rgba(201,123,140,.4);box-shadow:0 16px 40px rgba(0,0,0,.35), 0 0 24px rgba(201,123,140,.12);}
.p-card-imgwrap{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--surface-elevated);}
.p-card-imgwrap img{width:100%;height:100%;object-fit:cover;transition:opacity .3s var(--ease);}
.img-fade{opacity:0;transition:opacity .5s ease;}
.img-fade.loaded{opacity:1;}
.p-card-imgwrap img.img-b{position:absolute;inset:0;opacity:0;}
.p-card:hover .img-b{opacity:1;}
.p-wish{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:var(--r-pill);background:rgba(251,245,242,.65);border:1px solid var(--hairline-strong);display:flex;align-items:center;justify-content:center;z-index:3;}
.p-wish.active svg{fill:var(--primary);stroke:var(--primary);}
.p-badge{position:absolute;top:10px;left:10px;z-index:3;}
.p-quick{position:absolute;left:10px;right:10px;bottom:10px;z-index:3;display:flex;gap:6px;opacity:0;transform:translateY(8px);transition:.2s var(--ease);}
.p-quick .btn{min-width:0;flex-shrink:1;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.p-card:hover .p-quick{opacity:1;transform:translateY(0);}
.p-body{padding:14px 16px 18px;}
.p-cat{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);margin-bottom:4px;}
.p-name{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:6px;}
.p-price-row{display:flex;align-items:center;gap:8px;}
.p-price{font-size:15px;font-weight:700;color:var(--primary);}
.p-mrp{font-size:13px;color:var(--muted-soft);text-decoration:line-through;}

/* category tile */
.cat-tile{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:280px;display:flex;align-items:flex-end;border:1px solid transparent;transition:border-color .2s;background-size:cover;background-position:center;}
.cat-tile:hover{border-color:var(--primary);}
.cat-tile-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.cat-tile::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(20,16,12,.85));z-index:1;}
.cat-tile-body{position:relative;z-index:2;padding:22px;}
.cat-tile-body h3{color:#fff;}
.cat-tile-large{grid-row:span 2;min-height:100%;}

.trio-grid{grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;}
@media (max-width:768px){
  .trio-grid{grid-template-columns:repeat(3,1fr);grid-template-rows:auto;gap:10px;}
  .trio-grid .cat-tile,
  .trio-grid .cat-tile-large{grid-column:auto;grid-row:auto;min-height:auto;display:block;position:static;border:none;}
  .trio-grid .cat-tile-photo{position:static;width:100%;aspect-ratio:1/1;border-radius:var(--r-lg);}
  .trio-grid .cat-tile::after{display:none;}
  .trio-grid .cat-tile-body{position:static;padding:8px 2px 0;text-align:center;}
  .trio-grid .cat-tile-body h3{color:var(--ink);font-size:12px;font-weight:700;line-height:1.25;white-space:normal;word-break:break-word;margin:0;}
  .trio-grid .cat-tile-body .btn-link-accent{display:none;}
}
@media (max-width:420px){
  .trio-grid{gap:8px;}
  .trio-grid .cat-tile-body h3{font-size:11px;}
}

/* trust strip */
.trust-strip{display:flex;flex-wrap:wrap;gap:32px;justify-content:center;padding:32px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);}
.trust-item{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--body-strong);}

/* CTA yellow band */
.cta-band{background:var(--primary);color:var(--on-primary);border-radius:var(--r-lg);padding:64px 40px;text-align:center;}
.cta-band h2{color:var(--on-primary);}
.cta-band .lede{color:#FBE8DF;margin:0 auto;}

/* testimonial */
.tm-card{background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:28px;}
.stars{color:var(--primary);font-size:14px;margin-bottom:10px;letter-spacing:2px;}

/* footer */
#site-footer{border-top:1px solid var(--hairline);padding:64px 0 24px;margin-top:48px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:48px;}
@media (max-width:768px){ .footer-grid{grid-template-columns:1fr 1fr;} }
.footer-grid h4{font-size:13px;color:var(--ink);margin-bottom:14px;letter-spacing:.5px;}
.footer-grid a{display:block;font-size:14px;color:var(--muted);padding:6px 0;}
.footer-grid a:hover{color:var(--primary);}
.footer-bottom{border-top:1px solid var(--hairline);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:13px;color:var(--muted-soft);}
.newsletter-strip{background:var(--surface-soft);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:36px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;margin-bottom:48px;}
.newsletter-form{display:flex;gap:10px;flex:1;min-width:260px;max-width:420px;}

/* forms */
.field{margin-bottom:18px;}
.field label{display:block;font-size:13px;font-weight:600;color:var(--body-strong);margin-bottom:6px;}
.text-input{width:100%;height:44px;padding:0 14px;background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-md);color:var(--on-dark);font-size:14px;transition:border-color .15s;}
.text-input:focus{border-color:var(--primary);}
textarea.text-input{height:auto;padding:12px 14px;min-height:110px;resize:vertical;}
.field-row{display:flex;gap:14px;}
.field-row .field{flex:1;}
.select-wrap select{width:100%;height:44px;padding:0 14px;background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-md);color:var(--on-dark);font-size:14px;}
.checkbox-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--body);}

/* breadcrumb */
.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:18px;}
.breadcrumb a:hover{color:var(--primary);}

/* PLP */
.plp-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:12px;}
.chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px;}
.chip{padding:8px 16px;border-radius:var(--r-pill);background:var(--surface-card);border:1px solid var(--hairline);font-size:13px;color:var(--body-strong);}
.chip.active{background:var(--surface-elevated);border-color:var(--on-dark);color:var(--ink);}

/* PDP */
.pdp-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
@media (max-width:900px){ .pdp-grid{grid-template-columns:1fr;gap:28px;} }
.pdp-main-img{aspect-ratio:1/1;border-radius:var(--r-lg);overflow:hidden;background:var(--surface-card);border:1px solid var(--hairline);margin-bottom:12px;}
.pdp-main-img img{width:100%;height:100%;object-fit:cover;}
.pdp-thumbs{display:flex;gap:10px;}
.pdp-thumb{width:74px;height:74px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--hairline);cursor:pointer;opacity:.6;}
.pdp-thumb.active{opacity:1;border-color:var(--primary);}
.pdp-thumb img{width:100%;height:100%;object-fit:cover;}
.qty-stepper{display:inline-flex;align-items:center;border:1px solid var(--hairline);border-radius:var(--r-md);height:44px;}
.qty-stepper button{width:40px;height:100%;font-size:16px;color:var(--ink);}
.qty-stepper span{width:36px;text-align:center;font-weight:600;color:var(--ink);}
.accordion-item{border-top:1px solid var(--hairline);}
.accordion-item:last-child{border-bottom:1px solid var(--hairline);}
.accordion-head{width:100%;display:flex;justify-content:space-between;align-items:center;padding:16px 2px;font-size:14px;font-weight:600;color:var(--ink);text-align:left;}
.accordion-body{max-height:0;overflow:hidden;transition:max-height .25s var(--ease);font-size:14px;color:var(--body);}
.accordion-body-inner{padding:0 2px 16px;}
.accordion-item.open .accordion-body{max-height:400px;}
.pincode-box{display:flex;gap:8px;margin:18px 0;}
.pincode-box input{flex:1;}

/* highlight chips */
.hl-chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0;}
.hl-chip{font-size:12px;color:var(--body-strong);background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-pill);padding:6px 12px;}

/* offers box */
.offer-box{border:1px solid rgba(201,123,140,0.16);border-radius:var(--r-md);padding:14px 16px;margin:16px 0;background:rgba(255,255,255,.5);backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);}
.offer-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--hairline);font-size:13px;}
.offer-item:last-child{border-bottom:none;}
.offer-tag{font-size:10px;font-weight:700;letter-spacing:.5px;color:var(--primary);flex-shrink:0;}
.offer-code-btn{font-size:11px;color:var(--primary);border:1px dashed var(--primary);border-radius:var(--r-sm);padding:3px 8px;flex-shrink:0;}

/* urgency + stock */
.urgency-line{font-size:13px;color:var(--warning);font-weight:600;margin:8px 0;}
.stock-track{height:6px;background:var(--surface-elevated);border-radius:var(--r-pill);overflow:hidden;margin:6px 0 4px;}
.stock-fill{height:100%;background:var(--warning);border-radius:var(--r-pill);}

/* countdown */
.deal-banner{display:flex;align-items:center;gap:10px;background:rgba(201,123,140,.08);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(201,123,140,.28);border-radius:var(--r-md);padding:10px 14px;margin:14px 0;font-size:13px;color:var(--body-strong);animation:pulseGlow 2.4s ease-in-out infinite;}
.deal-banner strong{color:var(--primary);font-variant-numeric:tabular-nums;font-size:15px;}

/* combo */
.combo-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0;}
.combo-thumb{width:72px;height:88px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--hairline);}
.combo-thumb img{width:100%;height:100%;object-fit:cover;}
.combo-plus{color:var(--muted);font-size:20px;}

/* reels */
.reel-track{display:flex;gap:14px;overflow-x:auto;padding-bottom:10px;}
.reel-card{position:relative;flex:0 0 150px;aspect-ratio:9/16;border-radius:var(--r-lg);overflow:hidden;cursor:pointer;border:1px solid var(--hairline);}
.reel-card img{width:100%;height:100%;object-fit:cover;}
.reel-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(0deg,rgba(0,0,0,.5),transparent 40%);}
.reel-play span{width:38px;height:38px;border-radius:var(--r-pill);background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;color:#000;font-size:14px;}
.reel-label{position:absolute;bottom:8px;left:8px;right:8px;color:#fff;font-size:11px;font-weight:600;}

/* rating summary */
.rating-summary{display:flex;gap:32px;flex-wrap:wrap;margin-bottom:24px;}
.rating-big{font-size:44px;font-weight:700;color:var(--ink);line-height:1;}
.rating-bars{flex:1;min-width:220px;}
.rbar-row{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:12px;color:var(--muted);}
.rbar-track{flex:1;height:6px;background:var(--surface-elevated);border-radius:var(--r-pill);overflow:hidden;}
.rbar-fill{height:100%;background:var(--primary);border-radius:var(--r-pill);}

/* reviews */
.review-card{border-bottom:1px solid var(--hairline);padding:18px 0;}
.review-top{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.avatar-circle{width:36px;height:36px;border-radius:var(--r-pill);background:var(--surface-elevated);color:var(--ink);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;}
.review-photos{display:flex;gap:8px;margin:10px 0;}
.review-photos img{width:56px;height:56px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--hairline);}
.helpful-btn{font-size:12px;color:var(--muted);border:1px solid var(--hairline);border-radius:var(--r-pill);padding:5px 12px;margin-top:8px;}
.helpful-btn:disabled{opacity:.6;}

/* Q&A */
.qa-item{border-bottom:1px solid var(--hairline);padding:14px 0;}
.qa-q{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:4px;}
.qa-a{font-size:13px;color:var(--body);}

/* compare */
.compare-check{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);padding:0 14px 12px;cursor:pointer;}
.compare-bar{position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(251,245,242,.7);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-top:1px solid rgba(201,123,140,.16);padding:12px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;animation:fadeSlideIn .3s var(--ease);}

/* 360 viewer */
.spin-badge{position:absolute;top:10px;left:10px;background:rgba(10,10,10,.7);color:#FFFFFF;font-size:11px;padding:5px 10px;border-radius:var(--r-pill);cursor:pointer;z-index:4;border:1px solid var(--hairline-strong);}
.spin-hint{text-align:center;font-size:11px;color:var(--muted);margin-top:6px;}

/* size guide */
.size-guide-row{display:flex;align-items:flex-end;gap:20px;margin:14px 0;}
.size-box{background:var(--surface-elevated);border:1px solid var(--hairline);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:11px;}

/* artisan card */
.artisan-card{display:flex;gap:16px;align-items:center;background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:18px;}
.artisan-photo{width:64px;height:64px;border-radius:var(--r-pill);object-fit:cover;flex-shrink:0;}

/* QR authenticity */
.qr-box{display:flex;gap:14px;align-items:center;background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-md);padding:14px;margin:16px 0;}
.qr-box img{width:64px;height:64px;background:#fff;border-radius:6px;padding:4px;}

/* reward points / referral */
.points-card{background:var(--surface-card);border:1px solid var(--hairline-strong);border-radius:var(--r-lg);padding:20px;text-align:center;}
.points-big{font-size:32px;font-weight:700;color:var(--primary);}
.referral-box{background:var(--surface-card);border:1px dashed var(--hairline-strong);border-radius:var(--r-md);padding:14px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}

/* EMI calculator */
.emi-row{display:flex;justify-content:space-between;font-size:13px;color:var(--body-strong);padding:6px 0;border-bottom:1px solid var(--hairline);}

/* social proof popup */
.social-proof-popup{position:fixed;left:20px;bottom:20px;z-index:80;background:rgba(255,255,255,.65);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);border:1px solid rgba(201,123,140,.2);border-radius:var(--r-md);padding:12px 16px;max-width:270px;display:flex;gap:10px;align-items:center;box-shadow:0 12px 32px rgba(0,0,0,.4);animation:spFadeIn .3s var(--ease);}
@keyframes spFadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
.social-proof-popup img{width:38px;height:46px;object-fit:cover;border-radius:6px;flex-shrink:0;}

/* chat widget */
#chat-bubble{position:fixed;right:20px;bottom:20px;width:52px;height:52px;border-radius:var(--r-pill);background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font-size:22px;z-index:75;border:none;box-shadow:0 10px 24px rgba(0,0,0,.4);}
#chat-panel{position:fixed;right:20px;bottom:84px;width:320px;max-width:88vw;max-height:440px;background:rgba(251,245,242,.68);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border:1px solid rgba(201,123,140,.18);border-radius:var(--r-lg);z-index:76;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.5);transform:translateY(12px);opacity:0;pointer-events:none;transition:transform .28s var(--ease), opacity .28s var(--ease);}
#chat-panel.open{opacity:1;transform:translateY(0);pointer-events:auto;}
.chat-head{padding:14px 16px;border-bottom:1px solid var(--hairline);font-size:14px;font-weight:700;color:var(--ink);display:flex;justify-content:space-between;}
.chat-body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;}
.chat-msg{max-width:80%;font-size:13px;padding:8px 12px;border-radius:12px;}
.chat-msg.bot{background:var(--surface-card);color:var(--body-strong);align-self:flex-start;}
.chat-msg.user{background:var(--primary);color:var(--on-primary);align-self:flex-end;}
.chat-input-row{display:flex;gap:8px;padding:10px;border-top:1px solid var(--hairline);}
.chat-input-row input{flex:1;height:36px;}

/* Reels carousel (homepage) */
.reels-wrap{position:relative;}
.reels-carousel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none;}
.reels-carousel::-webkit-scrollbar{display:none;}
.reel-slide{flex:0 0 calc((100% - 4 * 14px) / 5);scroll-snap-align:start;position:relative;border-radius:14px;overflow:hidden;background:#000;aspect-ratio:9/16;cursor:pointer;}
.reel-slide video{width:100%;height:100%;object-fit:cover;display:block;}
.reel-slide .reel-caption{position:absolute;left:0;right:0;bottom:0;padding:14px 12px;background:linear-gradient(0deg,rgba(0,0,0,.65),transparent);color:#fff;font-size:13px;font-weight:600;}
.reel-nav-btn{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;z-index:5;box-shadow:0 2px 8px rgba(0,0,0,.12);}
.reel-nav-prev{left:-14px;}
.reel-nav-next{right:-14px;}
@media (max-width:960px){ .reel-slide{flex-basis:calc((100% - 2 * 14px) / 3);} }
@media (max-width:560px){ .reel-slide{flex-basis:calc((100% - 14px) / 2);} .reel-nav-btn{display:none;} }

.pagination{display:flex;gap:8px;flex-wrap:wrap;}
.pagination a{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border-radius:8px;border:1px solid var(--hairline);background:var(--surface-card);color:var(--body-strong);font-size:14px;font-weight:600;}
.pagination a.active{background:var(--primary);border-color:var(--primary);color:#fff;}
.pagination a:hover:not(.active){border-color:var(--primary);}

/* PWA install */
.install-btn{position:fixed;left:20px;top:90px;z-index:60;display:none;}
.install-btn.show{display:inline-flex;}

.pdp-mobile-bar{display:none;}
@media (max-width:900px){
  .pdp-mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--canvas);border-top:1px solid var(--hairline);padding:12px 16px;gap:10px;z-index:55;}
  .pdp-mobile-bar .btn{flex:1;}
  body:has(.pdp-mobile-bar) #chat-bubble{bottom:86px;}
}

/* cart drawer */
#cart-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:98;opacity:0;pointer-events:none;transition:opacity .25s;}
#cart-drawer-overlay.open{opacity:1;pointer-events:auto;}
#cart-drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:92vw;background:rgba(251,245,242,.72);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);border-left:1px solid rgba(201,123,140,0.14);z-index:99;transform:translateX(100%);transition:transform .32s var(--ease);display:flex;flex-direction:column;}
#cart-drawer.open{transform:translateX(0);}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--hairline);}
.drawer-items{flex:1;overflow-y:auto;padding:16px 20px;}
.cart-line{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--hairline);}
.cart-line img{width:64px;height:78px;object-fit:cover;border-radius:var(--r-sm);}
.cart-line-body{flex:1;}
.cart-line-top{display:flex;justify-content:space-between;gap:8px;}
.cart-line-remove{color:var(--muted);font-size:12px;text-decoration:underline;}
.drawer-foot{padding:18px 20px 22px;border-top:1px solid var(--hairline);}
.row-between{display:flex;justify-content:space-between;align-items:center;}

/* search overlay */
#search-overlay{position:fixed;inset:0;background:rgba(251,245,242,.88);backdrop-filter:blur(26px) saturate(160%);-webkit-backdrop-filter:blur(26px) saturate(160%);z-index:97;opacity:0;pointer-events:none;transform:scale(.98);transition:.25s var(--ease);}
#search-overlay.open{opacity:1;pointer-events:auto;transform:scale(1);}
.search-input-row{border-bottom:1px solid var(--hairline);}
.search-input-row input{flex:1;background:none;border:none;color:var(--ink);font-size:22px;height:76px;}
.search-input-row input:focus{outline:none;}

/* modal (quick view) */
#modal-overlay{position:fixed;inset:0;background:rgba(31,27,26,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:98;display:none;align-items:center;justify-content:center;padding:20px;}
#modal-overlay.open{display:flex;}
.modal-box{background:rgba(251,245,242,.78);backdrop-filter:blur(28px) saturate(160%);-webkit-backdrop-filter:blur(28px) saturate(160%);border:1px solid rgba(201,123,140,.18);border-radius:var(--r-lg);max-width:760px;width:100%;max-height:88vh;overflow-y:auto;animation:fadeSlideIn .3s var(--ease);}

/* toast */
#toast-container{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center;}
.toast{background:var(--surface-elevated);border:1px solid var(--hairline-strong);color:var(--ink);padding:12px 20px;border-radius:var(--r-md);font-size:14px;box-shadow:0 8px 24px rgba(0,0,0,.4);animation:toastIn .25s var(--ease);}
@keyframes toastIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}

/* checkout */
.checkout-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:start;}
@media (max-width:900px){ .checkout-grid{grid-template-columns:1fr;} }
.checkout-step{background:var(--surface-card);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:24px;margin-bottom:16px;}
.step-title{display:flex;align-items:center;gap:10px;margin-bottom:16px;font-size:16px;color:var(--ink);font-weight:700;}
.step-num{width:26px;height:26px;border-radius:var(--r-pill);background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;}
.addr-card{border:1px solid var(--hairline);border-radius:var(--r-md);padding:14px;margin-bottom:10px;display:flex;gap:10px;cursor:pointer;}
.addr-card.selected{border-color:var(--primary);}
.pay-option{border:1px solid var(--hairline);border-radius:var(--r-md);padding:14px;margin-bottom:10px;display:flex;align-items:center;gap:10px;cursor:pointer;}
.pay-option.selected{border-color:var(--primary);}
.summary-card{position:sticky;top:96px;}
.sum-line{display:flex;justify-content:space-between;font-size:14px;color:var(--body);padding:6px 0;}
.sum-total{display:flex;justify-content:space-between;font-size:18px;font-weight:700;color:var(--ink);padding-top:12px;border-top:1px solid var(--hairline);margin-top:8px;}

/* order confirmation */
.confirm-check{width:64px;height:64px;border-radius:var(--r-pill);background:var(--primary);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;}

/* faq */
.faq-item{border-bottom:1px solid var(--hairline);}
.faq-q{width:100%;text-align:left;padding:18px 4px;display:flex;justify-content:space-between;font-size:15px;font-weight:600;color:var(--ink);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s var(--ease);color:var(--body);font-size:14px;}
.faq-a-inner{padding:0 4px 18px;}
.faq-item.open .faq-a{max-height:300px;}

/* wishlist / empty state */
.empty-state{text-align:center;padding:80px 20px;}
.empty-state svg{margin:0 auto 20px;}

/* misc */
.divider{height:1px;background:var(--hairline);margin:40px 0;}
.mono-note{font-size:12px;color:var(--muted-soft);}
.tag-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.rating-line{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--body-strong);margin:8px 0 18px;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
@media (max-width:900px){ .two-col{grid-template-columns:1fr;gap:28px;} }
.img-frame{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--hairline);}
.policy-content h3{color:var(--ink);margin:28px 0 10px;font-size:18px;}
.policy-content p, .policy-content li{color:var(--body);font-size:14px;margin-bottom:10px;}
.policy-content ul{padding-left:20px;list-style:disc;}
