@media (prefers-reduced-motion: reduce) {

/* ── ANNOUNCEMENT BAR ── */

 to{transform:translateX(-50%)} }

/* ── HEADER ── */

header nav { display:flex; gap:1px; flex:1; justify-content:center; }

.ni > a:hover, .ni.active > a { color:var(--ink); background:rgba(0,0,0,0.05); }
.ni.active > a { color:var(--brand); }

.search-pill { display:flex; align-items:center; gap:7px; background:rgba(0,0,0,0.05); border-radius:100px; padding:6px 14px; cursor:pointer; transition:background .2s; }
.search-pill:hover { background:rgba(0,0,0,0.08); }
.search-pill svg { width:13px; height:13px; opacity:.4; }
.search-pill span { font-size:13px; color:var(--muted-2); }

.ib:hover { background:rgba(0,0,0,0.05); }
.ib svg { width:17px; height:17px; }

/* ── MOBILE DRAWER ── */

/* ── WRAP ── */
.wrap { max-width:1360px; margin:0 auto; padding:0 40px; }

/* ── BREADCRUMB ── */
.bcrumb { font-size:12.5px; color:var(--muted-2); display:flex; align-items:center; gap:6px; padding:24px 0 28px; }
.bcrumb a { color:var(--muted-2); transition:color .2s; }
.bcrumb a:hover { color:var(--ink); }
.bcrumb .sep { color:var(--muted-3); }
.bcrumb .cur { color:var(--ink); font-weight:500; }

/* ── PDP MAIN GRID ── */
.pdp-grid {
  display:grid;
  grid-template-columns:minmax(0, 1.55fr) minmax(0, 1fr);
  gap:64px;
  padding-bottom:80px;
}

/* ── GALLERY ── */
.pdp-gallery { display:grid; grid-template-columns:72px 1fr; gap:14px; align-items:start; }
.pdp-thumbs { display:flex; flex-direction:column; gap:10px; }
.pdp-thumb {
  width:72px; aspect-ratio:1; border-radius:14px;
  border:2px solid transparent; overflow:hidden;
  background:#fff; padding:0; cursor:pointer;
  transition:border-color .2s,transform .15s;
}
.pdp-thumb:hover { transform:scale(1.03); }
.pdp-thumb.on { border-color:var(--ink); }
.pdp-thumb img { width:100%; height:100%; object-fit:cover; }
.pdp-main-img {
  position:relative; aspect-ratio:3/4;
  border-radius:var(--radius-lg); overflow:hidden;
  background:#fff;
}
.pdp-main-img img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.pdp-main-img:hover img { transform:scale(1.02); }
.pdp-badge {
  position:absolute; top:18px; left:18px; z-index:2;
  padding:5px 12px; border-radius:var(--radius-pill);
  font-size:11px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
  background:var(--ink); color:#fff;
}
.pdp-zoom-hint {
  position:absolute; bottom:18px; right:18px;
  padding:7px 12px; background:rgba(255,255,255,0.85);
  backdrop-filter:blur(8px); border-radius:var(--radius-pill);
  font-size:11px; font-weight:500; color:var(--muted);
  display:flex; align-items:center; gap:6px;
  letter-spacing:.2px;
}
.pdp-zoom-hint svg { width:12px; height:12px; }

/* ── INFO PANEL ── */
.pdp-info { padding-top:6px; min-width:0; }
.pdp-meta {
  display:flex; align-items:center; gap:10px;
  font-size:12.5px; color:var(--muted-2); margin-bottom:10px;
}
.pdp-meta .stars { color:#FFCC00; letter-spacing:1px; font-size:13px; }
.pdp-meta .review-cnt { color:var(--muted); font-weight:500; }
.pdp-meta .review-cnt:hover { color:var(--ink); text-decoration:underline; cursor:pointer; }
.pdp-meta .pdp-read-reviews {
  display:inline-flex; align-items:center; gap:5px;
  margin-left:auto; padding:6px 13px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff;
  font-size:12px; font-weight:600; color:var(--ink); cursor:pointer;
  transition:border-color .15s, background .15s, color .15s; white-space:nowrap;
}
.pdp-read-reviews svg { width:13px; height:13px; }
.pdp-read-reviews:hover { border-color:var(--ink); background:var(--ink); color:#fff; }
.pdp-brand {
  display:block; font-size:10.5px; font-weight:700;
  letter-spacing:2.5px; text-transform:uppercase;
  color:var(--brand); margin-bottom:8px;
}
.pdp-info h1 {
  font-size:28px; font-weight:700; line-height:1.25;
  letter-spacing:-.3px; margin-bottom:8px;
}
.pdp-tagline {
  font-size:14px; color:var(--muted); line-height:1.6;
  margin-bottom:24px;
}
.pdp-price-row {
  display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  padding-bottom:24px; margin-bottom:24px;
  border-bottom:1px solid var(--line-soft);
}
.pdp-price { font-size:32px; font-weight:700; letter-spacing:-.5px; font-variant-numeric:tabular-nums; }
.pdp-price-orig { font-size:16px; color:var(--muted-3); text-decoration:line-through; font-variant-numeric:tabular-nums; }
.pdp-price-off {
  font-size:11px; font-weight:700; color:var(--brand);
  padding:4px 9px; background:var(--brand-soft); border-radius:6px;
  letter-spacing:.4px; text-transform:uppercase;
}

/* color/variant select */
.pdp-opt { margin-bottom:22px; }
.pdp-opt-label {
  font-size:12.5px; color:var(--muted-2); margin-bottom:12px;
  display:block;
}
.pdp-opt-label strong { color:var(--ink); font-weight:600; margin-left:4px; }
.pdp-swatches { display:flex; gap:12px; flex-wrap:wrap; }
.pdp-swatch {
  width:36px; height:36px; border-radius:50%;
  border:1px solid rgba(0,0,0,0.08); cursor:pointer;
  position:relative; transition:transform .15s;
  flex-shrink:0;
}
.pdp-swatch:hover { transform:scale(1.06); }
.pdp-swatch.on::after {
  content:''; position:absolute; inset:-5px;
  border:1.5px solid var(--ink); border-radius:50%;
}

/* qty + add to cart row */
.pdp-cta-row {
  display:grid; grid-template-columns:auto 1fr; gap:10px;
  margin-bottom:10px;
}
.pdp-qty {
  display:flex; align-items:center;
  background:var(--bg); border-radius:var(--radius-pill);
  padding:3px;
}
.pdp-qty button {
  width:42px; height:42px; border-radius:50%;
  font-size:17px; color:var(--muted); transition:color .15s,background .15s;
  display:flex; align-items:center; justify-content:center;
}
.pdp-qty button:hover { color:var(--ink); background:rgba(0,0,0,0.03); }
.pdp-qty button:active { transform:scale(.94); }
.pdp-qty .qty-val {
  width:32px; text-align:center; font-weight:600;
  font-size:14px; font-variant-numeric:tabular-nums;
}
.pdp-cart {
  background:var(--ink); color:#fff;
  font-weight:600; font-size:14px; letter-spacing:.3px;
  border-radius:var(--radius-pill); height:48px;
  display:flex; align-items:center; justify-content:center; gap:8px;
  transition:background .25s;
}
.pdp-cart:hover { background:var(--brand); }
.pdp-cart svg { width:16px; height:16px; }

/* ── Out of Stock: full-width single-column row ── */
.pdp-cta-row--oos { grid-template-columns:1fr; }

/* ── Out of Stock button: elegant sold-out pill ── */
.pdp-cart.pdp-cart--oos,
.pdp-cart[disabled] {
  background:#f5f5f5 !important;
  border:1.5px solid #e0e0e0 !important;
  color:#b0b0b0 !important;
  cursor:not-allowed;
  font-size:11px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase;
  width:100%; opacity:1; gap:8px;
  box-shadow:none !important;
}
.pdp-cart.pdp-cart--oos:hover,
.pdp-cart[disabled]:hover {
  background:#f5f5f5 !important;
  color:#b0b0b0 !important;
}

/* ── Enquire button: in-stock but no price ── */
.pdp-cart.pdp-cart--enquire {
  background:transparent !important;
  border:1.5px solid var(--brand) !important;
  color:var(--brand) !important;
  font-size:13px; font-weight:600; letter-spacing:.3px;
  text-transform:none; width:100%; gap:9px;
  transition:background .2s, color .2s;
  text-decoration:none;
}
.pdp-cart.pdp-cart--enquire:hover {
  background:var(--brand) !important;
  color:#fff !important;
}

.pdp-wish {
  width:100%; height:46px;
  border:1.5px solid var(--line); border-radius:var(--radius-pill);
  font-size:13px; font-weight:500; color:var(--ink);
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  margin-bottom:24px; transition:border-color .2s,color .2s;
}
.pdp-wish svg { width:16px; height:16px; }
.pdp-wish:hover { border-color:var(--ink); }
.pdp-wish.on { border-color:var(--brand); color:var(--brand); }

/* trust badges */
.pdp-trust {
  list-style:none; display:flex; flex-direction:column; gap:11px;
  padding:20px 0;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  margin-bottom:24px;
}
.pdp-trust li {
  font-size:13px; color:var(--muted);
  display:flex; align-items:center; gap:11px;
}
.pdp-trust li svg { width:16px; height:16px; color:var(--ink); flex-shrink:0; }

/* key features */
.pdp-features h4 {
  font-size:11px; letter-spacing:1.4px; text-transform:uppercase;
  color:var(--ink); font-weight:700; margin-bottom:14px;
}
.pdp-features ul {
  list-style:none;
  display:grid; grid-template-columns:1fr 1fr;
  gap:11px 16px;
}
.pdp-features li {
  font-size:13px; color:var(--muted);
  display:flex; align-items:center; gap:9px;
}
.pdp-features li::before {
  content:''; width:5px; height:5px; border-radius:50%;
  background:var(--brand); flex-shrink:0;
}

/* Stock indicator */
.pdp-stock {
  display:flex; align-items:center; gap:8px;
  font-size:13px; font-weight:500; color:#34C759;
  margin-bottom:22px;
}
.pdp-stock .dot {
  width:8px; height:8px; border-radius:50%;
  background:#34C759;
  box-shadow:0 0 0 3px rgba(52,199,89,.18);
  animation:pulse 2.4s ease-in-out infinite;
}
.pdp-stock .ship-eta { color:var(--muted-2); font-weight:400; }

/* Out of Stock stock indicator */
.pdp-stock--oos { color:var(--muted-3); }
.pdp-stock--oos .dot {
  background:#d1d1d6; box-shadow:none; animation:none;
}

@keyframes pulse {
  0%, 100% { box-shadow:0 0 0 3px rgba(52,199,89,.18); }
  50% { box-shadow:0 0 0 6px rgba(52,199,89,.06); }
}

/* Woo-style meta block (SKU, categories, share) */
.pdp-meta-block {
  margin-top:24px; padding-top:20px;
  border-top:1px solid var(--line-soft);
  display:flex; flex-direction:column; gap:10px;
}
.pdp-meta-row {
  font-size:12.5px; color:var(--muted);
  display:flex; align-items:center; gap:10px;
  flex-wrap:wrap;
}
.pdp-meta-row .lbl {
  font-size:11px; font-weight:700; letter-spacing:1.3px;
  text-transform:uppercase; color:var(--ink);
  flex-shrink:0; min-width:80px;
}
.pdp-meta-row a {
  color:var(--muted); transition:color .15s;
}
.pdp-meta-row a:hover { color:var(--brand); }
.pdp-meta-row .sep { color:var(--muted-3); margin:0 2px; }
.pdp-share-btns { display:flex; gap:6px; }
.pdp-share-btn {
  width:30px; height:30px; border-radius:50%;
  border:1px solid var(--line); background:#fff;
  display:flex; align-items:center; justify-content:center;
  color:var(--muted); transition:all .2s;
}
.pdp-share-btn:hover { color:var(--ink); border-color:var(--ink); transform:translateY(-1px); }
.pdp-share-btn svg { width:12px; height:12px; }

/* ── TABS SECTION ── */
.pdp-tabs {
  margin-top:24px; padding:48px 0 64px;
  border-top:1px solid var(--line);
}
.tab-nav {
  display:flex; gap:32px;
  border-bottom:1px solid var(--line);
  margin-bottom:36px; overflow-x:auto;
  scrollbar-width:none;
}
.tab-nav::-webkit-scrollbar { display:none; }
.tab-btn {
  padding:14px 0; font-size:14px; font-weight:500;
  color:var(--muted-2); position:relative; white-space:nowrap;
  transition:color .2s;
}
.tab-btn:hover { color:var(--ink); }
.tab-btn.on { color:var(--ink); font-weight:600; }
.tab-btn.on::after {
  content:''; position:absolute; bottom:-1px; left:0; right:0;
  height:2px; background:var(--ink);
}
.tab-content > div { display:none; }
.tab-content > div.on { display:block; animation:tabfade .25s ease; }
@keyframes tabfade { from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:translateY(0)} }

/* description */
.tab-desc { font-size:14.5px; line-height:1.7; color:var(--muted); max-width:780px; }
.tab-desc.on { display: block; }
.tab-desc p { margin-bottom:18px; }
.tab-desc h3 {
  font-size:16px; color:var(--ink); margin:28px 0 12px;
  font-weight:700; letter-spacing:-.2px;
}
.tab-desc strong { color:var(--ink); font-weight:600; }

/* spec grid */
.spec-grid {
  display:grid; grid-template-columns:240px 1fr;
  max-width:720px;
}
.spec-grid > div {
  padding:14px 0; border-bottom:1px solid var(--line-soft);
  font-size:14px; line-height:1.5;
}
.spec-grid > div:nth-child(odd) { font-weight:600; color:var(--ink); }
.spec-grid > div:nth-child(even) { color:var(--muted); }
.spec-grid > div:nth-last-child(-n+2) { border-bottom:none; }

/* reviews */
.reviews-layout {
  display:grid; grid-template-columns:300px 1fr; gap:56px;
}
.review-summary {
  padding:24px; background:var(--surface);
  border:1px solid var(--line-soft); border-radius:var(--radius-md);
  position:sticky; top:108px; align-self:start;
}
.review-big {
  font-size:48px; font-weight:800; letter-spacing:-1.5px;
  line-height:1; color:var(--ink); margin-bottom:6px;
}
.review-stars-big { color:#FFCC00; font-size:15px; letter-spacing:1.5px; margin-bottom:4px; }
.review-count-big { font-size:12.5px; color:var(--muted-2); margin-bottom:22px; }
.review-bars { display:flex; flex-direction:column; gap:8px; margin-bottom:22px; }
.review-bar { display:flex; align-items:center; gap:10px; font-size:11.5px; color:var(--muted-2); font-variant-numeric:tabular-nums; }
.review-bar .lbl { width:30px; }
.review-bar-track {
  flex:1; height:5px; background:var(--line);
  border-radius:3px; overflow:hidden;
}
.review-bar-fill { height:100%; background:var(--ink); border-radius:3px; }
.review-bar .pct { width:32px; text-align:right; }
.review-write {
  width:100%; height:42px;
  background:var(--ink); color:#fff;
  border-radius:var(--radius-pill);
  font-size:13px; font-weight:600;
  transition:background .2s;
}
.review-write:hover { background:var(--brand); }

.review-list { display:flex; flex-direction:column; gap:0; }
.review-item {
  padding:22px 0; border-bottom:1px solid var(--line-soft);
}
.review-item:first-child { padding-top:0; }
.review-item:last-child { border-bottom:none; }
.review-head {
  display:flex; align-items:center; gap:10px; margin-bottom:8px;
  flex-wrap:wrap;
}
.review-stars { color:#FFCC00; font-size:13px; letter-spacing:1px; }
.review-author { font-size:13px; font-weight:600; color:var(--ink); }
.review-verified {
  font-size:11px; color:#34C759; font-weight:600;
  display:inline-flex; align-items:center; gap:4px;
}
.review-verified svg { width:11px; height:11px; }
.review-date { font-size:12px; color:var(--muted-3); margin-left:auto; }
.review-title { font-size:14.5px; font-weight:600; margin-bottom:4px; color:var(--ink); }
.review-body { font-size:13.5px; line-height:1.65; color:var(--muted); }

/* ── CUSTOMER REVIEWS (card grid) ── */
.reviews-section {
  padding:64px 0 72px;
  border-top:1px solid var(--line);
}
.reviews-head {
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:16px; margin-bottom:28px; flex-wrap:wrap;
}
.reviews-head h2 {
  font-size:28px; font-weight:700; letter-spacing:-.5px;
  margin-bottom:6px;
}
.reviews-subhead { font-size:13.5px; color:var(--muted-2); display:flex; align-items:center; gap:6px; }
.reviews-subhead .rh-stars { color:#FFCC00; letter-spacing:1px; font-size:14px; }
.btn-write-review {
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 22px; border-radius:var(--radius-pill);
  background:var(--ink); color:#fff;
  font-size:13px; font-weight:600;
  transition:background .2s;
}
.btn-write-review:hover { background:var(--brand); }
.btn-write-review svg { width:14px; height:14px; }

/* Summary card */
.rs-card {
  display:grid; grid-template-columns:auto auto 1fr; gap:48px;
  background:var(--surface); border:1px solid var(--line-soft);
  border-radius:var(--radius-md); padding:28px 32px;
  margin-bottom:28px; align-items:center;
}
.rs-rating { text-align:center; padding-right:24px; border-right:1px solid var(--line-soft); }
.rs-big {
  font-size:54px; font-weight:800; letter-spacing:-2px; line-height:1;
  color:var(--ink); margin-bottom:6px;
}
.rs-stars-big { color:#FFCC00; font-size:14px; letter-spacing:1.5px; margin-bottom:4px; }
.rs-count-big { font-size:12px; color:var(--muted-2); }
.rs-bars { display:flex; flex-direction:column; gap:7px; min-width:200px; }
.rs-bar {
  display:flex; align-items:center; gap:10px; width:100%;
  font-size:11.5px; color:var(--muted-2);
  font-variant-numeric:tabular-nums;
  background:none; border:none; padding:3px 6px; margin:0 -6px;
  border-radius:7px; cursor:pointer; text-align:left;
  transition:background .15s;
}
.rs-bar:hover { background:var(--bg); }
.rs-bar:hover .rs-bar-fill,
.rs-bar.is-active .rs-bar-fill { background:var(--brand); }
.rs-bar.is-active { background:var(--bg); }
.rs-bar.is-active .rs-lbl { font-weight:700; color:var(--ink); }
.rs-lbl { width:24px; flex-shrink:0; }
.rs-bar-track { flex:1; height:5px; background:var(--line); border-radius:3px; overflow:hidden; }
.rs-bar-fill { height:100%; background:var(--ink); border-radius:3px; }
.rs-pct { width:32px; text-align:right; flex-shrink:0; }
.rs-tags h5 {
  font-size:11px; font-weight:700; color:var(--muted-2);
  text-transform:uppercase; letter-spacing:1.4px; margin-bottom:12px;
}
.rs-tag-list { display:flex; flex-wrap:wrap; gap:6px; }
.rs-tag {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 11px; border-radius:var(--radius-pill);
  background:var(--bg); border:1px solid transparent;
  font-size:12px; color:var(--ink); font-weight:500;
  transition:border-color .15s,background .15s;
}
.rs-tag:hover { border-color:var(--ink); }
.rs-tag span { color:var(--muted-2); font-weight:400; font-variant-numeric:tabular-nums; }

/* Reviews toolbar */
.reviews-toolbar {
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:0 0 20px;
}
.reviews-toolbar-left { font-size:13px; color:var(--muted-2); }
.reviews-toolbar-left strong { color:var(--ink); font-weight:700; }
.reviews-toolbar-right {
  display:flex; align-items:center; gap:10px;
  font-size:13px; color:var(--muted-2);
}
.reviews-toolbar-right select {
  border:1px solid var(--line); border-radius:var(--radius-pill);
  padding:8px 14px 8px 14px; background:#fff;
  font-size:13px; font-weight:500; color:var(--ink); cursor:pointer;
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none' stroke='%231D1D1F' stroke-width='2'><path d='M1 1l4 4 4-4'/></svg>");
  background-repeat:no-repeat; background-position:right 14px center;
  padding-right:32px;
}
.reviews-toolbar-right select:hover { border-color:var(--ink); }

/* Reviews grid */
.reviews-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
  margin-bottom:32px;
}
.review-card {
  background:var(--surface); border:1px solid var(--line-soft);
  border-radius:var(--radius-md); padding:24px;
  transition:border-color .2s,box-shadow .2s,transform .2s;
  display:flex; flex-direction:column;
}
.review-card:hover {
  border-color:var(--line);
  box-shadow:0 4px 20px rgba(0,0,0,0.05);
  transform:translateY(-2px);
}
/* ── Amazon-style review card ─────────────────────────────────── */
.rc-author { display:flex; align-items:center; gap:10px; margin-bottom:11px; min-width:0; }
.rc-name { font-size:13.5px; font-weight:600; color:var(--ink); line-height:1.2; }
.rc-headline { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:5px; }
.rc-stars { color:#FFCC00; font-size:14px; letter-spacing:1.5px; flex-shrink:0; }
.rc-stars .empty { color:var(--line); }
.rc-title {
  font-size:14.5px; font-weight:700; color:var(--ink);
  letter-spacing:-.1px; line-height:1.35; margin:0;
}
.rc-meta { font-size:12px; color:var(--muted-3); margin-bottom:11px; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.rc-verified { color:#067D62; font-weight:600; display:inline-flex; align-items:center; gap:4px; }
.rc-verified svg { width:12px; height:12px; }
.rc-dot { color:var(--line); }
.rc-date { color:var(--muted-3); }
.rc-body {
  font-size:13.5px; line-height:1.65; color:var(--muted);
  margin-bottom:14px; flex:1;
}
.rc-body p { margin:0 0 10px; }
.rc-body p:last-child { margin-bottom:0; }
/* Clamp the review body to a few lines (responsive). Higher specificity than the
   styles.css .rc-body blocks so it wins; full text remains in the gallery panel. */
:is(body.page-pdp, body.single-product) .review-card .rc-body {
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:6; line-clamp:6; overflow:hidden;
}
@media (max-width:1024px){ :is(body.page-pdp, body.single-product) .review-card .rc-body { -webkit-line-clamp:7; line-clamp:7; } }
@media (max-width:600px){  :is(body.page-pdp, body.single-product) .review-card .rc-body { -webkit-line-clamp:9; line-clamp:9; } }

/* ── Review media (buyer photos + video) ─────────────────────────── */
.rc-media { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.rc-media-item {
  width:72px; height:72px; border-radius:10px; border:1px solid var(--line-soft);
  background-size:contain; background-repeat:no-repeat; background-position:center; background-color:#f2f2f2;
  cursor:pointer; padding:0; position:relative; overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease;
}
/* v5.9.25: real media fills the tile with a clean cover crop. */
.rc-media-item img,
.rc-media-vid-thumb {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:top center; display:block; pointer-events:none;
}
.rc-media-item:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,.12); }
.rc-media-vid {
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#2a2a2e,#000); color:#fff;
}
/* Scrim keeps the white play glyph legible over a bright first frame. */
.rc-media-vid::after {
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(circle at center, rgba(0,0,0,.30), rgba(0,0,0,.12));
}
.rc-media-vid svg { width:26px; height:26px; position:relative; z-index:2; }

/* ── Review media gallery lightbox ───────────────────────────── */
.rc-lightbox {
  position:fixed; inset:0; z-index:99999;
  display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,.88); padding:24px;
}
.rc-lightbox.on { display:flex; }
.rc-lb-inner {
  display:flex; align-items:stretch;
  max-width:1000px; width:min(1000px, 94vw); height:min(86vh, 640px);
  background:#fff; border-radius:14px; overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.rc-lb-media {
  flex:1 1 auto; min-width:0; position:relative;
  display:flex; align-items:center; justify-content:center; background:#0e0e10;
}
.rc-lb-stage { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.rc-lb-stage img, .rc-lb-stage video { width:100%; height:100%; display:block; object-fit:contain; background:#0e0e10; }
.rc-lb-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border:none; border-radius:50%;
  background:rgba(255,255,255,.92); color:#1a1a1a;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:3; transition:background .15s;
}
.rc-lb-nav:hover { background:#fff; }
.rc-lb-nav svg { width:22px; height:22px; }
.rc-lb-prev { left:14px; }
.rc-lb-next { right:14px; }
.rc-lb-panel {
  flex:0 0 300px; width:300px; padding:28px 24px; overflow-y:auto;
  display:flex; flex-direction:column;
}
.rc-lb-author { font-size:14px; font-weight:700; color:var(--ink); margin-bottom:6px; }
.rc-lb-stars { color:#FFCC00; font-size:15px; letter-spacing:2px; margin-bottom:13px; }
.rc-lb-stars .empty { color:var(--line); }
.rc-lb-title { font-size:14px; font-weight:700; color:var(--ink); line-height:1.4; margin-bottom:9px; }
.rc-lb-body { font-size:13px; line-height:1.7; color:var(--muted); flex:1; }
.rc-lb-counter { font-size:12px; color:var(--muted-3); margin-top:20px; font-variant-numeric:tabular-nums; }
.rc-lb-close {
  position:absolute; top:18px; right:22px; width:42px; height:42px; z-index:5;
  border:none; border-radius:50%; background:rgba(255,255,255,.16); color:#fff;
  font-size:24px; line-height:1; cursor:pointer; transition:background .2s, transform .15s;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); box-shadow:0 2px 12px rgba(0,0,0,.32); text-shadow:0 1px 4px rgba(0,0,0,.5);
}
.rc-lb-close:hover { background:rgba(255,255,255,.32); transform:scale(1.07); }

.rc-avatar {
  width:32px; height:32px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:var(--ink);
  letter-spacing:.5px; flex-shrink:0;
  text-shadow:0 1px 2px rgba(255,255,255,.4);
}
.rc-helpful-row {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding-top:13px; border-top:1px solid var(--line-soft);
}
.rc-helpful-count { font-size:12px; color:var(--muted-2); }
.rc-helpful {
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; color:var(--muted-2); font-weight:500;
  padding:7px 14px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff; cursor:pointer;
  transition:color .15s,border-color .15s,background .15s;
}
.rc-helpful svg { width:13px; height:13px; }
.rc-helpful-num { font-variant-numeric:tabular-nums; }
.rc-helpful:hover { color:var(--ink); border-color:var(--ink); }
.rc-helpful.is-voted { color:#067D62; border-color:#067D62; background:#f0faf6; cursor:default; }
.rc-report {
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:500; color:var(--muted-3); cursor:pointer;
  padding:7px 10px; border-radius:var(--radius-pill); background:none; border:none;
  transition:color .15s, background .15s;
}
.rc-report svg { width:13px; height:13px; }
.rc-report:hover { color:var(--muted); background:var(--bg); }
.rc-report.is-reported { color:var(--muted-3); cursor:default; background:none; }

/* ── Customer photos & videos wall ───────────────────────────── */
.review-photowall { margin:0 0 26px; }
.rpw-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px; }
.rpw-title { display:inline-flex; align-items:center; gap:8px; font-size:15px; font-weight:700; color:var(--ink); }
.rpw-title svg { width:17px; height:17px; color:var(--muted-2); }
.rpw-seeall { font-size:12.5px; font-weight:600; color:var(--brand); background:none; border:none; cursor:pointer; padding:0; }
.rpw-seeall:hover { text-decoration:underline; }
.rpw-strip { display:flex; flex-wrap:wrap; gap:9px; }
.rpw-item {
  width:84px; height:84px; border-radius:10px; flex-shrink:0;
  border:1px solid var(--line-soft); background-color:#1a1a1c;
  cursor:pointer; padding:0; position:relative; overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease;
}
/* v5.9.25: real media thumbnails fill the tile and crop cleanly. */
.rpw-thumb-img,
.rpw-thumb-vid {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:top center; display:block;
  pointer-events:none;
}
.rpw-item:hover { transform:translateY(-3px); box-shadow:0 8px 22px rgba(0,0,0,.16); }
/* Video tiles keep a dark fallback behind the first-frame <video> in case
   the browser can't paint a frame (e.g. codec quirk). */
.rpw-item-vid { background:linear-gradient(135deg,#2a2a2e,#000); }
.rpw-play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; z-index:2; pointer-events:none; }
.rpw-play svg { width:28px; height:28px; filter:drop-shadow(0 2px 6px rgba(0,0,0,.5)); }
/* Subtle scrim so the white play-triangle stays visible over bright frames. */
.rpw-item-vid::after {
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(circle at center, rgba(0,0,0,.28), rgba(0,0,0,.12));
}
.rpw-more {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.58); color:#fff; font-size:17px; font-weight:700; z-index:3;
}
.rpw-extra { display:none; }

/* ── Filter pills ────────────────────────────────────────────── */
.reviews-filterbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; padding:0 0 22px; }
.rev-pill {
  display:inline-flex; align-items:center; gap:6px;
  font-size:12.5px; font-weight:500; color:var(--muted);
  padding:7px 15px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff; cursor:pointer;
  transition:all .15s;
}
.rev-pill svg { width:13px; height:13px; }
.rev-pill:hover { border-color:var(--ink); color:var(--ink); }
.rev-pill.is-active { background:var(--ink); border-color:var(--ink); color:#fff; }
.rev-starchip {
  display:inline-flex; align-items:center; gap:4px;
  font-size:12.5px; font-weight:600; color:var(--ink);
  padding:6px 6px 6px 13px; border-radius:var(--radius-pill);
  border:1px solid var(--ink); background:#fff;
}
.rev-starchip[hidden] { display:none; }
.rev-starchip-x {
  width:20px; height:20px; border:none; border-radius:50%;
  background:var(--bg); color:var(--muted-2); font-size:15px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.rev-starchip-x:hover { background:var(--ink); color:#fff; }
.reviews-empty { grid-column:1/-1; text-align:center; padding:40px 0; color:var(--muted-2); font-size:14px; }

.reviews-load-more { text-align:center; }
.btn-load-more {
  padding:13px 32px; border-radius:var(--radius-pill);
  border:1.5px solid var(--line); background:#fff;
  font-size:13px; font-weight:600; color:var(--ink);
  transition:all .2s;
}
.btn-load-more:hover {
  border-color:var(--ink); transform:translateY(-1px);
  box-shadow:var(--shadow-sm);
}

/* ── RELATED PRODUCTS ── */
.related { padding:60px 0 80px; border-top:1px solid var(--line); }
.related-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:28px; gap:16px; }
.related-head h2 {
  font-size:24px; font-weight:700; letter-spacing:-.4px;
}
.related-head a {
  font-size:13px; color:var(--muted-2); font-weight:500;
  display:inline-flex; align-items:center; gap:4px;
  transition:color .2s;
}
.related-head a:hover { color:var(--ink); }
.related-head a svg { width:11px; height:11px; }

.pgrid { display:grid; grid-template-columns:repeat(4, 1fr); gap:24px 18px; }
.pcard { cursor:pointer; }
.pcard-img {
  background:#fff; border-radius:var(--radius-md); aspect-ratio:3/4;
  overflow:hidden; margin-bottom:12px; position:relative;
  box-shadow:var(--shadow-sm); transition:box-shadow .3s,transform .3s;
}
.pcard:hover .pcard-img { box-shadow:var(--shadow-md); transform:translateY(-2px); }
.pcard-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.pcard:hover .pcard-img img { transform:scale(1.05); }
.pcard-badge {
  position:absolute; top:12px; left:12px; z-index:2;
  padding:4px 10px; border-radius:var(--radius-pill);
  font-size:10px; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
}
.bg-new { background:var(--ink); color:#fff; }
.bg-hot { background:var(--brand); color:#fff; }
.bg-sale { background:#FF9500; color:#fff; }
.bg-top { background:#34C759; color:#fff; }
.pcard-stars { font-size:12px; color:#FFCC00; margin-bottom:4px; display:flex; align-items:center; gap:4px; }
.pcard-stars span { color:var(--muted-3); font-size:11px; }
.pcard-name { font-size:14px; font-weight:600; margin-bottom:2px; line-height:1.35; }
.pcard-var { font-size:12px; color:var(--muted-2); margin-bottom:8px; }
.pcard-pr { display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; }
.pcard-p { font-size:15px; font-weight:700; color:var(--ink); }
.pcard-o { font-size:12px; color:var(--muted-3); text-decoration:line-through; }
.pcard-off { font-size:11px; font-weight:700; color:var(--brand); }

/* ── HOVER ZOOM (main image) ── */
.pdp-main-img { cursor:zoom-in; overflow:hidden; }
.pdp-main-img img {
  transition:transform .25s cubic-bezier(.2,.6,.3,1);
  transform-origin:center center;
}
.pdp-main-img.zooming img {
  transition:transform-origin 80ms ease-out;
  transform:scale(2.2);
}
/* hide the existing :hover scale rule when actively zooming */
.pdp-main-img.zooming:hover img { transform:scale(2.2); }

/* ── LIGHTBOX ── */
.lightbox {
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,0.92);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  visibility:hidden; opacity:0;
  transition:opacity .3s,visibility .3s;
  display:flex; align-items:center; justify-content:center;
}
.lightbox.on { visibility:visible; opacity:1; }
.lb-stage {
  position:relative;
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  padding:64px 80px;
}
.lb-img {
  max-width:100%; max-height:100%;
  width:auto; height:auto;
  border-radius:var(--radius-md);
  user-select:none; -webkit-user-drag:none;
  box-shadow:0 24px 80px rgba(0,0,0,0.4);
  animation:lbFade .35s ease-out;
}
@keyframes lbFade {
  from { opacity:0; transform:scale(.96); }
  to { opacity:1; transform:scale(1); }
}
.lb-close, .lb-nav {
  position:absolute;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.12);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; border-radius:50%;
  transition:background .2s,border-color .2s,transform .2s;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.lb-close:hover, .lb-nav:hover {
  background:rgba(255,255,255,0.18);
  border-color:rgba(255,255,255,0.25);
}
.lb-close { top:24px; right:24px; width:44px; height:44px; }
.lb-close:hover { transform:rotate(90deg); }
.lb-close svg { width:18px; height:18px; }
.lb-nav { top:50%; transform:translateY(-50%); width:52px; height:52px; }
.lb-nav:hover { transform:translateY(-50%) scale(1.06); }
.lb-prev { left:24px; }
.lb-next { right:24px; }
.lb-nav svg { width:20px; height:20px; }

.lb-counter {
  position:absolute; left:50%; bottom:24px;
  transform:translateX(-50%);
  color:rgba(255,255,255,0.7);
  font-size:13px; letter-spacing:1.5px;
  font-variant-numeric:tabular-nums;
  display:flex; align-items:center; gap:14px;
}
.lb-counter .dots { display:flex; gap:6px; }
.lb-counter .dot {
  width:6px; height:6px; border-radius:50%;
  background:rgba(255,255,255,0.25);
  transition:background .2s,transform .2s;
  cursor:pointer;
  border:none; padding:0;
}
.lb-counter .dot.on { background:#fff; transform:scale(1.4); }
.lb-counter .dot:hover { background:rgba(255,255,255,0.55); }

@media (max-width:768px) {
  .lb-stage { padding:60px 16px; }
  .lb-close { top:14px; right:14px; width:38px; height:38px; }
  .lb-nav { width:44px; height:44px; }
  .lb-prev { left:8px; }
  .lb-next { right:8px; }
  .lb-counter { bottom:20px; font-size:12px; }
  /* on touch, hover zoom is N/A — disable the cursor hint */
  .pdp-main-img { cursor:pointer; }
}
@media (hover:none) {
  .pdp-main-img.zooming img { transform:none !important; }
}

/* ── MOBILE STICKY CTA ── */
.pdp-sticky { display:none; }

/* ── FOOTER ── */

.flogo em { color:var(--brand); font-style:normal; }

.fsoc:hover { background:var(--brand); border-color:var(--brand); color:#fff; }

.flinks a:hover { color:rgba(255,255,255,0.72); }

/* ─────────── TABLET ≤ 1024px ─────────── */
@media (max-width:1024px) {
  .wrap, 
  
  
  header nav { gap:0; }
  
  .search-pill span { display:none; }
  .search-pill { padding:8px 10px; }

  .pdp-grid { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:36px; }
  .rs-card { gap:32px; padding:24px; }
  .rs-rating { padding-right:18px; }
  .rs-big { font-size:46px; }
  .pgrid { grid-template-columns:repeat(3, 1fr); gap:20px 14px; }
  
  .ftop > div:first-child { grid-column:1/-1; max-width:520px; }
}

/* ─────────── MOBILE ≤ 768px ─────────── */
@media (max-width:768px) {
  
  header nav, header .search-pill, .ib[title="Wishlist"], .ib[title="Account"] { display:none; }
  
  
  
  
  .ib svg { width:18px; height:18px; }
  
  
  
  .wrap, 

  .bcrumb { padding:16px 0 18px; font-size:12px; }

  /* PDP grid stacks */
  .pdp-grid { grid-template-columns:1fr; gap:22px; padding-bottom:32px; }

  /* gallery: main image first, thumbs row below */
  .pdp-gallery { grid-template-columns:1fr; gap:10px; }
  .pdp-thumbs {
    flex-direction:row; order:2;
    overflow-x:auto; scrollbar-width:none;
    padding-bottom:2px; -webkit-overflow-scrolling:touch;
  }
  .pdp-thumbs::-webkit-scrollbar { display:none; }
  .pdp-thumb { width:60px; flex-shrink:0; border-radius:10px; }
  .pdp-main-img { border-radius:var(--radius-md); }
  .pdp-zoom-hint { display:none; }
  .pdp-badge { top:12px; left:12px; font-size:10px; padding:4px 10px; }

  .pdp-info { padding-top:0; }
  .pdp-info h1 { font-size:25px; }
  .pdp-tagline { font-size:13.5px; margin-bottom:18px; }
  .pdp-price { font-size:26px; }
  .pdp-price-row { padding-bottom:18px; margin-bottom:18px; }

  /* hide desktop-only Add-to-Cart row, replaced by mobile sticky */
  .pdp-cta-row { display:none; }
  .pdp-wish { margin-bottom:20px; height:42px; }
  .pdp-trust { gap:9px; padding:16px 0; margin-bottom:20px; }
  .pdp-features ul { grid-template-columns:1fr; gap:9px; }

  /* tabs */
  .pdp-tabs { padding:32px 0 40px; margin-top:14px; }
  .tab-nav { gap:22px; margin-bottom:24px; }
  .tab-btn { font-size:13px; padding:12px 0; }
  .spec-grid { grid-template-columns:130px 1fr; }
  .spec-grid > div { padding:11px 0; font-size:13px; }

  /* reviews section mobile */
  .reviews-section { padding:36px 0 32px; }
  .reviews-head h2 { font-size:22px; }
  .btn-write-review { padding:9px 16px; font-size:12px; }
  .btn-write-review svg { width:13px; height:13px; }
  .rs-card {
    grid-template-columns:1fr; gap:24px;
    padding:22px; margin-bottom:22px;
  }
  .rs-rating {
    text-align:left; padding-right:0; padding-bottom:20px;
    border-right:none; border-bottom:1px solid var(--line-soft);
    display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  }
  .rs-big { font-size:40px; margin-bottom:0; }
  .rs-stars-big { font-size:13px; margin-bottom:0; }
  .rs-count-big { width:100%; }
  .rs-bars { min-width:0; }
  .reviews-toolbar { flex-direction:column; align-items:stretch; gap:10px; }
  .reviews-toolbar-right { justify-content:space-between; }
  .reviews-grid { grid-template-columns:1fr; gap:14px; margin-bottom:24px; }
  .review-card { padding:20px; }
  .rc-helpful { padding:6px 10px; font-size:11px; }

  /* photo wall + filters + gallery (mobile single-column) */
  .rpw-title { font-size:14px; }
  .rpw-item { width:72px; height:72px; }
  .reviews-filterbar { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:16px; }
  .reviews-filterbar::-webkit-scrollbar { display:none; }
  .rev-pill { flex-shrink:0; }
  .rc-lightbox { padding:0; }
  .rc-lb-inner { flex-direction:column; width:92vw; max-width:430px; height:auto; max-height:86vh; border-radius:20px; }
  .rc-lb-media { flex:0 0 auto; height:min(46vh,380px); min-height:0; }
  .rc-lb-panel { flex:1 1 auto; width:100%; min-height:0; padding:18px 20px 22px; overflow-y:auto; }
  .rc-lb-nav { width:38px; height:38px; }
  .rc-lb-prev { left:10px; } .rc-lb-next { right:10px; }
  .rc-lb-close { top:12px; right:12px; width:38px; height:38px; }

  /* Woo meta block */
  .pdp-meta-row { font-size:12px; }
  .pdp-meta-row .lbl { min-width:64px; font-size:10px; }

  /* related */
  .related { padding:36px 0 100px; }    /* extra bottom for sticky cta */
  .related-head h2 { font-size:20px; }
  .pgrid { grid-template-columns:1fr 1fr; gap:18px 12px; }
  .pcard-img { border-radius:var(--radius-sm); }
  .pcard-name { font-size:13px; }
  .pcard-p { font-size:14px; }

  /* footer */
  
  
  .ftop > div:first-child { grid-column:1/-1; }
  

  /* Mobile sticky CTA bar */
  .pdp-sticky {
    display:flex; align-items:center; gap:10px;
    position:fixed; left:0; right:0; bottom:0; z-index:700;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,0.94);
    backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
    border-top:1px solid var(--line);
  }
  .pdp-sticky-price { display:flex; flex-direction:column; line-height:1.1; flex-shrink:0; }
  .pdp-sticky-price .pp { font-size:16px; font-weight:700; }
  .pdp-sticky-price .po { font-size:11px; color:var(--muted-3); text-decoration:line-through; }
  .pdp-sticky-cart {
    flex:1; height:46px; border-radius:var(--radius-pill);
    background:var(--ink); color:#fff;
    font-size:14px; font-weight:600; letter-spacing:.3px;
    display:flex; align-items:center; justify-content:center;
  }
  .pdp-sticky-cart:active { background:var(--brand); }
}

@media (max-width:380px) {
  
  
  .pgrid { gap:14px 10px; }
}

/* ============================================================
   contact.html
   ============================================================ */

/* ===== contact.html ===== */

body.page-contact body.no-scroll { overflow:hidden; }
body.page-contact a { text-decoration:none; color:inherit; }
body.page-contact button { border:none; cursor:pointer; font-family:inherit; background:none; }
body.page-contact img { display:block; max-width:100%; }
body.page-contact input, body.page-contact select { font-family:inherit; }
body.page-contact a:focus-visible, body.page-contact button:focus-visible, body.page-contact input:focus-visible, body.page-contact summary:focus-visible {
  outline:2px solid var(--brand); outline-offset:3px; border-radius:6px;
}
@media (prefers-reduced-motion: reduce) {

/* ── ANNOUNCEMENT BAR ── */
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact 
 to{transform:translateX(-50%)} }

/* ── HEADER CAPSULE ── */
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact header nav { display:flex; gap:1px; flex:1; justify-content:center; }
body.page-contact 
body.page-contact .ni > a:hover { color:#1D1D1F; background:rgba(0,0,0,0.05); }
body.page-contact .chev { width:11px; height:11px; opacity:.4; transition:transform .2s; }
body.page-contact .ni:hover .chev { transform:rotate(180deg); }

body.page-contact .dg { display:grid; grid-template-columns:repeat(3,1fr); gap:3px; }
body.page-contact .di { padding:11px; border-radius:10px; transition:background .15s; cursor:pointer; }
body.page-contact .di:hover { background:#F5F5F7; }
body.page-contact .di-name { font-size:13px; font-weight:600; margin-bottom:2px; }
body.page-contact .di-desc { font-size:11px; color:#86868B; line-height:1.4; }
body.page-contact 
body.page-contact .search-pill { display:flex; align-items:center; gap:7px; background:rgba(0,0,0,0.05); border-radius:100px; padding:6px 14px; cursor:pointer; transition:background .2s; }
body.page-contact .search-pill:hover { background:rgba(0,0,0,0.08); }
body.page-contact .search-pill svg { width:13px; height:13px; opacity:.4; }
body.page-contact .search-pill span { font-size:13px; color:#86868B; }
body.page-contact 
body.page-contact .ib:hover { background:rgba(0,0,0,0.05); }
body.page-contact .ib svg { width:17px; height:17px; }
body.page-contact 

/* ── WRAPPER ── */
body.page-contact .wrap { max-width:1360px; margin:0 auto; padding:0 40px; }
body.page-contact .wrap > *:first-child { padding-top:24px; }

/* ── SHARED ── */
body.page-contact .sl { font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:#FF2D55; display:block; margin-bottom:8px; }
body.page-contact .st { font-size:34px; font-weight:700; letter-spacing:-.5px; line-height:1.1; }
body.page-contact .sh { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:32px; }

/* ── PAGE HERO ── */
body.page-contact .page-hero {
  padding:48px 0 0;
  position:relative;
}
body.page-contact .page-hero-inner {
  background:#1D1D1F; border-radius:28px;
  padding:72px 72px 0;
  display:grid; grid-template-columns:1fr 1fr;
  gap:60px; align-items:flex-end;
  overflow:hidden; position:relative; min-height:380px;
}
body.page-contact .page-hero-inner::before {
  content:''; position:absolute; top:-100px; right:-100px;
  width:500px; height:500px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,45,85,0.18) 0%,transparent 70%);
  filter:blur(60px);
}
body.page-contact .hero-left { position:relative; z-index:2; padding-bottom:72px; }
body.page-contact .hero-left .sl { color:rgba(255,255,255,0.3); }
body.page-contact .hero-left h1 { font-size:52px; font-weight:800; letter-spacing:-1.5px; line-height:1.0; color:#fff; margin-bottom:16px; }
body.page-contact .hero-left p { font-size:15px; color:rgba(255,255,255,0.45); line-height:1.7; max-width:400px; }
body.page-contact .hero-badges { display:flex; gap:10px; margin-top:28px; flex-wrap:wrap; }
body.page-contact .hero-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12);
  border-radius:100px; padding:6px 14px;
  font-size:12px; color:rgba(255,255,255,0.6); font-weight:500;
}
body.page-contact .hero-badge .dot { width:6px; height:6px; border-radius:50%; background:#34C759; flex-shrink:0; }
body.page-contact .hero-right { position:relative; z-index:2; align-self:flex-end; }
body.page-contact .hero-right img { width:100%; max-width:480px; border-radius:20px 20px 0 0; object-fit:cover; height:340px; margin-left:auto; }

/* ── CONTACT GRID ── */
body.page-contact .contact-s { padding:64px 0 72px; }
body.page-contact .contact-grid { display:grid; grid-template-columns:1fr 380px; gap:24px; align-items:start; }

/* Contact Form */
body.page-contact .form-card {
  background:#fff; border-radius:24px; padding:48px;
  box-shadow:0 2px 12px rgba(0,0,0,0.04);
}
body.page-contact .form-card h2 { font-size:24px; font-weight:700; letter-spacing:-.3px; margin-bottom:6px; }
body.page-contact .form-card .sub { font-size:13px; color:#86868B; margin-bottom:36px; line-height:1.6; }

body.page-contact .form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
body.page-contact .form-group { display:flex; flex-direction:column; gap:6px; margin-bottom:16px; }
body.page-contact .form-group label { font-size:12px; font-weight:600; color:#515154; letter-spacing:.3px; }
body.page-contact .form-input, body.page-contact .form-select, body.page-contact .form-textarea {
  padding:13px 16px; border-radius:12px;
  border:1.5px solid #E8E8ED; background:#FAFAFA;
  font-size:14px; color:#1D1D1F; font-family:inherit;
  outline:none; transition:border-color .2s, background .2s;
  width:100%;
}
body.page-contact .form-input:focus, body.page-contact .form-select:focus, body.page-contact .form-textarea:focus {
  border-color:#FF2D55; background:#fff;
}
body.page-contact .form-input::placeholder, body.page-contact .form-textarea::placeholder { color:#AEAEB2; }
body.page-contact .form-select { appearance:none; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 7L11 1' stroke='%23AEAEB2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; padding-right:40px; }
body.page-contact .form-textarea { resize:vertical; min-height:130px; line-height:1.6; }

/* File upload */
body.page-contact .upload-zone {
  border:1.5px dashed #E8E8ED; border-radius:12px;
  padding:24px; text-align:center; cursor:pointer;
  transition:border-color .2s, background .2s; background:#FAFAFA;
}
body.page-contact .upload-zone:hover { border-color:#FF2D55; background:#FFF5F7; }
body.page-contact .upload-zone-icon { display:flex; justify-content:center; margin-bottom:8px; }
body.page-contact .upload-zone-text { font-size:13px; color:#86868B; line-height:1.5; }
body.page-contact .upload-zone-text strong { color:#1D1D1F; font-weight:600; }

/* Privacy note */
body.page-contact .form-privacy { display:flex; align-items:flex-start; gap:10px; margin:20px 0; }
body.page-contact .form-privacy input[type="checkbox"] { width:16px; height:16px; margin-top:1px; accent-color:#FF2D55; flex-shrink:0; cursor:pointer; }
body.page-contact .form-privacy label { font-size:12px; color:#86868B; line-height:1.55; cursor:pointer; }
body.page-contact .form-privacy a { color:#FF2D55; }

body.page-contact .btn-submit {
  width:100%; padding:16px; border-radius:14px;
  background:#1D1D1F; color:#fff;
  font-size:15px; font-weight:700; cursor:pointer;
  transition:all .25s; font-family:inherit;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
body.page-contact .btn-submit:hover { background:#3a3a3c; transform:scale(1.01); }
body.page-contact .btn-submit svg { width:16px; height:16px; transition:transform .2s; }
body.page-contact .btn-submit:hover svg { transform:translateX(3px); }

/* Success message */
body.page-contact .form-success {
  display:none; text-align:center; padding:40px 20px;
}
body.page-contact .form-success-icon { display:flex; justify-content:center; margin-bottom:16px; }
body.page-contact .form-success h3 { font-size:20px; font-weight:700; margin-bottom:8px; }
body.page-contact .form-success p { font-size:13px; color:#86868B; line-height:1.6; }

/* Right sidebar */
body.page-contact .contact-sidebar { display:flex; flex-direction:column; gap:16px; }

/* Info card */
body.page-contact .info-card {
  background:#fff; border-radius:20px; padding:32px;
  box-shadow:0 2px 8px rgba(0,0,0,0.04);
}
body.page-contact .info-card h3 { font-size:16px; font-weight:700; margin-bottom:20px; }
body.page-contact .info-item { display:flex; gap:14px; margin-bottom:20px; }
body.page-contact .info-item:last-child { margin-bottom:0; }
body.page-contact .info-icon {
  width:40px; height:40px; border-radius:12px; background:#F5F5F7;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
body.page-contact .info-label { font-size:11px; font-weight:600; color:#86868B; letter-spacing:.5px; text-transform:uppercase; margin-bottom:3px; }
body.page-contact .info-val { font-size:14px; font-weight:600; color:#1D1D1F; }
body.page-contact .info-sub { font-size:12px; color:#86868B; margin-top:1px; }

/* Response time card */
body.page-contact .resp-card {
  background:#1D1D1F; border-radius:20px; padding:28px;
  position:relative; overflow:hidden;
}
body.page-contact .resp-card::before { content:''; position:absolute; top:-60px; right:-60px; width:200px; height:200px; border-radius:50%; background:radial-gradient(circle,rgba(255,45,85,0.25) 0%,transparent 70%); filter:blur(30px); }
body.page-contact .resp-card h3 { font-size:15px; font-weight:700; color:#fff; margin-bottom:14px; position:relative; z-index:1; }
body.page-contact .resp-items { display:flex; flex-direction:column; gap:12px; position:relative; z-index:1; }
body.page-contact .resp-item { display:flex; justify-content:space-between; align-items:center; }
body.page-contact .resp-ch { font-size:13px; color:rgba(255,255,255,0.55); }
body.page-contact .resp-time { font-size:12px; font-weight:600; color:#fff; background:rgba(255,255,255,0.1); padding:4px 10px; border-radius:100px; }
body.page-contact .resp-time.fast { background:rgba(52,199,89,0.2); color:#34C759; }

/* Social card */
body.page-contact .social-card {
  background:#F0EDE8; border-radius:20px; padding:28px;
}
body.page-contact .social-card h3 { font-size:15px; font-weight:700; margin-bottom:16px; }
body.page-contact .social-links { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
body.page-contact .soc-link {
  display:flex; align-items:center; gap:10px;
  background:#fff; border-radius:12px; padding:12px 14px;
  font-size:13px; font-weight:600; color:#1D1D1F;
  transition:all .2s; cursor:pointer; border:1.5px solid transparent;
}
body.page-contact .soc-link:hover { border-color:#FF2D55; color:#FF2D55; }
body.page-contact .soc-icon { width:28px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }

/* ── MAP SECTION ── */
body.page-contact .map-s { padding:0 0 72px; }
body.page-contact .map-card {
  background:#fff; border-radius:24px; overflow:hidden;
  box-shadow:0 2px 12px rgba(0,0,0,0.04);
  display:grid; grid-template-columns:1fr 340px;
  min-height:400px;
}
body.page-contact .map-embed { position:relative; overflow:hidden; min-height:400px; }
body.page-contact .map-embed iframe,
body.page-contact .map-embed svg { width:100%; height:100%; border:none; min-height:400px; display:block; }
body.page-contact .map-embed iframe { filter:grayscale(15%) contrast(1.05); }
body.page-contact .map-info { padding:40px 36px; display:flex; flex-direction:column; justify-content:center; gap:20px; }
body.page-contact .map-info h2 { font-size:22px; font-weight:700; letter-spacing:-.3px; }
body.page-contact .map-info p { font-size:13px; color:#86868B; line-height:1.7; }
body.page-contact .map-detail { display:flex; flex-direction:column; gap:14px; }
body.page-contact .map-item { display:flex; gap:12px; align-items:flex-start; }
body.page-contact .map-item-icon { width:34px; height:34px; background:#F5F5F7; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
body.page-contact .map-item-label { font-size:11px; font-weight:600; color:#86868B; text-transform:uppercase; letter-spacing:.5px; margin-bottom:2px; }
body.page-contact .map-item-val { font-size:13px; font-weight:600; color:#1D1D1F; }
body.page-contact .btn-directions {
  display:inline-flex; align-items:center; gap:8px;
  background:#1D1D1F; color:#fff; padding:12px 22px;
  border-radius:100px; font-size:13px; font-weight:600;
  transition:all .2s; align-self:flex-start;
}
body.page-contact .btn-directions:hover { background:#3a3a3c; transform:scale(1.02); }

/* ── FAQ SECTION ── */
body.page-contact .faq-s { padding:0 0 72px; }
body.page-contact .faq-grid { display:grid; grid-template-columns:360px 1fr; gap:64px; align-items:start; }
body.page-contact .faq-left { position:sticky; top:100px; }
body.page-contact .faq-left .st { margin-bottom:16px; }
body.page-contact .faq-left p { font-size:13px; color:#86868B; line-height:1.7; margin-bottom:24px; }
body.page-contact .faq-cats { display:flex; flex-direction:column; gap:6px; }
body.page-contact .faq-cat {
  padding:10px 16px; border-radius:12px; font-size:13px; font-weight:500;
  color:#515154; cursor:pointer; transition:all .2s; text-align:left;
  border:1.5px solid transparent;
}
body.page-contact .faq-cat.on { background:#fff; color:#1D1D1F; font-weight:600; border-color:#E8E8ED; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
body.page-contact .faq-cat:hover:not(.on) { background:rgba(0,0,0,0.03); color:#1D1D1F; }

body.page-contact .faq-list { display:flex; flex-direction:column; gap:12px; }
body.page-contact .faq-item { background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.04); }
body.page-contact .faq-q {
  display:flex; justify-content:space-between; align-items:center;
  padding:20px 24px; cursor:pointer; gap:16px;
  transition:background .2s;
}
body.page-contact .faq-q:hover { background:#FAFAFA; }
body.page-contact .faq-q-text { font-size:14px; font-weight:600; color:#1D1D1F; line-height:1.4; }
body.page-contact .faq-chevron {
  width:28px; height:28px; border-radius:50%; background:#F5F5F7;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  transition:background .2s, transform .25s;
}
body.page-contact .faq-chevron svg { width:12px; height:12px; color:#515154; }
body.page-contact .faq-item.open .faq-chevron { background:#FF2D55; transform:rotate(180deg); }
body.page-contact .faq-item.open .faq-chevron svg { color:#fff; }
body.page-contact .faq-a {
  max-height:0; overflow:hidden;
  transition:max-height .35s cubic-bezier(.25,1,.5,1);
}
body.page-contact .faq-item.open .faq-a { max-height:300px; }
body.page-contact .faq-a-inner { padding:0 24px 22px; font-size:13px; color:#86868B; line-height:1.75; border-top:1px solid #F5F5F7; padding-top:18px; }
body.page-contact .faq-a-inner a { color:#FF2D55; font-weight:500; }

/* ── SUPPORT CHANNELS ── */
body.page-contact .channels-s { padding:0 0 72px; }
body.page-contact .channels-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
body.page-contact .ch-card {
  background:#fff; border-radius:20px; padding:32px 28px;
  display:flex; flex-direction:column; gap:16px;
  box-shadow:0 2px 8px rgba(0,0,0,0.04);
  transition:all .3s; cursor:pointer;
  border:1.5px solid transparent;
}
body.page-contact .ch-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.09); border-color:#FF2D55; }
body.page-contact .ch-icon-wrap {
  width:52px; height:52px; border-radius:16px; background:#F5F5F7;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s;
}
body.page-contact .ch-card:hover .ch-icon-wrap { background:#FFF0F3; }
body.page-contact .ch-title { font-size:16px; font-weight:700; }
body.page-contact .ch-desc { font-size:12px; color:#86868B; line-height:1.6; }
body.page-contact .ch-action { font-size:13px; font-weight:600; color:#FF2D55; margin-top:auto; display:flex; align-items:center; gap:4px; }
body.page-contact .ch-action::after { content:'→'; transition:transform .2s; }
body.page-contact .ch-card:hover .ch-action::after { transform:translateX(3px); }
body.page-contact .ch-badge { font-size:10px; font-weight:700; background:#E8FFF0; color:#34C759; padding:3px 8px; border-radius:100px; letter-spacing:.3px; display:inline-block; }

/* ── TRUST STRIP ── */
body.page-contact .trust-s {
  margin-bottom:72px;
  background:#fff; border-radius:20px; padding:36px 48px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  box-shadow:0 2px 8px rgba(0,0,0,0.04); flex-wrap:wrap;
}
body.page-contact .trust-item { display:flex; align-items:center; gap:12px; }
body.page-contact .trust-icon { display:flex; align-items:center; justify-content:center; width:32px; height:32px; }
body.page-contact .trust-title { font-size:13px; font-weight:700; }
body.page-contact .trust-sub { font-size:11px; color:#86868B; }
body.page-contact .trust-divider { width:1px; height:40px; background:#E8E8ED; flex-shrink:0; }

/* ── NEWSLETTER MINI ── */
body.page-contact .nl-s { padding:0 0 72px; }
body.page-contact .nl-banner {
  background:#1D1D1F; border-radius:24px; padding:52px 64px;
  display:flex; align-items:center; gap:80px;
  position:relative; overflow:hidden;
}
body.page-contact .nl-banner::before { content:''; position:absolute; top:-100px; right:-100px; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle,rgba(255,45,85,0.2) 0%,transparent 70%); filter:blur(40px); }
body.page-contact .nl-left { flex:1; position:relative; z-index:1; }
body.page-contact .nl-left .sl { color:rgba(255,255,255,0.3); }
body.page-contact .nl-left h2 { font-size:28px; font-weight:700; letter-spacing:-.4px; color:#fff; margin-bottom:6px; }
body.page-contact .nl-left p { font-size:13px; color:rgba(255,255,255,0.4); line-height:1.65; }
body.page-contact .nl-right { min-width:380px; position:relative; z-index:1; }
body.page-contact .nl-form { display:flex; gap:10px; }
body.page-contact .nl-in { flex:1; padding:12px 18px; border-radius:100px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12); color:#fff; font-size:13px; outline:none; font-family:inherit; }
body.page-contact .nl-in::placeholder { color:rgba(255,255,255,0.3); }
body.page-contact .nl-in:focus { border-color:rgba(255,45,85,0.6); }
body.page-contact .nl-btn { background:#FF2D55; color:#fff; padding:12px 22px; border-radius:100px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; white-space:nowrap; transition:background .2s; }
body.page-contact .nl-btn:hover { background:#FF4D6A; }

/* ── FOOTER ── */
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact .flogo em { color:#FF2D55; font-style:normal; }
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact .fsoc:hover { background:#FF2D55; border-color:#FF2D55; color:#fff; }
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact .flinks a:hover { color:rgba(255,255,255,0.72); }
body.page-contact 
body.page-contact 
body.page-contact 
body.page-contact 

/* ── SCROLL REVEAL ── */
body.page-contact .rv { opacity:0; transform:translateY(20px); transition:opacity .65s ease,transform .65s ease; }
body.page-contact .rv.show { opacity:1; transform:translateY(0); }
body.page-contact .rv2 { opacity:0; transform:translateY(20px); transition:opacity .65s ease .1s,transform .65s ease .1s; }
body.page-contact .rv2.show { opacity:1; transform:translateY(0); }

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

/* Tablet landscape ≤1100px */
@media (max-width:1024px) {
  body.page-contact .wrap { padding:0 28px; }
  body.page-contact 
  body.page-contact .page-hero-inner { padding:56px 56px 0; gap:40px; }
  body.page-contact .hero-left h1 { font-size:44px; }
  body.page-contact .channels-grid { grid-template-columns:repeat(2,1fr); }
  body.page-contact .contact-grid { grid-template-columns:1fr 320px; gap:16px; }
  body.page-contact .form-card { padding:36px; }
  body.page-contact .faq-grid { grid-template-columns:280px 1fr; gap:40px; }
  body.page-contact .map-card { grid-template-columns:1fr 300px; }
  body.page-contact 
  body.page-contact .ftop > div:last-child { display:none; }
  body.page-contact .nl-banner { padding:40px 48px; gap:48px; }
}

/* Tablet portrait ≤860px */
@media (max-width:768px) {
  /* Capsule header collapses nav */
  body.page-contact 
  body.page-contact 
  body.page-contact header nav { display:none; }
  body.page-contact .search-pill span { display:none; }
  body.page-contact .search-pill { padding:7px 10px; }

  body.page-contact .wrap { padding:0 20px; }
  body.page-contact .wrap > *:first-child { margin-top:80px; }

  /* Hero */
  body.page-contact .page-hero-inner {
    grid-template-columns:1fr;
    padding:48px 36px 0;
    min-height:auto;
  }
  body.page-contact .hero-right { display:none; }
  body.page-contact .hero-left { padding-bottom:48px; }
  body.page-contact .hero-left h1 { font-size:38px; }
  body.page-contact .hero-left p { font-size:14px; }

  /* Channels */
  body.page-contact .channels-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  body.page-contact .ch-card { padding:24px 20px; }

  /* Contact grid */
  body.page-contact .contact-grid { grid-template-columns:1fr; }
  body.page-contact .contact-sidebar { flex-direction:row; flex-wrap:wrap; gap:12px; }
  body.page-contact .contact-sidebar > * { flex:1 1 calc(50% - 6px); min-width:260px; }
  body.page-contact .form-card { padding:28px; }

  /* FAQ */
  body.page-contact .faq-grid { grid-template-columns:1fr; gap:24px; }
  body.page-contact .faq-left { position:static; }
  body.page-contact .faq-cats { flex-direction:row; flex-wrap:wrap; gap:6px; }
  body.page-contact .faq-cat { padding:7px 14px; }

  /* Map */
  body.page-contact .map-card { grid-template-columns:1fr; }
  body.page-contact .map-embed iframe { min-height:280px; }
  body.page-contact .map-info { padding:28px; }

  /* Trust strip */
  body.page-contact .trust-s { padding:24px 28px; flex-wrap:wrap; gap:16px; justify-content:flex-start; }
  body.page-contact .trust-divider { display:none; }
  body.page-contact .trust-item { flex:1 1 calc(50% - 8px); min-width:140px; }

  /* Newsletter */
  body.page-contact .nl-banner { flex-direction:column; gap:28px; padding:40px 36px; }
  body.page-contact .nl-right { min-width:unset; width:100%; }

  /* Footer */
  body.page-contact 
  body.page-contact .ftop > div:first-child { grid-column:span 2; }
  body.page-contact .ftop > div:last-child { display:block; }
}

/* Mobile ≤560px */
@media (max-width:380px) {
  body.page-contact 
  body.page-contact 
  body.page-contact 

  body.page-contact .wrap { padding:0 16px; }
  body.page-contact .wrap > *:first-child { margin-top:72px; }

  /* Hero */
  body.page-contact .page-hero-inner { padding:36px 24px 0; }
  body.page-contact .hero-left h1 { font-size:32px; letter-spacing:-1px; }
  body.page-contact .hero-badges { gap:6px; }
  body.page-contact .hero-badge { font-size:11px; padding:5px 10px; }

  /* Channels */
  body.page-contact .channels-grid { grid-template-columns:1fr; }

  /* Form */
  body.page-contact .form-row { grid-template-columns:1fr; }
  body.page-contact .form-card { padding:22px 20px; }
  body.page-contact .form-card h2 { font-size:20px; }

  /* Sidebar */
  body.page-contact .contact-sidebar { flex-direction:column; }
  body.page-contact .contact-sidebar > * { flex:none; width:100%; }

  /* FAQ */
  body.page-contact .faq-cats { }
  body.page-contact .faq-q { padding:16px 18px; }
  body.page-contact .faq-q-text { font-size:13px; }
  body.page-contact .faq-a-inner { padding:14px 18px 18px; }

  /* Map */
  body.page-contact .map-info { padding:22px; }
  body.page-contact .map-info h2 { font-size:18px; }
  body.page-contact .sh .st { font-size:26px; }

  /* Trust */
  body.page-contact .trust-item { flex:1 1 100%; }

  /* Newsletter */
  body.page-contact .nl-banner { padding:32px 24px; }
  body.page-contact .nl-form { flex-direction:column; }
  body.page-contact .nl-btn { width:100%; padding:13px; }
  body.page-contact .nl-left h2 { font-size:22px; }

  /* Footer */
  body.page-contact 
  body.page-contact .ftop > div:first-child { grid-column:span 1; }
  body.page-contact 
}

/* ── HAMBURGER & MOBILE DRAWER (added for consistency) ── */
body.page-contact 
body.page-contact .mobile-drawer { display:none; }
@media (max-width:1024px) {
  body.page-contact 
  body.page-contact header nav { display:none; }
}
@media (max-width:1024px) {
  body.page-contact .mobile-drawer { display:block; }
  body.page-contact .mobile-drawer .md-back { position:fixed; inset:0; background:rgba(0,0,0,0); backdrop-filter:blur(0); z-index:998; transition:background .4s, backdrop-filter .4s; pointer-events:none; }
  body.page-contact .mobile-drawer.on .md-back { background:rgba(0,0,0,.28); backdrop-filter:blur(6px); pointer-events:auto; }
  body.page-contact .md-panel { position:fixed; top:0; right:0; width:min(420px,85vw); height:100vh; background:var(--surface); z-index:999; transform:translateX(100%); transition:transform .5s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; border-left:1.5px solid var(--line); }
  body.page-contact .mobile-drawer.on .md-panel { transform:translateX(0); }
  body.page-contact .md-head { display:flex; align-items:center; justify-content:space-between; padding:0 24px; height:72px; border-bottom:1.5px solid var(--line); }
  body.page-contact .md-head 
  body.page-contact .md-head 
  body.page-contact .md-close { width:36px; height:36px; border-radius:50%; background:var(--line-soft); display:flex; align-items:center; justify-content:center; }
  body.page-contact .md-body { flex:1; overflow-y:auto; padding:20px 24px 40px; }
  
  
}
@media (max-width:768px) {
  body.page-contact 
  body.page-contact header nav { display:none; }
  body.page-contact .search-pill { display:none; }
}

/* ============================================================
   faq.html
   ============================================================ */

/* ===== faq.html ===== */

/* ── DESIGN TOKENS ── */
body.page-faq body.no-scroll { overflow:hidden; }
body.page-faq a { text-decoration:none; color:inherit; }
body.page-faq button { border:none; cursor:pointer; font-family:inherit; background:none; color:inherit; }
body.page-faq img { display:block; max-width:100%; }
body.page-faq input, body.page-faq select { font-family:inherit; }
body.page-faq a:focus-visible, body.page-faq button:focus-visible, body.page-faq input:focus-visible, body.page-faq summary:focus-visible {
  outline:2px solid var(--brand); outline-offset:3px; border-radius:6px;
}
@media (prefers-reduced-motion: reduce) {

/* ── ANNOUNCEMENT BAR ── */
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq 
 to{transform:translateX(-50%)} }

/* ── HEADER ── */
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq header nav { display:flex; gap:1px; flex:1; justify-content:center; }
body.page-faq 
body.page-faq .ni > a:hover, body.page-faq .ni.active > a { color:var(--ink); background:rgba(0,0,0,0.05); }
body.page-faq .ni.active > a { color:var(--brand); }
body.page-faq 
body.page-faq .search-pill { display:flex; align-items:center; gap:7px; background:rgba(0,0,0,0.05); border-radius:100px; padding:6px 14px; cursor:pointer; transition:background .2s; }
body.page-faq .search-pill:hover { background:rgba(0,0,0,0.08); }
body.page-faq .search-pill svg { width:13px; height:13px; opacity:.4; }
body.page-faq .search-pill span { font-size:13px; color:var(--muted-2); }
body.page-faq 
body.page-faq .ib:hover { background:rgba(0,0,0,0.05); }
body.page-faq .ib svg { width:17px; height:17px; }
body.page-faq 
body.page-faq 

/* ── MOBILE DRAWER ── */

/* ── WRAP ── */
body.page-faq .wrap { max-width:1360px; margin:0 auto; padding:0 40px; }

/* ── BREADCRUMB / PAGE HERO ── */
body.page-faq .shop-hero { padding-top:28px; padding-bottom:8px; }
body.page-faq .bcrumb { font-size:12.5px; color:var(--muted-2); display:flex; align-items:center; gap:6px; margin-bottom:18px; }
body.page-faq .bcrumb a { color:var(--muted-2); transition:color .2s; }
body.page-faq .bcrumb a:hover { color:var(--ink); }
body.page-faq .bcrumb .sep { color:var(--muted-3); }
body.page-faq .bcrumb .cur { color:var(--ink); font-weight:500; }
body.page-faq .shop-title-row {
  display:flex; align-items:baseline; justify-content:flex-start;
  gap:18px; flex-wrap:wrap; margin-bottom:6px;
}
body.page-faq .shop-title { font-size:32px; font-weight:700; letter-spacing:-.6px; line-height:1.1; }
body.page-faq .shop-meta { font-size:11px; color:var(--muted-2); letter-spacing:1.4px; text-transform:uppercase; }
body.page-faq .shop-meta strong { color:var(--ink); font-weight:700; }
body.page-faq .shop-sub { font-size:14px; color:var(--muted-2); max-width:560px; line-height:1.55; }

/* ── ACTIVE FILTER CHIPS (top toolbar) ── */
body.page-faq .chips-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:18px 0 0; }
body.page-faq .chips-row:empty { padding:0; }
body.page-faq .fchip {
  display:inline-flex; align-items:center; gap:6px;
  background:var(--surface); border:1px solid var(--line);
  padding:5px 6px 5px 12px; border-radius:var(--radius-pill);
  font-size:12px; font-weight:500; color:var(--ink);
  transition:border-color .2s,background .2s;
}
body.page-faq .fchip:hover { border-color:var(--ink); }
body.page-faq .fchip-x {
  width:17px; height:17px; border-radius:50%;
  background:var(--bg); color:var(--muted-2);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; line-height:1; transition:background .2s,color .2s;
}
body.page-faq .fchip-x:hover { background:var(--brand); color:#fff; }
body.page-faq .fchip-clear {
  font-size:12px; font-weight:600; color:var(--brand);
  padding:5px 4px; transition:opacity .2s;
}
body.page-faq .fchip-clear:hover { opacity:.75; }

/* ── SHOP LAYOUT ── */
body.page-faq .shop-grid {
  display:grid;
  grid-template-columns:240px 1fr;
  gap:48px;
  padding:20px 0 80px;
  align-items:flex-start;
}

/* ── FILTER SIDEBAR ── */
body.page-faq .filters {
  position:sticky; top:96px;
  background:transparent;
  max-height:calc(100vh - 116px);
  overflow-y:auto;
  scrollbar-width:thin;
}
body.page-faq .filters::-webkit-scrollbar { width:5px; }
body.page-faq .filters::-webkit-scrollbar-thumb { background:var(--line); border-radius:3px; }
body.page-faq .filters::-webkit-scrollbar-thumb:hover { background:var(--muted-3); }

body.page-faq .f-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:0 0 12px;
}
body.page-faq .f-head h3 { font-size:11px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:var(--ink); }
body.page-faq .f-head-clear { font-size:12px; color:var(--brand); font-weight:500; transition:opacity .2s; }
body.page-faq .f-head-clear:hover { opacity:.7; }

/* filter group (details/summary) */
body.page-faq .fgroup { border-top:1px solid var(--line-soft); }
body.page-faq .fgroup:first-of-type { border-top:1px solid var(--line); }
body.page-faq .fgroup > summary {
  list-style:none; cursor:pointer; user-select:none;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0 12px;
  font-size:13px; font-weight:600; color:var(--ink);
  letter-spacing:.1px;
}
body.page-faq .fgroup > summary::-webkit-details-marker { display:none; }
body.page-faq .fgroup > summary .chev {
  width:11px; height:11px; opacity:.4; transition:transform .25s;
  flex-shrink:0;
}
body.page-faq .fgroup[open] > summary .chev { transform:rotate(180deg); }
body.page-faq .fgroup-body { padding:2px 0 14px; }

/* checkbox/radio rows */
body.page-faq .fopt {
  display:flex; align-items:center; gap:11px;
  padding:6px 0; font-size:13px; color:var(--muted); cursor:pointer;
  transition:color .15s;
}
body.page-faq .fopt:hover { color:var(--ink); }
body.page-faq .fopt input { position:absolute; opacity:0; pointer-events:none; }
body.page-faq .fopt-mark {
  width:16px; height:16px; border-radius:4px;
  border:1.5px solid var(--line); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  transition:all .15s;
  position:relative;
  background:#fff;
}
body.page-faq .fopt-mark.radio { border-radius:50%; }
body.page-faq .fopt:hover .fopt-mark { border-color:var(--ink-2); }
body.page-faq .fopt-mark::after {
  content:''; opacity:0; transition:opacity .15s;
}
body.page-faq .fopt input:checked ~ .fopt-mark {
  background:var(--brand); border-color:var(--brand);
}
body.page-faq .fopt input:checked ~ .fopt-mark::after {
  opacity:1;
  width:4px; height:7px;
  border:solid #fff; border-width:0 2px 2px 0;
  transform:rotate(45deg) translate(-1px,-1px);
}
body.page-faq .fopt input:checked ~ .fopt-mark.radio::after {
  width:6px; height:6px; border:none; background:#fff;
  border-radius:50%; transform:none;
}
body.page-faq .fopt input:checked ~ .fopt-text { color:var(--ink); font-weight:500; }
body.page-faq .fopt-text { flex:1; }
body.page-faq .fopt-count { font-size:11.5px; color:var(--muted-3); flex-shrink:0; font-variant-numeric:tabular-nums; }

/* ── PRICE ── */
body.page-faq .price-readout {
  display:flex; align-items:baseline; gap:10px;
  font-size:14px; color:var(--ink); font-weight:600;
  margin:4px 0 18px;
  font-variant-numeric:tabular-nums;
  letter-spacing:.2px;
}
body.page-faq .price-readout .dash { color:var(--muted-3); font-weight:400; }

body.page-faq .price-slider {
  position:relative; height:22px; margin:0 0 4px;
}
body.page-faq .price-track {
  position:absolute; top:50%; left:0; right:0;
  transform:translateY(-50%);
  height:2px; background:var(--line); border-radius:1px;
}
body.page-faq .price-fill {
  position:absolute; top:50%; transform:translateY(-50%);
  height:2px; background:var(--ink); border-radius:1px;
  left:10%; right:50%;
}
body.page-faq .price-slider input[type=range] {
  position:absolute; top:0; left:0; right:0; width:100%;
  -webkit-appearance:none; appearance:none;
  background:none; pointer-events:none; height:22px; margin:0;
}
body.page-faq .price-slider input[type=range]::-webkit-slider-thumb {
  -webkit-appearance:none; appearance:none;
  width:18px; height:18px; border-radius:50%;
  background:#fff; border:none;
  cursor:grab; pointer-events:auto;
  box-shadow:0 0 0 1.5px var(--ink), 0 2px 6px rgba(0,0,0,.08);
  transition:transform .15s,box-shadow .15s;
}
body.page-faq .price-slider input[type=range]::-webkit-slider-thumb:hover { transform:scale(1.08); }
body.page-faq .price-slider input[type=range]::-webkit-slider-thumb:active { cursor:grabbing; transform:scale(1.12); box-shadow:0 0 0 1.5px var(--brand), 0 2px 8px rgba(0,0,0,.12); }
body.page-faq .price-slider input[type=range]::-moz-range-thumb {
  width:18px; height:18px; border-radius:50%;
  background:#fff; border:none;
  cursor:grab; pointer-events:auto;
  box-shadow:0 0 0 1.5px var(--ink), 0 2px 6px rgba(0,0,0,.08);
}

/* ── TOGGLES ── */
body.page-faq .fopt.toggle { justify-content:space-between; padding:8px 0; }
body.page-faq .toggle-sw {
  width:34px; height:20px; border-radius:100px; background:var(--line);
  position:relative; transition:background .2s; flex-shrink:0;
}
body.page-faq .toggle-sw::before {
  content:''; position:absolute; top:2px; left:2px;
  width:16px; height:16px; border-radius:50%; background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.18); transition:transform .2s;
}
body.page-faq .fopt input:checked ~ .toggle-sw { background:var(--brand); }
body.page-faq .fopt input:checked ~ .toggle-sw::before { transform:translateX(14px); }

/* mobile-only "Show results" button: hidden by default, shown in @media ≤768 */
body.page-faq .f-mobile-apply { display:none; }

/* ── RESULTS / TOOLBAR ── */
body.page-faq .results { min-width:0; }
body.page-faq .toolbar {
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding-bottom:18px; flex-wrap:wrap;
}
body.page-faq .t-left { display:flex; align-items:center; gap:14px; }
body.page-faq .t-count { font-size:13px; color:var(--muted-2); }
body.page-faq .t-count strong { color:var(--ink); font-weight:700; }
body.page-faq .t-right { display:flex; align-items:center; gap:8px; }

/* custom sort dropdown */
body.page-faq .sortdrop { position:relative; z-index:10; }
body.page-faq .sortbtn {
  display:flex; align-items:center; gap:8px;
  padding:8px 14px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff;
  font-size:13px; font-weight:500; color:var(--ink);
  cursor:pointer; transition:border-color .15s;
}
body.page-faq .sortbtn:hover { border-color:var(--ink); }
body.page-faq .sortbtn .lbl { color:var(--muted-2); margin-right:-2px; }
body.page-faq .sortbtn .val { font-weight:600; }
body.page-faq .sortbtn .chev { width:11px; height:11px; opacity:.55; transition:transform .2s; }
body.page-faq .sortdrop.on .sortbtn .chev { transform:rotate(180deg); }
body.page-faq .sortmenu {
  position:absolute; top:calc(100% + 8px); right:0; min-width:200px;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:6px; box-shadow:var(--shadow-md);
  opacity:0; visibility:hidden; transform:translateY(-4px);
  transition:opacity .18s,transform .18s,visibility .18s;
  z-index:50;
}
body.page-faq .sortdrop.on .sortmenu { opacity:1; visibility:visible; transform:translateY(0); }
body.page-faq .sortopt {
  width:100%; text-align:left; display:flex; align-items:center; justify-content:space-between;
  padding:10px 12px; border-radius:8px;
  font-size:13px; color:var(--muted); transition:background .15s,color .15s;
  cursor:pointer;
}
body.page-faq .sortopt:hover { background:var(--bg); color:var(--ink); }
body.page-faq .sortopt.on { color:var(--ink); font-weight:600; }
body.page-faq .sortopt.on::after { content:''; width:14px; height:8px; border:solid var(--brand); border-width:0 0 2px 2px; transform:rotate(-45deg) translateY(-2px); }

/* view toggle */
body.page-faq .viewtog {
  display:flex; gap:2px; padding:2px;
  background:var(--bg); border-radius:var(--radius-pill);
}
body.page-faq .vbtn {
  width:30px; height:30px; border-radius:var(--radius-pill);
  display:flex; align-items:center; justify-content:center;
  color:var(--muted-2); transition:all .15s;
}
body.page-faq .vbtn:hover { color:var(--ink); }
body.page-faq .vbtn.on { background:#fff; color:var(--ink); box-shadow:0 1px 3px rgba(0,0,0,.08); }
body.page-faq .vbtn svg { width:14px; height:14px; }

/* mobile filter button */
body.page-faq .fbtn-mobile {
  display:none; align-items:center; gap:8px;
  padding:8px 14px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff;
  font-size:13px; font-weight:600;
}
body.page-faq .fbtn-mobile svg { width:14px; height:14px; }
body.page-faq .fbtn-mobile .badge {
  background:var(--brand); color:#fff; font-size:10px; font-weight:700;
  width:18px; height:18px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
}

/* ── PRODUCT GRID ── */
body.page-faq .pgrid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:24px 18px;
}
body.page-faq .pgrid.list-view { grid-template-columns:1fr; gap:14px; }
/* list-view card: horizontal, small image on left, info on right */
body.page-faq .pgrid.list-view .pcard {
  display:flex; gap:20px; padding:14px;
  background:#fff; border-radius:var(--radius-md);
  box-shadow:var(--shadow-sm);
  align-items:center;
  transition:box-shadow .2s,transform .2s;
}
body.page-faq .pgrid.list-view .pcard:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }
body.page-faq .pgrid.list-view .pcard-img {
  width:140px; flex-shrink:0; aspect-ratio:1; margin-bottom:0;
  border-radius:var(--radius-sm); box-shadow:none;
}
body.page-faq .pgrid.list-view .pcard:hover .pcard-img { transform:none; }
body.page-faq .pgrid.list-view .pcard > *:not(.pcard-img) { /* info column */ }
body.page-faq .pgrid.list-view .pcard-quick { display:none; }
body.page-faq .pgrid.list-view .pcard-badge { font-size:9px; padding:3px 7px; letter-spacing:.4px; top:9px; left:9px; }
body.page-faq .pgrid.list-view .pcard-wish { width:28px; height:28px; font-size:12px; top:9px; right:9px; }
body.page-faq .pgrid.list-view .pcard-name { font-size:16px; }
body.page-faq .pgrid.list-view .pcard-var { font-size:13px; }
body.page-faq .pgrid.list-view .pcard-pr { margin-top:4px; }
body.page-faq .pgrid.list-view .pcard-p { font-size:18px; }
/* wrap text content in implicit "rest" */
.pgrid.list-view .pcard-stars,
.pgrid.list-view .pcard-name,
.pgrid.list-view .pcard-var,
body.page-faq .pgrid.list-view .pcard-pr { flex-shrink:1; }
body.page-faq .pcard { cursor:pointer; }
body.page-faq .pcard-img {
  background:#fff; border-radius:var(--radius-md); aspect-ratio:1/1;
  overflow:hidden; margin-bottom:12px; position:relative;
  box-shadow:var(--shadow-sm); transition:box-shadow .3s,transform .3s;
}
body.page-faq .pcard:hover .pcard-img { box-shadow:var(--shadow-md); transform:translateY(-2px); }
body.page-faq .pcard-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
body.page-faq .pcard:hover .pcard-img img { transform:scale(1.05); }

/* badges */
body.page-faq .pcard-badge {
  position:absolute; top:12px; left:12px; z-index:2;
  padding:4px 10px; border-radius:var(--radius-pill);
  font-size:10px; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
}
body.page-faq .bg-new { background:var(--ink); color:#fff; }
body.page-faq .bg-hot { background:var(--brand); color:#fff; }
body.page-faq .bg-sale { background:#FF9500; color:#fff; }
body.page-faq .bg-top { background:#34C759; color:#fff; }

/* wishlist */
body.page-faq .pcard-wish {
  position:absolute; top:12px; right:12px; z-index:2;
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,0.9); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  font-size:14px; transition:background .2s,color .2s,transform .2s;
  color:var(--ink);
}
body.page-faq .pcard-wish:hover { background:var(--brand); color:#fff; transform:scale(1.08); }
body.page-faq .pcard-wish.on { background:var(--brand); color:#fff; }

/* quick view */
body.page-faq .pcard-quick {
  position:absolute; left:12px; right:12px; bottom:-44px; z-index:2;
  background:rgba(29,29,31,0.94); backdrop-filter:blur(12px);
  color:#fff; padding:11px; border-radius:var(--radius-pill);
  font-size:12px; font-weight:600; transition:bottom .3s cubic-bezier(.25,1,.5,1);
  text-align:center;
}
body.page-faq .pcard:hover .pcard-quick { bottom:12px; }
body.page-faq .pcard-quick:hover { background:var(--brand); }

/* meta */
body.page-faq .pcard-stars { font-size:12px; color:#FFCC00; margin-bottom:4px; display:flex; align-items:center; gap:4px; }
body.page-faq .pcard-stars span { color:var(--muted-3); font-size:11px; }
body.page-faq .pcard-name { font-size:14px; font-weight:600; margin-bottom:2px; line-height:1.35; }
body.page-faq .pcard-var { font-size:12px; color:var(--muted-2); margin-bottom:8px; }

/* price */
body.page-faq .pcard-pr { display:flex; align-items:baseline; gap:7px; flex-wrap:wrap; }
body.page-faq .pcard-p { font-size:15px; font-weight:700; color:var(--ink); }
body.page-faq .pcard-o { font-size:12px; color:var(--muted-3); text-decoration:line-through; }
body.page-faq .pcard-off { font-size:11px; font-weight:700; color:var(--brand); }

/* ── LOAD MORE ── */
body.page-faq .lmore-wrap { text-align:center; padding:48px 0 16px; }
body.page-faq .lmore {
  padding:13px 32px; border-radius:var(--radius-pill);
  border:1.5px solid var(--line); background:#fff;
  font-size:13px; font-weight:600; color:var(--ink);
  transition:all .2s;
}
body.page-faq .lmore:hover { border-color:var(--ink); transform:translateY(-1px); box-shadow:var(--shadow-sm); }
body.page-faq .lmore-meta { font-size:12px; color:var(--muted-2); margin-top:12px; }

/* ── FOOTER ── */
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq .flogo em { color:var(--brand); font-style:normal; }
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq .fsoc:hover { background:var(--brand); border-color:var(--brand); color:#fff; }
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq .flinks a:hover { color:rgba(255,255,255,0.72); }
body.page-faq 
body.page-faq 
body.page-faq 
body.page-faq 

/* ───────────────────────────────────────────────
   TABLET — ≤ 1024px
   ─────────────────────────────────────────────── */
@media (max-width:1024px) {
  body.page-faq .wrap, body.page-faq 
  body.page-faq 
  body.page-faq 
  body.page-faq header nav { gap:0; }
  body.page-faq 
  body.page-faq .search-pill span { display:none; }
  body.page-faq .search-pill { padding:8px 10px; }

  body.page-faq .shop-title { font-size:34px; }
  body.page-faq .shop-grid { grid-template-columns:200px 1fr; gap:32px; }
  body.page-faq .pgrid { grid-template-columns:repeat(2, 1fr); gap:20px 14px; }

  body.page-faq 
  body.page-faq .ftop > div:first-child { grid-column:1/-1; max-width:520px; }
}

/* ───────────────────────────────────────────────
   MOBILE — ≤ 768px
   ─────────────────────────────────────────────── */
@media (max-width:768px) {
  body.page-faq 
  body.page-faq header nav, body.page-faq header .search-pill, body.page-faq .ib[title="Wishlist"], body.page-faq .ib[title="Account"] { display:none; }
  body.page-faq 
  body.page-faq 
  body.page-faq 
  body.page-faq 
  body.page-faq .ib svg { width:18px; height:18px; }
  body.page-faq 
  body.page-faq 
  body.page-faq 
  body.page-faq .wrap, body.page-faq 

  /* hero */
  body.page-faq .shop-hero { padding-top:22px; padding-bottom:16px; }
  body.page-faq .shop-title { font-size:26px; letter-spacing:-.5px; }
  body.page-faq .shop-sub { font-size:13.5px; margin-top:6px; }
  body.page-faq .shop-meta { padding-bottom:0; }
  body.page-faq .shop-title-row { gap:14px; }

  /* convert sidebar to bottom-sheet */
  body.page-faq .shop-grid { grid-template-columns:1fr; gap:0; padding:8px 0 60px; }
  body.page-faq .filters {
    position:fixed; bottom:0; left:0; right:0; top:auto;
    width:100%; max-height:85vh; max-width:100%;
    border-radius:24px 24px 0 0; padding:0;
    transform:translateY(100%); transition:transform .35s cubic-bezier(.25,1,.5,1);
    z-index:960; display:flex; flex-direction:column;
    box-shadow:0 -8px 32px rgba(0,0,0,0.18);
    background:#fff;
  }
  body.page-faq .filters.on { transform:translateY(0); }
  body.page-faq .filters::before {
    content:''; position:sticky; top:0; left:50%; transform:translateX(-50%);
    width:40px; height:4px; background:var(--line); border-radius:2px;
    margin:8px auto; flex-shrink:0;
  }
  /* mobile: re-add horizontal padding inside sections (desktop has 0 since the column is its own width) */
  body.page-faq .f-head { padding:6px 20px 14px; margin-bottom:0; }
  body.page-faq .fgroup > summary { padding:18px 20px 14px; }
  body.page-faq .fgroup-body { padding:0 20px 18px; }
  body.page-faq .f-mobile-apply {
    display:block;
    position:sticky; bottom:0; padding:14px 20px 18px;
    background:linear-gradient(to top,#fff 70%,rgba(255,255,255,0));
    margin-top:auto;
  }
  body.page-faq .f-mobile-apply button {
    width:100%; padding:14px; border-radius:var(--radius-pill);
    background:var(--ink); color:#fff; font-size:14px; font-weight:600;
  }
  body.page-faq .filter-backdrop {
    position:fixed; inset:0; background:rgba(0,0,0,0.45);
    backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
    opacity:0; visibility:hidden; transition:opacity .3s,visibility .3s;
    z-index:955;
  }
  body.page-faq .filter-backdrop.on { opacity:1; visibility:visible; }

  /* show mobile filter trigger */
  body.page-faq .fbtn-mobile { display:inline-flex; }

  /* toolbar layout */
  body.page-faq .toolbar { gap:10px; padding-bottom:14px; }
  body.page-faq .t-left { gap:10px; flex:1; }
  body.page-faq .sortbtn .lbl { display:none; }
  body.page-faq .sortbtn { padding:8px 12px; }

  /* products: 2 cols */
  body.page-faq .pgrid { grid-template-columns:1fr 1fr; gap:18px 12px; }
  body.page-faq .pcard-img { border-radius:var(--radius-sm); }
  body.page-faq .pcard-quick { display:none; }   /* tap goes to PDP, less clutter */
  body.page-faq .pcard-wish { opacity:1; width:30px; height:30px; font-size:12px; top:9px; right:9px; }
  body.page-faq .pcard-badge { top:9px; left:9px; padding:3px 8px; font-size:9px; }
  body.page-faq .pcard-name { font-size:13px; }
  body.page-faq .pcard-p { font-size:14px; }

  /* footer */
  body.page-faq 
  body.page-faq 
  body.page-faq .ftop > div:first-child { grid-column:1/-1; }
  body.page-faq 

  /* hide mobile-only-hidden things */
  body.page-faq .filters .f-head-clear-desktop { display:none; }
  body.page-faq .desktop-only { display:none; }
}

/* small mobile */
@media (max-width:380px) {
  body.page-faq 
  body.page-faq 
  body.page-faq 
  body.page-faq .pgrid { gap:14px 10px; }
  body.page-faq .pcard-name, body.page-faq .pcard-p { font-size:12.5px; }
}

/* ── PAGE HERO ── */
body.page-faq .page-hero { padding:24px 0 0; }
body.page-faq .page-hero-inner {
  background:#1D1D1F; border-radius:28px; padding:72px 72px 0;
  display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:flex-end;
  overflow:hidden; position:relative; min-height:380px;
}
body.page-faq .page-hero-inner::before {
  content:''; position:absolute; top:-100px; right:-100px; width:500px; height:500px;
  border-radius:50%; background:radial-gradient(circle,rgba(255,45,85,0.18) 0%,transparent 70%); filter:blur(60px);
}
body.page-faq .hero-left { position:relative; z-index:2; padding-bottom:72px; }
body.page-faq .hero-left .sl { color:rgba(255,255,255,0.3); }
body.page-faq .hero-left h1 { font-size:52px; font-weight:800; letter-spacing:-1.5px; line-height:1.0; color:#fff; margin-bottom:16px; }
body.page-faq .hero-left p { font-size:15px; color:rgba(255,255,255,0.45); line-height:1.7; max-width:400px; }
body.page-faq .hero-right { position:relative; z-index:2; align-self:flex-end; }
body.page-faq .hero-right img { width:100%; max-width:480px; border-radius:20px 20px 0 0; object-fit:cover; height:340px; margin-left:auto; }

/* ── FAQ SECTION ── */
body.page-faq .faq-s { padding:64px 0 72px; }
body.page-faq .faq-grid { display:grid; grid-template-columns:280px 1fr; gap:48px; align-items:start; }
body.page-faq .faq-left { position:sticky; top:100px; }
body.page-faq .faq-left .st { margin-bottom:16px; }
body.page-faq .faq-left p { font-size:13px; color:#86868B; line-height:1.7; margin-bottom:24px; }
body.page-faq .faq-cats { display:flex; flex-direction:column; gap:6px; }
body.page-faq .faq-cat {
  padding:10px 16px; border-radius:12px; font-size:13px; font-weight:500;
  color:#515154; cursor:pointer; transition:all .2s; text-align:left; border:1.5px solid transparent; background:none;
}
body.page-faq .faq-cat.on { background:#fff; color:#1D1D1F; font-weight:600; border-color:#E8E8ED; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
body.page-faq .faq-cat:hover:not(.on) { background:rgba(0,0,0,0.03); color:#1D1D1F; }

body.page-faq .faq-list { display:flex; flex-direction:column; gap:12px; }
body.page-faq .faq-item { background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.04); }
body.page-faq .faq-q {
  display:flex; justify-content:space-between; align-items:center;
  padding:20px 24px; cursor:pointer; gap:16px; transition:background .2s; border:none; background:none; width:100%; text-align:left; font:inherit;
}
body.page-faq .faq-q:hover { background:#FAFAFA; }
body.page-faq .faq-q-text { font-size:14px; font-weight:600; color:#1D1D1F; line-height:1.4; }
body.page-faq .faq-chevron {
  width:28px; height:28px; border-radius:50%; background:#F5F5F7;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  transition:background .2s, transform .25s;
}
body.page-faq .faq-chevron svg { width:12px; height:12px; color:#515154; }
body.page-faq .faq-item.open .faq-chevron { background:#FF2D55; transform:rotate(180deg); }
body.page-faq .faq-item.open .faq-chevron svg { color:#fff; }
body.page-faq .faq-a {
  max-height:0; overflow:hidden;
  transition:max-height .35s cubic-bezier(.25,1,.5,1);
}
body.page-faq .faq-item.open .faq-a { max-height:400px; }
body.page-faq .faq-a-inner { padding:0 24px 22px; font-size:13px; color:#86868B; line-height:1.75; border-top:1px solid #F5F5F7; padding-top:18px; }
body.page-faq .faq-a-inner a { color:#FF2D55; font-weight:500; }

/* ── CTA BANNER ── */
body.page-faq .cta-s { padding:0 0 72px; }
body.page-faq .cta-banner {
  background:#1D1D1F; border-radius:24px; padding:52px 64px;
  display:flex; align-items:center; justify-content:space-between; gap:48px;
  position:relative; overflow:hidden;
}
body.page-faq .cta-banner::before {
  content:''; position:absolute; top:-80px; right:-80px; width:350px; height:350px;
  border-radius:50%; background:radial-gradient(circle,rgba(255,45,85,0.18) 0%,transparent 70%); filter:blur(50px);
}
body.page-faq .cta-left { position:relative; z-index:1; }
body.page-faq .cta-left h2 { font-size:28px; font-weight:700; letter-spacing:-.4px; color:#fff; margin-bottom:8px; }
body.page-faq .cta-left p { font-size:14px; color:rgba(255,255,255,0.45); line-height:1.6; }
body.page-faq .cta-right { position:relative; z-index:1; display:flex; gap:12px; flex-shrink:0; }
body.page-faq .btn-w { background:#fff; color:#1D1D1F; padding:14px 28px; border-radius:100px; font-size:14px; font-weight:600; transition:all .2s; }
body.page-faq .btn-w:hover { transform:scale(1.03); }
body.page-faq .btn-o { background:rgba(255,255,255,0.08); color:#fff; padding:14px 28px; border-radius:100px; font-size:14px; font-weight:500; border:1px solid rgba(255,255,255,0.15); transition:all .2s; }
body.page-faq .btn-o:hover { background:rgba(255,255,255,0.15); }

/* ── SHARED LABELS ── */
body.page-faq .sl { font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:#FF2D55; display:block; margin-bottom:8px; }
body.page-faq .st { font-size:34px; font-weight:700; letter-spacing:-.5px; line-height:1.1; }
body.page-faq .sh { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:32px; }

/* ── RESPONSIVE ── */
@media (max-width:1024px) {
  body.page-faq .page-hero-inner { padding:56px 56px 0; gap:40px; }
  body.page-faq .hero-left h1 { font-size:44px; }
  body.page-faq .faq-grid { grid-template-columns:240px 1fr; gap:32px; }
  body.page-faq .cta-banner { padding:40px 48px; }
}
@media (max-width:768px) {
  body.page-faq .page-hero-inner { grid-template-columns:1fr; padding:48px 36px 0; min-height:auto; }
  body.page-faq .hero-right { display:none; }
  body.page-faq .hero-left { padding-bottom:48px; }
  body.page-faq .hero-left h1 { font-size:38px; }
  body.page-faq .faq-grid { grid-template-columns:1fr; gap:24px; }
  body.page-faq .faq-left { position:static; }
  body.page-faq .faq-cats { flex-direction:row; flex-wrap:wrap; gap:6px; }
  body.page-faq .faq-cat { padding:7px 14px; }
  body.page-faq .cta-banner { flex-direction:column; align-items:flex-start; gap:24px; padding:36px 28px; }
  body.page-faq .cta-right { width:100%; flex-direction:column; }
  body.page-faq .btn-w, body.page-faq .btn-o { width:100%; text-align:center; }
}
@media (max-width:380px) {
  body.page-faq .page-hero-inner { padding:36px 24px 0; }
  body.page-faq .hero-left h1 { font-size:32px; }
  body.page-faq .faq-q { padding:16px 18px; }
  body.page-faq .faq-q-text { font-size:13px; }
  body.page-faq .faq-a-inner { padding:14px 18px 18px; }
}

/* ============================================================
   blog.html
   ============================================================ */

/* ===== blog.html ===== */

/* ── DESIGN TOKENS ── */
/* ============================================================
   PDP — Review form (SoulxDoll override of WC review form)
   Matches the .reviews-section / .rs-card / .review-card aesthetic.
   Renders inside `.luxe-review-form-wrap` from
   woocommerce/single-product-reviews.php
   ============================================================ */

.luxe-review-form-wrap {
  margin-top: 32px;
  padding: 32px;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
}

/* Reset WC's faint legacy spacing that bleeds in via #respond */
.luxe-review-form-wrap #respond,
.luxe-review-form-wrap .comment-respond { margin: 0; padding: 0; border: 0; background: transparent; }

/* Form title — "Write a review" */
.luxe-review-form-wrap .comment-reply-title {
  display: block;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -.2px;
  margin: 0 0 20px;
  line-height: 1.3;
}
.luxe-review-form-wrap .comment-reply-title small { display: none; }

/* Field row spacing */
.luxe-review-form-wrap .comment-form > p,
.luxe-review-form-wrap .comment-form-rating { margin: 0 0 18px; }
.luxe-review-form-wrap .comment-form > p:last-of-type,
.luxe-review-form-wrap .form-submit { margin-bottom: 0; }

/* Labels */
.luxe-review-form-wrap label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: .3px;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.luxe-review-form-wrap .required { color: var(--brand); margin-left: 2px; }

/* Inputs + textarea */
.luxe-review-form-wrap input[type="text"],
.luxe-review-form-wrap input[type="email"],
.luxe-review-form-wrap input[type="url"],
.luxe-review-form-wrap textarea {
  width: 100%;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  line-height: 1.5;
  transition: border-color .15s, box-shadow .15s;
  -webkit-appearance: none;
  appearance: none;
}
.luxe-review-form-wrap textarea {
  min-height: 140px;
  resize: vertical;
  line-height: 1.6;
  font-family: inherit;
}
.luxe-review-form-wrap input::placeholder,
.luxe-review-form-wrap textarea::placeholder { color: var(--muted-3); }
.luxe-review-form-wrap input:focus,
.luxe-review-form-wrap textarea:focus {
  outline: none;
  border-color: var(--ink);
  box-shadow: 0 0 0 3px rgba(0,0,0,.06);
}

/* 2-column author + email row on wider viewports */
@media (min-width: 720px) {
  .luxe-review-form-wrap .comment-form-author,
  .luxe-review-form-wrap .comment-form-email {
    display: inline-block;
    width: calc(50% - 8px);
    vertical-align: top;
  }
  .luxe-review-form-wrap .comment-form-author { margin-right: 14px; }
}

/* ── Star rating selector ── */
.luxe-review-form-wrap .comment-form-rating { margin-bottom: 22px; }
.luxe-review-form-wrap .comment-form-rating label {
  display: block;
  margin-bottom: 8px;
}
/* ── Review form: self-contained 5-star rating widget ──────────────────────
 * Markup: .luxe-stars > button.luxe-star (each holds an inline <svg> star).
 * Empty = light grey outline-fill; .on = brand gold fill. JS toggles .on on
 * hover/select. No dependency on WooCommerce's review JS. */
.luxe-review-form-wrap .luxe-stars {
  display: inline-flex;
  gap: 4px;
  margin: 2px 0 0;
  padding: 0;
}
.luxe-review-form-wrap .luxe-star {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  line-height: 0;
}
.luxe-review-form-wrap .luxe-star svg {
  width: 28px;
  height: 28px;
  fill: #e2e2e6;                       /* empty star */
  transition: fill .12s ease, transform .1s ease;
}
.luxe-review-form-wrap .luxe-star:hover svg { transform: scale(1.08); }
.luxe-review-form-wrap .luxe-star.on svg { fill: #FFB400; }   /* filled gold */
.luxe-review-form-wrap .luxe-star:focus-visible { outline: 2px solid var(--brand, #FF2D55); outline-offset: 2px; border-radius: 6px; }
.luxe-review-form-wrap .luxe-stars-error svg { fill: #f3b9c4; }   /* nudge: pick a rating */


/* ── Cookies consent / verification notices ── */
.luxe-review-form-wrap .comment-form-cookies-consent {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 4px;
}
.luxe-review-form-wrap .comment-form-cookies-consent input {
  width: auto;
  margin: 3px 0 0;
  flex-shrink: 0;
}
.luxe-review-form-wrap .comment-form-cookies-consent label {
  font-weight: 400;
  text-transform: none;
  letter-spacing: normal;
  font-size: 12.5px;
  color: var(--muted-2);
  margin: 0;
  line-height: 1.5;
}

/* ── Submit button ── matches .btn-add-cart / .btn-write-review ── */
.luxe-review-form-wrap .form-submit { margin: 8px 0 0; }
.luxe-review-form-wrap .form-submit input[type="submit"],
.luxe-review-form-wrap #submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 36px;
  background: var(--ink);
  color: #fff;
  border: 0;
  border-radius: var(--radius-pill);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .3px;
  cursor: pointer;
  transition: background .2s, transform .2s, box-shadow .2s;
  -webkit-appearance: none;
  appearance: none;
}
.luxe-review-form-wrap .form-submit input[type="submit"]:hover,
.luxe-review-form-wrap #submit:hover {
  background: var(--brand);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}
.luxe-review-form-wrap .form-submit input[type="submit"]:active,
.luxe-review-form-wrap #submit:active { transform: translateY(0); }

/* Hide the legacy "Cancel reply" link WP injects */
.luxe-review-form-wrap #cancel-comment-reply-link { display: none !important; }

/* "Verified buyer required" notice */
.luxe-review-form-wrap .luxe-review-restricted {
  font-size: 13.5px;
  color: var(--muted-2);
  line-height: 1.6;
  margin: 0;
  padding: 4px 0;
}

/* ── Mobile ── */
@media (max-width: 640px) {
  .luxe-review-form-wrap { padding: 22px 18px; margin-top: 24px; }
  .luxe-review-form-wrap .comment-reply-title { font-size: 16px; margin-bottom: 16px; }
  .luxe-review-form-wrap .comment-form-author,
  .luxe-review-form-wrap .comment-form-email { width: 100%; margin-right: 0; }
  .luxe-review-form-wrap .form-submit input[type="submit"],
  .luxe-review-form-wrap #submit { width: 100%; padding: 13px 24px; }
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║                                                                          ║
   ║   v3.8.0 — PDP GALLERY  FINAL OVERRIDE                  (2026-05-09)     ║
   ║   Reference: XStore × Woodmart commercial-theme PDP galleries.           ║
   ║                                                                          ║
   ║   This block is the source-of-truth for the PDP gallery. Earlier         ║
   ║   versions (v3.7.40 → v3.7.58 across styles.css and the early section    ║
   ║   of this file) are intentionally left in place — they get overridden    ║
   ║   here by source-order tiebreaker + matching specificity + !important.   ║
   ║                                                                          ║
   ║   Layout:                                                                ║
   ║     · Desktop (≥1024px) : [thumbs 92px] [main 1fr] — vertical column     ║
   ║     · Tablet  (768-1023): [thumbs 72px] [main 1fr] — narrower column     ║
   ║     · Mobile  (≤767)    : [main full]                                    ║
   ║                          [thumbs horizontal scroll + dots]               ║
   ║                                                                          ║
   ║   Decorations: badge top-left · counter bottom-right · fullscreen        ║
   ║   top-right · arrows on hover · 480px hover-zoom pane on desktop only.   ║
   ║                                                                          ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */


/* ── Gallery shell ─────────────────────────────────────────────────────── */

body[class] body.page-pdp .pdp-gallery,
body[class] body.single-product .pdp-gallery,
body[class] .pdp-gallery {
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  gap: 16px !important;
  align-items: start !important;     /* never stretch — that was the v3.7.58 bug */
  position: relative;
}


/* ── Main image — aspect-ratio locked, never overflows ─────────────────── */

body[class] body.page-pdp .pdp-main-img,
body[class] body.single-product .pdp-main-img,
body[class] .pdp-main-img {
  position: relative !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  aspect-ratio: 3 / 4 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background: linear-gradient(135deg, #FAFAFA 0%, #F2F2F4 100%) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  cursor: zoom-in !important;
  isolation: isolate;
  transition: box-shadow .3s ease;
}
body[class] body.page-pdp .pdp-main-img:hover,
body[class] body.single-product .pdp-main-img:hover {
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
}

body[class] body.page-pdp .pdp-main-img > #main-img,
body[class] body.single-product .pdp-main-img > #main-img,
body[class] body.page-pdp .pdp-main-img > img,
body[class] body.single-product .pdp-main-img > img,
body[class] .pdp-main-img > #main-img,
body[class] .pdp-main-img > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  z-index: 1;
  transition: opacity .25s ease, transform .9s cubic-bezier(.32,.08,.24,1);
}


/* ── Badge (top-left dot capsule) ──────────────────────────────────────── */

body[class] body.page-pdp .pdp-badge,
body[class] body.single-product .pdp-badge,
body[class] .pdp-badge {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 4;
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  padding: 5px 10px 5px 8px !important;
  background: var(--ink, #1D1D1F) !important;
  color: #fff !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase;
  border-radius: 100px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
  white-space: nowrap;
  pointer-events: none;
}
body[class] body.page-pdp .pdp-badge::before,
body[class] body.single-product .pdp-badge::before,
body[class] .pdp-badge::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--brand, #FF2D55);
  flex: 0 0 6px;
}


/* ── Counter (bottom-right) ────────────────────────────────────────────── */

body[class] body.page-pdp .pdp-counter,
body[class] body.single-product .pdp-counter,
body[class] .pdp-counter {
  position: absolute !important;
  right: 14px !important;
  bottom: 14px !important;
  top: auto !important;
  left: auto !important;
  z-index: 4;
  background: rgba(0, 0, 0, 0.55) !important;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 5px 12px !important;
  border-radius: 100px !important;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
  display: inline-flex !important;
  align-items: center;
  gap: 0;
}
body[class] .pdp-counter-sep { opacity: 0.55; padding: 0 2px; }


/* ── Fullscreen icon (top-right) ───────────────────────────────────────── */

body[class] .pdp-fullscreen {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.92) !important;
  -webkit-backdrop-filter: saturate(180%) blur(8px);
          backdrop-filter: saturate(180%) blur(8px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  border: 0 !important;
  cursor: pointer;
  display: grid !important;
  place-items: center;
  z-index: 4;
  opacity: 0;
  transition: opacity .28s ease, transform .16s ease;
  color: var(--ink, #1D1D1F);
  padding: 0 !important;
}
body[class] .pdp-main-img:hover .pdp-fullscreen { opacity: 1; }
body[class] .pdp-fullscreen:hover { transform: scale(1.06); background: #fff !important; }
body[class] .pdp-fullscreen svg { width: 14px; height: 14px; }


/* ── Arrows (left/right on main image) ─────────────────────────────────── */

body[class] body.page-pdp .pdp-arrow,
body[class] body.single-product .pdp-arrow,
body[class] .pdp-arrow {
  position: absolute !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.92) !important;
  -webkit-backdrop-filter: saturate(180%) blur(8px);
          backdrop-filter: saturate(180%) blur(8px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
  display: grid !important;
  place-items: center;
  color: var(--ink, #1D1D1F) !important;
  border: 0 !important;
  cursor: pointer;
  z-index: 4;
  opacity: 0;
  padding: 0 !important;
  transition: opacity .28s ease, transform .16s ease, background .16s ease;
}
body[class] .pdp-main-img:hover .pdp-arrow,
body[class] .pdp-arrow:focus-visible {
  opacity: 1;
}
body[class] .pdp-arrow:hover {
  background: #fff !important;
  transform: translateY(-50%) scale(1.06) !important;
}
body[class] .pdp-arrow:active {
  transform: translateY(-50%) scale(.96) !important;
}
body[class] .pdp-arrow-prev { left: 16px !important; right: auto !important; }
body[class] .pdp-arrow-next { right: 16px !important; left: auto !important; }
body[class] .pdp-arrow svg {
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  display: block;
}


/* ── Hover inner-zoom (desktop only) — v3.9.1 ──────────────────────────
   Image scales 2.5x INSIDE the main container; transform-origin tracks
   the cursor (set inline by JS). Container's overflow:hidden clips
   neatly to the rounded corners.

   Lens + zoom pane DOM nodes still exist in v3.8 markup but are hidden
   so the markup stays backward-compatible. */

body[class] .pdp-lens,
body[class] .pdp-zoom-pane,
.pdp-zoom-pane-floating { display: none !important; }

/* Inner-zoom: scale the actual <img> on hover, with origin tracking
   the cursor. Only on desktop (hover-capable) viewports ≥1024px. */
@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
  html body[class] .pdp-main-img.is-zooming > #main-img,
  html body[class] .pdp-main-img.is-zooming > img {
    transform: scale(2.5) !important;
    transition: transform .25s cubic-bezier(.32,.08,.24,1) !important;
    cursor: zoom-out !important;
    will-change: transform;
  }
  html body[class] .pdp-main-img:not(.is-zooming) > #main-img,
  html body[class] .pdp-main-img:not(.is-zooming) > img {
    transition: transform .35s cubic-bezier(.32,.08,.24,1),
                opacity .25s ease !important;
  }
}


/* ── Thumbnails column ─────────────────────────────────────────────────── */

html body[class] body.page-pdp .pdp-thumbs-wrap,
html body[class] body.single-product .pdp-thumbs-wrap,
html body[class] .pdp-thumbs-wrap {
  position: relative !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: start !important;
  width: 92px !important;
  max-width: 92px !important;
  /* v3.8.1: cap height defensively in case clip max-height escapes. */
  max-height: calc((92px + 10px) * 6 - 10px + 28px + 28px) !important;
}

html body[class] body.page-pdp .pdp-thumbs-clip,
html body[class] body.single-product .pdp-thumbs-clip,
html body[class] .pdp-thumbs-clip,
body[class] .pdp-thumbs-wrap > .pdp-thumbs-clip {
  /* v3.8.1: !important on every constraint to defeat any earlier rule. */
  overflow: hidden !important;
  position: relative !important;
  width: 100% !important;                                  /* fill parent (92px wrap) */
  max-width: 100% !important;
  /* Cap the clip to ~6 thumb rows so very long galleries scroll. */
  max-height: calc((92px + 10px) * 6 - 10px) !important;
  height: auto !important;
  -webkit-mask-image: linear-gradient(180deg,
    transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%) !important;
          mask-image: linear-gradient(180deg,
    transparent 0, #000 18px, #000 calc(100% - 18px), transparent 100%) !important;
}

html body[class] body.page-pdp .pdp-thumbs,
html body[class] body.single-product .pdp-thumbs,
html body[class] .pdp-thumbs {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  width: 100% !important;
  transition: transform .42s cubic-bezier(.76,0,.24,1);
  will-change: transform;
}

body[class] body.page-pdp .pdp-thumb,
body[class] body.single-product .pdp-thumb,
body[class] .pdp-thumb {
  flex: 0 0 92px !important;
  width: 92px !important;
  height: 92px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #F0F0F2;
  position: relative;
  border: 0 !important;
  cursor: pointer;
  padding: 0 !important;
  outline: 1px solid #E8E8ED;
  outline-offset: 0;
  transition: transform .16s ease;
  margin: 0 !important;
  box-shadow: none !important;
}
body[class] .pdp-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  transition: transform .28s cubic-bezier(.32,.08,.24,1), opacity .28s ease;
  opacity: 1;
}
body[class] .pdp-thumb:hover {
  transform: none !important;
}
body[class] .pdp-thumb:hover img {
  transform: scale(1.06);
}
body[class] .pdp-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 2px solid transparent;
  transition: border-color .16s ease;
  pointer-events: none;
}
body[class] .pdp-thumb.on::after,
body[class] .pdp-thumb.is-active::after {
  border-color: var(--brand, #FF2D55);
}
body[class] .pdp-thumb.on,
body[class] .pdp-thumb.is-active {
  outline-color: transparent;
}


/* ── Thumb scroll buttons (top/bottom) ─────────────────────────────────── */

body[class] .pdp-thumbs-nav {
  position: absolute;
  left: 0;
  right: 0;
  height: 28px;
  display: none;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, var(--bg, #F5F5F7), rgba(245,245,247,0));
  z-index: 2;
  color: var(--ink-2, #3a3a3c);
  border: 0;
  cursor: pointer;
  transition: color .16s ease, opacity .16s ease;
  padding: 0;
}
body[class] .pdp-thumbs-nav.top    { top: 0; }
body[class] .pdp-thumbs-nav.bottom {
  top: auto;
  bottom: 0;
  background: linear-gradient(0deg, var(--bg, #F5F5F7), rgba(245,245,247,0));
}
body[class] .pdp-thumbs-wrap[data-overflow="1"] .pdp-thumbs-nav { display: flex; }
body[class] .pdp-thumbs-wrap.at-start .pdp-thumbs-nav.top    { opacity: .25; pointer-events: none; }
body[class] .pdp-thumbs-wrap.at-end   .pdp-thumbs-nav.bottom { opacity: .25; pointer-events: none; }
body[class] .pdp-thumbs-nav:hover { color: var(--brand, #FF2D55); }
body[class] .pdp-thumbs-nav svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }


/* ── Mobile dot indicator (default hidden) ─────────────────────────────── */

body[class] .pdp-dots { display: none; }


/* ── Placeholder when product has no images ────────────────────────────── */

body[class] .pdp-main-placeholder {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #FFE5EC 0%, #FFB3C8 50%, #FF8FAA 100%);
  color: var(--ink, #1D1D1F);
  z-index: 1;
}
body[class] .pdp-main-placeholder-brand {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 3px;
  margin-top: 16px;
  opacity: 0.4;
}
body[class] .pdp-main-placeholder-name {
  font-size: 11px;
  opacity: 0.3;
  margin-top: 4px;
  letter-spacing: 1px;
}


/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║   TABLET    768 ~ 1023 px                                                ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

@media (min-width: 768px) and (max-width: 1023.98px) {
  body[class] body.page-pdp .pdp-gallery,
  body[class] body.single-product .pdp-gallery,
  body[class] .pdp-gallery {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 12px !important;
  }
  body[class] body.page-pdp .pdp-thumbs-wrap,
  body[class] body.single-product .pdp-thumbs-wrap,
  body[class] .pdp-thumbs-wrap { width: 72px !important; }
  body[class] body.page-pdp .pdp-thumb,
  body[class] body.single-product .pdp-thumb,
  body[class] .pdp-thumb {
    flex-basis: 72px !important;
    width: 72px !important;
    height: 72px !important;
  }
  html body[class] body.page-pdp .pdp-thumbs-clip,
  html body[class] body.single-product .pdp-thumbs-clip,
  html body[class] .pdp-thumbs-clip {
    max-height: calc((72px + 10px) * 6 - 10px) !important;
    width: 100% !important;
  }
  body[class] .pdp-zoom-pane,
  body[class] .pdp-lens { display: none !important; }
}


/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║   MOBILE    ≤ 767 px                                                     ║
   ║   Main image full-width on top, thumbs become a horizontal scroll        ║
   ║   strip beneath, with a dot indicator below them.                        ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

@media (max-width: 767.98px) {
  /* v3.8.2: every selector here uses `html body[class]` to match the
     desktop bump applied in v3.8.1 — otherwise desktop rules outrank
     these on mobile and break flex-direction:row, etc. */

  html body[class] body.page-pdp .pdp-gallery,
  html body[class] body.single-product .pdp-gallery,
  html body[class] .pdp-gallery {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto !important;
    gap: 10px !important;
  }
  html body[class] body.page-pdp .pdp-main-img,
  html body[class] body.single-product .pdp-main-img,
  html body[class] .pdp-main-img {
    grid-column: 1 !important;
    grid-row: 1 !important;
    border-radius: 16px !important;
    cursor: default !important;
  }

  html body[class] body.page-pdp .pdp-thumbs-wrap,
  html body[class] body.single-product .pdp-thumbs-wrap,
  html body[class] .pdp-thumbs-wrap {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
  }
  html body[class] body.page-pdp .pdp-thumbs-clip,
  html body[class] body.single-product .pdp-thumbs-clip,
  html body[class] .pdp-thumbs-clip {
    max-height: none !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* v3.8.4: mask-image removed on mobile — was fading the leftmost /
       rightmost thumbs too aggressively. Native horizontal scroll
       already gives a visual cue that there's more content offscreen. */
    -webkit-mask-image: none !important;
            mask-image: none !important;
  }
  html body[class] .pdp-thumbs-clip::-webkit-scrollbar { display: none; }

  /* THE CRITICAL FIX: thumbs row layout on mobile. */
  html body[class] body.page-pdp .pdp-thumbs,
  html body[class] body.single-product .pdp-thumbs,
  html body[class] .pdp-thumbs {
    flex-direction: row !important;
    gap: 8px !important;
    transform: none !important;
    width: auto !important;             /* let it grow with content */
  }
  html body[class] body.page-pdp .pdp-thumb,
  html body[class] body.single-product .pdp-thumb,
  html body[class] .pdp-thumb {
    flex: 0 0 64px !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 10px !important;
  }

  /* v3.9.6: arrows visible on mobile — users requested they don't
     have to rely on swipe alone. Keep zoom-pane / lens hidden (those
     are desktop-only hover features). */
  html body[class] .pdp-fullscreen,
  html body[class] .pdp-zoom-pane,
  html body[class] .pdp-lens,
  html body[class] .pdp-thumbs-nav { display: none !important; }

  /* Arrows on mobile: smaller, tighter to edges, semi-transparent.
     v3.9.9: z-index above main-img + video to prevent edge cases. */
  html body[class] .pdp-arrow {
    opacity: 1 !important;
    width: 38px !important;
    height: 38px !important;
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 6 !important;
  }
  html body[class] .pdp-arrow-prev { left: 10px !important; }
  html body[class] .pdp-arrow-next { right: 10px !important; }
  html body[class] .pdp-arrow svg {
    width: 16px !important;
    height: 16px !important;
  }

  html body[class] .pdp-dots {
    grid-column: 1 !important;
    grid-row: 3 !important;
    display: flex !important;
    justify-content: center;
    gap: 6px;
    margin-top: 4px;
  }
  html body[class] .pdp-dots span {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--muted-3, #AEAEB2);
    cursor: pointer;
    transition: width .16s ease, background .16s ease;
  }
  html body[class] .pdp-dots span.on {
    width: 18px;
    background: var(--brand, #FF2D55);
    border-radius: 6px;
  }

  html body[class] body.page-pdp .pdp-badge,
  html body[class] body.single-product .pdp-badge,
  html body[class] .pdp-badge {
    top: 12px !important;
    left: 12px !important;
    font-size: 10px !important;
    padding: 4px 10px !important;
  }
}


/* ── Reduced-motion preference ─────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  body[class] .pdp-gallery *,
  body[class] .lightbox * {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}


/* ── Lightbox — kept compatible with v3.7.x markup but cleaned up ──────── */

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(20, 20, 22, 0.96);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: stretch;
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s ease, visibility .28s ease;
}
.lightbox.on {
  opacity: 1;
  visibility: visible;
}
.lightbox .lb-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border: 0;
  cursor: pointer;
  display: grid;
  place-items: center;
  z-index: 5;
  transition: background .16s ease;
}
.lightbox .lb-close:hover { background: rgba(255, 255, 255, 0.2); }
.lightbox .lb-close svg { width: 20px; height: 20px; }
.lightbox .lb-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border: 0;
  cursor: pointer;
  display: grid;
  place-items: center;
  z-index: 5;
  transition: background .16s ease, transform .16s ease;
}
.lightbox .lb-nav:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-50%) scale(1.06);
}
.lightbox .lb-nav svg { width: 22px; height: 22px; }
.lightbox .lb-prev { left: 24px; }
.lightbox .lb-next { right: 24px; }
.lightbox .lb-stage {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 80px 16px;
  cursor: zoom-in;
  overflow: hidden;
}
.lightbox.lb-zoomed .lb-stage  { cursor: grab; }
.lightbox.lb-dragging .lb-stage { cursor: grabbing; }
.lightbox .lb-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 16px;
  user-select: none;
  -webkit-user-drag: none;
  transform-origin: center center;
  will-change: transform;
}
.lightbox .lb-counter {
  position: absolute;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
  z-index: 5;
}
.lightbox .lb-num { font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.lightbox .dots {
  display: flex;
  gap: 6px;
  align-items: center;
}
.lightbox .dots .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  border: 0;
  cursor: pointer;
  padding: 0;
  transition: width .16s ease, background .16s ease;
}
.lightbox .dots .dot.on {
  width: 18px;
  background: #fff;
  border-radius: 6px;
}

@media (max-width: 767.98px) {
  .lightbox .lb-stage { padding: 60px 16px 80px; }
  .lightbox .lb-nav { display: none; }
  .lightbox .lb-close { top: 14px; right: 14px; }
}


/* ════════ v3.9.6 — Video-main (cleaned up Taobao-style) ════════ */

/* Wrapper background fills letterbox bars when video aspect != 1:1 */
.pdp-main-img.has-video { background: #000; }

/* Both <video> and <img> share the same absolute box so switching is
   instant and they keep the wrapper's rounded corners. */
.pdp-main-img .pdp-main-video,
.pdp-main-img.has-video #main-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: #000;
}

/* video uses contain (no crop) — img keeps cover behaviour as before. */
.pdp-main-img .pdp-main-video {
  object-fit: contain;
  z-index: 2;
  display: block;
}

/* When the active item is an image, hide the <video>. */
.pdp-main-img[data-active-type="image"] .pdp-main-video,
.pdp-main-img[data-active-type="image"] #video-controls {
  display: none !important;
}
.pdp-main-img[data-active-type="video"] #main-img {
  visibility: hidden;
}

/* v3.9.8: when video is active, hide every PDP system overlay so it
   doesn't compete with our video controls for the same corners.
   Restored automatically when user clicks an image thumb. */
.pdp-main-img[data-active-type="video"] .pdp-fullscreen,
.pdp-main-img[data-active-type="video"] .pdp-counter,
.pdp-main-img[data-active-type="video"] .pdp-arrow,
.pdp-main-img[data-active-type="video"] .pdp-zoom-pane,
.pdp-main-img[data-active-type="video"] .pdp-lens,
.pdp-main-img[data-active-type="video"] .pdp-badge {
  display: none !important;
}

/* ── Video control overlay ── */
.pdp-video-controls {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.pdp-video-controls.is-visible {
  opacity: 1;
}
.pdp-video-controls > * { pointer-events: auto; }

/* v3.9.12: button styles are now INLINE in the PHP template
   (woocommerce/content-single-product.php) so they cannot be
   overridden. CSS here only handles :hover and the play/pause +
   mute icon-swap states (which inline styles can't express). */

/* Hover deepens the circle. Inline style sets base .3 opacity; we
   override on hover. !important still needed to beat cached rules. */
.pdp-video-btn:hover {
  background: rgba(0, 0, 0, 0.55) !important;
}
.pdp-video-btn:active {
  transform: scale(0.92) !important;
}

/* v3.9.12: positions are inline in the PHP template now. */

/* Play/Pause icon swap */
.pdp-video-playpause .ico-pause { display: block; }
.pdp-video-playpause .ico-play  { display: none; }
.pdp-video-playpause:not(.is-playing) .ico-pause { display: none; }
.pdp-video-playpause:not(.is-playing) .ico-play  { display: block; }

/* Mute icon swap */
.pdp-video-mute .ico-muted   { display: block; }
.pdp-video-mute .ico-unmuted { display: none; }
.pdp-video-mute:not(.is-muted) .ico-muted   { display: none; }
.pdp-video-mute:not(.is-muted) .ico-unmuted { display: block; }

/* ── Thumb strip — video thumb (▶ overlay) ── */
.pdp-thumb.pdp-thumb-video {
  position: relative;
  background: #000;
}
.pdp-thumb.pdp-thumb-video img {
  opacity: 0.65;
  transition: opacity 0.18s ease;
}
.pdp-thumb.pdp-thumb-video:hover img,
.pdp-thumb.pdp-thumb-video.on img {
  opacity: 0.92;
}
.pdp-thumb-video-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  color: #fff;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.45));
}
.pdp-thumb-video-icon svg { width: 28px; height: 28px; }

/* ── Lightbox video ── */
.lightbox .lb-video {
  display: block;
  max-width: 100%;
  max-height: 100%;
  background: #000;
  border-radius: 4px;
}

/* v3.9.12: mobile-specific size reduction. Inline styles set 44px;
   we shrink on mobile via !important class rule (still beats cache). */
@media (max-width: 1023.98px) {
  .pdp-video-btn {
    width: 38px !important;
    height: 38px !important;
  }
  .pdp-video-btn svg {
    width: 18px !important;
    height: 18px !important;
  }
  .pdp-video-close      { top: 10px !important; right: 10px !important; left: auto !important; }
  .pdp-video-bottom-bar { bottom: 10px !important; right: 10px !important; gap: 8px !important; }
}
/* End v3.9.6 */

/* ── Review "load more" loading dots ─────────────────────────────── */
.rc-loading { display:none; align-items:center; justify-content:center; gap:7px; padding:10px 0; }
.rc-loading span { width:9px; height:9px; border-radius:50%; background:var(--accent,#FF2D55); opacity:.35; animation:rcDot 1s infinite ease-in-out; }
.rc-loading span:nth-child(2) { animation-delay:.15s; }
.rc-loading span:nth-child(3) { animation-delay:.3s; }
.rc-loading em { font-style:normal; font-size:13px; color:var(--muted-2,#888); margin-left:6px; }
@keyframes rcDot { 0%,80%,100%{ opacity:.25; transform:scale(.8); } 40%{ opacity:1; transform:scale(1); } }


/* ===== Review-card (.rc-*) rules — consolidated here from styles.css =====
   .rc-* renders ONLY on the product page, and this stylesheet loads only on
   product pages, so pdp.css is now the single source of truth for review cards.
   Original selectors are preserved so specificity is unchanged (they still
   out-rank the global PDP button/link resets exactly as before). ===== */
body.page-pdp .rc-author {display:flex; align-items:center; gap:10px; margin-bottom:11px; min-width:0; }
body.page-pdp .rc-name {font-size:13.5px; font-weight:600; color:var(--ink); line-height:1.2; }
body.page-pdp .rc-headline {display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:5px; }
body.page-pdp .rc-stars {color:#FFCC00; font-size:14px; letter-spacing:1.5px; flex-shrink:0; }
body.page-pdp .rc-stars .empty {color:var(--line); }
body.page-pdp .rc-title {font-size:14.5px; font-weight:700; color:var(--ink);
  letter-spacing:-.1px; line-height:1.35; margin:0; }
body.page-pdp .rc-meta {font-size:12px; color:var(--muted-3); margin-bottom:11px; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
body.page-pdp .rc-verified {color:#067D62; font-weight:600; display:inline-flex; align-items:center; gap:4px; }
body.page-pdp .rc-verified svg {width:12px; height:12px; }
body.page-pdp .rc-dot {color:var(--line); }
body.page-pdp .rc-date {color:var(--muted-3); }
body.page-pdp .rc-body {font-size:13.5px; line-height:1.65; color:var(--muted);
  margin-bottom:14px; flex:1; }
body.page-pdp .rc-body p {margin:0 0 10px; }
body.page-pdp .rc-body p:last-child {margin-bottom:0; }
body.page-pdp .rc-avatar {width:32px; height:32px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:var(--ink);
  letter-spacing:.5px; flex-shrink:0;
  text-shadow:0 1px 2px rgba(255,255,255,.4); }
body.page-pdp .rc-helpful-row {display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding-top:13px; border-top:1px solid var(--line-soft); }
body.page-pdp .rc-helpful-count {font-size:12px; color:var(--muted-2); }
body.page-pdp .rc-helpful {display:inline-flex; align-items:center; gap:6px;
  font-size:12px; color:var(--muted-2); font-weight:500;
  padding:7px 14px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff; cursor:pointer;
  transition:color .15s,border-color .15s,background .15s; }
body.page-pdp .rc-helpful svg {width:13px; height:13px; }
body.page-pdp .rc-helpful:hover {color:var(--ink); border-color:var(--ink); }
body.page-pdp .rc-helpful.is-voted {color:#067D62; border-color:#067D62; background:#f0faf6; cursor:default; }
:is(body.page-pdp, body.single-product) .rc-author {display:flex; align-items:center; gap:10px; margin-bottom:11px; min-width:0; }
:is(body.page-pdp, body.single-product) .rc-name {font-size:13.5px; font-weight:600; color:var(--ink); line-height:1.2; }
:is(body.page-pdp, body.single-product) .rc-headline {display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:5px; }
:is(body.page-pdp, body.single-product) .rc-stars {color:#FFCC00; font-size:14px; letter-spacing:1.5px; flex-shrink:0; }
:is(body.page-pdp, body.single-product) .rc-stars .empty {color:var(--line); }
:is(body.page-pdp, body.single-product) .rc-title {font-size:14.5px; font-weight:700; color:var(--ink);
  letter-spacing:-.1px; line-height:1.35; margin:0; }
:is(body.page-pdp, body.single-product) .rc-meta {font-size:12px; color:var(--muted-3); margin-bottom:11px; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
:is(body.page-pdp, body.single-product) .rc-verified {color:#067D62; font-weight:600; display:inline-flex; align-items:center; gap:4px; }
:is(body.page-pdp, body.single-product) .rc-verified svg {width:12px; height:12px; }
:is(body.page-pdp, body.single-product) .rc-dot {color:var(--line); }
:is(body.page-pdp, body.single-product) .rc-date {color:var(--muted-3); }
:is(body.page-pdp, body.single-product) .rc-body {font-size:13.5px; line-height:1.65; color:var(--muted);
  margin-bottom:14px; flex:1; }
:is(body.page-pdp, body.single-product) .rc-body p {margin:0 0 10px; }
:is(body.page-pdp, body.single-product) .rc-body p:last-child {margin-bottom:0; }
:is(body.page-pdp, body.single-product) .rc-avatar {width:32px; height:32px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:var(--ink);
  letter-spacing:.5px; flex-shrink:0;
  text-shadow:0 1px 2px rgba(255,255,255,.4); }
:is(body.page-pdp, body.single-product) .rc-helpful-row {display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding-top:13px; border-top:1px solid var(--line-soft); }
:is(body.page-pdp, body.single-product) .rc-helpful-count {font-size:12px; color:var(--muted-2); }
:is(body.page-pdp, body.single-product) .rc-helpful {display:inline-flex; align-items:center; gap:6px;
  font-size:12px; color:var(--muted-2); font-weight:500;
  padding:7px 14px; border-radius:var(--radius-pill);
  border:1px solid var(--line); background:#fff; cursor:pointer;
  transition:color .15s,border-color .15s,background .15s; }
:is(body.page-pdp, body.single-product) .rc-helpful svg {width:13px; height:13px; }
:is(body.page-pdp, body.single-product) .rc-helpful:hover {color:var(--ink); border-color:var(--ink); }
:is(body.page-pdp, body.single-product) .rc-helpful.is-voted {color:#067D62; border-color:#067D62; background:#f0faf6; cursor:default; }
:is(body.page-pdp, body.single-product) .rc-media-item {background-color:#f2f2f2; border:1px solid var(--line-soft); }
:is(body.page-pdp, body.single-product) .rc-media-vid {background:linear-gradient(135deg,#2a2a2e,#000); color:#fff; }
:is(body.page-pdp, body.single-product) .rc-lb-nav {background:rgba(255,255,255,.92); color:#1a1a1a; }
:is(body.page-pdp, body.single-product) .rc-lb-nav:hover {background:#fff; }
:is(body.page-pdp, body.single-product) .rc-lb-close {background:rgba(255,255,255,.16); color:#fff; }
:is(body.page-pdp, body.single-product) .rc-lb-close:hover {background:rgba(255,255,255,.32); }
:is(body.page-pdp, body.single-product) .rc-report {color:var(--muted-3); }
:is(body.page-pdp, body.single-product) .rc-report:hover {color:var(--muted); background:var(--bg); }
@media (max-width:768px) {
  body.page-pdp .rc-helpful {padding:6px 10px; font-size:11px; }
  :is(body.page-pdp, body.single-product) .rc-helpful {padding:6px 10px; font-size:11px; }
}

/* Lazy-loaded review thumbnail image (native loading=lazy) fills its button. */
.rc-media-img img { width:100%; height:100%; object-fit:contain; display:block; }

/* ════════════════════════════════════════════════════════════
   Custom Options (made-to-order add-ons)  — .pdp-addons
   Structural defaults; refine visuals to taste.
   ════════════════════════════════════════════════════════════ */
.pdp-addons{margin:18px 0 4px;display:flex;flex-direction:column;gap:14px}
.pdp-addon-group{display:flex;flex-direction:column;gap:7px}
.pdp-addon-label{font-size:13px;font-weight:600;letter-spacing:.01em;color:var(--ink,#1d1d1f)}
.pdp-addon-req{color:#c0392b;font-weight:700}
.pdp-addon-select{width:100%;padding:11px 40px 11px 14px;border:1px solid var(--line,#e3e3e6);border-radius:12px;background-color:#fff;font-size:14px;color:inherit;-webkit-appearance:none;appearance:none;cursor:pointer;background-repeat:no-repeat;background-position:right 14px center;background-size:16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E")}
.pdp-addon-select:focus{outline:none;border-color:#b76e79}
.pdp-addon-radios{display:flex;flex-wrap:wrap;gap:8px}
.pdp-addon-radio{position:relative;display:inline-flex}
.pdp-addon-radio input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.pdp-addon-radio span{display:inline-flex;align-items:center;white-space:nowrap;padding:9px 16px;border:1px solid var(--line,#e3e3e6);border-radius:22px;font-size:13px;line-height:1.2;cursor:pointer;transition:border-color .15s ease,background .15s ease,color .15s ease}
.pdp-addon-radio input:checked + span{border-color:#1d1d1f;background:#1d1d1f;color:#fff}
.pdp-addon-radio input:focus-visible + span{outline:2px solid #b76e79;outline-offset:2px}
/* Defensive: never let the global WC price styling (red <ins>, struck <del>,
 * nested .woocommerce-Price-amount boxes) leak into an add-on pill. The price
 * here is plain text baked into the label. */
.pdp-addon-radio span del,.pdp-addon-radio span ins,
.pdp-addon-radio .woocommerce-Price-amount{all:unset;font:inherit;color:inherit}

/* ============================================================================
   v5.9.17 — PDP review form: single star rating only
   WooCommerce's review JS injects its own <p class="stars"> before #rating at
   runtime (client-side), producing a second, inert star row next to the
   theme's accessible .luxe-stars control. A server-side strip can't remove a
   client-injected node, so hide it here. .luxe-stars remains the sole rating
   input and still writes the hidden #rating value on click.
   ============================================================================ */
.comment-form-rating.luxe-rating p.stars,
.luxe-rating p.stars { display: none !important; }