@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,400;1,600&display=swap');

:root {
  --brand: #ff3f6c;
  --brand-dark: #e11d48;
  --brand-light: #fff1f4;
  --brand-subtle: #ffe4e9;
  --green: #111827;
  --green-dark: #000000;
  --green-light: #f3f4f6;
  --green-accent: #1f2937;
  --green-subtle: #f8fafc;
  --gold: #f59e0b;
  --gold-dark: #d97706;
  --gold-light: #fffbeb;
  --sale: #ff3f6c;
  --sale-light: #fff1f4;
  --ink: #111827;
  --ink-light: #374151;
  --muted: #6b7280;
  --muted-light: #9ca3af;
  --cream: #fafafa;
  --cream-dark: #f4f4f5;
  --line: #e4e4e7;
  --line-light: #f4f4f5;
  --surface: #ffffff;
  --danger: #dc2626;
  --danger-light: #fef2f2;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 9999px;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  --shadow-md: 0 8px 24px -4px rgba(0, 0, 0, 0.08), 0 2px 6px -1px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 20px 40px -8px rgba(0, 0, 0, 0.12), 0 4px 12px -2px rgba(0, 0, 0, 0.05);
  --font-serif: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

* { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
  color: var(--ink);
  background: #ffffff;
  font: 14px/1.6 var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
  width: 100%;
  max-width: 100vw;
}

button, input, select, textarea { font-family: inherit; font-size: inherit; }
button, a, input, select { outline-offset: 3px; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; border: 0; background: none; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; height: auto; object-fit: cover; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, .serif {
  font-family: var(--font-serif);
  font-weight: 500;
  line-height: 1.18;
  color: var(--ink);
}
h1 { font-size: clamp(32px, 4.6vw, 64px); letter-spacing: -0.025em; }
h2 { font-size: clamp(24px, 3vw, 40px); letter-spacing: -0.015em; }

/* Page Transition */
#app {
  animation: pageFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  min-height: 50vh;
}
@keyframes pageFadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Top Glowing Loader */
#page-loader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3.5px;
  background: linear-gradient(90deg, #0f3d2e, #b38e4a, #165b44, #d4af37, #0f3d2e);
  background-size: 250% 100%;
  z-index: 999999;
  width: 0%;
  opacity: 0;
  box-shadow: 0 0 12px rgba(179,142,74,.85), 0 0 5px rgba(15,61,46,.9);
  transition: width .25s cubic-bezier(.1,.9,.2,1), opacity .2s ease-out;
  pointer-events: none;
}
#page-loader.active { width: 80%; opacity: 1; animation: pageLoaderGlow 1.2s infinite linear; }
#page-loader.done { width: 100%; opacity: 0; }
@keyframes pageLoaderGlow { 0% { background-position: 0% 50%; } 100% { background-position: 250% 50%; } }

/* Announcement Bar */
.announcement {
  background: var(--green-dark);
  color: #fff;
  text-align: center;
  padding: 8px 16px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .8px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  position: relative;
  z-index: 25;
  white-space: nowrap;
  overflow: hidden;
}
.announcement span { opacity: .95; display: inline-flex; align-items: center; gap: 6px; }
.announcement i { color: var(--gold); font-style: normal; font-size: 10px; opacity: .8; }

/* Header & Navigation */
header {
  height: 76px;
  padding: 0 5%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  position: sticky;
  top: 0;
  z-index: 40;
  gap: 20px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
  transition: all .2s ease;
}
.brand {
  font-family: var(--font-sans);
  font-size: 21px;
  font-weight: 800;
  letter-spacing: 2px;
  color: #111827;
  display: flex;
  flex-direction: column;
  line-height: 1.05;
  flex-shrink: 0;
}
.brand small {
  font-family: var(--font-sans);
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--brand);
  margin-top: 3px;
  text-transform: uppercase;
}
nav {
  display: flex;
  gap: 28px;
  align-items: center;
}
nav a {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-light);
  position: relative;
  padding: 6px 0;
  transition: color 0.2s ease;
}
nav a:hover {
  color: var(--green);
}
nav a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--green);
  transition: width 0.25s ease;
  border-radius: 2px;
}
nav a:hover::after {
  width: 100%;
}
.tools {
  display: flex;
  gap: 8px;
  align-items: center;
}
.tools button {
  position: relative;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink);
  background: transparent;
  transition: background-color .15s ease, transform .12s ease;
}
.tools button:hover {
  background: var(--cream);
  transform: translateY(-1px);
}
.tools button:active {
  transform: scale(0.94);
}
.tools svg {
  width: 20px;
  height: 20px;
  stroke-width: 1.6;
}
.tools b {
  background: var(--green);
  color: white;
  position: absolute;
  right: 2px;
  top: 2px;
  border-radius: var(--radius-full);
  font-size: 9px;
  font-weight: 700;
  min-width: 17px;
  height: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  box-shadow: 0 2px 6px rgba(15, 61, 46, 0.35);
}
@keyframes badgePop {
  0% { transform: scale(1); }
  50% { transform: scale(1.35); }
  100% { transform: scale(1); }
}
.tools b.pulse, .mobile-bag-count.pulse {
  animation: badgePop 0.35s ease;
}
.mobile-menu { display: none !important; }

/* Mobile Bottom Navigation Bar (Myntra/Amazon Style) */
.mobile-bottom-bar {
  display: none;
}

/* Buttons & Links */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--green);
  color: #fff;
  padding: 13px 26px;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-size: 13.5px;
  letter-spacing: .3px;
  transition: all .2s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: var(--shadow-xs);
  cursor: pointer;
  text-align: center;
}
.btn:hover {
  background: var(--green-accent);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(15, 61, 46, 0.25);
}
.btn:active {
  transform: scale(0.98);
}
.btn.light {
  background: #ffffff;
  color: var(--green);
  border: 1.5px solid var(--line);
  box-shadow: var(--shadow-xs);
}
.btn.light:hover {
  background: var(--cream);
  border-color: #cbd5e1;
  color: var(--green);
  box-shadow: var(--shadow-sm);
}
.btn:disabled {
  opacity: .5;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}
.text-link {
  color: var(--green);
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  transition: gap .15s ease;
}
.text-link:hover { gap: 10px; }

/* Hero Section */
.hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 540px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, #ffffff 0%, #faf8f4 100%);
  position: relative;
  overflow: hidden;
}
.hero-copy {
  padding: 60px 8%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  background: var(--cream);
  border: 1px solid #e8e2d5;
  border-radius: var(--radius-full);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--gold-dark);
  text-transform: uppercase;
  width: fit-content;
  margin-bottom: 20px;
}
.hero h1 {
  margin: 0 0 18px;
}
.hero h1 em {
  font-style: italic;
  color: var(--green);
}
.hero p {
  font-size: 16px;
  line-height: 1.6;
  color: var(--muted);
  max-width: 480px;
  margin-bottom: 28px;
}
.hero-cta-group {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
}
.hero-trust-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  font-size: 12.5px;
  color: var(--ink-light);
}
.hero-trust-pill .stars {
  color: #eab308;
  letter-spacing: -1px;
  font-size: 14px;
}
.hero-visual {
  padding: 40px 6%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  position: relative;
}
.hero-img-wrap {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.hero-img-wrap img {
  height: 380px;
  object-fit: cover;
  transition: transform .5s ease;
}
.hero-img-wrap:hover img {
  transform: scale(1.04);
}
.hero-img-wrap .trending-tag {
  position: absolute;
  top: 12px;
  left: 12px;
  background: rgba(15, 61, 46, 0.9);
  backdrop-filter: blur(8px);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 4px 10px;
  border-radius: var(--radius-full);
}
.hero-label {
  grid-column: 1/-1;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 12px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--green);
  box-shadow: var(--shadow-sm);
}

/* Value Ticker Strip */
.ticker {
  background: var(--cream);
  border-bottom: 1px solid var(--line);
  padding: 14px 5%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 28px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-light);
  flex-wrap: wrap;
}
.ticker i { color: var(--gold); font-style: normal; font-size: 10px; }

/* Sections */
.section {
  padding: 50px 5%;
  max-width: 1360px;
  margin: 0 auto;
}
.section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 30px;
  border-bottom: 1px solid var(--line-light);
  padding-bottom: 16px;
  gap: 20px;
}
.section-head h2 { margin: 4px 0 0; }
.section-head p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold-dark);
  display: block;
}

/* Category Grid */
.category-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.category {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-xs);
  transition: transform .25s ease, box-shadow .25s ease;
  aspect-ratio: 4/5;
}
.category:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.category img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2,0,0,1);
}
.category:hover img { transform: scale(1.05); }
.category-title {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 30px 20px 18px;
  background: linear-gradient(to top, rgba(8, 33, 24, 0.92) 0%, rgba(8, 33, 24, 0.4) 65%, transparent 100%);
  color: #fff;
  font-family: var(--font-serif);
  font-size: 22px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.category-title span {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--gold-light);
}

/* Product Cards */
.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px 18px;
}
.product {
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-xs);
  transition: transform .25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .25s ease, border-color .2s ease;
  position: relative;
}
.product:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: #cbd5e1;
}
.product-media {
  position: relative;
  background: var(--cream);
  overflow: hidden;
  aspect-ratio: 3/4;
}
.product-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  transition: transform .4s cubic-bezier(0.16, 1, 0.3, 1);
}
.product:hover .product-media img {
  transform: scale(1.04);
}
.wish {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 0;
  border-radius: var(--radius-full);
  width: 34px;
  height: 34px;
  font-size: 17px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  color: #64748b;
  transition: all .2s ease;
}
.wish:hover {
  transform: scale(1.1);
  color: var(--sale);
  background: #ffffff;
}
.wish.active {
  color: var(--sale);
  animation: heartPop .3s ease;
}
@keyframes heartPop {
  0% { transform: scale(1); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}
.sale {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 4px 8px;
  background: var(--sale);
  color: white;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .3px;
  border-radius: var(--radius-xs);
  box-shadow: 0 2px 6px rgba(225, 29, 72, 0.3);
  z-index: 1;
}
.quick {
  position: absolute;
  bottom: 10px;
  left: 10px;
  right: 10px;
  border: 0;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(8px);
  padding: 9px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 700;
  color: var(--green);
  opacity: 0;
  transform: translateY(6px);
  transition: all .2s ease;
  box-shadow: var(--shadow-sm);
  text-align: center;
  z-index: 2;
}
.product:hover .quick, .quick:focus {
  opacity: 1;
  transform: translateY(0);
}
.quick:hover {
  background: var(--green);
  color: #ffffff;
}
.product-info {
  padding: 12px 14px 14px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.product-rating {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 6px;
  font-size: 11px;
}
.product-rating .stars {
  color: #eab308;
  font-size: 12px;
  letter-spacing: -1px;
}
.rating-val {
  font-weight: 700;
  color: var(--ink);
}
.product h3 {
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.38;
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: 38px;
  color: var(--ink);
}
.product h3 a:hover {
  color: var(--green);
}
.price {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin-top: auto;
  font-size: 15px;
  font-weight: 700;
  color: var(--green);
  flex-wrap: wrap;
}
.price-orig, .price del {
  color: var(--muted-light);
  font-weight: 400;
  font-size: 12px;
  text-decoration: line-through;
}
.price-save {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--sale);
  background: var(--sale-light);
  padding: 2px 6px;
  border-radius: var(--radius-xs);
}
.product-tags {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--line-light);
}
.cat-pill, .product small {
  color: var(--muted);
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .5px;
  font-weight: 600;
}
.tag-stock {
  font-size: 10px;
  font-weight: 600;
  color: #15803d;
  background: #dcfce7;
  padding: 2px 7px;
  border-radius: var(--radius-xs);
}

/* Editorial Section */
.editorial {
  background: var(--green-dark);
  color: white;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin: 30px 5% 50px;
  box-shadow: var(--shadow-md);
}
.editorial img { height: 440px; object-fit: cover; object-position: top; }
.editorial-copy {
  padding: 50px 8%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.editorial h2 { color: #fff; margin-bottom: 16px; }
.editorial p { color: #d1d5db; line-height: 1.6; margin-bottom: 24px; font-size: 15px; }
.editorial .btn { background: #fff; color: var(--green); width: fit-content; }
.editorial .btn:hover { background: var(--cream); color: var(--green-dark); }

/* Testimonials */
.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.testimonial-card {
  background: var(--cream);
  border: 1px solid #e8e2d5;
  border-radius: var(--radius-md);
  padding: 24px;
  display: flex;
  flex-direction: column;
}
.testimonial-card .stars { color: #eab308; font-size: 14px; margin-bottom: 12px; }
.testimonial-card p { font-size: 13.5px; font-style: italic; line-height: 1.6; color: var(--ink-light); flex: 1; }
.customer-info { margin-top: 16px; padding-top: 12px; border-top: 1px solid #e2dbce; display: flex; flex-direction: column; }
.customer-info strong { font-size: 13px; color: var(--ink); }
.customer-info span { font-size: 11px; color: var(--muted); }

/* Benefits / Trust Strip */
.benefits {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #ffffff;
  padding: 34px 5%;
  text-align: center;
  gap: 24px;
}
.benefits div { display: flex; flex-direction: column; align-items: center; }
.benefits i { font-size: 26px; font-style: normal; margin-bottom: 8px; color: var(--green); }
.benefits strong { font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 4px; }
.benefits span { font-size: 12px; color: var(--muted); line-height: 1.4; }

/* Product Detail Page (PDP) */
.detail {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 6%;
  padding: 40px 6% 70px;
  max-width: 1320px;
  margin: 0 auto;
}
.gallery-main {
  width: 100%;
  aspect-ratio: 4/5;
  border-radius: var(--radius-md);
  background: var(--cream);
  object-fit: cover;
  box-shadow: var(--shadow-sm);
  transition: opacity .2s ease;
}
.thumbs {
  display: flex;
  gap: 10px;
  margin-top: 14px;
  overflow-x: auto;
  padding-bottom: 6px;
  scrollbar-width: thin;
}
.thumbs button {
  border: 2px solid transparent;
  border-radius: var(--radius-sm);
  overflow: hidden;
  width: 68px;
  height: 85px;
  flex-shrink: 0;
  padding: 0;
  transition: border-color .15s ease, transform .15s ease;
}
.thumbs button:hover {
  transform: translateY(-2px);
  border-color: #cbd5e1;
}
.thumbs button:focus, .thumbs button.active {
  border-color: var(--green);
}
.thumbs img { height: 100%; width: 100%; object-fit: cover; }
.photo-note { font-size: 11px; color: var(--muted); margin-top: 12px; }

.detail-info { display: flex; flex-direction: column; }
.detail-rating { display: flex; align-items: center; gap: 6px; font-size: 12px; margin-bottom: 8px; }
.detail-rating .stars { color: #eab308; font-size: 14px; }
.detail-info h1 { font-size: clamp(26px, 3.2vw, 36px); margin: 6px 0 14px; }
.detail-price-box { margin-bottom: 16px; }
.detail-price-box .price { font-size: 26px; }
.detail-price-box .price-orig { font-size: 16px; }
.detail-price-box .price-save { font-size: 13px; }
.detail-stock-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  font-weight: 700;
  color: #15803d;
  background: #dcfce7;
  padding: 4px 10px;
  border-radius: var(--radius-full);
  width: fit-content;
}

/* Option Groups (Sizes / Colors) */
.option-group { margin: 18px 0; }
.option-label-row { display: flex; justify-content: space-between; font-size: 12.5px; font-weight: 600; margin-bottom: 8px; }
.option-choices { display: flex; gap: 8px; flex-wrap: wrap; }
.option-choices label {
  border: 1.5px solid var(--line);
  padding: 8px 16px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: all .15s ease;
  user-select: none;
  background: #fff;
}
.option-choices label:hover {
  border-color: #94a3b8;
}
.option-choices label:has(input:checked) {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
  box-shadow: 0 2px 8px rgba(15, 61, 46, 0.25);
}
.option-choices label.sold-out {
  opacity: .4;
  text-decoration: line-through;
  cursor: not-allowed;
  background: #f1f5f9;
}
.option-choices input { position: absolute; opacity: 0; pointer-events: none; }

.detail-actions {
  display: flex;
  gap: 12px;
  margin: 22px 0 14px;
}
.detail-actions input[type="number"] {
  width: 70px;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  padding: 12px;
}
.detail-actions .btn { flex: 1; padding: 14px 24px; font-size: 14px; letter-spacing: .5px; }

/* Product Detail Page Trust Cards (Myntra / Zara Style) */
.detail-trust-strip {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  background: #fafaf9;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 14px;
  margin: 22px 0;
}
.trust-badge-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 10px;
  background: #ffffff;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line-light);
  box-shadow: 0 1px 2px rgba(0,0,0,0.02);
  transition: transform .15s ease, border-color .15s ease;
}
.trust-badge-card:hover {
  transform: translateY(-1px);
  border-color: #cbd5e1;
}
.trust-badge-icon {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  background: var(--green-light);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  flex-shrink: 0;
}
.trust-badge-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.trust-badge-text strong {
  font-size: 11.5px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.trust-badge-text span {
  font-size: 10.5px;
  color: var(--muted);
  line-height: 1.3;
}

.detail details {
  border-top: 1px solid var(--line);
  padding: 16px 0;
}
.detail summary {
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
}
.detail summary::after { content: '+'; font-size: 18px; font-weight: 400; color: var(--muted); }
.detail details[open] summary::after { content: '−'; }
.detail details p { margin: 12px 0 0; color: #4b5563; line-height: 1.7; font-size: 13.5px; }

.product-specs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 18px;
  margin-top: 14px;
  font-size: 13px;
}
.product-specs div { border-bottom: 1px solid var(--line-light); padding-bottom: 6px; }
.product-specs dt { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .5px; }
.product-specs dd { margin: 2px 0 0; font-weight: 600; color: var(--ink); }

/* Customer Reviews Section */
.reviews-section {
  border-top: 1px solid var(--line);
  padding: 18px 0;
}
.reviews-card {
  background: #fafaf9;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 20px;
  margin-top: 14px;
}
.reviews-rating-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 18px;
  flex-wrap: wrap;
  gap: 12px;
}
.reviews-score-block { display: flex; flex-direction: column; }
.reviews-avg-num {
  font-size: 36px;
  font-weight: 700;
  color: var(--green);
  line-height: 1;
  font-family: var(--font-serif);
}
.reviews-score-block .stars { color: #eab308; font-size: 16px; margin: 4px 0 2px; }
.reviews-badge-verified {
  background: #dcfce7;
  color: #15803d;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: var(--radius-full);
}
.reviews-grid { display: flex; flex-direction: column; gap: 14px; }
.review-box {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.02);
}
.review-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.review-buyer { display: flex; align-items: center; gap: 8px; }
.review-buyer strong { font-size: 13px; color: var(--ink); }
.verified-tag {
  font-size: 10.5px;
  font-weight: 600;
  color: #15803d;
  background: #f0fdf4;
  padding: 2px 6px;
  border-radius: 4px;
}
.review-time { font-size: 11px; color: var(--muted); }
.review-stars-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.review-stars-row .stars { color: #eab308; font-size: 12px; }
.review-title-text { font-size: 12.5px; font-weight: 700; color: var(--ink); }
.review-text { font-size: 13px; color: #4b5563; line-height: 1.55; margin: 0; }

/* Cart & Checkout Layout */
.page-heading { padding: 36px 5% 20px; background: var(--cream); border-bottom: 1px solid var(--line); margin-bottom: 30px; }
.page-heading h1 { font-size: clamp(28px, 3.4vw, 38px); margin: 6px 0 0; }
.breadcrumb { font-size: 12px; color: var(--muted); }
.breadcrumb a { color: var(--muted); }
.breadcrumb a:hover { color: var(--green); }

.cart-layout {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 5%;
  max-width: 1240px;
  margin: 0 auto;
}
.cart-row {
  display: grid;
  grid-template-columns: 85px 1fr auto;
  gap: 18px;
  padding: 18px;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  margin-bottom: 14px;
  align-items: center;
  box-shadow: var(--shadow-xs);
}
.cart-row img { height: 110px; border-radius: var(--radius-sm); object-fit: cover; }
.cart-row h3 { font-size: 14px; font-weight: 600; margin: 0 0 6px; }
.cart-row small { color: var(--muted); font-size: 12px; display: block; }
.cart-row button {
  border: 1px solid var(--line);
  background: white;
  padding: 5px 12px;
  border-radius: 4px;
  font-weight: 600;
  transition: all .15s ease;
}
.cart-row button:hover { border-color: var(--green); color: var(--green); }

.order-summary {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 26px;
  height: fit-content;
  box-shadow: var(--shadow-sm);
  position: sticky;
  top: 96px;
}
.order-summary h2 { font-size: 20px; margin-bottom: 18px; border-bottom: 1px solid var(--line-light); padding-bottom: 12px; }
.order-summary p { display: flex; justify-content: space-between; font-size: 13.5px; margin: 10px 0; color: var(--ink-light); }
.order-summary strong { color: var(--ink); font-size: 15px; }

/* Checkout Form */
.checkout-fields label { display: block; margin-bottom: 16px; font-size: 12px; font-weight: 600; color: var(--ink-light); }
.checkout-fields input {
  width: 100%;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-top: 6px;
  font-size: 14px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.checkout-fields input:focus {
  border-color: var(--green);
  outline: none;
  box-shadow: 0 0 0 3px rgba(15,61,46,0.12);
}
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.payment-options { margin: 24px 0; border: 0; padding: 0; }
.payment-options legend { font-size: 15px; font-weight: 700; margin-bottom: 12px; display: block; color: var(--ink); }
.payment-options label {
  display: flex !important;
  align-items: flex-start;
  gap: 14px;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-md);
  padding: 16px 18px;
  margin: 10px 0;
  background: #ffffff;
  cursor: pointer;
  transition: all .15s ease;
}
.payment-options label:hover { border-color: #cbd5e1; }
.payment-options label:has(input:checked) {
  border-color: var(--green);
  background: var(--green-light);
  box-shadow: 0 0 0 1px var(--green);
}
.payment-options input[type="radio"] { width: 18px !important; min-width: 18px; accent-color: var(--green); margin-top: 3px !important; }
.payment-options span strong { display: block; font-size: 13.5px; color: var(--ink); }
.payment-options span small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 3px; line-height: 1.45; }
.checkout-consent { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; margin: 16px 0; line-height: 1.55; }
.checkout-total { background: var(--cream); border-radius: var(--radius-md); padding: 18px; margin: 18px 0; border: 1px solid var(--line-light); }
.checkout-total p { display: flex; justify-content: space-between; font-size: 13.5px; margin: 8px 0; }

/* Professional Checkout Trust Guarantee (Amazon / Myntra Style) */
.checkout-trust-box {
  margin-top: 20px;
  border-radius: var(--radius-md);
  background: #fbfbfa;
  border: 1px solid var(--line);
  padding: 16px 18px;
  box-shadow: var(--shadow-xs);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.checkout-trust-header {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--line-light);
  padding-bottom: 10px;
}
.trust-shield-icon {
  width: 24px;
  height: 24px;
  color: var(--green);
  flex-shrink: 0;
}
.checkout-trust-header strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}
.checkout-trust-header p {
  margin: 2px 0 0;
  font-size: 11px;
  color: var(--muted);
  line-height: 1.3;
}
.checkout-trust-perks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 10px;
}
.checkout-trust-perks div {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--ink-light);
}
.checkout-trust-perks i {
  font-style: normal;
  font-size: 13px;
}
.checkout-pay-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--line-light);
}
.pay-chip {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 600;
  color: #475569;
  letter-spacing: .3px;
}

/* Address Autocomplete & Public APIs Integration */
.address-field-wrap {
  position: relative;
  margin-bottom: 16px;
}
.address-field-wrap label {
  margin-bottom: 0 !important;
}
.address-suggestions-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1.5px solid var(--green);
  border-top: none;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  box-shadow: var(--shadow-lg);
  max-height: 260px;
  overflow-y: auto;
  z-index: 1000;
  margin-top: -2px;
}
.address-suggestion-item {
  padding: 12px 14px;
  cursor: pointer;
  border-bottom: 1px solid var(--line-light);
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: var(--ink);
  transition: background .15s ease;
  line-height: 1.4;
}
.address-suggestion-item:last-child {
  border-bottom: none;
}
.address-suggestion-item:hover,
.address-suggestion-item.active {
  background: #f4f8f5;
  color: var(--green);
}
.address-suggestion-icon {
  flex-shrink: 0;
  margin-top: 2px;
  font-size: 14px;
}
.address-suggestion-main {
  font-weight: 600;
  color: var(--ink);
  display: block;
  font-size: 13px;
}
.address-suggestion-sub {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
  display: block;
}
.field-hint {
  font-size: 11px;
  color: var(--muted);
  font-weight: 500;
  display: block;
  margin-top: 4px;
}
.postcode-status {
  font-size: 12px;
  font-weight: 600;
  margin-top: 5px;
  display: block;
  min-height: 16px;
  transition: all .2s ease;
}
.postcode-status.success {
  color: #15803d;
}
.postcode-status.loading {
  color: var(--muted);
}
.postcode-status.error {
  color: #b74c49;
}
.field-highlight {
  animation: fieldFlash 1.4s ease;
}
@keyframes fieldFlash {
  0% { background-color: #dcfce7; border-color: #16a34a; box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.2); }
  100% { background-color: #ffffff; border-color: var(--line); box-shadow: none; }
}

/* Modals & Dialogs (Zero Scrollbars & Zero Overlaps) */
dialog#modal,
dialog#modal * {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
dialog#modal::-webkit-scrollbar,
dialog#modal *::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}
dialog#modal {
  border: 1px solid rgba(15, 61, 46, 0.1);
  padding: 24px 26px;
  border-radius: var(--radius-lg);
  width: min(440px, 92vw);
  max-height: calc(100vh - 40px);
  box-shadow: 0 25px 60px -10px rgba(15, 61, 46, 0.25), 0 10px 20px -5px rgba(0, 0, 0, 0.1);
  background: #ffffff;
  position: fixed;
  overflow-y: auto;
  overflow-x: hidden;
}
@keyframes modalIn {
  from { opacity: 0; transform: translateY(14px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
dialog#modal[open] {
  animation: modalIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
dialog::backdrop {
  background: rgba(8, 33, 24, 0.65);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
dialog .close {
  position: absolute;
  right: 14px;
  top: 14px;
  font-size: 20px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  color: var(--muted);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
  z-index: 10;
}
dialog .close:hover {
  background: var(--cream);
  color: var(--ink);
}

/* Luxury Auth Modal & Account System */
.auth-modal {
  display: flex;
  flex-direction: column;
}
.auth-header {
  margin-bottom: 12px;
  text-align: left;
}
.auth-header h2 {
  font-size: 20px;
  margin: 0 0 4px;
  color: var(--green);
}
.auth-header p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  margin: 0;
}

/* Auth Segmented Tabs */
.auth-tabs {
  display: flex;
  background: var(--cream);
  border-radius: var(--radius-full);
  padding: 3px;
  margin-bottom: 14px;
  border: 1px solid var(--line);
}
.auth-tab {
  flex: 1;
  border: none;
  background: transparent;
  padding: 8px 14px;
  border-radius: var(--radius-full);
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  transition: all .2s ease;
  text-align: center;
}
.auth-tab.active {
  background: #ffffff;
  color: var(--green);
  box-shadow: var(--shadow-xs);
  font-weight: 700;
}

/* Google OAuth Button */
.google-auth-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #ffffff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  color: #3c4043;
  cursor: pointer;
  transition: all .2s ease;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.google-auth-btn:hover {
  background: #fafaf9;
  border-color: #cbd5e1;
  box-shadow: var(--shadow-xs);
  transform: translateY(-1px);
}
.google-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

/* Auth Divider */
.auth-divider {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 12px 0;
  color: var(--muted);
  font-size: 11px;
}
.auth-divider::before,
.auth-divider::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid var(--line-light);
}
.auth-divider span {
  padding: 0 10px;
}

/* Auth Form Fields (Zero Overlap!) */
.auth-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.auth-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.auth-field label {
  display: block !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--ink-light) !important;
  margin: 0 !important;
  text-align: left;
}
.auth-field input {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1.5px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  font-size: 13.5px !important;
  margin: 0 !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.auth-field input:focus {
  border-color: var(--green) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(15, 61, 46, 0.12) !important;
}

.auth-submit-btn {
  width: 100% !important;
  padding: 11px 16px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px;
  margin-top: 4px;
}

/* Error and Status Message */
.auth-message {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.4;
  border-radius: 6px;
  transition: all .2s ease;
}
.auth-message:not(:empty) {
  padding: 8px 12px;
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}
.auth-message.success:not(:empty) {
  background: #f0fdf4;
  color: #15803d;
  border-color: #bbf7d0;
}

/* 1-Line Security Note */
.auth-security-line {
  margin-top: 10px;
  font-size: 11px;
  color: #4a5c53;
  text-align: center;
  background: #f7faf8;
  border: 1px solid #e1ebe5;
  border-radius: var(--radius-sm);
  padding: 6px 10px;
}

.auth-legal {
  font-size: 10px;
  color: var(--muted);
  line-height: 1.5;
  margin-top: 8px;
  text-align: center;
}
.auth-legal a {
  color: var(--green);
  text-decoration: underline;
}

/* OTP Code Input Screen */
.otp-display-box {
  background: var(--cream);
  border: 1.5px dashed var(--gold);
  border-radius: var(--radius-md);
  padding: 12px;
  text-align: center;
  margin: 10px 0;
}
.otp-code-large {
  font-family: monospace;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 8px;
  color: var(--green);
  display: block;
}
.otp-input-field {
  text-align: center !important;
  font-family: monospace !important;
  font-size: 24px !important;
  letter-spacing: 8px !important;
  font-weight: 700 !important;
  padding: 10px 14px !important;
}
.auth-actions-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
}
.account-order {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  margin-bottom: 10px;
  background: #fafaf9;
}
.account-order strong { font-size: 14px; color: var(--green); }
.account-order p { margin: 4px 0 6px; font-size: 12.5px; color: var(--muted); }
.auth-switch {
  background: none;
  border: none;
  color: var(--green);
  text-decoration: underline;
  font-size: 12px;
  cursor: pointer;
  padding: 0;
  font-weight: 600;
}

/* Bag Modal */
.bag-modal { display: flex; flex-direction: column; gap: 14px; }
.bag-modal-header { display: flex; align-items: center; gap: 10px; color: var(--green); font-weight: 700; font-size: 17px; }
.bag-modal-item { display: flex; gap: 16px; align-items: center; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.bag-modal-item img { width: 68px; height: 90px; object-fit: cover; border-radius: var(--radius-sm); background: var(--cream); flex-shrink: 0; }
.bag-modal-actions { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }

/* Toast */
#toast {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: rgba(15, 61, 46, 0.95);
  backdrop-filter: blur(8px);
  color: white;
  padding: 12px 24px;
  border-radius: var(--radius-full);
  font-size: 13px;
  font-weight: 600;
  z-index: 99999;
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
  opacity: 0;
  pointer-events: none;
  transition: transform .25s cubic-bezier(0.16, 1, 0.3, 1), opacity .25s ease;
  white-space: nowrap;
}
#toast.show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

/* Footer */
footer {
  background: var(--green-dark);
  color: #d1d5db;
  padding: 60px 5% 30px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1.5fr;
  gap: 36px;
  font-size: 13px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
footer h4 { color: #ffffff; font-size: 13px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 16px; font-weight: 700; }
footer a { color: #9ca3af; display: block; margin-bottom: 10px; transition: color .15s ease; }
footer a:hover { color: #ffffff; }
footer .brand { font-size: 24px; color: #fff; text-align: left; }
footer .brand small { color: var(--gold); text-align: left; }
.payment-methods-strip {
  grid-column: 1/-1;
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 24px;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 12px;
  color: #9ca3af;
}
.payment-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.badge-pill {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  color: #fff;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
}
.business-details {
  grid-column: 1/-1;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 20px;
  font-size: 12px;
  color: #9ca3af;
  line-height: 1.7;
}
.business-details strong { color: #fff; }
.business-details a { display: inline; color: var(--gold-light); }
.copyright {
  grid-column: 1/-1;
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 20px;
  margin-top: 10px;
  font-size: 11.5px;
  color: #6b7280;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

/* Catalog Controls & Search */
.controls-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.controls-bar input[type="search"] {
  border: 1.5px solid var(--line);
  background: #fff;
  padding: 9px 14px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  min-width: 220px;
  flex: 1;
}
.controls-bar select {
  border: 1.5px solid var(--line);
  background: #fff;
  padding: 9px 14px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

/* Empty State */
.empty {
  padding: 70px 20px;
  text-align: center;
  grid-column: 1/-1;
  color: var(--muted);
  background: var(--cream);
  border-radius: var(--radius-lg);
  border: 1px dashed var(--line);
}

/* Prose & Policies */
.prose { max-width: 820px; padding: 50px 24px; margin: 0 auto; }
.prose h1 { font-size: 38px; margin-bottom: 20px; }
.prose h2 { font-size: 22px; margin-top: 36px; margin-bottom: 14px; color: var(--green); }
.prose p, .prose li { color: #374151; line-height: 1.8; font-size: 14px; }
.contact-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 24px;
  margin: 20px 0;
  box-shadow: var(--shadow-xs);
}
.contact-card h2 { margin-top: 0; font-size: 18px; color: var(--green); }

/* Responsive Media Queries */
@media(max-width: 1050px) {
  header { padding: 0 4%; }
  .hero-copy { padding: 50px 6%; }
  .products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 16px; }
  footer { grid-template-columns: repeat(3, 1fr); }
  .footer-brand { grid-column: 1/-1; }
  .category { aspect-ratio: 1/1; }
  .testimonials-grid { grid-template-columns: 1fr; }
}

@media(max-width: 768px) {
  header { height: 62px; padding: 0 4%; gap: 10px; }
  nav { display: none; }
  .mobile-menu { display: flex !important; }
  
  .brand {
    font-size: clamp(18px, 4.5vw, 22px);
    max-width: calc(100% - 170px);
  }
  .brand small { font-size: 7.5px; letter-spacing: 1.5px; }
  
  .tools { gap: 4px; }
  .tools button { width: 34px; height: 34px; }
  .tools svg { width: 18px; height: 18px; }
  
  /* Mobile Bottom Navigation Bar Active */
  .mobile-bottom-bar {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 56px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid var(--line);
    z-index: 990;
    justify-content: space-around;
    align-items: center;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
    padding: 0 4px;
  }
  .mobile-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    color: var(--ink-light);
    font-size: 10px;
    font-weight: 600;
    text-decoration: none;
    background: none;
    border: none;
    padding: 6px 10px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.15s ease, transform 0.1s ease;
  }
  .mobile-nav-item:active { transform: scale(0.92); }
  .mobile-nav-item svg { width: 20px; height: 20px; stroke-width: 1.8; }
  .mobile-nav-bag-wrap { position: relative; display: flex; align-items: center; justify-content: center; }
  .mobile-bag-count {
    position: absolute;
    top: -4px;
    right: -8px;
    background: var(--green);
    color: white;
    border-radius: var(--radius-full);
    font-size: 9px;
    font-weight: 700;
    min-width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
  }
  
  /* Ensure page content does not hide behind bottom bar */
  main#app { padding-bottom: 68px; }
  footer { padding-bottom: 84px !important; }

  /* Announcement bar */
  .announcement {
    font-size: 9.5px;
    padding: 7px 10px;
    gap: 12px;
  }

  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { padding: 36px 5% 24px; }
  .hero h1 { font-size: 34px; }
  .hero-visual { padding: 0 5% 30px; gap: 12px; }
  .hero-img-wrap img { height: 250px; }
  .category-grid { grid-template-columns: 1fr; gap: 14px; }
  .category { aspect-ratio: 16/9; }
  
  .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 10px;
  }
  .product-info { padding: 10px 10px 12px; }
  .product h3 { font-size: 12.5px; height: 34px; }
  .price { font-size: 13.5px; }
  .quick { display: none; }
  
  .detail { grid-template-columns: 1fr; padding: 20px 4% 50px; }
  .detail h1 { font-size: 24px; }
  .detail-trust-strip { grid-template-columns: 1fr; }
  
  .cart-layout { grid-template-columns: 1fr; }
  .editorial { grid-template-columns: 1fr; margin: 20px 4%; }
  .editorial img { height: 280px; }
  .editorial-copy { padding: 30px 6%; }
  .benefits { grid-template-columns: 1fr 1fr; padding: 24px 4%; gap: 18px; }
  footer { grid-template-columns: 1fr; gap: 24px; padding: 40px 5% 24px; }
  
  /* Checkout responsiveness */
  .field-pair { grid-template-columns: 1fr; gap: 0; }
  .checkout-trust-perks { grid-template-columns: 1fr; }
}

@media(max-width: 480px) {
  header { padding: 0 12px; }
  .tools { gap: 2px; }
  .tools button { width: 32px; height: 32px; }
  .products { gap: 12px 8px; }
  .product-info { padding: 8px; }
  .product h3 { font-size: 11.5px; height: 32px; line-height: 1.35; margin-bottom: 4px; }
  .price { font-size: 12.5px; gap: 4px; }
  .price-orig { font-size: 10.5px; }
  .price-save { font-size: 9.5px; padding: 1px 4px; }
  .tag-stock { font-size: 9px; padding: 1px 5px; }
  .benefits { grid-template-columns: 1fr; }
}


/* =======================================================
   HIGH-FASHION MODERN EXTENSIONS (ATTIRE MART)
   ======================================================= */

/* 1. Category Story Circles Rail */
.category-rail-section {
  padding: 16px 0 8px;
  background: #ffffff;
  border-bottom: 1px solid var(--line-light);
}
.category-rail-scroll {
  display: flex;
  gap: 22px;
  padding: 4px 5% 10px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.category-rail-scroll::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
}
.category-bubble {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  flex-shrink: 0;
  width: 72px;
  cursor: pointer;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.category-bubble:hover {
  transform: translateY(-2px);
}
.category-bubble:active {
  transform: scale(0.96);
}
.bubble-avatar {
  width: 66px;
  height: 66px;
  border-radius: 50%;
  overflow: hidden;
  padding: 2.5px;
  border: 2px solid #e4e4e7;
  background: #ffffff;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.category-bubble:hover .bubble-avatar {
  border-color: var(--brand);
  box-shadow: 0 4px 12px rgba(255, 63, 108, 0.25);
}
.bubble-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.category-bubble:hover .bubble-avatar img {
  transform: scale(1.08);
}
.category-bubble span {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink);
  text-align: center;
  white-space: nowrap;
  letter-spacing: -0.2px;
}

/* 2. Hero Elements */
.hero-badge {
  display: inline-block;
  background: var(--brand-light);
  color: var(--brand);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 5px 12px;
  border-radius: var(--radius-full);
  margin-bottom: 12px;
}
.hero-cta-group {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 20px;
}
.hero-trust-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 6px 14px;
  border-radius: var(--radius-full);
  font-size: 12px;
  margin-top: 18px;
}
.trending-tag {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: rgba(17, 24, 39, 0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: var(--radius-full);
}

/* 3. Product Cards Modern Badges */
.product-rating-badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-radius: 4px;
  padding: 3px 7px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #111827;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
  z-index: 2;
}
.product-rating-badge span {
  color: #f59e0b;
  font-size: 12px;
}
.product-rating-badge small {
  color: #6b7280;
  font-weight: 500;
}
.card-brand {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: #9ca3af;
  text-transform: uppercase;
  margin-bottom: 3px;
  display: block;
}
.cat-pill {
  font-size: 10.5px;
  font-weight: 600;
  color: #6b7280;
  background: #f1f5f9;
  padding: 2px 7px;
  border-radius: 4px;
}
.tag-stock {
  font-size: 10px;
  font-weight: 600;
  color: #059669;
}

/* 4. Customer Review Photos Rail & Buttons */
.write-review-btn {
  background: var(--brand) !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 10px 18px !important;
  border-radius: var(--radius-sm) !important;
  transition: all .2s ease !important;
  box-shadow: 0 2px 8px rgba(255, 63, 108, 0.25) !important;
  border: none !important;
  cursor: pointer !important;
}
.write-review-btn:hover {
  background: var(--brand-dark) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 14px rgba(255, 63, 108, 0.35) !important;
}
.customer-photos-section {
  margin: 18px 0;
  padding: 16px;
  background: #f8fafc;
  border-radius: var(--radius-md);
  border: 1px solid var(--line);
}
.customer-photos-section h4 {
  font-size: 13.5px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 10px;
}
.customer-photos-rail {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
}
.customer-photos-rail::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
}
.customer-photo-thumb {
  width: 72px;
  height: 96px;
  border-radius: 8px;
  overflow: hidden;
  border: 1.5px solid #e2e8f0;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  background: #ffffff;
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.customer-photo-thumb:hover {
  transform: scale(1.05);
  border-color: var(--brand);
}
.customer-photo-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.review-attached-photos {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;
}
.review-attached-photos img {
  width: 64px;
  height: 84px;
  border-radius: 6px;
  object-fit: cover;
  border: 1px solid #e2e8f0;
  cursor: pointer;
  transition: transform 0.2s ease;
}
.review-attached-photos img:hover {
  transform: scale(1.06);
}

/* 5. Photo Lightbox Modal */
.photo-lightbox-modal {
  position: relative;
  text-align: center;
  padding: 6px;
}
.lightbox-img {
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}
.lightbox-caption {
  margin-top: 12px;
  font-size: 13px;
  color: #374151;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lightbox-caption span {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #9ca3af;
  font-weight: 700;
}

/* 6. Verified Review Gate & Star Picker */
.verified-gate-modal {
  text-align: center;
  padding: 8px 4px;
}
.gate-icon-badge {
  font-size: 40px;
  margin-bottom: 6px;
  display: inline-block;
}
.gate-tip-box {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 8px;
  padding: 12px;
  margin: 14px 0;
  text-align: left;
  font-size: 12.5px;
  color: #166534;
  line-height: 1.45;
}
.star-rating-picker {
  display: flex;
  gap: 8px;
  font-size: 32px;
  cursor: pointer;
  justify-content: center;
  margin: 6px 0 14px;
}
.star-pick {
  color: #d1d5db;
  transition: color 0.15s ease, transform 0.1s ease;
  user-select: none;
}
.star-pick:hover {
  transform: scale(1.2);
}
.star-pick.active {
  color: #f59e0b;
}

/* 7. Sleek Checkout Trust Strip (Amazon / Myntra Style) */
.checkout-trust-strip {
  margin-top: 18px;
  border-radius: var(--radius-md);
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.trust-header-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.trust-badge-svg {
  width: 22px;
  height: 22px;
  color: #059669;
  flex-shrink: 0;
}
.trust-header-row strong {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  color: #111827;
}
.trust-header-row span {
  display: block;
  font-size: 11px;
  color: #64748b;
}
.trust-pill-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.trust-pill-badges span {
  font-size: 11px;
  color: #334155;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 3px 8px;
  font-weight: 500;
}
.checkout-pay-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid #e2e8f0;
}
.pay-chip {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  padding: 3px 8px;
  font-size: 10.5px;
  font-weight: 600;
  color: #334155;
}


/* ==========================================
   ATTIRE MART | Modern editorial boutique
   Byutify-referenced visual hierarchy, original ATTIRE MART identity
   Pure presentation: product data, pricing and commerce rules unchanged.
   ========================================== */
:root{
 --brand:#9c334c;--brand-dark:#782239;--brand-light:#fff3f5;--brand-subtle:#fce8ed;
 --green:#32282b;--green-dark:#261c20;--green-light:#f8f2f1;--green-accent:#6f5056;--green-subtle:#fffbf9;
 --gold:#b68a5a;--gold-dark:#997145;--gold-light:#faf5ed;
 --sale:#a22c48;--sale-light:#fdf0f2;
 --ink:#2f2728;--ink-light:#5e5051;--muted:#817276;--muted-light:#a79a9c;
 --cream:#fcf9f6;--cream-dark:#f5efeb;--line:#e9e0dd;--line-light:#f4ede9;
 --surface:#fff;--radius-sm:9px;--radius-md:15px;--radius-lg:20px;
 --shadow-sm:0 7px 28px rgba(76,44,45,.055);--shadow-md:0 15px 40px rgba(71,37,41,.09);
 --font-serif:'Playfair Display',Georgia,'Times New Roman',serif
}
html{scroll-padding-top:90px}
body{background:#fffdfb;color:var(--ink)}
h1,h2,.serif{font-weight:500;letter-spacing:-.028em}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.announcement{background:#582c3c;color:#fff7f2;font-size:10px;letter-spacing:.12em;min-height:34px}
.announcement i{color:#f1b7b1}
header{background:rgba(255,253,251,.98);border-bottom:1px solid #efe3e1;box-shadow:0 3px 18px rgba(69,34,40,.035);height:82px}
.brand{font-family:'Playfair Display',Georgia,serif!important;font-weight:600;letter-spacing:.085em;color:#512d3a}
.brand small{font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:.25em}
header nav a{font-size:12px;font-weight:650;text-transform:uppercase;letter-spacing:.07em}
header nav a:hover{color:var(--brand)}
.tools button{color:#4b303b}
.tools button:hover{background:#fff0f0;color:#8f2c4b}
.btn{background:var(--brand);color:#fff;border:1px solid var(--brand);font-weight:700;letter-spacing:.02em;border-radius:8px;box-shadow:none;transition:background .2s,border-color .2s,transform .2s}
.btn:hover{background:var(--brand-dark);border-color:var(--brand-dark);transform:translateY(-1px)}
.btn.light{background:#fff;border:1px solid #cfb9b9;color:#543b41}
.btn.light:hover{background:#fff5f4;border-color:var(--brand)}
.eyebrow{color:var(--brand);letter-spacing:.18em;font-weight:750}
.section{max-width:1450px}
.section-head h2{font-family:'Playfair Display',Georgia,serif;letter-spacing:-.045em}
.section-head .text-link{color:var(--brand);font-weight:700}
.category-rail-section{background:#fffaf6;border-bottom:1px solid var(--line)}
.category-bubble .bubble-avatar{box-shadow:0 4px 14px rgba(77,42,48,.07);border:3px solid #fff;outline:1px solid #ebdcd6}
.category-bubble:hover .bubble-avatar{outline-color:var(--brand)}
.category-bubble span{font-size:12px;color:#5e464e}
.hero{background:linear-gradient(125deg,#fbf1ed 0%,#fffaf6 48%,#f8e9e7 100%);border-bottom:1px solid #f1e4dc}
.hero h1{font-family:'Playfair Display',Georgia,serif;letter-spacing:-.045em;line-height:1.12}
.hero h1 em{color:#9b3554}
.hero-copy>p{line-height:1.9;color:#6a5557}
.hero-badge{background:#fff5ee;color:#8b4d54;border:1px solid #efd9d2;border-radius:40px}
.hero-img-wrap{box-shadow:0 24px 55px rgba(86,49,56,.12);border-radius:10px}
.ticker{background:#623344;color:#fff8f5}
.ticker i{color:#e9b09d}
.products{gap:25px 18px}
.product{background:#fff;border:1px solid #f1e8e4;border-radius:11px;overflow:hidden;box-shadow:0 3px 13px rgba(70,40,48,.03);transition:transform .25s,box-shadow .25s}
.product:hover{transform:translateY(-4px);box-shadow:0 15px 36px rgba(91,50,56,.105)}
.product-media{background:#f8f0eb;overflow:hidden}
.product-media img{transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.product:hover .product-media img{transform:scale(1.035)}
.product-info{padding:15px 15px 18px}
.product-info h3{line-height:1.5;font-weight:600}
.card-brand{letter-spacing:.14em;color:#946575}
.sale{background:#a6324f;color:#fff;border-radius:0 0 5px 0;font-weight:750;box-shadow:none}
.product-rating-badge{border:1px solid #f0e6dc;background:rgba(255,255,255,.94);color:#463b39}
.price{color:#74283f;align-items:baseline;gap:9px}
.price-orig{color:#9d9192}
.price-save{color:#19754f;background:#e9f5eb;border-radius:4px;padding:2px 6px}
.cat-pill{background:#f7eeeb;color:#765560;border:1px solid #eee0db}
.quick{background:rgba(255,253,251,.97);color:#6e2841;border:1px solid #f2e7e6}
.quick:hover{background:#762640;color:#fff}
.page-heading{background:linear-gradient(105deg,#fcf3ee,#fffdfb);border-bottom:1px solid #f0e2df;padding:42px 5% 26px}
.page-heading h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(31px,3vw,44px);color:#492f3a}
.breadcrumb{font-size:12px;color:#937b7b;letter-spacing:.02em}
.breadcrumb a:hover{color:var(--brand)}
/* Product detail page: generous photography, focused purchasing panel */
.detail-premium{max-width:1500px;grid-template-columns:minmax(0,1.08fr) minmax(0,.9fr);gap:clamp(30px,5.5vw,95px);padding:40px max(4%,20px) 86px;align-items:start}
.detail-premium>.gallery-column{position:sticky;top:106px;min-width:0}
.detail-premium .gallery-main{display:block;width:100%;max-height:720px;aspect-ratio:4/4.65;object-fit:contain;background:#f8f3ee;border:1px solid #eee5df;border-radius:11px;box-shadow:0 9px 25px rgba(68,41,40,.07);cursor:zoom-in}
.detail-premium .gallery-main:hover{filter:brightness(.98)}
.detail-premium .thumbs{gap:11px;padding:8px 2px 8px;scrollbar-color:#d4b8b8 transparent}
.detail-premium .thumbs button{width:78px;height:96px;border:1.5px solid #e8dedc;background:#faf6f3;border-radius:8px;outline-offset:2px}
.detail-premium .thumbs button:hover,.detail-premium .thumbs button.active{border-color:#9b3955;box-shadow:0 0 0 2px rgba(156,51,76,.11)}
.detail-premium .thumbs button img{object-fit:cover}
.detail-premium .photo-note{border-top:1px solid #f2e9e5;padding-top:13px;color:#97898a;line-height:1.65}
.detail-premium .detail-info{min-width:0}
.detail-premium .detail-info h1{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:clamp(30px,2.65vw,43px);line-height:1.27;letter-spacing:-.04em;margin:5px 0 18px}
.detail-premium .detail-rating{font-size:12px;gap:7px;background:#fbf4f0;border-radius:8px;width:fit-content;padding:6px 10px;color:#83616b}
.detail-premium .detail-rating .stars{color:#ce934d}
.detail-premium .detail-price-box{border-top:1px solid #efe4df;padding-top:20px;margin:5px 0 16px}
.detail-premium .detail-price-box .price>span:first-child{font-size:30px;font-weight:800;color:#742940}
.detail-premium .detail-price-box .price-orig{font-size:16px}
.detail-premium .detail-stock-badge{background:#eff7ef;color:#2e704e;border-radius:5px;padding:7px 11px;font-size:11.5px;margin-bottom:2px}
.detail-premium .detail-stock-badge.pending{background:#f8f1e8;color:#786657}
.detail-premium .detail-stock-badge.unavailable{background:#fff0ef;color:#ad3d42}
.variant-group{border:0;min-width:0;margin:21px 0 5px;padding:14px 0 5px;border-top:1px solid #f1e8e5;position:relative}
.variant-group legend{float:left;width:100%;font-size:12px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;color:#56414b;margin:0 0 14px}
.variant-group legend .chosen-label{font-weight:550;letter-spacing:normal;text-transform:none;margin-left:8px;color:#8b5a65}
.variant-group .option-tiles{clear:both;display:flex;gap:10px;flex-wrap:wrap;padding:3px 0 4px}
.variant-group .option-tile{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:48px;min-height:48px;padding:10px 14px;border:1.5px solid #e3d7d3;background:#fff;border-radius:7px;font-weight:700;font-size:12px;color:#5e4d51;cursor:pointer;transition:background .16s,border-color .16s,box-shadow .16s}
.variant-group .option-tile:hover{border-color:#bd7890}
.variant-group .option-tile:has(input:checked){background:#803049;color:#fff;border-color:#803049;box-shadow:0 2px 9px rgba(128,48,73,.14)}
.variant-group .option-tile:has(input:focus-visible){outline:2px solid #ae6980;outline-offset:3px}
.variant-group .option-tile.sold-out{opacity:.5;background:#faf8f7;color:#92898b;cursor:not-allowed}
.variant-group .option-tile input{position:absolute;width:1px;height:1px;opacity:0}
.variant-colour .option-tile{min-height:57px;gap:9px}
.variant-colour .colour-dot{width:22px;height:22px;border:2px solid #fff;outline:1px solid #d1bfc0;border-radius:100%;flex-shrink:0}
.variant-colour .option-tile:has(input:checked) .colour-dot{outline-color:#ebc2cd}
.size-guide-link{float:right;margin:-2px 0 8px;color:#803049;text-decoration:underline;text-underline-offset:3px;font-size:12px;font-weight:700}
.size-guide-link:hover{color:#4b2634}
.variant-message{font-size:12px;line-height:1.5}
.purchase-options{margin:20px 0}
.purchase-options .quantity-label{display:block;font-weight:750;font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:11px;color:#5e4550}
.detail-premium .detail-actions{display:grid;grid-template-columns:144px minmax(0,1fr);gap:11px;margin:0 0 11px}
.detail-premium .detail-actions input[type=number]{width:54px;min-width:0;border:0!important;border-radius:0;padding:8px 0;background:transparent;text-align:center;appearance:textfield;-moz-appearance:textfield}
.detail-premium .detail-actions input::-webkit-outer-spin-button,.detail-premium .detail-actions input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.quantity-stepper{display:flex;align-items:center;justify-content:space-between;height:53px;border:1.5px solid #ddccc8;background:#fff;border-radius:7px;overflow:hidden}
.quantity-stepper button{flex:1;max-width:44px;height:100%;display:grid;place-items:center;color:#754854;font-size:21px}
.quantity-stepper button:hover{background:#fdf1f1}
.detail-premium .detail-actions .add-to-bag{height:53px;background:#fff;color:#87344d;border:1.5px solid #923b54;letter-spacing:.055em;text-transform:uppercase;border-radius:7px;font-size:12px;box-shadow:none}
.detail-premium .detail-actions .add-to-bag:hover{background:#faeef0}
.buy-now-btn{display:block;width:100%;height:53px;background:#87334d!important;border-color:#87334d!important;border-radius:7px;font-size:13px;text-transform:uppercase;letter-spacing:.085em}
.buy-now-btn:hover{background:#67283e!important;border-color:#67283e!important}
.detail-trust-strip{background:#fffaf7;border:1px solid #eee1de;border-radius:10px;gap:10px;padding:12px}
.trust-badge-card{border:1px solid #f0e6df;background:#fff;border-radius:8px;box-shadow:none}
.trust-badge-icon{background:#fbf1ed}
.detail-premium .detail-info details{padding:17px 0;border-top:1px solid #eee3df}
.detail-premium .detail-info details summary{font-weight:700;font-size:13.5px;letter-spacing:.01em}
.detail-premium .detail-info details p{color:#74656a}
.product-specs dt{color:#937f84}
.product-specs dd{color:#4c3b44}
.reviews-card{background:#fffaf8;border:1px solid #ebdfdb;border-radius:11px}
.review-box{border-color:#f0e7e3;border-radius:9px}
.verified-tag{background:#eef7ed}
/* Cart: airy product rows and clearly separated order summary */
.cart-layout{max-width:1330px;gap:clamp(24px,4vw,58px);grid-template-columns:minmax(0,1.48fr) minmax(310px,1fr);align-items:start}
.cart-row{border-color:#eee3df;border-radius:13px;padding:18px;gap:18px;box-shadow:0 3px 20px rgba(69,34,42,.04);grid-template-columns:100px minmax(0,1fr) auto}
.cart-row img{height:125px;width:100px;object-fit:cover;border-radius:8px}
.cart-row h3{font-size:14px;line-height:1.5;color:#4d3540}
.cart-row button{border-color:#ecdddd;border-radius:7px}
.order-summary{background:#fff;border:1px solid #e9dcd8;border-radius:14px;padding:28px;top:104px;box-shadow:0 10px 32px rgba(75,39,46,.065)}
.order-summary h2{font-family:'Playfair Display',Georgia,serif;font-weight:550;font-size:25px!important;color:#50313e;border-bottom:1px solid #ecdfdb;padding-bottom:16px}
.order-summary p{color:#736268}
.order-summary strong{color:#4b353f}
.order-summary hr{border-color:#eee1dc!important}
/* Checkout: clear contact / delivery / payment and bill hierarchy */
.checkout-layout{gap:clamp(24px,4vw,64px)}
.checkout-main{background:#fff;border:1px solid #eee2de;border-radius:14px;padding:clamp(20px,3vw,36px);box-shadow:0 9px 34px rgba(67,36,43,.05)}
.checkout-main>h2{font-family:'Playfair Display',Georgia,serif;color:#4b303e;font-size:31px!important}
.checkout-fields label{font-size:12px;letter-spacing:.012em;color:#5c4951}
.checkout-fields input{background:#fffdfc;border:1px solid #e5d9d5;border-radius:8px;min-height:49px;padding:13px 15px}
.checkout-fields input:hover{border-color:#cbb3b5}
.checkout-fields input:focus{border-color:#9c334c;box-shadow:0 0 0 3px rgba(156,51,76,.095)}
.payment-options{padding-top:19px;border-top:1px solid #f0e6e2}
.payment-options legend{font-size:14px!important;font-weight:750!important;color:#543a48}
.payment-options label{border:1.5px solid #e8dcd9;border-radius:9px;background:#fffefd;padding:18px 17px;gap:13px}
.payment-options label:hover{border-color:#c89ba8}
.payment-options label:has(input:checked){border-color:#963a55;background:#fff7f7;box-shadow:0 0 0 1px #963a55}
.payment-options input[type=radio]{accent-color:#963a55}
.payment-options span strong{font-size:13px}
.payment-options span small{font-size:11.5px;line-height:1.55}
.checkout-consent{background:#fcf7f3;border:1px solid #f0e6e0;padding:13px;border-radius:8px}
.checkout-consent a{color:#8d3554;text-decoration:underline}
.checkout-total{background:#fcf7f3;border:1px solid #eee0dc;border-radius:9px;padding:20px}
.checkout-total p{margin:11px 0;font-size:13px}
.checkout-total p strong{color:#563844}
.checkout-trust-box,.checkout-trust-strip{background:#fffbf8;border:1px solid #eee2dc;border-radius:10px}
.checkout-trust-header .trust-shield-icon,.trust-badge-svg{color:#7d3651}
.trust-pill-badges span{background:#fff8f7;border-color:#f0e6e3;color:#644751}
.pay-chip{background:#fff;border:1px solid #eadedb;border-radius:6px;color:#674953;font-size:11px}
.checkout-preloader{color:#795d68}
/* Finish the visual system */
.benefits{background:#fcf7f3;border-color:#f0e4de}
.benefits strong{color:#4d3440}
footer{background:#3a2731;color:#fff4ed}
footer h4{color:#e9bdad}
footer a:hover{color:#ffddd0}
.mobile-bottom-bar{background:#fffdfb;border-top:1px solid #e8dbd6}
.mobile-nav-item{color:#765260}
.mobile-nav-item:hover{color:#8f3050}
dialog#modal{border:1px solid #ecddd9;border-radius:18px;box-shadow:0 22px 90px rgba(46,22,32,.22)}
.size-help-modal{padding:4px 8px 8px;max-width:530px}
.size-help-modal h2{font-family:'Playfair Display',Georgia,serif;color:#532e40;font-size:30px;margin-bottom:13px}
.size-help-modal p,.size-help-modal li{font-size:13px;line-height:1.8;color:#67555c}
.size-help-modal li{margin:8px 0}
.size-help-modal a{color:#923951;text-decoration:underline}
.product-zoom-modal{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:min(90vw,780px)}
.product-zoom-modal img{display:block;width:auto;max-width:100%;max-height:76vh;object-fit:contain}
.product-zoom-modal p{font-size:12px;color:#827378}
@media(max-width:980px){
 header{height:68px}
 .detail-premium{gap:26px;padding:26px 4% 56px}
 .detail-premium .detail-info h1{font-size:clamp(26px,3.1vw,34px)}
 .detail-premium .gallery-main{max-height:600px}
 .detail-premium>.gallery-column{top:85px}
 .cart-layout{grid-template-columns:minmax(0,1fr) minmax(265px,.78fr);gap:25px}
 .order-summary{padding:19px}
}
@media(max-width:760px){
 .announcement{font-size:9px;min-height:31px}
 header{height:64px}
 .detail-premium{display:flex;flex-direction:column;gap:22px;padding:14px 4.5% 45px}
 .detail-premium>.gallery-column{position:static;width:100%}
 .detail-premium .gallery-main{max-height:none;aspect-ratio:4/4.35;object-fit:contain;border-radius:8px}
 .detail-premium .thumbs button{width:66px;height:80px}
 .detail-premium .detail-info{width:100%}
 .detail-premium .detail-info h1{font-size:clamp(27px,7vw,38px);margin-bottom:15px}
 .detail-premium .detail-price-box .price>span:first-child{font-size:27px}
 .detail-premium .detail-trust-strip{margin:18px 0}
 .products{gap:14px 10px}
 .product-info{padding:11px 9px 14px}
 .cart-layout,.checkout-layout{grid-template-columns:1fr;gap:22px}
 .checkout-main{padding:20px 17px;border-radius:12px}
 .order-summary{position:static;top:auto;margin-bottom:16px}
 .page-heading{padding:28px 5% 18px}
 .page-heading h1{font-size:30px}
 .cart-row{grid-template-columns:78px minmax(0,1fr) auto;gap:11px;padding:12px}
 .cart-row img{width:78px;height:102px}
 .cart-row h3{font-size:12px}
 .cart-row small{font-size:11px}
}
@media(max-width:420px){
 .detail-premium .detail-actions{grid-template-columns:115px minmax(0,1fr);gap:7px}
 .detail-premium .detail-actions .add-to-bag{padding:11px 7px;font-size:11px}
 .detail-premium .detail-trust-strip{grid-template-columns:1fr 1fr;gap:6px;padding:7px}
 .detail-premium .trust-badge-card{gap:5px;padding:7px}
 .detail-premium .trust-badge-icon{width:25px;height:25px}
 .detail-premium .trust-badge-text strong{font-size:10.5px}
 .detail-premium .trust-badge-text span{font-size:10px}
 .detail-premium .option-tile{min-width:42px;min-height:44px;padding:8px 11px}
 .cart-row{grid-template-columns:65px minmax(0,1fr);gap:12px}
 .cart-row img{width:65px;height:88px}
 .cart-row>span:last-child{grid-column:2;justify-self:start}
 .field-pair{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
 .product,.product-media img,.btn,.option-tile,.gallery-main{transition:none!important}
 .product:hover{transform:none}
}


/* === Responsive hardening: 2026-11-13 ===
   Correct hero promotional label positioning and avoid checkout min-content
   overflow on small screens, zoomed browsers, and narrow webviews. */
.hero-img-wrap .trending-tag {
  top: 12px;
  bottom: auto;
  left: 12px;
  right: auto;
  width: max-content;
  max-width: calc(100% - 24px);
  height: auto;
  min-height: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: normal;
  line-height: 1.35;
  border-radius: 999px;
  background: rgba(76, 35, 49, .92);
  z-index: 2;
}
.hero, .hero-copy, .hero-visual, .hero-img-wrap,
.section, .cart-layout, .checkout-layout, .checkout-main,
.checkout-fields, .checkout-fields label, .checkout-main form,
.order-summary, .checkout-items-list, .checkout-total,
.payment-options, .payment-options label, .payment-options label > span,
.checkout-consent, .checkout-consent > span {
  min-width: 0;
}
.hero-visual { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hero-img-wrap img { width: 100%; }
.hero-label { min-width: 0; flex-wrap: wrap; gap: 6px 12px; }
.hero-label span { overflow-wrap: anywhere; }
.hero-trust-pill { max-width: 100%; flex-wrap: wrap; white-space: normal; }
.ticker { max-width: 100%; overflow-wrap: anywhere; }
.cart-layout, .checkout-layout { width: 100%; }
.checkout-layout > *, .cart-layout > *,
.checkout-main > *, .order-summary > * { min-width: 0; max-width: 100%; }
.checkout-fields input, .checkout-main input:not([type="radio"]):not([type="checkbox"]),
.checkout-fields select, .checkout-fields textarea {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}
.checkout-fields .field-pair {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.payment-options {
  display: block;
  width: 100%;
  max-width: 100%;
  min-inline-size: 0;
}
.payment-options label {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  align-items: flex-start;
  overflow-wrap: anywhere;
}
.payment-options label > span { flex: 1 1 0%; display: block; }
.payment-options label > span strong,
.payment-options label > span small {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  text-overflow: clip;
}
.payment-options label input[type="radio"] {
  flex: 0 0 18px;
  width: 18px !important;
  min-width: 18px;
  height: 18px;
}
.checkout-consent {
  width: 100%;
  max-width: 100%;
  align-items: flex-start;
  white-space: normal;
  overflow-wrap: anywhere;
}
.checkout-consent > input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin: 2px 0 0;
}
.checkout-consent > span { display: block; flex: 1 1 0%; line-height: 1.65; }
.checkout-consent a { overflow-wrap: anywhere; }
.order-summary h2, .order-summary p, .order-summary strong,
.checkout-items-list > * { max-width: 100%; overflow-wrap: anywhere; }
.checkout-main .btn { max-width: 100%; white-space: normal; text-align: center; }
.checkout-trust-box, .checkout-trust-strip { min-width: 0; overflow-wrap: anywhere; }
.checkout-pay-icons { min-width: 0; }
.checkout-pay-icons .pay-chip { max-width: 100%; white-space: normal; }
@media (max-width: 980px) {
  .cart-layout, .checkout-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  .order-summary { position: static; }
}
@media (max-width: 768px) {
  header {
    gap: 6px;
    padding-inline: max(10px, 3.5%);
  }
  header .brand { flex: 1 1 auto; min-width: 0; max-width: none; }
  header .tools { flex: 0 0 auto; gap: 0; }
  header .tools button { width: 32px; height: 36px; }
  .hero { grid-template-columns: minmax(0, 1fr); overflow: visible; }
  .hero-copy { min-width: 0; padding: 28px 5% 22px; }
  .hero h1 { font-size: clamp(29px, 8.2vw, 40px); }
  .hero-copy > p { font-size: clamp(13px, 3.6vw, 16px); }
  .hero-visual { padding: 0 5% 25px; gap: 10px; }
  .hero-img-wrap img { height: clamp(190px, 65vw, 290px); }
  .hero-label { font-size: 11px; }
  .hero-cta-group { gap: 8px; }
  .hero-cta-group .btn { flex: 1 1 140px; min-width: 0; padding: 11px 10px; text-align: center; }
  .hero-trust-pill { font-size: 11px; padding: 7px 10px; }
  .ticker { flex-wrap: wrap; gap: 8px 14px; padding: 13px 5%; font-size: 10px; }
  .cart-layout, .checkout-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    padding-inline: max(12px, 4%);
  }
  .checkout-main { width: 100%; padding: 18px 15px; }
  .checkout-main > h2 { font-size: clamp(22px, 6vw, 29px) !important; }
  .checkout-fields .field-pair { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .payment-options label { padding: 14px 12px; gap: 10px; }
  .payment-options span strong { font-size: 12.5px; }
  .payment-options span small { font-size: 11px; line-height: 1.6; }
  .checkout-consent { padding: 12px 10px; font-size: 11px; }
  .checkout-trust-perks { grid-template-columns: minmax(0, 1fr); }
  .order-summary { width: 100%; padding: 19px 16px; }
  .order-summary h2 { font-size: 23px !important; }
  .mobile-bottom-bar { padding-bottom: env(safe-area-inset-bottom, 0px); height: calc(56px + env(safe-area-inset-bottom, 0px)); }
  main#app { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
  footer { padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 380px) {
  header .brand { font-size: 16px; letter-spacing: .05em; }
  header .brand small { font-size: 6px; letter-spacing: .7px; }
  header .tools button { width: 29px; height: 34px; }
  header .tools svg { width: 17px; height: 17px; }
  .hero-visual { gap: 7px; }
  .hero-img-wrap .trending-tag { top: 8px; left: 6px; font-size: 8px; padding: 4px 6px; max-width: calc(100% - 12px); }
  .checkout-main { padding: 14px 12px; }
  .payment-options label { gap: 8px; padding: 12px 9px; }
  .payment-options label input[type="radio"] { flex-basis: 16px; width: 16px !important; min-width: 16px; height: 16px; }
  .order-summary { padding: 15px 12px; }
  .mobile-nav-item { padding-inline: 3px; font-size: 9px; }
}


/* Premium storefront search and remaining responsive hardening. */
.search-box{
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  margin:0;
  border:0;
  background:transparent;
  box-shadow:none;
  font-size:15px;
  font-weight:500;
  color:var(--ink);
  outline:none;
  padding:14px 12px;
  border-radius:0;
  appearance:none;
  -webkit-appearance:none;
}
.search-box:focus{outline:none;box-shadow:none}
.search-box::placeholder{color:#a29398}
.catalog-search-panel{
  width:100%;
  border:1px solid #eaddd8;
  border-radius:17px;
  padding:clamp(17px,3vw,28px);
  margin-bottom:25px;
  background:linear-gradient(120deg,#fff8f6,#fffefc);
  box-shadow:0 7px 30px rgba(96,56,62,.055)
}
.catalog-search-heading{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:15px;margin-bottom:15px
}
.catalog-search-heading h2{font-size:clamp(23px,2.5vw,32px);margin:3px 0 0;line-height:1.25}
.catalog-search-heading .eyebrow{font-size:10px}
.catalog-search-count{white-space:nowrap;color:#856c75;font-size:12px;font-weight:650}
.catalog-search-input-wrap{
  display:flex;align-items:center;gap:10px;
  background:#fff;border:1.5px solid #eadbd9;border-radius:11px;
  min-width:0;padding:0 12px;transition:border-color .2s,box-shadow .2s
}
.catalog-search-input-wrap:focus-within{border-color:#a24860;box-shadow:0 0 0 3px rgba(156,51,76,.09)}
.catalog-search-input-wrap svg{width:21px;height:21px;flex:0 0 21px;color:#906677}
.catalog-search-input-wrap input{flex:1 1 0%;width:100%;min-width:0;max-width:100%;font-size:15px}
.catalog-search-clear{
  padding:8px 10px;white-space:nowrap;border:0;
  font-size:12px;font-weight:700;color:#9b3957;border-radius:7px
}
.catalog-search-clear:hover{background:#fff0f0}
.catalog-search-panel>p{font-size:12px;color:#897781;margin:11px 0 0}
.catalog-controls{gap:12px;flex-wrap:wrap}
.catalog-controls .pills{gap:8px;flex-wrap:wrap}
.catalog-controls .pills button{border-radius:100px;padding:9px 13px}
.catalog-controls select{max-width:100%;border-radius:9px}
.tag-stock.stock-unavailable{color:#9a4355}
.product .stock-unavailable{background:#fbebec}
.product-info .card-brand{color:#98707d}
/* Premium command-palette-like product search */
#modal.search-dialog{
  width:min(880px,calc(100vw - 26px));
  max-width:calc(100vw - 26px);
  max-height:min(90vh,900px);
  max-height:min(90dvh,900px);
  padding:clamp(17px,3vw,31px);
  overflow:auto;
  border-radius:19px;
  background:#fffdfb
}
#modal.search-dialog #modal-body{width:100%;min-width:0;max-width:100%;padding:0}
#modal.search-dialog .close{top:12px;right:12px;z-index:5}
.premium-search{width:100%;min-width:0;max-width:100%}
.premium-search-head{padding-right:35px}
.premium-search-head h2{
 font-family:var(--font-serif);font-size:clamp(26px,4vw,40px);
 letter-spacing:-.04em;margin:5px 0 9px;color:#512f3c
}
.premium-search-head p{color:#806a73;font-size:13px;margin-bottom:20px}
.premium-search-input-wrap{
 display:flex;align-items:center;gap:12px;padding:7px 8px 7px 17px;
 border-radius:12px;border:1.5px solid #ddc7c6;
 background:#fff;box-shadow:0 4px 18px rgba(86,47,55,.055);
 min-width:0;width:100%
}
.premium-search-input-wrap:focus-within{
 border-color:#a23e58;box-shadow:0 0 0 4px rgba(162,62,88,.1)
}
.premium-search-input-wrap svg{width:23px;height:23px;color:#956c7b;flex:0 0 23px}
.premium-search-input-wrap input{
 min-width:0;flex:1 1 0%;border:0;outline:0;width:100%;
 padding:12px 0;background:transparent;font-size:15px;
 color:#452b38;box-shadow:none;appearance:none
}
.premium-search-input-wrap input::-webkit-search-cancel-button{cursor:pointer}
.premium-search-input-wrap button{
 flex:0 0 auto;padding:12px 17px;border-radius:8px;
 background:#87344d;color:#fff;font-size:12px;font-weight:750
}
.premium-search-input-wrap button:hover{background:#692438}
.premium-search-tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:15px 0 20px}
.premium-search-tags>span{font-size:11px;color:#8d7980;font-weight:650}
.premium-search-tags button{
 border:1px solid #e9d9d7;border-radius:30px;
 padding:6px 13px;background:#fbf5f3;font-size:11px;font-weight:650;color:#644852
}
.premium-search-tags button:hover{border-color:#a95e74;color:#803049;background:#fff}
.premium-search-results{border-top:1px solid #f0e6e2;padding-top:17px}
.premium-search-results-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}
.premium-search-results-head strong{font-size:12px;color:#503b42}
.premium-search-results-head span{font-size:11px;color:#9a8489}
.premium-search-grid{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
 gap:9px;width:100%;min-width:0
}
.premium-search-result{
 display:flex;align-items:center;gap:11px;
 padding:9px;border:1px solid #eee3e0;border-radius:11px;
 min-width:0;max-width:100%;background:#fff;
 transition:border-color .18s,box-shadow .18s
}
.premium-search-result:hover{border-color:#c794a4;box-shadow:0 4px 15px rgba(83,43,51,.065)}
.premium-search-result img{
 width:58px;height:75px;flex:0 0 58px;border-radius:7px;
 object-fit:cover;background:#f8eeec
}
.premium-search-result-info{min-width:0;flex:1 1 0%;display:flex;flex-direction:column;gap:3px}
.premium-search-result-info strong{
 display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
 overflow:hidden;font-size:12px;font-weight:700;line-height:1.45;color:#47343c
}
.premium-search-result-info small{color:#8e7c82;font-size:10px}
.premium-search-result-info b{font-size:12px;color:#862e49}
.premium-search-arrow{color:#a66a7a;font-size:17px;flex:0 0 auto}
.premium-search-no-results{text-align:center;padding:30px 12px;color:#654f58}
.premium-search-no-results p{color:#8d7980;font-size:12px}
.premium-search-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px;border-top:1px solid #f1e7e3;padding-top:16px}
.premium-search-bottom button{color:#96364f;text-decoration:underline;font-weight:750;font-size:12px;text-underline-offset:4px}
.premium-search-bottom span{font-size:11px;color:#95818a}
/* Avoid clipping on all pages, including review boxes, trust strips and checkout. */
.section,.catalog-controls,.products,.detail,.detail-info,.order-summary,.checkout-layout,.checkout-main,.checkout-fields,.payment-options,.payment-options label,.checkout-consent,.review-box,.trust-badge-card,.footer-brand{min-width:0}
.products{grid-template-columns:repeat(4,minmax(0,1fr))}
.cart-layout,.checkout-layout{width:100%;max-width:1330px}
.checkout-items-list>div{max-width:100%;min-width:0}
.checkout-items-list>div>div{min-width:0;overflow-wrap:anywhere}
.checkout-fields input,.checkout-fields select,.checkout-fields textarea{font-size:16px}
.payment-options label{min-inline-size:0;max-inline-size:100%}
.payment-options label>span{min-width:0;overflow-wrap:anywhere}
.payment-options label>span strong,.payment-options label>span small{white-space:normal}
.checkout-consent>span{min-width:0;overflow-wrap:anywhere}
.checkout-main .field-pair>*{min-width:0}
.product .sale{max-width:calc(100% - 18px);height:auto}
@media(max-width:1050px){
 .products{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:980px){
 .cart-layout,.checkout-layout{grid-template-columns:minmax(0,1fr)}
 .order-summary{position:static}
}
@media(max-width:768px){
 .products{grid-template-columns:repeat(2,minmax(0,1fr))}
 .premium-search-grid{grid-template-columns:minmax(0,1fr)}
 .catalog-search-panel{padding:16px 13px}
 .catalog-search-heading h2{font-size:23px}
 .catalog-controls>div{min-width:0;max-width:100%}
 .catalog-controls select{font-size:12px}
 .premium-search-result img{width:53px;height:68px;flex-basis:53px}
 .premium-search-bottom{flex-wrap:wrap}
 .payment-options label{width:100%;max-width:100%;min-width:0}
 .order-summary{position:static}
}
@media(max-width:375px){
 .catalog-search-input-wrap{gap:6px;padding-inline:9px}
 .catalog-search-input-wrap svg{width:18px;height:18px;flex-basis:18px}
 .catalog-search-input-wrap .search-box{font-size:13px;padding:12px 4px}
 .catalog-search-clear{font-size:11px;padding:6px}
 #modal.search-dialog{width:calc(100vw - 12px);max-width:calc(100vw - 12px);padding:17px 12px}
 .premium-search-input-wrap{gap:6px;padding:6px}
 .premium-search-input-wrap svg{width:18px;height:18px;flex-basis:18px}
 .premium-search-input-wrap input{font-size:13px}
 .premium-search-input-wrap button{padding:10px 9px;font-size:11px}
 .premium-search-result-info strong{font-size:11px}
}

/* Honest checkout readiness and sandbox status */
.checkout-readiness-notice{
 border:1px solid #e7c7a0;
 background:#fff8ec;
 color:#76522e;
 padding:13px 15px;
 line-height:1.6;
 font-size:12px;
 border-radius:9px;
 margin:15px 0 8px;
 overflow-wrap:anywhere
}
.checkout-readiness-notice.sandbox{
 background:#eef7ff;
 border-color:#bfd8f0;
 color:#315674
}
.checkout-main #checkout-form button[type="submit"]:disabled{
 cursor:not-allowed;
 background:#a79ba0;
 border-color:#a79ba0;
 box-shadow:none;
 opacity:.8;
 transform:none
}

/* Quiet, polished two-column checkout influenced by familiar hosted-store checkout layouts.
   Scoped to checkout only; no change to hosted PayU payment forms or transaction logic. */
#checkout-view.checkout-layout{
  max-width:1160px;
  margin-inline:auto;
  align-items:start;
  gap:clamp(25px,4vw,64px);
  grid-template-columns:minmax(0,1.18fr) minmax(290px,.82fr)
}
#checkout-view .checkout-main{
  background:#fff;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:clamp(10px,2vw,28px) 0
}
#checkout-view .checkout-stage-label{
  color:#806574;
  font-size:10px;
  font-weight:750;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin:0 0 27px
}
#checkout-view .checkout-section-head{
  display:flex;
  gap:15px;
  align-items:flex-start;
  margin-bottom:20px
}
#checkout-view .checkout-section-head h2{
  font-family:'Plus Jakarta Sans',Arial,sans-serif;
  font-size:clamp(20px,2.5vw,25px);
  font-weight:750;
  color:#332934;
  letter-spacing:-.035em;
  line-height:1.2;
  margin:2px 0 6px
}
#checkout-view .checkout-section-head p:last-child{
  color:#7a7078;
  font-size:12px;
  line-height:1.65;
  margin:0
}
#checkout-view .checkout-step-number{
  display:grid;
  place-items:center;
  flex:0 0 30px;
  width:30px;
  height:30px;
  border:1px solid #e9dce2;
  border-radius:50%;
  background:#fbf8fa;
  color:#7d3651;
  font-size:12px;
  font-weight:750
}
#checkout-view .checkout-section-kicker{
  font-size:10px;
  font-weight:750;
  letter-spacing:.13em;
  color:#986479;
  margin:0
}
#checkout-view .checkout-payment-head{
  border-top:1px solid #eee8ec;
  padding-top:27px;
  margin-top:30px;
  margin-bottom:14px
}
#checkout-view .checkout-fields{
  display:grid;
  gap:14px
}
#checkout-view .checkout-fields label{
  color:#544953;
  font-size:12px;
  font-weight:650;
  letter-spacing:0
}
#checkout-view .checkout-fields input{
  display:block;
  width:100%;
  min-height:48px;
  border:1px solid #dcd4db;
  border-radius:7px;
  background:#fff;
  margin-top:7px;
  color:#312c33;
  padding:12px 14px;
  box-shadow:none;
  transition:border-color .16s ease,box-shadow .16s ease
}
#checkout-view .checkout-fields input:focus{
  border-color:#763c58;
  outline:0;
  box-shadow:0 0 0 3px rgba(126,56,85,.10)
}
#checkout-view .payment-options{
  padding-top:0;
  border:0;
  margin:0 0 22px
}
#checkout-view .payment-options label{
  border:1px solid #ddd5dc;
  border-radius:8px;
  background:#fff;
  box-shadow:none;
  margin:0 0 10px;
  padding:16px;
  transition:border-color .16s ease,background .16s ease
}
#checkout-view .payment-options label:has(input:checked){
  border-color:#763c58;
  background:#fefafc;
  box-shadow:0 0 0 1px #763c58
}
#checkout-view .payment-options span strong{
  color:#362c35;
  font-size:13px;
  font-weight:700;
  line-height:1.45
}
#checkout-view .payment-options span small{
  color:#827581;
  font-size:11px;
  line-height:1.6
}
#checkout-view .checkout-consent{
  background:#fcfafb;
  border-color:#ede5e9;
  border-radius:7px;
  line-height:1.6
}
#checkout-view .order-summary{
  position:sticky;
  top:100px;
  background:#faf8fa;
  border:1px solid #ede7ec;
  border-radius:11px;
  padding:clamp(19px,2.5vw,30px);
  box-shadow:none
}
#checkout-view .checkout-summary-heading{
  display:flex;
  gap:12px;
  justify-content:space-between;
  align-items:baseline;
  border-bottom:1px solid #ebe3e9;
  padding-bottom:15px;
  margin-bottom:12px
}
#checkout-view .checkout-summary-heading h2{
  border:0;
  margin:0;
  padding:0;
  color:#393039;
  font:750 17px/1.35 'Plus Jakarta Sans',Arial,sans-serif!important
}
#checkout-view .checkout-summary-count{
  color:#8e7e87;
  font-size:11px;
  white-space:nowrap
}
#checkout-view .checkout-items-list>div{
  padding:15px 0!important;
  border-bottom:1px solid #ebe4e9!important
}
#checkout-view .checkout-items-list img{
  border:1px solid #eee6e9;
  border-radius:7px!important
}
#checkout-view .checkout-total{
  background:transparent;
  padding:8px 0 12px;
  border:0;
  border-radius:0
}
#checkout-view .checkout-total p{
  margin:13px 0
}
#checkout-view .checkout-trust-strip{
  background:#fff;
  border-color:#ebe3e9
}
#checkout-view .visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap
}
@media(max-width:980px){
  #checkout-view.checkout-layout{grid-template-columns:minmax(0,1fr)}
  #checkout-view .checkout-main{padding:8px 0}
  #checkout-view .order-summary{position:static;top:auto}
}
@media(max-width:600px){
  #checkout-view.checkout-layout{padding-inline:max(14px,4%);gap:24px}
  #checkout-view .checkout-stage-label{margin-bottom:20px}
  #checkout-view .checkout-section-head{gap:12px}
  #checkout-view .checkout-section-head h2{font-size:20px}
  #checkout-view .checkout-fields input{font-size:16px}
  #checkout-view .order-summary{padding:18px}
}