/** Shopify CDN: Minification failed

Line 9846:36 Expected identifier but found whitespace
Line 9846:38 Unexpected "{"
Line 9846:47 Expected ":"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:announcement-bar (INDEX:0) */
.announcement-bar {
  background: #262320;
  color: rgba(255, 255, 255, 0.9);
  text-align: center;
  padding: 6px 12px;
  font-size: 12px;
  line-height: 1.4;
  position: relative;
  z-index: 60;
}

.announcement-bar__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  max-width: 1280px;
  margin: 0 auto;
}

.announcement-bar__slides {
  flex: 1;
  min-width: 0;
  position: relative;
  overflow: hidden;
}

.announcement-bar__slide {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease;
  pointer-events: none;
}
.announcement-bar__slide--active {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
  position: relative;
}
/* Exit left (next arrow clicked — content slides out to the left) */
.announcement-bar__slide--exit-left {
  opacity: 0;
  transform: translateX(-100%);
}
/* Enter from right (next arrow — new content slides in from the right) */
.announcement-bar__slide--enter-from-right {
  transform: translateX(100%);
  opacity: 0;
}
/* Enter from left (prev arrow — new content slides in from the left) */
.announcement-bar__slide--enter-from-left {
  transform: translateX(-100%);
  opacity: 0;
}

.announcement-bar__message {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  justify-content: center;
}

.announcement-bar__text {
  color: inherit;
}

/* Link text — bold + underlined, appears inline after message */
.announcement-bar__link {
  color: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
  transition: opacity 0.15s;
}
.announcement-bar__link:hover {
  opacity: 0.8;
  text-decoration: underline;
}

/* Arrow buttons — inline next to text, compact */
.announcement-bar__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border: none;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  cursor: pointer;
  color: inherit;
  opacity: 0.5;
  transition: opacity 0.15s, background 0.15s;
  flex-shrink: 0;
  padding: 0;
  vertical-align: middle;
}
.announcement-bar__arrow:hover {
  opacity: 1;
  background: rgba(255, 255, 255, 0.2);
}

@media (min-width: 640px) {
  .announcement-bar { padding: 6px 16px; }
}
/* END_SECTION:announcement-bar */

/* START_SECTION:best-sellers (INDEX:2) */
/* ── HP Best Sellers ── */
.hp-bestsellers {
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 2.5rem var(--space-md);
  overflow: hidden;
}

.hp-bestsellers__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-xl);
}

.hp-bestsellers__title {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 600;
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
  margin: 0;
}

.hp-bestsellers__view-all {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  font-size: var(--font-size-sm);
  font-weight: 600;
  text-decoration: none;
  color: var(--color-text);
  transition: opacity 0.2s ease;
}

.hp-bestsellers__view-all:hover { opacity: 0.7; }

/* Desktop scroll */
.hp-bestsellers__scroll-wrap {
  position: relative;
}

/* ── Gradient fades ── */
.hp-bestsellers__fade {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 3rem;
  z-index: 2;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.hp-bestsellers__fade--left {
  left: 0;
  background: linear-gradient(to right, var(--section-bg, #fff), transparent);
}
.hp-bestsellers__fade--right {
  right: 0;
  background: linear-gradient(to left, var(--section-bg, #fff), transparent);
}

.hp-bestsellers__track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.5rem;
}

.hp-bestsellers__track::-webkit-scrollbar { display: none; }

.hp-bestsellers__item {
  flex: 0 0 auto;
  scroll-snap-align: start;
}

.hp-bestsellers__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: box-shadow 0.2s ease, opacity 0.2s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.hp-bestsellers__arrow:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}

.hp-bestsellers__arrow--prev { left: -0.75rem; }
.hp-bestsellers__arrow--next { right: -0.75rem; }

.hp-bestsellers__arrow:disabled {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

/* Mobile grid */
.hp-bestsellers__grid {
  display: none;
}

.hp-bestsellers__footer {
  text-align: center;
  margin-top: var(--space-xl);
}

/* Desktop: show scroll, hide grid */
@media (min-width: 768px) {
  .hp-bestsellers__view-all--mobile { display: none; }
  .hp-bestsellers__grid { display: none; }
  .hp-bestsellers__scroll-wrap { display: block; }
}

/* Mobile: show grid, hide scroll */
@media (max-width: 767px) {
  .hp-bestsellers__scroll-wrap { display: none; }
  .hp-bestsellers__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
  .hp-bestsellers__view-all--desktop { display: none; }
  .hp-bestsellers__footer { display: block; }
  .hp-bestsellers__arrow { display: none; }
}
/* END_SECTION:best-sellers */

/* START_SECTION:cart-drawer (INDEX:4) */
/* ══════════════════════════════════════════
   CART DRAWER — On-brand CRO Styles
   ══════════════════════════════════════════ */

/* ── Backdrop ── */
.nf-cart-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,0.45);
  z-index: 998; opacity: 0; transition: opacity 0.3s ease;
  cursor: pointer;
}
.nf-cart-backdrop[hidden] { display: none; }
.nf-cart-backdrop.is-visible { opacity: 1; }

/* ── Drawer Shell ── */
.nf-cart-drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: 460px; max-width: 100vw;
  background: #fff; z-index: 999;
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  font-family: var(--font-body, 'Inter', sans-serif);
  box-shadow: -8px 0 30px rgba(0,0,0,0.12);
  overscroll-behavior: contain;
}
.nf-cart-drawer.is-open { transform: translateX(0); }

/* ── Header ── */
.nf-cart-drawer__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
}
.nf-cart-drawer__header-left { display: flex; align-items: center; gap: 8px; }
.nf-cart-drawer__title { font-size: 16px; font-weight: 700; color: #262320; margin: 0; }
.nf-cart-drawer__count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 22px; height: 22px; padding: 0 6px;
  background: #262320; color: #fff;
  font-size: 11px; font-weight: 700; border-radius: var(--radius-button);
}
.nf-cart-drawer__close {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 50%;
  background: #F3F1E9; border: none; cursor: pointer;
  color: #555; transition: all 0.15s;
}
.nf-cart-drawer__close:hover { background: #eee; color: #262320; }

/* ── Free Shipping Bar ── */
.nf-cart-drawer__shipping-bar {
  padding: 12px 20px;
  background: #f9f9f7;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
}
.nf-cart-drawer__shipping-bar.is-qualified { background: #f0faf0; }
.nf-cart-drawer__shipping-bar.is-empty-cart {
  padding: 10px 20px;
  background: transparent;
  border-bottom: none;
}
.nf-cart-drawer__shipping-bar.is-empty-cart .nf-cart-drawer__shipping-progress { display: none; }
.nf-cart-drawer__shipping-bar.is-empty-cart .nf-cart-drawer__shipping-text { margin: 0; justify-content: center; }
.nf-cart-drawer__shipping-progress {
  width: 100%; height: 6px; background: #e5e5e5;
  border-radius: 999px; overflow: hidden;
}
.nf-cart-drawer__shipping-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #E16C47, #3ec232);
  transition: width 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.nf-cart-drawer__shipping-text {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: #555; margin: 8px 0 0;
}
.nf-cart-drawer__shipping-text svg { flex-shrink: 0; color: #E16C47; }
.nf-cart-drawer__shipping-bar.is-qualified .nf-cart-drawer__shipping-text { color: #E16C47; }
.nf-cart-drawer__shipping-timer {
  display: inline-flex; align-items: center; gap: 3px;
  margin-left: auto;
  color: #E16C47;
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  flex-shrink: 0;
}
.nf-cart-drawer__shipping-timer svg { color: #E16C47; }

/* ── Items Container ── */
.nf-cart-drawer__items {
  flex: 1; overflow-y: auto; padding: 0;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
/* Scroll fade gradient — bottom edge indicator */
.nf-cart-drawer__items-wrap {
  flex: 1; position: relative; overflow: hidden;
  display: flex; flex-direction: column;
}
.nf-cart-drawer__items-wrap::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 48px;
  background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.95));
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  transition: opacity 0.3s;
}
.nf-cart-drawer__items-wrap.has-overflow::after {
  opacity: 1;
}

/* ── Empty State Trust Bar (under shipping bar) ── */
.nf-cart-drawer__empty-trust {
  display: flex; align-items: center; justify-content: center;
  gap: 0; padding: 10px 20px;
  background: #f9f9f7; border-bottom: 1px solid #eee;
  flex-shrink: 0;
  /* Horizontal scroll on narrow screens instead of wrapping/clipping */
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.nf-cart-drawer__empty-trust::-webkit-scrollbar { display: none; }
.nf-cart-drawer__empty-trust[hidden] { display: none; }
.nf-cart-drawer__empty-trust-row {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 500; color: #555;
  white-space: nowrap; flex-shrink: 0;
}
.nf-cart-drawer__empty-trust-sep {
  width: 1px; height: 12px; background: #ddd; margin: 0 10px; flex-shrink: 0;
}

/* ── Empty State — simple centered message + CTA ── */
.nf-cart-drawer__empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.25rem;
  box-sizing: border-box;
}
.nf-cart-drawer__empty[hidden] { display: none; }
.nf-cart-drawer__empty-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  max-width: 320px;
  width: 100%;
}
.nf-cart-drawer__empty-icon {
  margin-bottom: 6px;
  opacity: 0.9;
}
.nf-cart-drawer__empty-heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: 1.125rem;
  color: #262320;
  letter-spacing: -0.01em;
  margin: 0;
}
.nf-cart-drawer__empty-sub {
  font-size: 0.875rem;
  color: rgba(38, 35, 32, 0.6);
  margin: 0 0 12px;
}
.nf-cart-drawer__empty-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 32px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
  font-weight: 600;
  color: #fff;
  background: #E16C47;
  border-radius: 9999px;
  text-decoration: none;
  transition: background 0.2s, transform 0.2s;
}
.nf-cart-drawer__empty-cta:hover {
  background: #c9563a;
  transform: translateY(-1px);
  text-decoration: none;
}

/* ── Product Discovery Tabs ── */
.nf-cart-drawer__discover {
  display: flex; flex-direction: column;
  align-items: center;
  padding: 0;
}
.nf-cart-drawer__discover-tabs {
  display: inline-flex; gap: 0;
  margin: 4px auto 10px;
  background: var(--color-primary, #262320);
  border-radius: var(--radius-button);
  padding: 3px; flex-shrink: 0;
}
.nf-cart-drawer__discover-tab {
  padding: 6px 16px;
  font-size: 11px; font-weight: 600;
  color: rgba(255,255,255,0.55); background: transparent;
  border: none; border-radius: var(--radius-button);
  cursor: pointer; font-family: inherit;
  transition: all 0.2s ease;
  text-align: center; white-space: nowrap;
}
.nf-cart-drawer__discover-tab.is-active {
  background: #fff; color: #262320;
}
.nf-cart-drawer__discover-tab:hover:not(.is-active) { color: rgba(255,255,255,0.85); }

/* Panels */
.nf-cart-drawer__discover-panel {
  width: 100%; display: flex; flex-direction: column;
}
.nf-cart-drawer__discover-panel[hidden] { display: none; }

/* Scroll wrapper with side gradients */
.nf-cart-drawer__discover-scroll-wrap {
  position: relative;
}
.nf-cart-drawer__discover-grad {
  position: absolute; top: 0; bottom: 0; width: 32px;
  pointer-events: none; z-index: 2;
  transition: opacity 0.2s ease;
}
.nf-cart-drawer__discover-grad--left {
  left: 0;
  background: linear-gradient(to right, #fff 0%, transparent 100%);
  opacity: 0;
}
.nf-cart-drawer__discover-grad--left.is-visible { opacity: 1; }
.nf-cart-drawer__discover-grad--right {
  right: 0;
  background: linear-gradient(to left, #fff 0%, transparent 100%);
}
.nf-cart-drawer__discover-grad--right.is-hidden { opacity: 0; }

.nf-cart-drawer__discover-scroll {
  display: flex; gap: 10px;
  overflow-x: auto; overflow-y: hidden;
  padding: 4px 20px 8px 20px;
  scroll-snap-type: x proximity;
  scroll-padding-left: 20px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  align-items: flex-start;
}
.nf-cart-drawer__discover-scroll::-webkit-scrollbar { display: none; }

/* Nav: arrows + dots */
.nf-cart-drawer__discover-nav {
  display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 4px 0; flex-shrink: 0;
}
.nf-cart-drawer__discover-arrow {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  border: 1px solid #e0e0e0; background: #fff;
  cursor: pointer; color: #555; transition: all 0.15s;
}
.nf-cart-drawer__discover-arrow:hover { border-color: #262320; color: #262320; }
.nf-cart-drawer__discover-arrow:disabled { opacity: 0.3; cursor: default; }
.nf-cart-drawer__discover-dots {
  display: flex; gap: 4px; align-items: center;
}
.nf-cart-drawer__discover-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: #ddd; border: none; padding: 0; cursor: pointer;
  transition: all 0.2s;
}
.nf-cart-drawer__discover-dot.is-active {
  background: #262320; width: 16px; border-radius: 3px;
}

/* Discovery Card */
.nf-cart-drawer__discover-card {
  display: flex; flex-direction: column;
  flex: 0 0 155px; min-width: 155px;
  text-decoration: none; color: inherit;
  padding: 10px; border-radius: var(--radius-card);
  border: 1px solid #e5e5e5; background: #fff;
  scroll-snap-align: center;
  transition: border-color 0.2s, box-shadow 0.2s;
}
/* First card respects left padding */
.nf-cart-drawer__discover-card:first-child { scroll-snap-align: start; }
.nf-cart-drawer__discover-card:hover {
  border-color: #262320;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.08);
  text-decoration: none;
}
.nf-cart-drawer__discover-card-img-wrap {
  position: relative; width: 100%;
  aspect-ratio: 1; border-radius: 6px;
  overflow: hidden; background: #e8e8e4;
  margin-bottom: 8px;
}
.nf-cart-drawer__discover-card-img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.nf-cart-drawer__discover-card-badge {
  position: absolute; top: 6px; right: 6px;
  background: #E16C47; color: #fff;
  font-size: 9px; font-weight: 700;
  padding: 2px 7px; border-radius: 999px;
}
.nf-cart-drawer__discover-card-badge[hidden] { display: none; }
.nf-cart-drawer__discover-card-title {
  font-size: 12px; font-weight: 600; color: #262320;
  margin: 0 0 3px; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.nf-cart-drawer__discover-card-price-row {
  display: flex; align-items: center; gap: 5px;
  margin-top: auto;
}
.nf-cart-drawer__discover-card-price {
  font-size: 13px; font-weight: 700; color: #262320;
}
.nf-cart-drawer__discover-card-compare {
  font-size: 10px; color: #999; text-decoration: line-through;
}
.nf-cart-drawer__discover-card-compare[hidden] { display: none; }
.nf-cart-drawer__discover-add-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 3px;
  width: 100%; padding: 5px 0; margin-top: 6px;
  background: var(--color-primary, #262320); color: #fff;
  border: none; border-radius: var(--radius-md, 8px);
  font-size: 10px; font-weight: 600;
  font-family: inherit; cursor: pointer;
  transition: background 0.15s;
  position: relative; overflow: hidden;
}
.nf-cart-drawer__discover-add-btn:hover { background: var(--color-primary-hover, #2a2a2d); }
.nf-cart-drawer__discover-add-btn.is-adding { pointer-events: none; opacity: 0.85; }
.nf-cart-drawer__discover-add-btn .nf-spinner,
.nf-cart-drawer__discover-add-btn .nf-checkmark {
  display: flex; align-items: center; justify-content: center;
}
.nf-cart-drawer__discover-add-btn .nf-spinner svg {
  animation: spin 0.6s linear infinite;
}

/* Skeleton cards for discovery panels — matches upsell card sizing */
.nf-cart-drawer__discover-skeleton {
  display: flex; gap: 10px; padding: 0 20px 8px;
}
.nf-cart-drawer__discover-skeleton-card {
  flex: 0 0 160px; min-width: 160px;
  padding: 12px; border-radius: 8px;
  border: 1px solid #e5e5e5; background: #fff;
}
.nf-cart-drawer__discover-skeleton-card .nf-cart-drawer__skeleton-img {
  margin-bottom: 8px;
}
.nf-cart-drawer__discover-skeleton-card .nf-cart-drawer__skeleton-line { height: 8px; margin-bottom: 5px; }
.nf-cart-drawer__discover-skeleton-card .nf-cart-drawer__skeleton-btn { height: 24px; margin-top: 5px; }

/* (USPs removed from empty state — redundant with footer guarantees) */

/* ── Single Item ── */
.nf-cart-drawer__item {
  display: flex; gap: 14px;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f0f0;
  position: relative;
}
.nf-cart-drawer__item.is-updating {
  pointer-events: none;
}
/* Full overlay spinner centered on the entire line item */
.nf-cart-drawer__item.is-updating::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.7);
  z-index: 3;
}
.nf-cart-drawer__item.is-updating::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 20px; height: 20px;
  margin: -10px 0 0 -10px;
  border: 2.5px solid #deddd8;
  border-top-color: #262320;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
  z-index: 4;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Smooth cart state transitions ── */
.nf-cart-drawer__items {
  transition: opacity 0.22s ease;
}
.nf-cart-drawer__items.is-fading-out {
  opacity: 0;
  transition: opacity 0.18s ease;
}
.nf-cart-drawer__empty {
  transition: opacity 0.22s ease;
}
.nf-cart-drawer__empty.is-fading-in {
  opacity: 0;
  animation: cartFadeIn 0.28s ease forwards;
}
@keyframes cartFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Shop All button inside discover panels */
.nf-cart-drawer__discover-view-all {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  margin: 12px 20px 16px;
  padding: 14px 24px;
  font-size: 0.9375rem; font-weight: 600;
  color: #fff;
  background: #E16C47;
  text-decoration: none;
  border: none;
  border-radius: 9999px;
  transition: background 0.2s, transform 0.2s;
  flex-shrink: 0;
}
.nf-cart-drawer__discover-view-all:hover {
  background: #c9563a;
  transform: translateY(-1px);
  text-decoration: none;
}
.nf-cart-drawer__discover-view-all svg { flex-shrink: 0; }

/* Discover scroll uses upsell card styles — ensure scroll-snap alignment */
.nf-cart-drawer__discover-scroll .nf-cart-drawer__upsell-card {
  scroll-snap-align: center;
}
.nf-cart-drawer__discover-scroll .nf-cart-drawer__upsell-card:first-child {
  scroll-snap-align: start;
}

.nf-cart-drawer__item-img-link { flex-shrink: 0; }
.nf-cart-drawer__item-img {
  width: 80px; height: 80px; object-fit: cover;
  border-radius: 10px; background: #F3F1E9;
  border: 1px solid #eee;
}
.nf-cart-drawer__item-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.nf-cart-drawer__item-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.nf-cart-drawer__item-title {
  font-size: 13px; font-weight: 600; color: #262320;
  text-decoration: none; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.nf-cart-drawer__item-title:hover { color: var(--color-primary-hover, #2a2a2d); }
.nf-cart-drawer__item-remove {
  flex-shrink: 0; background: none; border: none;
  cursor: pointer; color: #bbb; padding: 2px;
  transition: color 0.15s;
}
.nf-cart-drawer__item-remove:hover { color: #E16C47; }
/* Variant pill — always visible when variant exists */
.nf-cart-drawer__item-variant {
  display: inline-block;
  font-size: 10px; font-weight: 500; color: #666;
  background: #f0efea; border-radius: 999px;
  padding: 2px 8px; margin: 0;
  line-height: 1.4; letter-spacing: 0.01em;
  width: auto; max-width: max-content;
}
.nf-cart-drawer__item-variant[hidden] { display: none; }

/* Price row */
.nf-cart-drawer__item-price-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.nf-cart-drawer__item-prices { display: flex; align-items: center; gap: 6px; }
.nf-cart-drawer__item-price { font-size: 13px; font-weight: 600; color: #262320; }
.nf-cart-drawer__item-compare {
  font-size: 13px; font-weight: 400; color: rgba(38,35,32,0.45); text-decoration: line-through;
}
.nf-cart-drawer__item-compare[hidden] { display: none; }
.nf-cart-drawer__item-subscription {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 4px 0 0;
  font-size: 11px;
  line-height: 1.3;
  color: #E16C47;
  font-weight: 500;
}
.nf-cart-drawer__item-subscription[hidden] { display: none; }
.nf-cart-drawer__item-subscription svg { flex-shrink: 0; }
.nf-cart-drawer__item-save-badge {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 2px 7px;
  background: #E16C47; color: #fff;
  font-size: 10px; font-weight: 700; border-radius: 9999px;
  white-space: nowrap; letter-spacing: 0.01em;
}
.nf-cart-drawer__item-save-badge[hidden] { display: none; }

/* "You Save" line */
.nf-cart-drawer__item-you-save {
  font-size: 11px; color: #E16C47; font-weight: 600; margin: 0;
}
.nf-cart-drawer__item-you-save[hidden] { display: none; }

/* On-sale price — stays black like PDP, strikethrough + badge provide sale context */
.nf-cart-drawer__item--on-sale .nf-cart-drawer__item-price { color: #262320; }

/* ── Quantity Selector ── */
.nf-cart-drawer__item-qty {
  display: inline-flex; align-items: center;
  border: 1px solid var(--color-border, #deddd8); border-radius: var(--radius-md, 8px);
  overflow: hidden; margin-top: 4px; align-self: flex-start;
}
.nf-cart-drawer__qty-btn {
  width: 32px; height: 32px; display: flex;
  align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer;
  font-size: 15px; font-weight: 500; color: var(--color-foreground, #262320);
  transition: background 0.15s; user-select: none;
}
.nf-cart-drawer__qty-btn:hover { background: var(--color-surface, #F3F1E9); }
.nf-cart-drawer__qty-btn:active { background: var(--color-secondary, #eae9e4); }
.nf-cart-drawer__qty-input {
  width: 36px; height: 32px; text-align: center;
  border: none; border-left: 1px solid var(--color-border, #deddd8);
  border-right: 1px solid var(--color-border, #deddd8);
  font-size: 13px; font-weight: 600; color: var(--color-foreground, #262320);
  font-family: inherit; background: transparent;
  -moz-appearance: textfield;
}
.nf-cart-drawer__qty-input::-webkit-outer-spin-button,
.nf-cart-drawer__qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ── Footer ── */
.nf-cart-drawer__footer {
  flex-shrink: 0;
  border-top: 1px solid #eee;
  background: #fafaf8;
  padding: 14px 20px 12px;
}
.nf-cart-drawer__footer[hidden] { display: none; }

/* Summary */
.nf-cart-drawer__summary {
  padding: 0;
  display: flex; flex-direction: column; gap: 8px;
  margin-bottom: 14px;
}
.nf-cart-drawer__summary-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 13px; color: #555;
}
/* Subtotal row gets more weight */
.nf-cart-drawer__summary-row:not([class*="--"]):not([hidden]) span:first-child {
  font-weight: 600; color: #262320; font-size: 14px;
}
.nf-cart-drawer__summary-row:not([class*="--"]):not([hidden]) span:last-child {
  font-weight: 700; color: #262320; font-size: 15px;
}
/* Compare-at row */
.nf-cart-drawer__summary-row--compare {
  font-size: 12px; color: #999;
}
.nf-cart-drawer__compare-value {
  text-decoration: line-through;
}
/* Savings row */
.nf-cart-drawer__summary-row--savings .nf-cart-drawer__savings-value {
  color: #E16C47; font-weight: 600;
}
.nf-cart-drawer__summary-row--savings span:first-child {
  color: #E16C47;
}
/* Shipping row */
.nf-cart-drawer__summary-row--shipping span:last-child {
  font-size: 11px; color: #999;
}
.nf-cart-drawer__summary-row[hidden] { display: none; }

/* CTA — matches PDP green pill pattern */
.nf-cart-drawer__checkout-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 14px 20px;
  background: #E16C47; color: #fff;
  border: none; border-radius: var(--radius-full, 9999px);
  font-size: 15px; font-weight: 700;
  font-family: inherit; cursor: pointer;
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 4px;
  box-shadow: 0 2px 8px rgba(45, 138, 35, 0.25);
  position: relative;
  overflow: hidden;
}
.nf-cart-drawer__checkout-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.08) 25%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.08) 75%, transparent 100%);
  background-size: 200% 100%;
  animation: ctaShimmer 4s ease-in-out infinite;
  pointer-events: none;
  border-radius: inherit;
}
@keyframes ctaShimmer {
  0% { background-position: 200% center; }
  100% { background-position: -200% center; }
}
.nf-cart-drawer__checkout-btn:hover {
  box-shadow: 0 4px 20px rgba(45, 138, 35, 0.44);
  transform: translateY(-1px);
  filter: brightness(0.95);
  text-decoration: none;
}
.nf-cart-drawer__checkout-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(45, 138, 35, 0.25);
}
.nf-cart-drawer__lock-icon { opacity: 0.85; position: relative; z-index: 1; }
.nf-cart-drawer__checkout-total { opacity: 0.9; position: relative; z-index: 1; }
.nf-cart-drawer__checkout-btn span { position: relative; z-index: 1; }

/* Payment Trust */
.nf-cart-drawer__trust {
  display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 10px 0 4px;
}
.nf-cart-drawer__trust-label {
  font-size: 10px; font-weight: 500; color: #999;
  text-transform: uppercase; letter-spacing: 0.05em;
}
.nf-cart-drawer__payment-icons { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: center; }
.nf-cart-drawer__payment-icon { height: 22px; width: auto; border-radius: 3px; }
@media (max-width: 749px) {
  .nf-cart-drawer__payment-icons { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; white-space: nowrap; -webkit-overflow-scrolling: touch; justify-content: flex-start; padding: 0 4px; }
  .nf-cart-drawer__payment-icons::-webkit-scrollbar { display: none; }
  .nf-cart-drawer__payment-icon { flex-shrink: 0; }
}

/* Guarantee — each check+label stays grouped when row wraps */
.nf-cart-drawer__guarantee {
  display: flex; align-items: center; justify-content: center;
  gap: 6px 10px; padding: 6px 0 0;
  font-size: 10px; color: #888; flex-wrap: wrap;
}
.nf-cart-drawer__guarantee-item {
  display: inline-flex; align-items: center; gap: 4px;
}
.nf-cart-drawer__guarantee-item svg { flex-shrink: 0; }
.nf-cart-drawer__guarantee-sep { color: #ccc; }

/* ── Upsell Section ── */
.nf-cart-drawer__upsell {
  flex-shrink: 0;
  border-top: 1px solid #eee;
  padding: 14px 0 10px;
  background: #fafaf8;
}
.nf-cart-drawer__upsell[hidden] { display: none; }
.nf-cart-drawer__upsell-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px 10px;
}
.nf-cart-drawer__upsell-title {
  font-size: 13px; font-weight: 700; color: #262320;
  letter-spacing: -0.01em;
}

/* Upsell Nav — arrows & dots */
.nf-cart-drawer__upsell-nav {
  display: flex; align-items: center; gap: 6px;
}
.nf-cart-drawer__upsell-arrow {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  background: #fff; border: 1px solid #deddd8;
  cursor: pointer; color: #262320;
  transition: all 0.15s;
  padding: 0; flex-shrink: 0;
}
.nf-cart-drawer__upsell-arrow:hover {
  background: #262320; color: #fff; border-color: #262320;
}
.nf-cart-drawer__upsell-arrow:disabled {
  opacity: 0.3; cursor: default; pointer-events: none;
}
.nf-cart-drawer__upsell-dots {
  display: flex; align-items: center; gap: 4px;
}
.nf-cart-drawer__upsell-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: #deddd8; border: none; padding: 0;
  cursor: pointer; transition: all 0.2s;
}
.nf-cart-drawer__upsell-dot.is-active {
  background: #262320; width: 16px; border-radius: 3px;
}

/* Scroll container */
.nf-cart-drawer__upsell-scroll {
  display: flex; gap: 12px;
  overflow-x: auto; padding: 0 20px 10px;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scroll-padding-left: 20px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.nf-cart-drawer__upsell-scroll::-webkit-scrollbar { display: none; }

/* Upsell skeleton loading */
.nf-cart-drawer__upsell-skeleton {
  display: flex; gap: 12px; padding: 0 20px 10px;
}
.nf-cart-drawer__upsell-skeleton-card {
  flex: 0 0 160px; min-width: 160px;
  padding: 12px; border-radius: 8px;
  border: 1px solid #eee; background: #fff;
}
.nf-cart-drawer__skeleton-img {
  width: 100%; aspect-ratio: 1;
  border-radius: 6px; background: #f0efea;
  margin-bottom: 8px;
  animation: skeletonPulse 1.5s ease-in-out infinite;
}
.nf-cart-drawer__skeleton-line {
  height: 10px; border-radius: 4px;
  background: #f0efea; margin-bottom: 6px;
  animation: skeletonPulse 1.5s ease-in-out infinite;
}
.nf-cart-drawer__skeleton-line--short { width: 60%; }
.nf-cart-drawer__skeleton-line--medium { width: 80%; }
.nf-cart-drawer__skeleton-btn {
  height: 28px; border-radius: 8px;
  background: #f0efea; margin-top: 6px;
  animation: skeletonPulse 1.5s ease-in-out infinite;
}
@keyframes skeletonPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Smooth upsell list transition */
.nf-cart-drawer__upsell-scroll.is-transitioning {
  opacity: 0;
  transform: translateX(8px);
  transition: opacity 0.25s, transform 0.25s;
}
.nf-cart-drawer__upsell-scroll.is-visible {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 0.35s ease, transform 0.35s ease;
}

/* Upsell Card — matches mega menu product card exactly */
.nf-cart-drawer__upsell-card {
  display: block; flex: 0 0 160px; min-width: 160px;
  text-decoration: none; color: inherit;
  padding: 12px; border-radius: 8px;
  border: 1px solid #e5e5e5; background: #fff;
  scroll-snap-align: start;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.nf-cart-drawer__upsell-card:hover {
  border-color: #262320;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
  text-decoration: none;
}

/* Image wrap — 1:1 aspect ratio like mega menu */
.nf-cart-drawer__upsell-card-img-wrap {
  position: relative; width: 100%;
  aspect-ratio: 1; border-radius: 6px;
  overflow: hidden; background: #e8e8e4;
  margin-bottom: 8px;
}
.nf-cart-drawer__upsell-card-img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}

/* Badge */
.nf-cart-drawer__upsell-card-badge {
  position: absolute; top: 8px; right: 8px;
  background: #E16C47; color: #fff;
  font-size: 9px; font-weight: 700;
  padding: 2px 8px; border-radius: 999px;
  text-transform: uppercase;
}
.nf-cart-drawer__upsell-card-badge[hidden] { display: none; }

/* Title — 2-line clamp like mega menu */
.nf-cart-drawer__upsell-card-title {
  font-size: 13px; font-weight: 600; color: #262320;
  margin: 0 0 2px; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
  transition: color 0.2s;
}
.nf-cart-drawer__upsell-card:hover .nf-cart-drawer__upsell-card-title { color: var(--color-primary-hover, #2a2a2d); }

/* Price row */
.nf-cart-drawer__upsell-card-price-row {
  display: flex; align-items: center; gap: 6px;
}
.nf-cart-drawer__upsell-card-price {
  font-size: 12px; font-weight: 600; color: #262320; margin: 0;
}
.nf-cart-drawer__upsell-card-compare {
  font-size: 12px; font-weight: 400; color: rgba(38,35,32,0.45); text-decoration: line-through;
}
.nf-cart-drawer__upsell-card-compare[hidden] { display: none; }
.nf-cart-drawer__upsell-card--on-sale .nf-cart-drawer__upsell-card-price { color: #262320; }
.nf-cart-drawer__upsell-card-sub-label {
  display: block;
  font-size: 10px;
  font-weight: 600;
  color: #E16C47;
  margin-top: 3px;
  letter-spacing: 0.01em;
}
.nf-cart-drawer__upsell-card-sub-label[hidden] { display: none; }
.nf-cart-drawer__upsell-card-review {
  display: flex; align-items: center; gap: 3px; color: #262320; min-height: 14px;
}
.nf-cart-drawer__upsell-card-review svg { flex-shrink: 0; }
.nf-cart-drawer__upsell-card-review span { font-size: 11px; color: #71717a; line-height: 1; }

/* Add button */
.nf-cart-drawer__upsell-add-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  width: 100%; padding: 6px 0; margin-top: 6px;
  background: var(--color-primary, #262320); color: #fff;
  border: none; border-radius: var(--radius-md, 8px);
  font-size: 11px; font-weight: 600;
  font-family: inherit; cursor: pointer;
  transition: background 0.15s;
}
.nf-cart-drawer__upsell-add-btn:hover { background: var(--color-primary-hover, #2a2a2d); }
.nf-cart-drawer__upsell-add-btn.is-adding {
  pointer-events: none; opacity: 0.85;
}
.nf-cart-drawer__upsell-add-btn.is-added {
  background: #E16C47; pointer-events: none;
}
.nf-cart-drawer__upsell-spinner {
  animation: spin 0.6s linear infinite;
}
/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .nf-cart-drawer__checkout-btn::before { animation: none; }
  .nf-cart-drawer * { transition-duration: 0.01ms !important; }
}

/* ── Mobile ── */
@media screen and (max-width: 480px) {
  .nf-cart-drawer { width: 100vw; }
  .nf-cart-drawer__item-img { width: 68px; height: 68px; }
  .nf-cart-drawer__upsell-arrow { width: 24px; height: 24px; }
  .nf-cart-drawer__upsell-arrow svg { width: 10px; height: 10px; }
  .nf-cart-drawer__upsell-dot { width: 5px; height: 5px; }
  .nf-cart-drawer__upsell-dot.is-active { width: 12px; }
  .nf-cart-drawer__upsell-card { flex: 0 0 145px; min-width: 145px; padding: 10px; }
  .nf-cart-drawer__upsell-scroll { gap: 10px; }
}

/* ── Body scroll lock ── */
body.cart-drawer-open { overflow: hidden; }
/* END_SECTION:cart-drawer */

/* START_SECTION:collection-benefits (INDEX:5) */
.cl-benefits {
  padding-block: 4rem;
  overflow: hidden;
  background: var(--section-bg, #F3F1E9);
  --cl-bg: var(--section-bg, #F3F1E9);
}
.cl-benefits--dark {
  background: var(--section-bg, #141416);
  --cl-bg: var(--section-bg, #141416);
}
.cl-benefits__header {
  text-align: center;
  margin-block-end: 2.5rem;
  max-width: 72rem;
  margin-inline: auto;
}
.cl-benefits__heading {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0;
}
.cl-benefits--dark .cl-benefits__heading { color: #f5f5f5; }
.cl-benefits__subheading {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--color-text-muted, #71717a);
  max-width: 40rem;
  margin: 0.75rem auto 0;
}
.cl-benefits--dark .cl-benefits__subheading { color: rgba(255,255,255,0.6); }

.cl-benefits__track-wrap {
  position: relative;
  max-width: 72rem;
  margin-inline: auto;
}
.cl-benefits__track {
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  max-width: 72rem;
  margin-inline: auto;
  padding: 0 1rem 1rem;
  scroll-padding-left: 1rem;
}
.cl-benefits__track::-webkit-scrollbar { display: none; }

.cl-benefits__card {
  flex: 0 0 300px;
  scroll-snap-align: start;
  border-radius: 1rem;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.06);
  transition: transform 0.25s;
}
.cl-benefits--dark .cl-benefits__card {
  background: #1e1e21;
  border-color: rgba(255,255,255,0.06);
}
/* hover removed — cards are not clickable */

.cl-benefits__card-media {
  aspect-ratio: var(--cl-benefit-ratio, 1 / 1);
  overflow: hidden;
  background: #F3F1E9;
}
.cl-benefits--dark .cl-benefits__card-media { background: #0d0d14; }
.cl-benefits__card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cl-benefits__card-body {
  padding: 1.25rem 1.5rem 1.5rem;
}
.cl-benefits__card-number {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--color-text-muted, #999);
  margin-block-end: 0.25rem;
}
.cl-benefits--dark .cl-benefits__card-number { color: rgba(255,255,255,0.35); }
.cl-benefits__card-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin: 0;
  line-height: 1.3;
}
.cl-benefits--dark .cl-benefits__card-title { color: #f5f5f5; }
.cl-benefits__card-desc {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted, #71717a);
  margin: 0.375rem 0 0;
}
.cl-benefits--dark .cl-benefits__card-desc { color: rgba(255,255,255,0.5); }

.cl-benefits__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  transition: opacity 200ms ease, transform 200ms ease, box-shadow 200ms ease;
  color: #262320;
  padding: 0;
}
.cl-benefits--dark .cl-benefits__arrow {
  background: #1e1e21;
  border-color: rgba(255,255,255,0.15);
  color: #f5f5f5;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
.cl-benefits__arrow:hover { transform: translateY(-50%) scale(1.08); }
.cl-benefits__arrow--prev { left: 0.5rem; }
.cl-benefits__arrow--next { right: 0.5rem; }
.cl-benefits__arrow[hidden] { display: none; }

/* ── Side fade gradients — dynamically sourced from section background ── */
.cl-benefits__fade {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4rem;
  pointer-events: none;
  z-index: 1;
}
.cl-benefits__fade--left {
  left: 0;
  background: linear-gradient(to right, var(--cl-bg) 0%, transparent 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.cl-benefits__fade--right {
  right: 0;
  background: linear-gradient(to left, var(--cl-bg) 0%, transparent 100%);
  opacity: 1;
  transition: opacity 0.3s ease;
}

/* ── Nav dots ── */
.cl-benefits__dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-block-start: 1.25rem;
}
.cl-benefits__dot {
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  background: var(--color-border, #deddd8);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: width 0.3s, background 0.3s;
}
.cl-benefits--dark .cl-benefits__dot {
  background: rgba(255,255,255,0.2);
}
.cl-benefits__dot.is-active {
  width: 18px;
  background: var(--color-foreground, #262320);
}
.cl-benefits--dark .cl-benefits__dot.is-active {
  background: #f5f5f5;
}

@media (max-width: 749px) {
  .cl-benefits { padding-block: 2.5rem; }
  .cl-benefits__card { flex: 0 0 75vw; max-width: 300px; }
  .cl-benefits__arrow { display: none; }
  /* No left fade on mobile — content snags to left edge */
  .cl-benefits__fade--left { display: none; }
  .cl-benefits__track { padding-left: 1rem; scroll-padding-left: 1rem; }
}
/* END_SECTION:collection-benefits */

/* START_SECTION:collection-hero (INDEX:6) */
.cl-hero {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
  min-height: var(--cl-hero-desktop-h, 70vh);
}
.cl-hero__media {
  position: absolute;
  inset: 0;
}
.cl-hero__img {
  width: 100%;
  height: 125%;
  object-fit: cover;
  display: block;
  transform: translateY(0);
  will-change: transform;
}
/* Premium brand gradient */
.cl-hero__gradient {
  width: 100%;
  height: 100%;
  background:
    radial-gradient(ellipse at 15% 80%, rgba(76, 175, 80, 0.55) 0%, transparent 45%),
    radial-gradient(ellipse at 85% 15%, rgba(56, 195, 80, 0.45) 0%, transparent 40%),
    radial-gradient(ellipse at 50% 50%, rgba(34, 197, 94, 0.25) 0%, transparent 55%),
    radial-gradient(circle at 70% 70%, rgba(22, 163, 74, 0.35) 0%, transparent 35%),
    radial-gradient(circle at 25% 30%, rgba(74, 222, 128, 0.15) 0%, transparent 30%),
    linear-gradient(155deg, #1a1816 0%, #18703a 20%, #22944a 40%, #1e8842 55%, #167a36 70%, #0f5a26 85%, #0a3818 100%);
}
.cl-hero__overlay {
  position: absolute;
  inset: 0;
  background: #000;
  pointer-events: none;
}
.cl-hero__content {
  position: relative;
  z-index: 2;
  padding-block: 5rem;
  display: flex;
  flex-direction: column;
  width: 100%;
}
.cl-hero__content--center {
  align-items: center;
  text-align: center;
  margin-inline: auto;
}
.cl-hero__content--left {
  align-items: flex-start;
  text-align: left;
}
.cl-hero__content--narrow { max-width: 40rem; }
.cl-hero__content--medium { max-width: 50rem; }
.cl-hero__content--wide { max-width: 64rem; }

.cl-hero__eyebrow {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-block-end: 0.75rem;
  color: rgba(255,255,255,0.65);
}
.cl-hero__heading {
  font-size: clamp(2.25rem, 5vw, 4rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: #fff;
  margin: 0;
}
.cl-hero__subheading {
  font-size: clamp(1rem, 1.5vw, 1.25rem);
  line-height: 1.6;
  color: rgba(255,255,255,0.8);
  max-width: 36rem;
  margin: 1rem 0 0;
}
.cl-hero__content--center .cl-hero__subheading { margin-inline: auto; }

.cl-hero__cta-wrap {
  margin-block-start: 1.5rem;
}
.cl-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.625rem 1.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  border-radius: var(--radius-button);
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
  font-family: inherit;
}
.cl-hero__cta--primary {
  background: rgba(255,255,255,0.2);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.35);
}
.cl-hero__cta--primary:hover {
  background: rgba(255,255,255,0.3);
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}
.cl-hero__cta--secondary {
  background: transparent;
  color: #fff;
  border: 1.5px solid rgba(255,255,255,0.45);
}
.cl-hero__cta--secondary:hover {
  border-color: #fff;
  background: rgba(255,255,255,0.08);
}

/* ── Breadcrumb inside hero — matches PDP breadcrumb position ── */
.cl-hero__breadcrumb {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
  padding: 14px 0;
}
.cl-hero__breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 0.8125rem;
  color: rgba(255,255,255,0.6);
  justify-content: flex-start;
}
.cl-hero__breadcrumb-item:not(:last-child)::after {
  content: '/';
  margin-inline-start: 0.5rem;
  color: rgba(255,255,255,0.35);
}
.cl-hero__breadcrumb-item a {
  color: rgba(255,255,255,0.6);
  text-decoration: none;
  transition: color 0.2s;
}
.cl-hero__breadcrumb-item a:hover {
  color: #fff;
}
.cl-hero__breadcrumb-item--current {
  color: rgba(255,255,255,0.85);
}

@media (max-width: 749px) {
  .cl-hero { min-height: var(--cl-hero-mobile-h, auto) !important; }
  .cl-hero__content { padding-block: 3rem; }
  .cl-hero__cta { padding: 0.5rem 1.125rem; font-size: 0.75rem; }
  .cl-hero__breadcrumb { padding: 10px 0; }
  .cl-hero__breadcrumb-list { font-size: 0.75rem; }
}
/* END_SECTION:collection-hero */

/* START_SECTION:collection-promo-splitters (INDEX:7) */
.cl-promos {
  padding-block: 1rem;
}
.cl-promos--dark {
  background: #141416;
}
.cl-promos__container {
  max-width: 72rem;
  margin: 0 auto;
}
.cl-promos__grid {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
.cl-promos__grid--two {
  flex-direction: row;
}
.cl-promos__card {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-card);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, background 0.15s;
}
.cl-promos--dark .cl-promos__card {
  background: #1e1e21;
  border-color: rgba(255,255,255,0.08);
}
.cl-promos__card:hover {
  border-color: var(--color-foreground, #262320);
}
.cl-promos--dark .cl-promos__card:hover {
  border-color: rgba(255,255,255,0.25);
}
.cl-promos__card > svg:first-child {
  flex-shrink: 0;
  color: var(--color-foreground, #262320);
}
.cl-promos--dark .cl-promos__card > svg:first-child {
  color: #f5f5f5;
}
.cl-promos__card-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.cl-promos__card-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.cl-promos--dark .cl-promos__card-title {
  color: #f5f5f5;
}
.cl-promos__card-desc {
  font-size: 11px;
  color: var(--color-text-muted, #999);
}
.cl-promos--dark .cl-promos__card-desc {
  color: rgba(255,255,255,0.45);
}
.cl-promos__card-arrow {
  flex-shrink: 0;
  color: #bbb;
  transition: transform 0.15s;
}
.cl-promos__card:hover .cl-promos__card-arrow {
  transform: translateX(2px);
  color: var(--color-foreground, #262320);
}
.cl-promos--dark .cl-promos__card:hover .cl-promos__card-arrow {
  color: #f5f5f5;
}

@media (max-width: 749px) {
  .cl-promos__grid--two {
    flex-direction: column;
  }
}
/* END_SECTION:collection-promo-splitters */

/* START_SECTION:collection-reviews (INDEX:8) */
.cl-reviews {
    padding: 72px 0 80px;
  }

  .cl-reviews__header {
    text-align: center;
    margin-bottom: 40px;
  }

  .cl-reviews__heading {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: var(--color-text, #262320);
    margin: 0 0 8px;
  }

  .cl-reviews__subtitle {
    font-family: var(--font-body);
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--color-text, #262320);
    opacity: 0.7;
    margin: 0;
  }
/* END_SECTION:collection-reviews */

/* START_SECTION:collection-seo-content (INDEX:9) */
.cl-seo {
  padding-block: 3.5rem;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.cl-seo--dark {
  background: var(--section-bg, #1e1e21);
  border-color: rgba(255,255,255,0.06);
}
.cl-seo__container {
  max-width: 48rem;
  margin: 0 auto;
  text-align: center;
}
.cl-seo__heading {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 1.5rem;
  letter-spacing: -0.01em;
}
.cl-seo--dark .cl-seo__heading { color: #f5f5f5; }
.cl-seo__wrap {
  position: relative;
  text-align: left;
}
.cl-seo__wrap.is-collapsed .cl-seo__body {
  max-height: 25rem; /* ~400 chars equivalent */
  overflow: hidden;
}
.cl-seo__fade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 5rem;
  background: linear-gradient(to bottom, transparent 0%, var(--section-bg, #fff) 100%);
  pointer-events: none;
}
.cl-seo--dark .cl-seo__fade {
  background: linear-gradient(to bottom, transparent 0%, var(--section-bg, #1e1e21) 100%);
}
.cl-seo__fade[hidden] { display: none; }
.cl-seo__body {
  font-size: 0.9375rem;
  line-height: 1.8;
  color: var(--color-text-muted, #555);
}
.cl-seo--dark .cl-seo__body { color: rgba(255,255,255,0.6); }
.cl-seo__body h2, .cl-seo__body h3 {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin: 2rem 0 0.75rem;
}
.cl-seo--dark .cl-seo__body h2,
.cl-seo--dark .cl-seo__body h3 { color: #f5f5f5; }
.cl-seo__body p { margin: 0 0 1rem; }
.cl-seo__body p:last-child { margin-bottom: 0; }
.cl-seo__body a { color: var(--color-foreground, #262320); text-decoration: underline; }
.cl-seo--dark .cl-seo__body a { color: #f5f5f5; }
.cl-seo__body ul, .cl-seo__body ol {
  padding-left: 1.5rem;
  margin: 0 0 1rem;
}
.cl-seo__toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-top: 1rem;
  padding: 0.5rem 1.25rem;
  background: #e5e5e5;
  border: none;
  border-radius: var(--radius-button);
  font-size: 0.8125rem;
  font-weight: 600;
  color: #262320;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s, color 0.2s;
}
.cl-seo--dark .cl-seo__toggle {
  background: rgba(255,255,255,0.15);
  color: #f5f5f5 !important;
  border: 1px solid rgba(255,255,255,0.2);
}
.cl-seo--dark .cl-seo__toggle svg { color: #f5f5f5; }
.cl-seo__toggle:hover {
  background: #d4d4d4;
  color: #262320;
}
.cl-seo--dark .cl-seo__toggle:hover {
  background: rgba(255,255,255,0.25);
  color: #f5f5f5 !important;
}
.cl-seo__toggle[hidden] { display: none; }
.cl-seo__toggle svg {
  transition: transform 0.3s ease;
}
.cl-seo__toggle.is-expanded svg { transform: rotate(180deg); }

@media (max-width: 749px) {
  .cl-seo { padding-block: 2.5rem; }
}
/* END_SECTION:collection-seo-content */

/* START_SECTION:collection-spotlights (INDEX:10) */
.cl-spotlights {
  padding-block: 4rem;
  background: #F3F1E9;
}
.cl-spotlights--dark {
  background: #1e1e21;
}
.cl-spotlights__container {
  max-width: 72rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
.cl-spotlights__header {
  text-align: center;
}
.cl-spotlights__section-heading {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0;
}
.cl-spotlights--dark .cl-spotlights__section-heading {
  color: #f5f5f5;
}
.cl-spotlights__section-sub {
  color: var(--color-text-muted, #71717a);
  max-width: 36rem;
  margin: 0.75rem auto 0;
  line-height: 1.6;
}

/* ── Row: image + content side by side ── */
.cl-spotlights__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}
.cl-spotlights__row--reversed {
  direction: rtl;
}
.cl-spotlights__row--reversed > * {
  direction: ltr;
}

.cl-spotlights__media {
  border-radius: 1rem;
  overflow: hidden;
  background: #F3F1E9;
}
.cl-spotlights--dark .cl-spotlights__media {
  background: #0d0d14;
}
.cl-spotlights__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.cl-spotlights__video-wrap {
  position: relative;
  aspect-ratio: 16 / 9;
}
.cl-spotlights__video-wrap iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.cl-spotlights__content {
  padding: var(--cl-text-pad, 1rem);
}

.cl-spotlights__eyebrow {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-text-muted, #71717a);
  margin-block-end: 0.5rem;
}
.cl-spotlights--dark .cl-spotlights__eyebrow {
  color: rgba(255,255,255,0.45);
}
.cl-spotlights__heading {
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.75rem;
  line-height: 1.2;
}
.cl-spotlights--dark .cl-spotlights__heading {
  color: #f5f5f5;
}
.cl-spotlights__body {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--color-text-muted, #555);
}
.cl-spotlights--dark .cl-spotlights__body {
  color: rgba(255,255,255,0.65);
}
.cl-spotlights__body p { margin: 0 0 0.5rem; }
.cl-spotlights__body p:last-child { margin-bottom: 0; }

.cl-spotlights__specs {
  list-style: none;
  padding: 0;
  margin: 1.25rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.cl-spotlights__spec {
  font-size: 0.875rem;
  line-height: 1.5;
}
.cl-spotlights__spec-label {
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.cl-spotlights--dark .cl-spotlights__spec-label {
  color: #f5f5f5;
}
.cl-spotlights__spec-value {
  color: var(--color-text-muted, #555);
}

.cl-spotlights__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin-block-start: 1.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  text-decoration: none;
  transition: gap 0.2s;
}
.cl-spotlights--dark .cl-spotlights__cta {
  color: #f5f5f5;
}
.cl-spotlights__cta:hover {
  gap: 0.625rem;
}

@media (max-width: 749px) {
  .cl-spotlights { padding-block: 2.5rem; }
  .cl-spotlights__container { gap: 2.5rem; }
  .cl-spotlights__row {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .cl-spotlights__row--reversed { direction: ltr; }
  /* Normalize text padding on mobile — ignore CMS override */
  .cl-spotlights__content { padding: 1rem !important; }
}
/* END_SECTION:collection-spotlights */

/* START_SECTION:collection-sticky-cta (INDEX:11) */
.cl-sticky-cta {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%) translateY(80px);
  z-index: 50;
  opacity: 0;
  pointer-events: none;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
}
.cl-sticky-cta.is-visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.cl-sticky-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.625rem 1.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  border-radius: var(--radius-button);
  text-decoration: none;
  background: rgba(255,255,255,0.2);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  color: #262320;
  border: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  transition: background 0.2s, box-shadow 0.2s;
}
.cl-sticky-cta__btn:hover {
  background: rgba(255,255,255,0.35);
  box-shadow: 0 6px 28px rgba(0,0,0,0.15);
}
.cl-sticky-cta--dark .cl-sticky-cta__btn {
  background: rgba(255,255,255,0.12);
  color: #f5f5f5;
  border-color: rgba(255,255,255,0.15);
}
.cl-sticky-cta--dark .cl-sticky-cta__btn:hover {
  background: rgba(255,255,255,0.2);
}
.cl-sticky-cta[hidden] { display: none; }
/* END_SECTION:collection-sticky-cta */

/* START_SECTION:collection-subcategories (INDEX:12) */
.cl-subcats {
  padding-block: 2rem;
  background: transparent;
  overflow-x: clip;
}
.cl-subcats--dark {
  background: transparent;
}

.cl-subcats__container {
  max-width: 72rem;
  margin: 0 auto;
}
.cl-subcats__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-end: 1.5rem;
}
/* Sticky only when filters are enabled */
.cl-subcats--has-filters .cl-subcats__header {
  position: sticky;
  top: 0;
  z-index: 10;
  /* Full-bleed background, boxed content */
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 0.75rem calc(50vw - 50%);
  background: var(--section-bg, #fff);
  margin-top: -0.75rem;
  transition: box-shadow 0.2s ease;
}
.cl-subcats--has-filters .cl-subcats__header.is-stuck {
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.cl-subcats--has-filters.cl-subcats--dark .cl-subcats__header {
  background: var(--section-bg, #141416);
}
.cl-subcats--has-filters.cl-subcats--dark .cl-subcats__header.is-stuck {
  box-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
.cl-subcats__header-left {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}
.cl-subcats__heading {
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--color-foreground, #262320);
  margin: 0;
}
.cl-subcats__bundle-btn {
  display: inline-flex;
  align-items: center;
  padding: 0.375rem 1rem;
  font-size: 0.75rem;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #262320;
  border: none;
  border-radius: var(--radius-button);
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.2s, box-shadow 0.2s;
}
.cl-subcats__bundle-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 12px rgba(0,0,0,0.15);
}
.cl-subcats--dark .cl-subcats__bundle-btn {
  background: #fff;
  color: #262320;
}
.cl-subcats--dark .cl-subcats__heading {
  color: #f5f5f5;
}
.cl-subcats__subheading {
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
  margin: 0;
}
.cl-subcats--dark .cl-subcats__subheading {
  color: rgba(255,255,255,0.5);
}

/* ── Product grid — auto columns with minimum 3 ── */
.cl-subcats__grid {
  display: grid;
  grid-template-columns: repeat(var(--cl-cols-mobile, 1), 1fr);
  gap: 1rem;
}
@media (min-width: 750px) {
  .cl-subcats__grid { grid-template-columns: repeat(var(--cl-cols-tablet, 2), 1fr); }
}
@media (min-width: 990px) {
  .cl-subcats__grid { grid-template-columns: repeat(var(--cl-cols-desktop, 3), 1fr); }
}

.cl-subcats__product-item {
  min-width: 0;
}
/* Force product cards to fill their grid cell */
.cl-subcats__product-item .nf-card {
  width: 100%;
}
.cl-subcats__product-item .nf-card__img-wrap {
  width: 100%;
}
.cl-subcats__product-item .nf-card__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Dark card overrides handled globally by .theme-dark .nf-card__* in theme.liquid */

/* ── Filter button ── */
.cl-subcats__filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.4375rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  color: #262320;
  background: #f4f4f5;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--radius-button);
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s, transform 0.15s;
}
.cl-subcats__filter-btn:hover {
  background: #e4e4e7;
  transform: translateY(-1px);
}
.cl-subcats--dark .cl-subcats__filter-btn {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.1);
  color: #f5f5f5;
}
.cl-subcats--dark .cl-subcats__filter-btn:hover {
  background: rgba(255,255,255,0.14);
}

/* ── Filter area: button + active chips inline ── */
.cl-subcats__filter-area {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.cl-subcats__active-filters {
  display: flex;
  gap: 0.375rem;
  flex-wrap: wrap;
  align-items: center;
}
/* Desktop: show inline chips, hide mobile row */
.cl-subcats__active-filters--mobile { display: none; }
@media (max-width: 749px) {
  .cl-subcats__active-filters--desktop { display: none !important; }
  .cl-subcats__active-filters--mobile {
    display: flex;
    gap: 0.375rem;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 0.25rem;
    margin-bottom: 1rem;
  }
  .cl-subcats__active-filters--mobile:empty { display: none; }
}
.cl-subcats__active-filters:empty { display: none; }
.cl-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.3125rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 500;
  font-family: inherit;
  color: #262320;
  background: #e8e8ec;
  border: none;
  border-radius: var(--radius-button);
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, transform 0.1s;
  line-height: 1;
}
.cl-filter-chip:hover {
  background: #d4d4d8;
}
.cl-filter-chip:active {
  transform: scale(0.95);
}
.cl-filter-chip__x {
  width: 12px;
  height: 12px;
  opacity: 0.5;
  flex-shrink: 0;
  transition: opacity 0.15s;
}
.cl-filter-chip:hover .cl-filter-chip__x {
  opacity: 0.9;
}
/* Dark theme chips */
.cl-subcats--dark .cl-filter-chip {
  background: rgba(255,255,255,0.1);
  color: #f5f5f5;
}
.cl-subcats--dark .cl-filter-chip:hover {
  background: rgba(255,255,255,0.18);
}

/* ══════════════════════════════════════
   Filter Drawer — slides from left
   ══════════════════════════════════════ */
.cl-filter-drawer { position: fixed; inset: 0; z-index: 999; display: flex; pointer-events: none; }
.cl-filter-drawer[hidden] { display: none; }
.cl-filter-drawer.is-open { pointer-events: auto; }
.cl-filter-drawer__overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,0.45);
}

.cl-filter-drawer__panel {
  position: relative; z-index: 1;
  width: 22rem; max-width: 85vw;
  height: 100%;
  display: flex; flex-direction: column;
  background: #fff;
  box-shadow: 4px 0 24px rgba(0,0,0,0.12);
  transform: translateX(-100%);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.cl-filter-drawer.is-open .cl-filter-drawer__panel { transform: translateX(0); }
.cl-filter-drawer__overlay { opacity: 0; transition: opacity 0.3s ease; }
.cl-filter-drawer.is-open .cl-filter-drawer__overlay { opacity: 1; }

.cl-filter-drawer__panel--dark {
  background: #1e1e21;
  color: #f5f5f5;
  box-shadow: 4px 0 24px rgba(0,0,0,0.4);
}

.cl-filter-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__header {
  border-color: rgba(255,255,255,0.1);
}
.cl-filter-drawer__title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.01em;
}
.cl-filter-drawer__close {
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  background: none; border: none;
  color: inherit; cursor: pointer;
  border-radius: 50%;
  transition: background 0.2s;
}
.cl-filter-drawer__close:hover { background: rgba(0,0,0,0.05); }
.cl-filter-drawer__panel--dark .cl-filter-drawer__close:hover { background: rgba(255,255,255,0.1); }

.cl-filter-drawer__body {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem 0;
}

/* Filter groups (details/summary) */
.cl-filter-drawer__group {
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__group {
  border-color: rgba(255,255,255,0.08);
}
.cl-filter-drawer__group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.cl-filter-drawer__group-title::-webkit-details-marker { display: none; }
.cl-filter-drawer__chevron {
  transition: transform 0.2s ease;
}
.cl-filter-drawer__group[open] .cl-filter-drawer__chevron {
  transform: rotate(180deg);
}
.cl-filter-drawer__group-body {
  padding: 0 1.5rem 1rem;
}

/* Checkboxes */
.cl-filter-drawer__values {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.cl-filter-drawer__check-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0.375rem 0;
  font-size: 0.8125rem;
  cursor: pointer;
}
.cl-filter-drawer__checkbox {
  width: 16px; height: 16px;
  accent-color: #262320;
  flex-shrink: 0;
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__checkbox {
  accent-color: #f5f5f5;
}
.cl-filter-drawer__check-count {
  color: #a1a1aa;
  font-size: 0.75rem;
  margin-left: auto;
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__check-count {
  color: rgba(255,255,255,0.35);
}

/* Price range */
.cl-filter-drawer__price-range {
  display: flex;
  align-items: flex-end;
  gap: 0.75rem;
}
.cl-filter-drawer__price-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.75rem;
  font-weight: 500;
  flex: 1;
}
.cl-filter-drawer__price-input {
  padding: 0.5rem 0.625rem;
  font-size: 0.8125rem;
  font-family: inherit;
  border: 1.5px solid rgba(0,0,0,0.12);
  border-radius: 8px;
  background: #f9f9f7;
  color: inherit;
  width: 100%;
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__price-input {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.12);
}
.cl-filter-drawer__price-sep {
  color: #a1a1aa;
  padding-bottom: 0.5rem;
}

/* Footer */
.cl-filter-drawer__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.5rem;
  border-top: 1px solid rgba(0,0,0,0.08);
  gap: 1rem;
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__footer {
  border-color: rgba(255,255,255,0.1);
}
.cl-filter-drawer__clear {
  font-size: 0.8125rem;
  color: #71717a;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__clear {
  color: rgba(255,255,255,0.5);
}
.cl-filter-drawer__apply {
  flex: 1;
  max-width: 10rem;
  padding: 0.625rem 1.25rem;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #262320;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: background 0.2s;
}
.cl-filter-drawer__apply:hover { background: #2a2a2d; }
.cl-filter-drawer__panel--dark .cl-filter-drawer__apply {
  background: #f5f5f5;
  color: #262320;
}
.cl-filter-drawer__panel--dark .cl-filter-drawer__apply:hover {
  background: #e0e0e0;
}

/* Infinite scroll trigger */
.cl-subcats__infinite-trigger {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 2rem 0;
}
.cl-subcats__infinite-trigger[hidden] { display: none; }
.cl-subcats__infinite-spinner svg {
  animation: clInfSpin 0.7s linear infinite;
  color: #999;
}
.cl-subcats--dark .cl-subcats__infinite-spinner svg { color: rgba(255,255,255,0.4); }
@keyframes clInfSpin { to { transform: rotate(360deg); } }
.cl-subcats__infinite-text {
  font-size: 0.8125rem;
  color: #999;
  font-weight: 500;
}
.cl-subcats--dark .cl-subcats__infinite-text { color: rgba(255,255,255,0.4); }

/* Pagination */
.cl-subcats__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 2rem;
  font-size: 0.875rem;
}
.cl-subcats__page-btn {
  padding: 0.5rem 1.25rem;
  border-radius: 9999px;
  background: #262320;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.8125rem;
  transition: background 0.2s;
}
.cl-subcats__page-btn:hover { background: #2a2a2d; }
.cl-subcats__page-info { color: #666; font-weight: 500; }
.cl-subcats--dark .cl-subcats__page-btn { background: #f5f5f5; color: #262320; }
.cl-subcats--dark .cl-subcats__page-info { color: rgba(255,255,255,0.5); }
.cl-subcats__no-results {
  text-align: center;
  padding: 3rem 1rem;
  color: #666;
  font-size: 0.9375rem;
}
.cl-subcats__no-results a { color: #262320; font-weight: 600; text-decoration: underline; }
.cl-subcats--dark .cl-subcats__no-results { color: rgba(255,255,255,0.5); }
.cl-subcats--dark .cl-subcats__no-results a { color: #f5f5f5; }

@media (max-width: 749px) {
  .cl-subcats { padding-block: 1.25rem; }
  .cl-subcats__grid { gap: 0.75rem; }
  .cl-filter-drawer__panel { width: 85vw; }
}
/* END_SECTION:collection-subcategories */

/* START_SECTION:collection-subnav (INDEX:13) */
/* ══════════════════════════════════════
   Collection Sub-Navigation
   Design A = cards (image + label)
   Design B = pills (icon + label) — default
   ══════════════════════════════════════ */
/* Force the shopify-section wrapper to be transparent */
.shopify-section:has(.cl-subnav) {
  background: transparent !important;
}
.cl-subnav {
  padding-block: 1.25rem 0.5rem;
  background: transparent !important;
}
.cl-subnav__label {
  display: none; /* hidden on mobile/tablet */
}
.cl-subnav__container {
  max-width: 72rem;
  margin: 0 auto;
}

/* ── Track: horizontal scroll ── */
.cl-subnav__track {
  display: flex;
  gap: 0.625rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 0;
}
.cl-subnav__track::-webkit-scrollbar { display: none; }
.cl-subnav__track::after { content: ''; flex-shrink: 0; width: 0.25rem; }
@media (max-width: 749px) { .cl-subnav__track::after { width: 1.25rem; } }

/* ── Shared item base ── */
.cl-subnav__item {
  display: flex;
  text-decoration: none;
  scroll-snap-align: start;
  flex-shrink: 0;
}

/* ══════════════════════════════════════
   Design B: Pills (default)
   Mirrors megamenu room filter pills
   ══════════════════════════════════════ */
.cl-subnav--pills .cl-subnav__item {
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  border-radius: var(--radius-button);
  background: transparent;
  border: 1px solid #ccc;
  font-size: 12px;
  font-weight: 500;
  color: #666;
  letter-spacing: 0;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.cl-subnav--pills .cl-subnav__item:hover {
  background: #262320;
  color: #fff;
  border-color: #262320;
}
.cl-subnav--pills .cl-subnav__icon {
  width: 16px;
  height: 16px;
  object-fit: contain;
  flex-shrink: 0;
}
/* Active/current collection pill */
.cl-subnav--pills .cl-subnav__item[aria-current="page"],
.cl-subnav--pills .cl-subnav__item.is-active {
  background: #262320;
  color: #fff;
  border-color: #262320;
}

/* Pills — dark theme */
.cl-subnav--dark.cl-subnav--pills .cl-subnav__item {
  background: transparent;
  border-color: rgba(255,255,255,0.25);
  color: rgba(255,255,255,0.55);
}
.cl-subnav--dark.cl-subnav--pills .cl-subnav__item:hover {
  background: #fff;
  color: #262320;
  border-color: #fff;
  box-shadow: none;
}
.cl-subnav--dark.cl-subnav--pills .cl-subnav__item[aria-current="page"],
.cl-subnav--dark.cl-subnav--pills .cl-subnav__item.is-active {
  background: #fff;
  color: #262320;
  border-color: #fff;
}

/* ══════════════════════════════════════
   Design A: Cards (image + label)
   ══════════════════════════════════════ */
.cl-subnav--cards .cl-subnav__item {
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  width: 7.5rem;
}
.cl-subnav--cards .cl-subnav__img-wrap {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 0.75rem;
  overflow: hidden;
  background: #f4f4f5;
  border: 1px solid rgba(0,0,0,0.06);
}
.cl-subnav--cards .cl-subnav__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.cl-subnav--cards .cl-subnav__item:hover .cl-subnav__img {
  transform: scale(1.05);
}
.cl-subnav--cards .cl-subnav__img-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a1a1aa;
}
.cl-subnav--cards .cl-subnav__label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #262320;
  text-align: center;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

/* Cards — dark theme */
.cl-subnav--dark.cl-subnav--cards .cl-subnav__img-wrap {
  background: #1a1a1d;
  border-color: rgba(255,255,255,0.08);
}
.cl-subnav--dark.cl-subnav--cards .cl-subnav__label {
  color: #f5f5f5;
}
.cl-subnav--dark.cl-subnav--cards .cl-subnav__img-placeholder {
  color: rgba(255,255,255,0.3);
}

/* ── Desktop: boxed pill bar overlapping hero ── */
@media (min-width: 750px) {
  .cl-subnav {
    position: relative;
    z-index: 2;
    margin-top: -1.75rem;
    padding-block: 0;
    background: transparent;
    display: flex;
    justify-content: center;
  }
  .cl-subnav__container {
    display: inline-flex !important;
    align-items: center;
    gap: 0.75rem;
    max-width: 72rem;
    width: auto !important;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border-radius: var(--radius-button);
    padding: 0.375rem 1rem;
  }
  .cl-subnav__label {
    display: block;
    font-size: 0.5625rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted, #999);
    white-space: nowrap;
    flex-shrink: 0;
  }
  .cl-subnav--dark .cl-subnav__label {
    color: rgba(255,255,255,0.5);
  }
  .cl-subnav__track {
    justify-content: center;
    overflow: visible;
    gap: 0.5rem;
  }
  .cl-subnav--dark .cl-subnav__container {
    background: #1e1e21;
    border-color: rgba(255,255,255,0.1);
    box-shadow: 0 2px 12px rgba(0,0,0,0.3);
  }
}

/* ── Mobile ── */
@media (max-width: 749px) {
  .cl-subnav { padding-block: 1rem 0.25rem; }
  .cl-subnav__container.page-width { max-width: 100vw !important; padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; }
  .cl-subnav__track { padding-left: 1.25rem; padding-right: 1.25rem; overflow-x: auto; }
  .cl-subnav__track::after { content: ''; flex-shrink: 0; width: 1px; } /* ensures last pill isn't clipped */
  .cl-subnav--cards .cl-subnav__item { width: 5.5rem; }
  .cl-subnav--cards .cl-subnav__label { font-size: 0.6875rem; }
  .cl-subnav--pills .cl-subnav__item { font-size: 0.75rem; padding: 0.4375rem 0.875rem; }
}
/* END_SECTION:collection-subnav */

/* START_SECTION:collection-trust (INDEX:14) */
.cl-trust {
  padding-block: 3rem;
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.cl-trust--dark {
  background: #111118;
  border-color: rgba(255,255,255,0.06);
}
.cl-trust__container {
  max-width: 72rem;
  margin: 0 auto;
}
.cl-trust__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 2rem;
}
.cl-trust__item {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.cl-trust__icon {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-foreground, #262320);
}
.cl-trust--dark .cl-trust__icon { color: #f5f5f5; }
.cl-trust__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin: 0;
  line-height: 1.3;
}
.cl-trust--dark .cl-trust__title { color: #f5f5f5; }
.cl-trust__desc {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-muted, #71717a);
  margin: 0.25rem 0 0;
}
.cl-trust--dark .cl-trust__desc { color: rgba(255,255,255,0.5); }

@media (max-width: 749px) {
  .cl-trust { padding-block: 2rem; }
  .cl-trust__grid { grid-template-columns: 1fr; gap: 1.5rem; }
}
/* END_SECTION:collection-trust */

/* START_SECTION:collection-video (INDEX:15) */
.cl-video {
  padding-block: 4rem;
}
.cl-video--dark {
  background: #1e1e21;
}
.cl-video__container {
  max-width: 72rem;
  margin: 0 auto;
}
.cl-video__layout {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 3rem;
  align-items: center;
}
.cl-video__heading {
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0 0 1rem;
  line-height: 1.15;
}
.cl-video--dark .cl-video__heading { color: #f5f5f5; }
.cl-video__description {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--color-text-muted, #555);
}
.cl-video--dark .cl-video__description { color: rgba(255,255,255,0.65); }
.cl-video__description p { margin: 0 0 0.75rem; }
.cl-video__trust-point {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-foreground, #262320);
  margin-block-start: 0.625rem;
}
.cl-video--dark .cl-video__trust-point { color: #f5f5f5; }
.cl-video__trust-point svg { color: #22c55e; flex-shrink: 0; }

/* ── Player ── */
.cl-video__player {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #0d0d14;
}
.cl-video__native {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cl-video__poster {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.cl-video__player:hover .cl-video__poster { transform: scale(1.02); }
.cl-video__play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: none;
  border: none;
  cursor: pointer;
  z-index: 2;
  transition: transform 0.2s;
}
.cl-video__play-btn:hover { transform: translate(-50%, -50%) scale(1.08); }
.cl-video__play-btn[hidden] { display: none; }

.cl-video__controls {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, transparent 100%);
  padding: 1.5rem 0.75rem 0.5rem;
}
.cl-video__controls[hidden] { display: none; }
.cl-video__progress {
  width: 100%;
  height: 3px;
  background: rgba(255,255,255,0.25);
  border-radius: 2px;
  cursor: pointer;
  margin-bottom: 0.5rem;
}
.cl-video__progress-bar {
  height: 100%;
  background: #fff;
  width: 0%;
  border-radius: 2px;
  transition: width 0.15s linear;
}
.cl-video__controls-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.cl-video__time {
  font-size: 0.6875rem;
  color: rgba(255,255,255,0.8);
  font-variant-numeric: tabular-nums;
}
.cl-video__controls-right {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.cl-video__speed,
.cl-video__mute,
.cl-video__fullscreen {
  background: rgba(255,255,255,0.15);
  border: none;
  border-radius: 0.25rem;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.cl-video__speed {
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.25rem 0.5rem;
  font-family: inherit;
  min-width: 2rem;
}
.cl-video__mute,
.cl-video__fullscreen {
  width: 28px;
  height: 28px;
  padding: 0;
}
.cl-video__speed:hover,
.cl-video__mute:hover,
.cl-video__fullscreen:hover { background: rgba(255,255,255,0.3); }

.cl-video__iframe-wrap {
  position: absolute;
  inset: 0;
}
.cl-video__iframe-wrap iframe {
  width: 100%;
  height: 100%;
  border: none;
}

@media (max-width: 749px) {
  .cl-video { padding-block: 2.5rem; }
  .cl-video__layout { grid-template-columns: 1fr; gap: 1.5rem; }
  .cl-video__player { border-radius: 0.75rem; }
  .cl-video__play-btn svg { width: 48px; height: 48px; }
}
/* END_SECTION:collection-video */

/* START_SECTION:contact-form (INDEX:16) */
.contact-page {
  padding: 3rem 1.5rem 4rem;
}
.contact-page__container {
  max-width: 72rem;
  margin: 0 auto;
}

/* Help Center nudge */
.contact-page__help-nudge {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 1rem;
  margin-bottom: 3rem;
}
.contact-page__help-icon { flex-shrink: 0; color: #4aaf47; }
.contact-page__help-text { flex: 1; }
.contact-page__help-title { font-weight: 600; font-size: 0.9375rem; margin: 0 0 0.25rem; }
.contact-page__help-desc { font-size: 0.8125rem; color: #666; margin: 0; }
.contact-page__help-desc a { color: #4aaf47; font-weight: 600; }
.contact-page__help-btn {
  flex-shrink: 0;
  padding: 0.5rem 1.25rem;
  background: #262320;
  color: #fff;
  border-radius: var(--radius-button);
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s;
}
.contact-page__help-btn:hover { background: #2a2a2d; }

/* Grid */
.contact-page__grid {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 3rem;
  align-items: start;
}

/* Form */
.contact-page__form-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.5rem;
}
.contact-page__form-desc {
  color: #666;
  font-size: 0.875rem;
  margin: 0 0 2rem;
}
.contact-page__field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.contact-page__field {
  margin-bottom: 1.25rem;
}
.contact-page__label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  margin-bottom: 0.375rem;
  color: #262320;
}
.contact-page__required { color: #ef4444; }
.contact-page__optional { color: #999; font-weight: 400; }
.contact-page__input,
.contact-page__select,
.contact-page__textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  font-family: inherit;
  border: 1.5px solid rgba(0,0,0,0.12);
  border-radius: 0.625rem;
  background: #fff;
  color: #262320;
  transition: border-color 0.2s, box-shadow 0.2s;
  outline: none;
  box-sizing: border-box;
}
.contact-page__input:focus,
.contact-page__select:focus,
.contact-page__textarea:focus {
  border-color: #E16C47;
  box-shadow: 0 0 0 3px rgba(45,138,35,0.1);
}
.contact-page__input::placeholder,
.contact-page__textarea::placeholder { color: #aaa; }
.contact-page__select { cursor: pointer; appearance: none; background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; padding-right: 2.5rem; }
.contact-page__textarea { resize: vertical; min-height: 120px; }
.contact-page__submit {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 2rem;
  background: #262320;
  color: #fff;
  border: none;
  border-radius: var(--radius-button);
  font-size: 0.9375rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}
.contact-page__submit:hover { background: #2a2a2d; transform: translateY(-1px); }

/* Success / Error */
.contact-page__success {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 0.75rem;
  margin-bottom: 1.5rem;
  font-size: 0.875rem;
  color: #166534;
}
.contact-page__error {
  padding: 1rem 1.25rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 0.75rem;
  margin-bottom: 1.5rem;
  font-size: 0.875rem;
  color: #991b1b;
}

/* Info sidebar */
.contact-page__info-col {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.contact-page__info-card {
  padding: 1.25rem;
  background: #f9f9f7;
  border-radius: 1rem;
  border: 1px solid rgba(0,0,0,0.06);
}
.contact-page__info-icon { margin-bottom: 0.5rem; color: #666; }
.contact-page__info-card h3 { font-size: 0.9375rem; font-weight: 600; margin: 0 0 0.375rem; }
.contact-page__info-card p { font-size: 0.8125rem; color: #666; margin: 0; line-height: 1.6; }
.contact-page__info-card a { color: #4aaf47; }
.contact-page__quick-links h3 { font-size: 0.9375rem; font-weight: 600; margin: 0 0 0.75rem; }
.contact-page__quick-links ul { list-style: none; padding: 0; margin: 0; }
.contact-page__quick-links li {
  margin-bottom: 0.375rem;
  border-left: 2px solid #e5e5e5;
  padding-left: 0.75rem;
  transition: border-color 0.2s;
}
.contact-page__quick-links li:hover { border-left-color: #4aaf47; }
.contact-page__quick-links a {
  font-size: 0.8125rem;
  color: #4aaf47;
  text-decoration: none;
  transition: opacity 0.2s;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.375rem 0;
}
.contact-page__quick-links a svg { flex-shrink: 0; opacity: 0.5; transition: opacity 0.2s, transform 0.2s; }
.contact-page__quick-links a:hover svg { opacity: 1; transform: translateX(2px); }
.contact-page__quick-links a:hover { opacity: 0.85; }

/* Dark mode */
.theme-dark .contact-page__help-nudge { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); }
.theme-dark .contact-page__quick-links li { border-left-color: rgba(255,255,255,0.12); }
.theme-dark .contact-page__quick-links li:hover { border-left-color: #4aaf47; }
.theme-dark .contact-page__help-title { color: #f5f5f5; }
.theme-dark .contact-page__form-title { color: #f5f5f5; }
.theme-dark .contact-page__label { color: #f5f5f5; }
.theme-dark .contact-page__input,
.theme-dark .contact-page__select,
.theme-dark .contact-page__textarea { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.12); color: #f5f5f5; }
.theme-dark .contact-page__info-card { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
.theme-dark .contact-page__info-card h3 { color: #f5f5f5; }
.theme-dark .contact-page__info-card p { color: rgba(255,255,255,0.6); }
.theme-dark .contact-page__quick-links h3 { color: #f5f5f5; }

@media (max-width: 749px) {
  .contact-page__grid { grid-template-columns: 1fr; gap: 2rem; }
  .contact-page__field-row { grid-template-columns: 1fr; }
  .contact-page__help-nudge { flex-direction: column; text-align: center; }
  .contact-page__info-col { order: -1; }
}
/* END_SECTION:contact-form */

/* START_SECTION:footer (INDEX:17) */
/* ── Footer Base ── */
  .footer-wrapper {
    background: #262320;
    color: #fff;
    font-family: inherit;
  }

  .nf-footer__inner {
    max-width: 72rem;
    margin: 0 auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  /* ── Top: Newsletter + Contact ── */
  .nf-footer__top {
    padding: 3rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }

  .nf-footer__top-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .nf-footer__newsletter-heading {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    line-height: 1.2;
  }

  .nf-footer__newsletter-sub {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.6);
    margin: 0 0 1.25rem;
    line-height: 1.5;
  }

  .nf-footer__newsletter-form { max-width: 480px; }

  .nf-footer__newsletter-field {
    display: flex;
    gap: 0.5rem;
  }

  .nf-footer__newsletter-input {
    flex: 1;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 0.75rem;
    font-size: 0.875rem;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-family: inherit;
    transition: border-color 200ms ease;
  }

  .nf-footer__newsletter-input::placeholder { color: rgba(255, 255, 255, 0.4); }

  .nf-footer__newsletter-input:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(45, 138, 35, 0.4);
    border-color: #E16C47;
  }

  .nf-footer__newsletter-btn {
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 0.75rem;
    background: #2e2e3a;
    color: #fff;
    font-size: 0.875rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 200ms ease;
  }

  .nf-footer__newsletter-btn:hover { opacity: 0.9; }

  /* Legal disclaimer */
  .nf-footer__newsletter-legal {
    font-size: 0.625rem;
    color: rgba(255, 255, 255, 0.3);
    margin: 0.625rem 0 0;
    line-height: 1.5;
    max-width: 480px;
  }
  .nf-footer__newsletter-legal-link {
    color: rgba(255, 255, 255, 0.45);
    text-decoration: underline;
    text-underline-offset: 1px;
  }
  .nf-footer__newsletter-legal-link:hover {
    color: rgba(255, 255, 255, 0.7);
  }

  /* Klaviyo status */
  .nf-footer__newsletter-status {
    font-size: 0.75rem;
    margin: 0.5rem 0 0;
    line-height: 1.4;
  }
  .nf-footer__newsletter-status[hidden] { display: none; }
  .nf-footer__newsletter-status--success { color: #E16C47; }
  .nf-footer__newsletter-status--error { color: #E16C47; }

  /* ── Contact Card ── */
  .nf-footer__contact-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.75rem;
    padding: 1.25rem;
  }

  .nf-footer__contact-heading { font-size: 0.875rem; font-weight: 600; margin: 0 0 1rem; color: #fff; }

  .nf-footer__contact-list { display: flex; flex-direction: column; gap: 0.5rem; margin: 0 0 0.75rem; }

  .nf-footer__contact-item {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.625rem; border-radius: 0.5rem;
    text-decoration: none; color: inherit;
    transition: background 200ms ease;
  }

  .nf-footer__contact-item:hover { background: rgba(255, 255, 255, 0.05); }

  .nf-footer__contact-icon-wrap {
    display: flex; align-items: center; justify-content: center;
    width: 2.25rem; height: 2.25rem; border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.7);
    flex-shrink: 0; transition: background 200ms ease;
  }

  .nf-footer__contact-item:hover .nf-footer__contact-icon-wrap { background: rgba(255, 255, 255, 0.15); }

  .nf-footer__contact-text { display: flex; flex-direction: column; gap: 0.125rem; }
  .nf-footer__contact-label { font-size: 0.625rem; color: rgba(255, 255, 255, 0.4); line-height: 1; }
  .nf-footer__contact-value { font-size: 0.75rem; font-weight: 500; color: rgba(255, 255, 255, 0.9); line-height: 1.3; }

  /* ── Live Chat Button ── */
  .nf-footer__live-chat-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
    width: 100%; padding: 0.625rem 1.5rem;
    background: #E16C47; color: #fff; border-radius: var(--radius-button);
    font-size: 0.8125rem; font-weight: 500; text-decoration: none;
    transition: all 200ms ease; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  }

  .nf-footer__live-chat-btn:hover { background: #256e1d; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15); }
  .nf-footer__chat-chevron { transition: transform 200ms ease; }
  .nf-footer__live-chat-btn:hover .nf-footer__chat-chevron { transform: translateX(2px); }

  /* ── Hours ── */
  .nf-footer__contact-hours-wrap { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid rgba(255, 255, 255, 0.1); }
  .nf-footer__contact-hours { font-size: 0.625rem; color: rgba(255, 255, 255, 0.3); margin: 0; text-align: center; }

  /* ── Middle: Column Grid ── */
  .nf-footer__middle { padding: 3rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }

  .nf-footer__columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem 1.5rem;
  }

  .nf-footer__col--brand { grid-column: 1 / -1; }

  .nf-footer__logo-img { height: 2.5rem; width: auto; margin-bottom: 1rem; filter: brightness(0) invert(1); }
  .nf-footer__tagline { font-size: 0.75rem; color: rgba(255, 255, 255, 0.5); margin: 0 0 1rem; line-height: 1.6; }
  .nf-footer__social { display: flex; gap: 0.75rem; }

  .nf-footer__social-link {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem; border-radius: 50%;
    background: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.6);
    transition: background 200ms ease, color 200ms ease;
  }

  .nf-footer__social-link:hover { background: rgba(255, 255, 255, 0.2); color: #fff; }
  .nf-footer__col-heading { font-size: 0.875rem; font-weight: 600; color: rgba(255, 255, 255, 0.9); margin: 0 0 1rem; }

  .nf-footer__links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.625rem; }

  .nf-footer__link {
    font-size: 0.75rem; color: rgba(255, 255, 255, 0.5); text-decoration: none;
    transition: color 200ms ease; line-height: 1.4; position: relative; width: fit-content;
  }

  .nf-footer__link::after {
    content: ''; position: absolute; bottom: -1px; left: 0;
    width: 0; height: 1px; background: #fff; transition: width 0.25s ease;
  }

  .nf-footer__link:hover { color: #fff; }
  .nf-footer__link:hover::after { width: 100%; }

  /* ── Payment Badges (inside last column) ── */
  .nf-footer__payments-wrap { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, 0.1); }
  .nf-footer__payments-label { display: block; font-size: 0.625rem; color: rgba(255, 255, 255, 0.3); margin-bottom: 0.5rem; }
  .nf-footer__payments { display: flex; flex-wrap: wrap; gap: 0.375rem; }
  .nf-footer__payment-icon { display: inline-block; height: 1.5rem; width: auto; border-radius: 0.25rem; overflow: hidden; vertical-align: middle; }

  /* ── Bottom Bar ── */
  .nf-footer__bottom { padding: 1rem 0; border-top: 1px solid rgba(255, 255, 255, 0.1); }

  .nf-footer__bottom-row { display: flex; flex-direction: column; gap: 0.5rem; align-items: center; text-align: center; }
  .nf-footer__copyright { font-size: 0.75rem; color: rgba(255, 255, 255, 0.35); }
  .nf-footer__legal { display: flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; color: rgba(255, 255, 255, 0.35); flex-wrap: wrap; justify-content: center; }
  .nf-footer__legal-dot { color: rgba(255, 255, 255, 0.25); user-select: none; }
  .nf-footer__legal-link { color: rgba(255, 255, 255, 0.35); text-decoration: none; transition: color 200ms ease; }
  .nf-footer__legal-link:hover { color: rgba(255, 255, 255, 0.7); }

  /* ── Hover underline override ── */
  .nf-footer__contact-item:hover,
  .nf-footer__live-chat-btn:hover,
  .nf-footer__social-link:hover,
  .nf-footer__link:hover,
  .nf-footer__legal-link:hover {
    text-decoration: none;
  }

  /* ── Responsive ── */
  @media screen and (min-width: 768px) {
    .nf-footer__top-grid { grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: start; }
    .nf-footer__columns { grid-template-columns: repeat(3, 1fr); }
    .nf-footer__col--brand { grid-column: 1 / -1; }
    .nf-footer__bottom-row { flex-direction: row; justify-content: space-between; align-items: center; text-align: left; }
  }

  @media screen and (min-width: 1024px) {
    .nf-footer__columns { grid-template-columns: 1.4fr repeat(5, 1fr); gap: 2rem; }
    .nf-footer__col--brand { grid-column: auto; }
  }
/* END_SECTION:footer */

/* START_SECTION:header (INDEX:18) */
/* ══════════════════════════════════════════
   DESKTOP HEADER
   ══════════════════════════════════════════ */

/* Prevent FOUC: hide segment navs until JS moves them into the header */
nav.nf-segment-nav { opacity: 0; transition: opacity 0.15s ease; }
div.nf-segment-right-nav { opacity: 0; transition: opacity 0.15s ease; }
div.nf-segment-mobile-menu { opacity: 0; }
.nf-header__inner nav.nf-segment-nav:not([hidden]) { opacity: 1; }
.nf-header__actions div.nf-segment-right-nav:not([hidden]) { opacity: 1; }
.nf-mobile-menu__sections div.nf-segment-mobile-menu:not([hidden]) { opacity: 1; }

body.search-drawer-open { overflow: hidden; }

.nf-header--desktop { display: none; background: #fff; border-bottom: 1px solid #e5e5e5; position: sticky; top: 0; z-index: 50; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.nf-header__inner { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 2rem; display: flex; align-items: center; height: 56px; }
.nf-header__logo { display: inline-flex; align-items: center; text-decoration: none; margin-right: 2rem; flex-shrink: 0; }
.nf-header__logo-img { height: 32px; width: auto; }
.nf-header__logo-img--mobile { height: 28px; }
.nf-header__nav { flex: 1; }
.nf-header__nav-list { display: flex; align-items: center; gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
.nf-header__actions-segment { display: inline-flex; align-items: center; gap: 0; }
.nf-header__actions-segment[hidden] { display: none !important; }

/* Nav links — NO ::after underline (React uses opacity dimming instead) */
.nf-header__nav-link { font-size: 14px; font-weight: 500; color: #666; text-decoration: none; padding: 6px 0; background: none; border: none; cursor: pointer; font-family: inherit; transition: opacity 0.2s, color 0.2s; }
.nf-header__nav-link:hover { color: #1a1a1a; }

/* Opacity dimming: when any nav item is hovered, non-hovered items dim */
.nf-header__nav-list:hover .nf-header__nav-link { opacity: 0.35; }
.nf-header__nav-list:hover .nf-header__nav-link:hover { opacity: 1; color: #1a1a1a; }
.nf-header__nav-link--sale { color: #E16C47; }
.nf-header__nav-list:hover .nf-header__nav-link--sale:hover { color: #E16C47; }
.nf-header__nav-link--mega-active { opacity: 1 !important; color: #1a1a1a; }
.nf-header__nav-link--mega-active.nf-header__nav-link--sale { color: #E16C47; }

.nf-header__sale-badge { position: absolute; top: -8px; right: -22px; background: #E16C47; color: #fff; font-size: 8px; font-weight: 700; padding: 1px 4px; border-radius: 999px; line-height: 1.2; }
.nf-header__nav-item--sale { position: relative; }

/* Right Actions */
.nf-header__actions { display: flex; align-items: center; gap: 1.5rem; margin-left: auto; }
.nf-header__quiz-cta { display: inline-block; background: var(--color-accent, #E16C47); color: #F3F1E9; border-radius: 9999px; padding: 0.45em 1.2em; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.02em; text-decoration: none; white-space: nowrap; transition: opacity 0.2s ease; font-family: var(--font-heading, inherit); }
.nf-header__quiz-cta:hover { opacity: 0.85; }
@media (max-width: 767px) { .nf-header__quiz-cta { display: none; } }
.nf-header__action-btn { display: inline-flex; align-items: center; gap: 0.375rem; background: none; border: none; cursor: pointer; color: #1a1a1a; padding: 0; text-decoration: none; font-family: inherit; font-size: 14px; }
.nf-header__action-btn:hover { opacity: 0.7; }
.nf-header__help-text { font-size: 14px; font-weight: 500; text-transform: none; letter-spacing: normal; }
.nf-header__flag { width: 20px; height: 14px; border-radius: 2px; object-fit: cover; }
.nf-header__country-code { font-size: 11px; font-weight: 500; }
.nf-header__cart { position: relative; display: inline-flex; align-items: center; color: #1a1a1a; text-decoration: none; background: none; border: none; cursor: pointer; padding: 0; font-family: inherit; }
.nf-header__cart:hover { opacity: 0.7; }
.nf-header__cart-badge { position: absolute; top: -6px; right: -6px; width: 16px; height: 16px; border-radius: 50%; background: #E16C47; color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; line-height: 1; }

/* ══════════════════════════════════════════
   MEGA MENU SYSTEM
   ══════════════════════════════════════════ */
.nf-mega-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 40; opacity: 0; transition: opacity 0.2s ease; }
.nf-mega-backdrop[hidden] { display: none; }
.nf-mega-backdrop.is-visible { opacity: 1; }

.nf-mega-container { position: fixed; left: 0; right: 0; z-index: 45; overflow: hidden; max-height: 0; transition: max-height 0.28s cubic-bezier(0.16, 1, 0.3, 1); }
.nf-mega-container[hidden] { display: none; }
.nf-mega-container.is-open { max-height: 600px; }

.nf-mega[hidden] { display: none; }

/* Shared layout */
.nf-mega__layout { display: flex; min-height: 400px; background: #F3F1E9; }
.nf-mega__hero { width: 380px; flex-shrink: 0; position: relative; overflow: hidden; background: #171717; display: block; text-decoration: none; color: inherit; cursor: pointer; }
.nf-mega__hero--narrow { width: 320px; }
.nf-mega__hero-img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
.nf-mega__hero:hover .nf-mega__hero-img { transform: scale(1.04); }
.nf-mega__hero-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0.1), transparent); }
.nf-mega__hero-text { position: absolute; bottom: 0; left: 0; right: 0; padding: 1.5rem; }
.nf-mega__hero-title { color: #fff; font-size: 20px; font-weight: 700; letter-spacing: -0.01em; text-shadow: 0 2px 8px rgba(0,0,0,0.3); margin: 0; }
.nf-mega__hero-tagline { color: rgba(255,255,255,0.8); font-size: 13px; margin-top: 4px; text-shadow: 0 1px 4px rgba(0,0,0,0.2); }

/* Content area */
.nf-mega__content { flex: 1; padding: 20px 32px; display: flex; flex-direction: column; min-width: 0; }

/* Tabs */
.nf-mega__tabs-row { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 20px; border-bottom: 1px solid #e5e5e5; }
.nf-mega__tabs { display: flex; align-items: center; gap: 2px; position: relative; }
.nf-mega__tab { padding-bottom: 10px; padding-left: 12px; padding-right: 12px; font-size: 13px; font-weight: 500; color: #999; background: none; border: none; cursor: pointer; font-family: inherit; position: relative; white-space: nowrap; transition: color 0.2s; }
.nf-mega__tab:hover { color: #555; }
.nf-mega__tab--active { color: #262320; }
/* Remove static ::after — replaced by sliding indicator */

/* Sliding tab indicator — mimics Framer Motion layoutId spring animation */
.nf-mega__tab-indicator { position: absolute; bottom: 0; left: 0; height: 2px; background: #262320; border-radius: 1px; transition: transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94), width 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color 0.3s ease; pointer-events: none; will-change: transform, width; }

.nf-mega__quick-links { display: flex; align-items: center; gap: 4px; padding-bottom: 8px; }
.nf-mega__quick-pill { padding: 4px 10px; font-size: 11px; font-weight: 500; border-radius: 999px; background: #f0f0f0; color: #999; border: 1px solid transparent; cursor: pointer; font-family: inherit; white-space: nowrap; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.nf-mega__quick-pill:hover,
.nf-mega__quick-pill--active { background: #262320; color: #fff; border-color: #262320; }

/* ── Wellness dark mode ── */
.nf-mega__layout--dark { background: #0f0f0f; transition: background 0.3s ease; }
.nf-mega__layout--dark .nf-mega__tabs-row { border-bottom-color: rgba(255,255,255,0.1); }
.nf-mega__layout--dark .nf-mega__tab { color: rgba(255,255,255,0.4); }
.nf-mega__layout--dark .nf-mega__tab:hover { color: rgba(255,255,255,0.7); }
.nf-mega__layout--dark .nf-mega__tab--active { color: #fbbf24; }
.nf-mega__layout--dark .nf-mega__tab-indicator { background: #fbbf24; }
.nf-mega__layout--dark .nf-mega__quick-pill { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.4); border-color: transparent; }
.nf-mega__layout--dark .nf-mega__quick-pill:hover,
.nf-mega__layout--dark .nf-mega__quick-pill--active { background: #f59e0b; color: #000; border-color: #f59e0b; }
.nf-mega__layout--dark .nf-mega__product-card { background: #1a1a1a; border-color: rgba(255,255,255,0.1); }
.nf-mega__layout--dark .nf-mega__product-card:hover { border-color: rgba(255,255,255,0.25); }
.nf-mega__layout--dark .nf-mega__product-name { color: rgba(255,255,255,0.9); }
.nf-mega__layout--dark .nf-mega__product-card:hover .nf-mega__product-name { color: #fbbf24; }
.nf-mega__layout--dark .nf-mega__product-price { color: #fff; }
.nf-mega__layout--dark .nf-mega__product-compare { color: rgba(255,255,255,0.4); }
.nf-mega__layout--dark .nf-mega__product-img-wrap { background: #1a1a1a; }
.nf-mega__layout--dark .nf-mega__see-all { color: rgba(255,255,255,0.6); }
.nf-mega__layout--dark .nf-mega__see-all:hover { color: #fbbf24; }
.nf-mega__layout--dark .nf-mega__cta-btn { background: #fbbf24; color: #000; }
.nf-mega__layout--dark .nf-mega__cta-btn:hover { background: #f59e0b; }
.nf-mega__layout--dark .nf-mega__products-scroll { scrollbar-color: rgba(255,255,255,0.2) transparent; }

/* Product cards — 1:1 match with React reference */
.nf-mega__scroll-wrap { position: relative; flex: 1; margin-bottom: 16px; margin-right: -32px; }
.nf-mega__products-scroll { overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; padding-right: 32px; }
.nf-mega__products-scroll::-webkit-scrollbar { display: none; }
.nf-mega__products-row { display: flex; gap: 12px; }

/* Scroll gradient fades */
.nf-mega__scroll-fade { position: absolute; top: 0; bottom: 0; width: 4rem; z-index: 3; pointer-events: none; transition: opacity 0.25s; }
.nf-mega__scroll-fade--left { left: 0; background: linear-gradient(to right, #F3F1E9, transparent); opacity: 0; }
.nf-mega__scroll-fade--right { right: 0; background: linear-gradient(to left, #F3F1E9, transparent); }
.nf-mega__scroll-fade.is-hidden { opacity: 0; }
/* Wellness dark mode fades */
.nf-mega__layout--dark .nf-mega__scroll-fade--left { background: linear-gradient(to right, #0f0f0f, transparent); }
.nf-mega__layout--dark .nf-mega__scroll-fade--right { background: linear-gradient(to left, #0f0f0f, transparent); }
/* Support non-layout fades */
.nf-mega__support .nf-mega__scroll-fade--left { background: linear-gradient(to right, #fff, transparent); }
.nf-mega__support .nf-mega__scroll-fade--right { background: linear-gradient(to left, #fff, transparent); }

/* Scroll arrows */
.nf-mega__scroll-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 4; width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 1px solid #e5e5e5; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,0.1); transition: opacity 0.25s, background 0.2s, box-shadow 0.2s; color: #262320; }
.nf-mega__scroll-arrow:hover { background: #f5f5f5; box-shadow: 0 2px 8px rgba(0,0,0,0.15); }
.nf-mega__scroll-arrow--prev { left: -4px; }
.nf-mega__scroll-arrow--next { right: 4px; }
.nf-mega__scroll-arrow.is-hidden { opacity: 0; pointer-events: none; }
/* Wellness dark mode arrows */
.nf-mega__layout--dark .nf-mega__scroll-arrow { background: #2a2a2a; border-color: rgba(255,255,255,0.15); color: #fff; }
.nf-mega__layout--dark .nf-mega__scroll-arrow:hover { background: #3a3a3a; }
.nf-mega__product-card { display: block; width: 180px; flex-shrink: 0; text-decoration: none; color: inherit; padding: 12px; border-radius: 8px; border: 1px solid #e5e5e5; background: #fff; transition: border-color 0.2s ease, box-shadow 0.2s ease; }
.nf-mega__product-card:hover { border-color: #262320; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); }
.nf-mega__product-img-wrap { position: relative; width: 100%; aspect-ratio: 1; border-radius: 6px; overflow: hidden; background: #e8e8e4; margin-bottom: 8px; }
.nf-mega__product-img { width: 100%; height: 100%; object-fit: cover; }
.nf-mega__product-badge { position: absolute; top: 8px; right: 8px; background: #6b7280; color: #fff; font-size: 9px; font-weight: 700; padding: 2px 8px; border-radius: 999px; text-transform: uppercase; }
.nf-mega__product-badge--new { background: #8b5cf6; }
.nf-mega__product-badge--bestseller { background: #3b82f6; }
.nf-mega__product-badge--popular { background: #3b82f6; }
.nf-mega__product-badge--limited { background: #ef4444; }
.nf-mega__product-badge--sale { background: #E16C47; }
.nf-mega__product-name { font-size: 13px; font-weight: 600; color: #262320; margin: 0 0 2px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.2s; }
.nf-mega__product-card:hover .nf-mega__product-name { color: #3b82f6; }
.nf-mega__product-price { font-size: 15px; font-weight: 700; color: #262320; margin: 0; }
.nf-mega__product-price-row { display: flex; align-items: center; gap: 6px; }
.nf-mega__product-compare { font-size: 11px; color: #999; text-decoration: line-through; }
.nf-mega__product-review { display: flex; align-items: center; gap: 3px; margin: 1px 0; color: #262320; }
.nf-mega__product-review svg { flex-shrink: 0; }
.nf-mega__product-review span { font-size: 11px; color: #71717a; line-height: 1; }
.nf-mega__layout--dark .nf-mega__product-review { color: #f5f5f5; }
.nf-mega__layout--dark .nf-mega__product-review span { color: rgba(255,255,255,0.55); }

/* Bottom actions */
.nf-mega__bottom { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }
.nf-mega__see-all { font-size: 13px; font-weight: 500; color: #262320; text-decoration: none; }
.nf-mega__see-all:hover { text-decoration: underline; }
.nf-mega__cta-btn { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; background: #262320; color: #fff; padding: 10px 24px; border-radius: 999px; text-decoration: none; transition: background 0.2s, box-shadow 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.nf-mega__cta-btn:hover { background: #111122; box-shadow: 0 4px 12px rgba(0,0,0,0.15); }

/* ── Quiz card inside mega menu ── */
.nf-mega__quiz-card { display: flex; align-items: center; gap: 12px; background: var(--color-yellow, #F3E891); border-radius: 12px; padding: 14px 18px; margin-top: 16px; text-decoration: none; transition: opacity 0.2s ease; }
.nf-mega__quiz-card:hover { opacity: 0.88; }
.nf-mega__quiz-card-icon { width: 32px; height: 32px; flex-shrink: 0; opacity: 0.7; }
.nf-mega__quiz-card-text { display: flex; flex-direction: column; gap: 2px; }
.nf-mega__quiz-card-heading { font-family: var(--font-heading, inherit); font-weight: 600; font-size: 0.85rem; color: #262320; letter-spacing: -0.01em; }
.nf-mega__quiz-card-link { font-size: 0.78rem; color: #262320; opacity: 0.75; font-weight: 500; }

/* ── FILTER PILLS (Spaces/Rooms) ── */
.nf-mega__filter-pills { display: flex; gap: 6px; margin-bottom: 20px; flex-wrap: wrap; }
.nf-mega__filter-pill { padding: 5px 14px; font-size: 12px; font-weight: 500; color: #666; background: transparent; border: 1px solid #ccc; border-radius: 999px; cursor: pointer; font-family: inherit; white-space: nowrap; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.nf-mega__filter-pill:hover { background: #262320; color: #fff; border-color: #262320; }
.nf-mega__filter-pill--active { background: #262320; color: #fff; border-color: #262320; }

/* ── BUNDLES MEGA ── */
.nf-mega__bundles-layout { display: flex; min-height: 380px; background: #F3F1E9; }
.nf-mega__bundles-list { flex: 1; padding: 20px 24px; display: flex; flex-direction: column; }
.nf-mega__bundles-heading { font-size: 13px; font-weight: 600; color: #262320; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 12px; }
.nf-mega__bundles-items { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.nf-mega__bundle-item { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 8px; background: #fff; border: 1px solid #e5e5e5; text-decoration: none; color: inherit; transition: all 0.2s ease; cursor: pointer; }
.nf-mega__bundle-item:hover { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); border-color: #262320; }
.nf-mega__bundle-chevron { flex-shrink: 0; color: #71717a; opacity: 0; transition: opacity 0.2s; }
.nf-mega__bundle-item:hover .nf-mega__bundle-chevron { opacity: 1; }
.nf-mega__bundle-thumb { width: 48px; height: 48px; border-radius: 6px; overflow: hidden; flex-shrink: 0; background: #f5f5f5; border: 1px solid #e5e5e5; }
.nf-mega__bundle-thumb img { width: 100%; height: 100%; object-fit: cover; }
.nf-mega__bundle-info { flex: 1; min-width: 0; }
.nf-mega__bundle-title-row { display: flex; align-items: center; gap: 8px; }
.nf-mega__bundle-title-row h4 { font-size: 12px; font-weight: 600; color: #262320; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nf-mega__bundle-tag { font-size: 8px; font-weight: 600; padding: 2px 6px; border-radius: 4px; background: #262320; color: #fff; text-transform: uppercase; white-space: nowrap; flex-shrink: 0; }
.nf-mega__bundle-desc { font-size: 10px; color: #71717a; margin: 2px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nf-mega__bundle-pricing { text-align: right; flex-shrink: 0; }
.nf-mega__bundle-price { font-size: 13px; font-weight: 700; color: #262320; display: block; }
.nf-mega__bundle-compare { font-size: 10px; color: #71717a; text-decoration: line-through; }
.nf-mega__bundles-view-all { font-size: 12px; font-weight: 500; color: #262320; text-decoration: none; margin-top: 12px; }
.nf-mega__bundles-view-all:hover { text-decoration: underline; }

/* Build Your Own */
.nf-mega__build-own { width: 300px; flex-shrink: 0; padding: 20px; }
.nf-mega__build-card { display: block; height: 100%; border-radius: 12px; overflow: hidden; position: relative; background: #262320; text-decoration: none; color: #fff; transition: box-shadow 0.3s; }
.nf-mega__build-card:hover { box-shadow: 0 8px 32px rgba(0,0,0,0.2); }
.nf-mega__build-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.4; }
.nf-mega__build-card:hover .nf-mega__build-bg { opacity: 0.5; }
.nf-mega__build-gradient { position: absolute; inset: 0; background: linear-gradient(to top, rgba(15,15,30,1), rgba(15,15,30,0.8), transparent); }
.nf-mega__build-content { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 24px; }
.nf-mega__build-label { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.nf-mega__build-label svg { color: #c8a942; }
.nf-mega__build-label span { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #c8a942; }
.nf-mega__build-title { font-size: 24px; font-weight: 900; line-height: 1.1; margin: 0 0 8px; }
.nf-mega__build-desc { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.5; }
.nf-mega__build-desc strong { color: #fff; }
.nf-mega__build-tiers { display: flex; flex-direction: column; gap: 8px; margin: 20px 0; }
.nf-mega__build-tier { display: flex; align-items: center; gap: 8px; }
.nf-mega__build-tier-count { width: 32px; height: 32px; border-radius: 8px; background: rgba(255,255,255,0.1); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; }
.nf-mega__build-tier-line { flex: 1; height: 1px; background: rgba(255,255,255,0.1); }
.nf-mega__build-tier-disc { font-size: 13px; font-weight: 700; color: #c8a942; }
.nf-mega__build-benefits { display: flex; flex-direction: column; gap: 6px; margin-bottom: 20px; }
.nf-mega__build-benefit { display: flex; align-items: center; gap: 6px; }
.nf-mega__build-benefit svg { color: #c8a942; }
.nf-mega__build-benefit span { font-size: 10px; color: rgba(255,255,255,0.6); }
.nf-mega__build-cta { display: inline-flex; align-items: center; gap: 8px; background: #fff; color: #262320; padding: 10px 20px; border-radius: 999px; font-size: 13px; font-weight: 700; width: fit-content; transition: background 0.2s; }
.nf-mega__build-card:hover .nf-mega__build-cta { background: #c8a942; }

/* ── Support mega menu ── */
.nf-mega__support { padding: 24px; background: #F3F1E9; border-bottom: 1px solid #e5e5e5; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
.nf-mega__support-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 280px; gap: 40px; max-width: 1200px; margin: 0 auto; align-items: start; }
.nf-mega__support-heading { font-size: 10px; font-weight: 600; color: #999; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 16px; }
.nf-mega__support-links { display: flex; flex-direction: column; gap: 10px; }
.nf-mega__support-link { font-size: 14px; font-weight: 500; color: #555; text-decoration: none; width: fit-content; transition: color 0.2s; position: relative; }
.nf-mega__support-link::after { content: ''; position: absolute; bottom: -1px; left: 0; width: 0; height: 1px; background: #262320; transition: width 0.25s ease; }
.nf-mega__support-link:hover { color: #262320; }
.nf-mega__support-link:hover::after { width: 100%; }
.nf-mega__support-contact { min-width: 260px; }
.nf-mega__support-card { background: #fff; border: 1px solid #e5e5e5; border-radius: 12px; padding: 24px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.nf-mega__support-card-title { font-size: 16px; font-weight: 700; color: #262320; margin: 0 0 20px; letter-spacing: -0.01em; }
.nf-mega__support-card-items { display: flex; flex-direction: column; gap: 12px; }
.nf-mega__support-card-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; text-decoration: none; color: inherit; transition: background 0.15s; }
.nf-mega__support-card-item:hover { background: #F3F1E9; }
.nf-mega__support-card-icon { width: 36px; height: 36px; border-radius: 10px; background: #F3F1E9; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #555; }
.nf-mega__support-card-item:hover .nf-mega__support-card-icon { background: #e8e7e3; }
.nf-mega__support-card-label { font-size: 11px; color: #999; margin-bottom: 2px; text-transform: uppercase; letter-spacing: 0.03em; font-weight: 500; }
.nf-mega__support-card-value { font-size: 13px; font-weight: 600; color: #262320; }
.nf-mega__support-chat-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 12px 24px; background: #4aaf47; color: #fff; border-radius: 999px; font-size: 14px; font-weight: 600; text-decoration: none; transition: background 0.2s, box-shadow 0.2s; margin-top: 4px; }
.nf-mega__support-chat-btn:hover { background: #3d9a3b; box-shadow: 0 4px 12px rgba(74,175,71,0.25); }
.nf-mega__support-card-hours { margin-top: 16px; padding-top: 12px; border-top: 1px solid #e5e5e5; }
.nf-mega__support-card-hours p { font-size: 11px; color: #999; text-align: center; margin: 0; }

/* ── Hover underline override (global a:hover sets underline — override per class) ── */
.nf-header__logo:hover,
.nf-header__nav-link:hover,
.nf-header__action-btn:hover,
.nf-header__cart:hover,
.nf-mega__product-card:hover,
.nf-mega__cta-btn:hover,
.nf-mega__support-link:hover,
.nf-mega__support-card-item:hover,
.nf-mega__support-chat-btn:hover { text-decoration: none; }

/* ══════════════════════════════════════════
   MOBILE HEADER
   ══════════════════════════════════════════ */
.nf-header--mobile { display: block; background: #fff; border-bottom: 1px solid #e5e5e5; position: relative; z-index: 70; }
.nf-header--mobile.menu-locked { position: fixed; width: 100%; touch-action: none; }
.nf-header--mobile .nf-header__inner { height: 56px; justify-content: space-between; }
.nf-header__burger { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: none; border: none; cursor: pointer; color: #1a1a1a; }
.nf-header__burger-lines { display: flex; flex-direction: column; gap: 5px; width: 20px; }
.nf-header__burger-line { display: block; width: 100%; height: 2px; background: currentColor; border-radius: 1px; transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease; transform-origin: center; }
.nf-header__burger.is-open .nf-header__burger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nf-header__burger.is-open .nf-header__burger-line:nth-child(2) { opacity: 0; }
.nf-header__burger.is-open .nf-header__burger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.nf-header--mobile .nf-header__logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; }

@media (min-width: 768px) {
  .nf-header--desktop { display: block; }
  .nf-header--mobile { display: none; }
}

/* ── Mobile Drawer ── */
.nf-mobile-menu { position: fixed; top: var(--mobile-header-bottom, 56px); left: 0; right: 0; bottom: 0; z-index: 61; pointer-events: none; overflow: hidden; }
.nf-mobile-menu[hidden] { display: none; }
.nf-mobile-menu.is-open { pointer-events: auto; overflow: visible; }
.nf-mobile-menu__backdrop { position: fixed; top: var(--mobile-header-bottom, 56px); left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 60; opacity: 0; transition: opacity 0.2s ease; }
.nf-mobile-menu.is-open .nf-mobile-menu__backdrop { opacity: 1; }
.nf-mobile-menu__drawer { position: fixed; top: var(--mobile-header-bottom, 56px); left: 0; right: 0; bottom: 0; width: 100vw; background: #fff; z-index: 61; overflow: hidden; display: flex; flex-direction: column; height: 100dvh; height: calc(100vh - var(--mobile-header-bottom, 56px)); clip-path: inset(0 0 100% 0); transition: clip-path 0.28s cubic-bezier(0.16, 1, 0.3, 1); overscroll-behavior: contain; }
.nf-mobile-menu.is-open .nf-mobile-menu__drawer { clip-path: inset(0 0 0 0); }
/* close button removed — burger transforms to × */
.nf-mobile-menu__search { display: flex; align-items: center; gap: 0.5rem; margin: 1rem 1.25rem; padding: 0.625rem 1rem; background: #f5f5f5; border-radius: 999px; color: #999; }
.nf-mobile-menu__search-input { flex: 1; border: none; background: none; font-size: 14px; color: #1a1a1a; outline: none; font-family: inherit; }
.nf-mobile-menu__search-input::placeholder { color: #999; }
.nf-mobile-menu__pills { display: flex; gap: 0.5rem; padding: 1.25rem 1.25rem 0.75rem; flex-wrap: wrap; align-items: center; }
.nf-mobile-menu__pill { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.5rem 0.875rem; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; text-decoration: none; flex-shrink: 0; }
.nf-mobile-menu__pill--dark { background: #171717; color: #fff; }
.nf-mobile-menu__pill--amber { background: linear-gradient(to right, #f59e0b, #f97316); color: #fff; }
.nf-mobile-menu__pill--green { background: #E16C47; color: #fff; }
.nf-mobile-menu__pill--purple { background: #9333ea; color: #fff; }
.nf-mobile-menu__pill-sub { font-size: 9px; background: rgba(255,255,255,0.3); padding: 1px 4px; border-radius: 4px; }
.nf-mobile-menu__sections { flex: 1; overflow-y: auto; padding: 0; -webkit-overflow-scrolling: touch; }
.nf-mobile-menu__section { border-bottom: 1px solid #f0f0f0; }
.nf-mobile-menu__section-btn { display: flex; align-items: center; width: 100%; padding: 0.875rem 1.25rem; background: none; border: none; cursor: pointer; font-size: 15px; font-weight: 500; color: #1a1a1a; font-family: inherit; gap: 0.5rem; }
.nf-mobile-menu__section-btn svg { margin-left: auto; color: #999; transition: transform 0.2s; }
.nf-mobile-menu__section-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.nf-mobile-menu__section-badge { font-size: 9px; font-weight: 700; background: #E16C47; color: #fff; padding: 2px 6px; border-radius: 999px; }
.nf-mobile-menu__section-content { padding: 0 1.25rem 0.75rem 1.25rem; overflow: visible; }
/* Tabs break out of section padding to scroll edge-to-edge */
.nf-mobile-menu__section-content > .nf-mobile-menu__tab-row { margin-left: -1.25rem; margin-right: -1.25rem; padding-left: 1.25rem; padding-right: 1.25rem; }
/* Filter pills break out too */
.nf-mobile-menu__section-content > .nf-mobile-menu__filter-pills { margin-left: -1.25rem; margin-right: -1.25rem; padding-left: 1.25rem; padding-right: 1.25rem; }
.nf-mobile-menu__section-content[hidden] { display: none; }
.nf-mobile-menu__section-link { display: block; padding: 0.5rem 0; font-size: 14px; color: #666; text-decoration: none; }
.nf-mobile-menu__sub-heading { font-size: 10px; font-weight: 600; color: #999; text-transform: uppercase; letter-spacing: 0.05em; margin: 12px 0 4px; }
.nf-mobile-menu__sub-heading:first-child { margin-top: 0; }
.nf-mobile-menu__section-btn--link { text-decoration: none; color: #1a1a1a; border-bottom: 1px solid #f0f0f0; }
.nf-mobile-menu__bottom-content { padding: 0; }
.nf-mobile-menu__ww-link { display: flex; align-items: center; gap: 10px; }
.nf-mobile-menu__ww-logo { border-radius: 4px; flex-shrink: 0; }
.nf-mobile-menu__section-link--accent { color: #2e2e3a; font-weight: 500; }
.nf-mobile-menu__footer { position: sticky; bottom: 0; z-index: 5; flex-shrink: 0; border-top: 1px solid #f0f0f0; padding: 0.75rem 1.25rem; background: #fff; box-shadow: 0 -2px 8px rgba(0,0,0,0.06); }
/* Action bar — icon buttons matching desktop header UX */
.nf-mobile-menu__actions { display: flex; gap: 6px; margin-top: 12px; margin-bottom: 12px; }
.nf-mobile-menu__action-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 0; border-radius: 8px; border: 1px solid #e5e5e5;
  background: #fff; color: #262320; font-size: 12px; font-weight: 600;
  font-family: inherit; cursor: pointer; text-decoration: none;
  transition: background 0.15s, border-color 0.15s;
}
.nf-mobile-menu__action-btn:hover { background: #F3F1E9; border-color: #ccc; text-decoration: none; }
.nf-mobile-menu__action-btn svg { color: #555; flex-shrink: 0; }
.nf-mobile-menu__flag { border-radius: 2px; flex-shrink: 0; }
/* Legacy (keep for compat) */
.nf-mobile-menu__footer-link { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0; font-size: 14px; font-weight: 500; color: #1a1a1a; text-decoration: none; }
.nf-mobile-menu__footer-link svg { color: #666; }

/* ── Mobile: tab row (bottom border indicator — matches desktop mega tabs) ── */
.nf-mobile-menu__tab-row { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; padding: 0; margin-bottom: 12px; border-bottom: 1px solid #e5e5e5; }
.nf-mobile-menu__tab-row::-webkit-scrollbar { display: none; }
.nf-mobile-menu__tab { padding: 8px 12px 10px; font-size: 12px; font-weight: 500; border-radius: 0; background: none; color: #999; border: none; border-bottom: 2px solid transparent; cursor: pointer; font-family: inherit; white-space: nowrap; transition: color 0.2s, border-color 0.2s; margin-bottom: -1px; }
.nf-mobile-menu__tab:hover { color: #555; }
.nf-mobile-menu__tab--active { color: #262320; border-bottom-color: #262320; }

/* ── Mobile: horizontal scrollable product cards ── */
.nf-mobile-menu__card-scroll { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; padding: 0 0 8px; margin-left: -1.25rem; margin-right: -1.25rem; }
.nf-mobile-menu__card-scroll::before,
.nf-mobile-menu__card-scroll::after { content: ''; flex-shrink: 0; width: 1.25rem; }
.nf-mobile-menu__card-scroll::-webkit-scrollbar { display: none; }
.nf-mobile-menu__card-scroll--hidden { display: none; }
.nf-mobile-menu__product-card { display: block; width: 130px; flex-shrink: 0; text-decoration: none; color: inherit; }
.nf-mobile-menu__product-img { position: relative; width: 130px; height: 130px; border-radius: 8px; overflow: hidden; background: #f0f0f0; margin-bottom: 6px; }
.nf-mobile-menu__product-img img { width: 100%; height: 100%; object-fit: cover; }
.nf-mobile-menu__product-badge { position: absolute; top: 6px; right: 6px; font-size: 8px; font-weight: 700; background: #3b82f6; color: #fff; padding: 2px 6px; border-radius: 999px; }
.nf-mobile-menu__product-badge--sale { background: #E16C47; }
.nf-mobile-menu__product-name { font-size: 12px; font-weight: 500; color: #1a1a1a; margin: 0; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nf-mobile-menu__product-price { font-size: 13px; font-weight: 700; color: #1a1a1a; margin: 2px 0 0; }
.nf-mobile-menu__product-price-row { display: flex; align-items: center; gap: 6px; }
.nf-mobile-menu__product-compare { font-size: 11px; color: #999; text-decoration: line-through; }

/* ── Mobile: section CTA link ── */
.nf-mobile-menu__section-cta { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 12px; font-size: 13px; font-weight: 600; color: #fff; text-decoration: none; background: #262320; padding: 12px 24px; border-radius: 999px; width: 100%; text-align: center; box-sizing: border-box; transition: background 0.2s; }
.nf-mobile-menu__section-cta:hover { background: #111122; text-decoration: none; }

/* ── Mobile: Shop Products — horizontal-scroll cards (matches desktop mega) ── */
.nf-mobile-menu__shop-scroll {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  /* Key: scroll-padding-inline-start matches the inline padding so snap
     aligns cards with the content grid, not the viewport edge */
  scroll-padding-inline-start: 1.25rem;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  margin: 0 -1.25rem;
  padding: 0 1.25rem 10px;
}
.nf-mobile-menu__shop-scroll::-webkit-scrollbar { display: none; }
.nf-mobile-menu__shop-card {
  flex: 0 0 60%;
  max-width: 200px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-decoration: none;
  color: inherit;
}
.nf-mobile-menu__shop-card-img {
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  overflow: hidden;
  background: #F7F5EF;
}
.nf-mobile-menu__shop-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.nf-mobile-menu__shop-card-name {
  font-size: 13px;
  font-weight: 500;
  color: #262320;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nf-mobile-menu__shop-card-price {
  font-size: 12px;
  font-weight: 500;
  color: rgba(38, 35, 32, 0.55);
}
.nf-mobile-menu__shop-all-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: #E16C47;
  border-radius: 999px;
  text-decoration: none;
  width: 100%;
  box-sizing: border-box;
  transition: background 0.2s;
}
.nf-mobile-menu__shop-all-btn:hover {
  background: #c9563a;
  text-decoration: none;
}

/* Secondary quiz CTA — black pill below Shop All Products */
.nf-mobile-menu__shop-quiz-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 8px;
  padding: 13px 20px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: #262320;
  border-radius: 999px;
  text-decoration: none;
  width: 100%;
  box-sizing: border-box;
  transition: background 0.2s;
}
.nf-mobile-menu__shop-quiz-btn:hover {
  background: #111;
  text-decoration: none;
}

/* Take the Quiz — prominent CTA above "Why NOOCI" in the burger drawer */
.nf-mobile-menu__quiz-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 4px 1.25rem 20px;
  padding: 15px 20px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #fff;
  background: #E16C47;
  border-radius: 9999px;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(225, 108, 71, 0.25);
  transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}
.nf-mobile-menu__quiz-cta:hover,
.nf-mobile-menu__quiz-cta:active {
  background: #c9563a;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(225, 108, 71, 0.3);
  text-decoration: none;
}
.nf-mobile-menu__quiz-cta svg { flex-shrink: 0; }

/* ── Mobile: room filter pills ── */
.nf-mobile-menu__filter-pills { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: 10px; padding-bottom: 4px; }
.nf-mobile-menu__filter-pills::-webkit-scrollbar { display: none; }
.nf-mobile-menu__filter-pill { padding: 5px 14px; font-size: 12px; font-weight: 500; color: #666; background: transparent; border: 1px solid #ccc; border-radius: 999px; cursor: pointer; font-family: inherit; white-space: nowrap; flex-shrink: 0; transition: background 0.2s, color 0.2s, border-color 0.2s; }
.nf-mobile-menu__filter-pill:hover { background: #262320; color: #fff; border-color: #262320; }
.nf-mobile-menu__filter-pill--active { background: #262320; color: #fff; border-color: #262320; }
.nf-mobile-menu__section-cta--sale { background: #262320; color: #fff; }
.nf-mobile-menu__section-cta--sale:hover { background: #111122; }
.nf-mobile-menu__ww-link { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: #fff; border: 1px solid #f0f0f0; border-radius: var(--radius-card, 12px); margin-bottom: 4px; transition: border-color 0.2s, box-shadow 0.2s; }
.nf-mobile-menu__ww-link:hover { border-color: #ddd; box-shadow: 0 1px 4px rgba(0,0,0,0.06); }
.nf-mobile-menu__ww-logo { width: 20px; height: 20px; border-radius: 4px; object-fit: contain; flex-shrink: 0; }
.nf-mobile-menu__ww-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.nf-mobile-menu__section-btn--link { border-bottom: 1px solid #f0f0f0; }
.nf-mobile-menu__bottom-content { padding: 1.25rem 1.25rem 0.5rem; margin-top: 0; border-top: none !important; }
.nf-mobile-menu__bottom-content .nf-search-drawer__section-title { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #999; margin-bottom: 0.5rem; }
.nf-mobile-menu__bottom-content .nf-search-drawer__usps { margin-top: 0; }
.nf-mobile-menu__bottom-content .nf-search-drawer__usp { padding: 0.5rem 0; }
.nf-mobile-menu__bottom-content .nf-search-drawer__usp:last-child { border-bottom: none; }

/* ── Mobile: inspiration 2-col grid ── */
.nf-mobile-menu__insp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.nf-mobile-menu__insp-card { position: relative; border-radius: 10px; overflow: hidden; height: 100px; display: block; }
.nf-mobile-menu__insp-card img { width: 100%; height: 100%; object-fit: cover; }
.nf-mobile-menu__insp-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.6), transparent); }
.nf-mobile-menu__insp-card-title { position: absolute; bottom: 8px; left: 10px; right: 10px; color: #fff; font-size: 12px; font-weight: 600; }

/* ── Mobile: BYOB CTA button ── */
/* byob-cta replaced by section-cta */

/* ── Mobile: help heading + contact card ── */
.nf-mobile-menu__help-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem 1.5rem; }
.nf-mobile-menu__help-col { padding-top: 0.5rem; }
.nf-mobile-menu__help-col:first-child, .nf-mobile-menu__help-col:nth-child(2) { padding-top: 0; }
.nf-mobile-menu__help-heading { font-size: 10px; font-weight: 600; color: #999; text-transform: uppercase; letter-spacing: 0.05em; margin: 0.75rem 0 4px; }
.nf-mobile-menu__help-heading:first-child { margin-top: 0; }
.nf-mobile-menu__contact-card { margin-top: 16px; padding: 12px; background: #f8f8f8; border-radius: 10px; display: flex; flex-direction: column; gap: 8px; }
.nf-mobile-menu__contact-item { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #1a1a1a; text-decoration: none; }
.nf-mobile-menu__contact-item svg { color: #666; flex-shrink: 0; }
.nf-mobile-menu__chat-btn { display: flex; align-items: center; gap: 10px; padding: 8px 14px; background: #E16C47; color: #fff; border: none; border-radius: 999px; font-size: 13px; font-weight: 500; font-family: inherit; cursor: pointer; }
.nf-mobile-menu__contact-hours { font-size: 11px; color: #999; margin: 0; }

/* ── Mobile: social links row ── */
.nf-mobile-menu__social { display: flex; align-items: center; justify-content: center; gap: 16px; padding: 12px 0 4px; border-top: 1px solid #f0f0f0; margin-top: 8px; }
.nf-mobile-menu__social-link { display: inline-flex; align-items: center; color: #666; transition: color 0.2s; }
.nf-mobile-menu__social-link:hover { color: #1a1a1a; }

/* ── Mobile: Trending Now gallery ── */
.nf-mobile-menu__trending { padding: 1rem 1.25rem 0.5rem; }
.nf-mobile-menu__trending-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #999; margin: 0 0 0.625rem; }
.nf-mobile-menu__trending-scroll { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
.nf-mobile-menu__trending-scroll::-webkit-scrollbar { display: none; }
.nf-mobile-menu__trending-card { display: flex; align-items: center; gap: 10px; flex-shrink: 0; width: 200px; padding: 8px; background: #f9f9f9; border-radius: 10px; text-decoration: none; color: inherit; transition: background 0.15s; }
.nf-mobile-menu__trending-card:hover { background: #f0efea; text-decoration: none; }
.nf-mobile-menu__trending-img { width: 56px; height: 56px; border-radius: 8px; overflow: hidden; flex-shrink: 0; background: #eee; }
.nf-mobile-menu__trending-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nf-mobile-menu__trending-info { min-width: 0; }
.nf-mobile-menu__trending-name { font-size: 12px; font-weight: 600; color: #1a1a1a; margin: 0 0 2px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nf-mobile-menu__trending-price { font-size: 12px; font-weight: 700; color: #262320; margin: 0; }

/* ── Mobile: Why NOOCI trust bar ── */
.nf-mobile-menu__trust { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 0.75rem 1.25rem 1rem; }
.nf-mobile-menu__trust-item { display: flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 500; color: #777; white-space: nowrap; }
.nf-mobile-menu__trust-sep { width: 1px; height: 12px; background: #ddd; flex-shrink: 0; }

/* ── Mobile header padding fix ── */
.nf-header--mobile .nf-header__inner { padding: 0 1rem; }
/* Optically align burger & cart icons with page content grid */
.nf-header--mobile .nf-header__burger { margin-left: -10px; }
.nf-header__mobile-actions { display: flex; align-items: center; gap: 0; margin-right: -10px; }
.nf-header__mobile-actions .nf-header__action-btn { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: none; border: none; cursor: pointer; color: #1a1a1a; padding: 0; }
.nf-header--mobile .nf-header__cart { box-sizing: content-box; padding: 10px; background: none; border: none; cursor: pointer; }
.nf-header--mobile .nf-header__cart-badge { top: 2px; right: 2px; }

/* ── Mobile hover underline override ── */
.nf-mobile-menu__pill:hover,
.nf-mobile-menu__section-link:hover,
.nf-mobile-menu__footer-link:hover { text-decoration: none; }

/* Country/currency switcher styles live in snippets/nf-country-switcher.liquid */

/* ══════════════════════════════════════════
   SEARCH DRAWER
   ══════════════════════════════════════════ */
.nf-search-backdrop {
  position: fixed; inset: 0; z-index: 75;
  background: rgba(0,0,0,0.4); opacity: 0;
  transition: opacity 0.3s ease;
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.nf-search-backdrop.is-visible { opacity: 1; }

.nf-search-drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  z-index: 80; width: 460px; max-width: 100vw;
  background: #fff; display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
  box-shadow: -8px 0 30px rgba(0,0,0,0.08);
  overscroll-behavior: contain;
}
.nf-search-drawer.is-open { transform: translateX(0); }

/* Header */
.nf-search-drawer__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.25rem; border-bottom: 1px solid #f0f0f0;
  flex-shrink: 0;
}
.nf-search-drawer__header-left {
  display: flex; align-items: center; gap: 0.5rem;
}
.nf-search-drawer__header-left svg { color: #666; }
.nf-search-drawer__title {
  font-size: 1rem; font-weight: 600; color: #111; margin: 0;
  letter-spacing: -0.01em;
}
.nf-search-drawer__close {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  border: none; background: #f5f5f5; cursor: pointer;
  color: #555; transition: background 0.2s, color 0.2s;
}
.nf-search-drawer__close:hover { background: #eee; color: #111; }

/* Search Input */
.nf-search-drawer__input-wrap {
  position: relative; padding: 1rem 1.25rem;
  flex-shrink: 0;
}
.nf-search-drawer__input-icon {
  position: absolute; left: 2rem; top: 50%; transform: translateY(-50%);
  color: #999; pointer-events: none;
}
.nf-search-drawer__input {
  width: 100%; padding: 0.75rem 2.5rem 0.75rem 2.75rem;
  font-size: 0.95rem; font-family: inherit;
  border: 1.5px solid #e5e5e5; border-radius: 12px;
  background: #fafafa; outline: none;
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  -webkit-appearance: none;
}
.nf-search-drawer__input:focus {
  border-color: #ccc; background: #fff;
  box-shadow: 0 0 0 3px rgba(0,0,0,0.04);
}
.nf-search-drawer__input::placeholder { color: #aaa; }
.nf-search-drawer__input::-webkit-search-cancel-button { display: none; }
.nf-search-drawer__input-clear {
  position: absolute; right: 2rem; top: 50%; transform: translateY(-50%);
  border: none; background: none; cursor: pointer; color: #999; padding: 4px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; transition: color 0.2s;
}
.nf-search-drawer__input-clear:hover { color: #333; }

/* Scrollable content area */
.nf-search-drawer__default,
.nf-search-drawer__results {
  flex: 1; overflow-y: auto; overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* Sections */
.nf-search-drawer__section {
  padding: 1.25rem 1.25rem 0;
}
.nf-search-drawer__section:last-child { padding-bottom: 2rem; }
.nf-search-drawer__section-title {
  font-size: 0.7rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.06em; color: #999; margin: 0 0 0.75rem;
}

/* Popular search pills */
.nf-search-drawer__pills {
  display: flex; flex-wrap: wrap; gap: 0.5rem;
}
.nf-search-drawer__pill {
  padding: 0.4rem 0.85rem; font-size: 0.8rem; font-weight: 500;
  font-family: inherit; border: 1px solid #e8e8e8; border-radius: 9999px;
  background: #fff; color: #333; cursor: pointer;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.nf-search-drawer__pill:hover {
  background: #111; border-color: #111; color: #fff;
}

/* USPs */
.nf-search-drawer__usps {
  display: flex; flex-direction: column; gap: 0;
}
.nf-search-drawer__usp {
  display: flex; align-items: flex-start; gap: 0.75rem;
  padding: 0.7rem 0; border-bottom: 1px solid #f5f5f5;
}
.nf-search-drawer__usp:last-child { border-bottom: none; }
.nf-search-drawer__usp-icon {
  width: 36px; height: 36px; border-radius: 10px;
  background: #f5f7f5; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: #E16C47;
}
.nf-search-drawer__usp-text {
  display: flex; flex-direction: column; gap: 0.1rem; min-width: 0;
}
.nf-search-drawer__usp-text strong {
  font-size: 0.82rem; font-weight: 600; color: #111;
}
.nf-search-drawer__usp-text span {
  font-size: 0.75rem; color: #888; line-height: 1.3;
}

/* Trending products */
.nf-search-drawer__trending {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem;
}
.nf-search-drawer__trending-card {
  display: flex; flex-direction: column; gap: 0.5rem;
  text-decoration: none; color: inherit;
  border-radius: 12px; overflow: hidden;
  border: 1px solid #f0f0f0;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.nf-search-drawer__trending-card:hover {
  border-color: #ddd;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.nf-search-drawer__trending-img {
  width: 100%; aspect-ratio: 1; object-fit: cover;
  background: #f5f5f5;
}
.nf-search-drawer__trending-info { padding: 0.5rem 0.65rem 0.65rem; }
.nf-search-drawer__trending-name {
  font-size: 0.78rem; font-weight: 600; color: #111;
  margin: 0; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nf-search-drawer__trending-price {
  font-size: 0.75rem; color: #666; margin: 0.15rem 0 0;
}

/* Search Results */
.nf-search-drawer__results-inner { padding: 0.5rem 1.25rem 2rem; }
.nf-search-drawer__result-group { margin-bottom: 1.25rem; }
.nf-search-drawer__result-group-title {
  font-size: 0.7rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: 0.06em; color: #999; margin: 0 0 0.5rem;
}
.nf-search-drawer__result-item {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.6rem 0; border-bottom: 1px solid #f5f5f5;
  text-decoration: none; color: inherit;
  transition: background 0.15s;
  border-radius: 8px;
}
.nf-search-drawer__result-item:hover { background: #fafafa; }
.nf-search-drawer__result-item:last-child { border-bottom: none; }
.nf-search-drawer__result-img {
  width: 52px; height: 52px; border-radius: 8px;
  object-fit: cover; background: #f5f5f5; flex-shrink: 0;
}
.nf-search-drawer__result-info {
  flex: 1; min-width: 0;
}
.nf-search-drawer__result-name {
  font-size: 0.82rem; font-weight: 600; color: #111; margin: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.nf-search-drawer__result-price {
  font-size: 0.78rem; color: #666; margin: 0.1rem 0 0;
}
.nf-search-drawer__result-link {
  display: flex; align-items: center; gap: 0.4rem;
  padding: 0.5rem 0; text-decoration: none; color: #E16C47;
  font-size: 0.82rem; font-weight: 600; transition: opacity 0.2s;
}
.nf-search-drawer__result-link:hover { opacity: 0.7; }

/* No results */
.nf-search-drawer__no-results {
  text-align: center; padding: 3rem 1rem;
}
.nf-search-drawer__no-results-icon { color: #ccc; margin-bottom: 0.75rem; }
.nf-search-drawer__no-results-text {
  font-size: 0.9rem; font-weight: 600; color: #333; margin: 0 0 0.25rem;
}
.nf-search-drawer__no-results-sub {
  font-size: 0.8rem; color: #999; margin: 0;
}

/* Loading */
.nf-search-drawer__loading {
  display: flex; align-items: center; justify-content: center;
  padding: 3rem; color: #999;
}
.nf-search-drawer__loading svg { animation: nfSearchSpin 0.8s linear infinite; }
@keyframes nfSearchSpin { to { transform: rotate(360deg); } }

/* Mobile */
@media (max-width: 767px) {
  .nf-search-drawer { width: 100vw; }
  .nf-search-drawer__trending { grid-template-columns: 1fr 1fr; gap: 0.5rem; }
}

/* ── Works With Mega ── */
.nf-mega__ww {
  padding: 24px;
  background: #F3F1E9;
  border-bottom: 1px solid #e5e5e5;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
.nf-mega__ww-columns {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  max-width: 1200px;
  margin: 0 auto;
}
.nf-mega__ww-section {
  flex: 1;
  min-width: 0;
}
.nf-mega__ww-section--wide {
  flex: 2;
}
.nf-mega__ww-heading {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #999;
  margin: 0 0 10px 4px;
}
.nf-mega__ww-cards {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.nf-mega__ww-cards--2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
}
.nf-mega__ww-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid transparent;
  text-decoration: none;
  color: #262320;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.nf-mega__ww-card:hover {
  background: #fff;
  border-color: #e5e5e5;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transform: translateY(-1px);
}
.nf-mega__ww-card-logo {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  object-fit: contain;
  flex-shrink: 0;
}
.nf-mega__ww-card-name {
  font-size: 13px;
  font-weight: 500;
  flex: 1;
}
.nf-mega__ww-card-arrow {
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.15s, transform 0.15s;
  color: #999;
  flex-shrink: 0;
}
.nf-mega__ww-card:hover .nf-mega__ww-card-arrow {
  opacity: 1;
  transform: translateX(0);
}
.nf-mega__ww-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(0,0,0,0.06);
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}
.nf-mega__ww-view-all-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  border-radius: 999px;
  background: #262320;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: opacity 0.2s;
}
.nf-mega__ww-view-all-btn:hover {
  opacity: 0.85;
  text-decoration: none;
}
/* END_SECTION:header */

/* START_SECTION:help-center (INDEX:19) */
/* ── Help Center ── */
.help-center {
  padding-block-end: var(--space-3xl);
}

/* ── Full-width top bar (title + tabs share one background) ── */
.help-center__top-bar {
  background: var(--color-background);
  border-bottom: 1px solid var(--color-border);
  padding-block-start: var(--space-3xl);
}

.help-center__top-bar-inner {
  max-width: 72rem;
  margin: 0 auto;
}

.help-center__container {
  max-width: 72rem;
  margin: 0 auto;
  padding-block-start: var(--space-xl);
}

.help-center__header {
  text-align: center;
  margin-block-end: var(--space-2xl);
}

.help-center__title {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  letter-spacing: var(--tracking-tight);
  color: var(--color-foreground);
  margin-block-end: var(--space-xs);
}

.help-center__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 500px;
  margin-inline: auto;
}

/* ── Tabs ── */
.help-center__tabs {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  background: var(--color-background);
  padding-block: var(--space-sm);
  margin-block-end: 0;
}

.help-center__tabs-track {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-block: 4px;
}

@media (max-width: 749px) {
  .help-center__tabs-track {
    justify-content: flex-start;
    padding-inline: 1rem;
  }
}

.help-center__tabs-track::-webkit-scrollbar { display: none; }

.help-center__tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-full);
  border: 1px solid var(--color-border);
  background: transparent;
  color: var(--color-text-secondary);
  font-family: inherit;
  font-size: var(--font-size-sm);
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: background var(--duration-base) var(--ease-default),
              color var(--duration-base) var(--ease-default),
              border-color var(--duration-base) var(--ease-default);
  flex-shrink: 0;
  -webkit-appearance: none;
  appearance: none;
}

.help-center__tab:hover {
  background: var(--color-primary);
  color: var(--color-text-on-primary);
  border-color: var(--color-primary);
}

.help-center__tab--active {
  background: var(--color-primary);
  color: var(--color-text-on-primary);
  border-color: var(--color-primary);
}

.help-center__tab svg {
  flex-shrink: 0;
}

/* ── Panels ── */
.help-center__panel {
  display: none;
  animation: fadeInUp 0.3s ease;
}

.help-center__panel--active {
  display: block;
}

.help-center__panel-inner {
  max-width: 56rem;
  margin: 0 auto;
}

.help-center__panel-title {
  font-family: var(--font-heading);
  font-size: var(--font-size-2xl);
  font-weight: 600;
  letter-spacing: var(--tracking-tight);
  margin-block-end: var(--space-xl);
  color: var(--color-foreground);
}

/* ── Info Cards Grid ── */
.help-center__cards-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-md);
}

@media (min-width: 750px) {
  .help-center__cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.help-center__cards-grid--2col {
  grid-template-columns: 1fr;
}

@media (min-width: 750px) {
  .help-center__cards-grid--2col {
    grid-template-columns: repeat(2, 1fr);
  }
}

.help-center__info-card {
  background: var(--color-card);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
}

.help-center__info-card h3 {
  font-size: var(--font-size-lg);
  font-weight: 600;
  margin-block-end: var(--space-xs);
  color: var(--color-foreground);
}

.help-center__info-card p {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
}

.help-center__info-card p a {
  color: var(--color-foreground);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.help-center__info-icon {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-muted);
  border-radius: var(--radius-lg);
  margin-block-end: var(--space-md);
  color: var(--color-foreground);
}

/* ── Resource Cards ── */
.help-center__resource-card {
  display: block;
  background: var(--color-card);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--radius-xl);
  padding: var(--space-xl);
  text-decoration: none;
  color: var(--color-foreground);
  transition: transform var(--duration-base) var(--ease-default), box-shadow var(--duration-base) var(--ease-default);
}

.help-center__resource-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.help-center__resource-icon {
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-primary);
  color: var(--color-text-on-primary);
  border-radius: var(--radius-lg);
  margin-block-end: var(--space-md);
}

.help-center__resource-card h3 {
  font-size: var(--font-size-lg);
  font-weight: 600;
  margin-block-end: var(--space-xs);
}

.help-center__resource-card p {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-base);
}

/* ── Two-col content ── */
.help-center__two-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2xl);
}

@media (min-width: 750px) {
  .help-center__two-col {
    grid-template-columns: 1fr 1fr;
  }
}

.help-center__content-block h3 {
  font-size: var(--font-size-xl);
  font-weight: 600;
  margin-block-end: var(--space-sm);
  color: var(--color-foreground);
}

.help-center__content-block h4 {
  font-size: var(--font-size-base);
  font-weight: 600;
  margin-block-start: var(--space-lg);
  margin-block-end: var(--space-xs);
  color: var(--color-foreground);
}

.help-center__content-block p {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
  margin-block-end: var(--space-sm);
}

.help-center__content-block p a {
  color: var(--color-foreground);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.help-center__content-block ul,
.help-center__content-block ol {
  padding-inline-start: var(--space-lg);
  margin-block-end: var(--space-md);
}

.help-center__content-block li {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
  margin-block-end: var(--space-xs);
}

.help-center__content-block li strong {
  color: var(--color-foreground);
}

.help-center__note {
  background: var(--color-muted);
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  margin-block-start: var(--space-xl);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
}

.help-center__note strong {
  color: var(--color-foreground);
}

/* ── FAQ Accordion ── */
.help-center__faq-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.help-center__faq-item {
  border-bottom: 1px solid var(--color-border);
}

.help-center__faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--space-lg) 0;
  background: none;
  border: none;
  font-family: inherit;
  font-size: var(--font-size-base);
  font-weight: 500;
  color: var(--color-foreground);
  cursor: pointer;
  text-align: left;
  gap: var(--space-md);
  -webkit-appearance: none;
  appearance: none;
}

.help-center__faq-question:hover {
  color: var(--color-text-secondary);
}

.help-center__faq-chevron {
  flex-shrink: 0;
  transition: transform var(--duration-base) var(--ease-default);
}

.help-center__faq-question[aria-expanded="true"] .help-center__faq-chevron {
  transform: rotate(180deg);
}

.help-center__faq-answer {
  padding-block-end: var(--space-lg);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
  max-width: 48rem;
}

/* ── Mobile ── */
@media (max-width: 749px) {
  .help-center {
    padding-block: var(--space-2xl);
  }

  .help-center__tabs-track {
    padding-inline: var(--space-xs);
  }

  .help-center__tab {
    font-size: 0.75rem;
    padding: 0.4375rem 0.875rem;
  }
}
/* END_SECTION:help-center */

/* START_SECTION:legal-content (INDEX:20) */
/* ═══════════════════════════════════════
   LEGAL PAGE — narrow centered layout
   ═══════════════════════════════════════ */
.legal-page {
  max-width: 48rem;
  margin: 0 auto;
  padding: 6rem 1.5rem 4rem;
}

/* ── Breadcrumb ── */
.legal-breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
  margin-bottom: 2.5rem;
}
.legal-breadcrumb a {
  color: var(--color-text-muted, #71717a);
  text-decoration: none;
  transition: color 0.2s ease;
}
.legal-breadcrumb a:hover {
  color: var(--color-foreground, #262320);
}
.legal-breadcrumb span:last-child {
  color: var(--color-foreground, #262320);
}

/* ── White card container ── */
.legal-content {
  background: #fff;
  border-radius: 1.5rem;
  padding: 3rem;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  animation: legalFadeIn 0.6s ease both;
}
@keyframes legalFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── Header ── */
.legal-title {
  font-size: 2rem;
  font-weight: 800;
  margin: 0 0 0.5rem;
  color: var(--color-foreground, #262320);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.legal-date {
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
  margin: 0 0 3rem;
}

/* ── Table of contents ── */
.legal-toc {
  background: var(--color-secondary, #F3F1E9);
  border-radius: 0.75rem;
  padding: 1.25rem 1.5rem;
  margin-bottom: 2.5rem;
}
.legal-toc__title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted, #71717a);
  margin: 0 0 0.75rem;
}
.legal-toc__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.legal-toc__link {
  font-size: 0.875rem;
  color: var(--color-accent, #2563eb);
  text-decoration: none;
  line-height: 1.5;
  transition: opacity 0.2s ease;
}
.legal-toc__link:hover {
  opacity: 0.7;
}

/* ── Body typography — heading hierarchy ── */
.legal-body h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 2.5rem 0 1rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
  color: var(--color-foreground, #262320);
  line-height: 1.3;
}
.legal-body h2:first-child {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}
.legal-body h3 {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 2rem 0 0.75rem;
  color: var(--color-foreground, #262320);
  line-height: 1.3;
}
.legal-body h4 {
  font-size: 1.0625rem;
  font-weight: 600;
  margin: 1.75rem 0 0.625rem;
  color: var(--color-text-muted, #71717a);
  line-height: 1.4;
}
.legal-body h5 {
  font-size: 0.9375rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 1.5rem 0 0.5rem;
  color: var(--color-foreground, #262320);
  line-height: 1.4;
}
.legal-body p {
  line-height: 1.8;
  margin: 0 0 1.25rem;
  color: var(--color-body-text, #444);
}
.legal-body ul,
.legal-body ol {
  padding-left: 1.5rem;
  margin: 0 0 1.25rem;
}
.legal-body li {
  line-height: 1.8;
  margin-bottom: 0.5rem;
  color: var(--color-body-text, #444);
}
.legal-body a {
  color: var(--color-accent, #2563eb);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.legal-body a:hover {
  opacity: 0.7;
}
.legal-body strong {
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.legal-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: 0.875rem;
}
.legal-body th,
.legal-body td {
  text-align: left;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--color-border, #e5e5e5);
  line-height: 1.6;
}
.legal-body th {
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.legal-body blockquote {
  border-left: 3px solid var(--color-border, #e5e5e5);
  padding-left: 1rem;
  margin: 1.5rem 0;
  color: var(--color-text-muted, #71717a);
  font-style: italic;
}

/* ── Dark mode ── */
@media (prefers-color-scheme: dark) {
  .legal-content {
    background: #1e1e21;
    box-shadow: 0 2px 12px rgba(0,0,0,0.2);
  }
  .legal-title,
  .legal-body h2,
  .legal-body h3,
  .legal-body h5,
  .legal-body strong,
  .legal-body th {
    color: #f0f0f5;
  }
  .legal-body h4 {
    color: #a0a0b0;
  }
  .legal-body p,
  .legal-body li {
    color: #c8c8d4;
  }
  .legal-breadcrumb,
  .legal-breadcrumb a,
  .legal-date,
  .legal-body blockquote {
    color: #8888a0;
  }
  .legal-breadcrumb span:last-child {
    color: #f0f0f5;
  }
  .legal-toc {
    background: #24242e;
  }
  .legal-body h2 {
    border-top-color: #2e2e3a;
  }
  .legal-body th,
  .legal-body td {
    border-bottom-color: #2e2e3a;
  }
}

/* ── Responsive ── */
@media (max-width: 749px) {
  .legal-page { padding: 3rem 1rem 3rem; }
  .legal-content { padding: 2rem 1.25rem; border-radius: 1rem; }
  .legal-title { font-size: 1.5rem; }
  .legal-body h2 { font-size: 1.25rem; margin-top: 2rem; }
  .legal-body h3 { font-size: 1.0625rem; }
  .legal-body h4 { font-size: 1rem; }
  .legal-body h5 { font-size: 0.875rem; }
  .legal-toc { padding: 1rem 1.25rem; }
}
/* END_SECTION:legal-content */

/* START_SECTION:main-account (INDEX:22) */
.nf-account {
  min-height: calc(100vh - 160px);
  padding: 3rem 1rem 5rem;
  background: var(--color-background, #F3F1E9);
}
.nf-account__wrap {
  max-width: 720px;
  margin: 0 auto;
}
.nf-account__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}
.nf-account__welcome {
  display: block;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 500;
  color: rgba(38, 35, 32, 0.55);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}
.nf-account__name {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: 1.75rem;
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0;
}
.nf-account__logout {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 500;
  color: rgba(38, 35, 32, 0.7);
  text-decoration: none;
  padding: 8px 14px;
  border: 1px solid rgba(38, 35, 32, 0.15);
  border-radius: 9999px;
  transition: background 0.15s, border-color 0.15s;
}
.nf-account__logout:hover {
  background: #fff;
  border-color: rgba(38, 35, 32, 0.3);
  text-decoration: none;
}
.nf-account__nav {
  display: flex;
  gap: 2px;
  margin-bottom: 2rem;
  border-bottom: 1px solid rgba(38, 35, 32, 0.1);
}
.nf-account__nav-link {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem;
  font-weight: 500;
  color: rgba(38, 35, 32, 0.6);
  text-decoration: none;
  padding: 10px 16px;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
  margin-bottom: -1px;
}
.nf-account__nav-link:hover {
  color: var(--color-foreground, #262320);
  text-decoration: none;
}
.nf-account__nav-link.is-active {
  color: var(--color-foreground, #262320);
  border-bottom-color: #E16C47;
  font-weight: 600;
}
.nf-account__section-title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: 1.125rem;
  color: var(--color-foreground, #262320);
  margin: 0 0 1rem;
}
.nf-account__orders {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.nf-account__order {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 16px 20px;
  background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, box-shadow 0.15s;
  flex-wrap: wrap;
}
.nf-account__order:hover {
  border-color: rgba(225, 108, 71, 0.4);
  box-shadow: 0 2px 8px rgba(38, 35, 32, 0.05);
  text-decoration: none;
}
.nf-account__order-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nf-account__order-name {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--color-foreground, #262320);
}
.nf-account__order-date {
  font-size: 0.75rem;
  color: rgba(38, 35, 32, 0.55);
}
.nf-account__order-meta {
  display: flex;
  align-items: center;
  gap: 12px;
}
.nf-account__order-status {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 9999px;
  background: rgba(38, 35, 32, 0.06);
  color: rgba(38, 35, 32, 0.7);
}
.nf-account__order-status--fulfilled { background: rgba(34, 197, 94, 0.12); color: #15803d; }
.nf-account__order-status--partial { background: rgba(234, 179, 8, 0.14); color: #a16207; }
.nf-account__order-total {
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--color-foreground, #262320);
}
.nf-account__empty {
  text-align: center;
  padding: 3rem 1rem;
  background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 12px;
}
.nf-account__empty-title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: 1.125rem;
  margin: 0 0 0.25rem;
  color: var(--color-foreground, #262320);
}
.nf-account__empty-sub {
  font-size: 0.875rem;
  color: rgba(38, 35, 32, 0.6);
  margin: 0 0 1.5rem;
}
.nf-account__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
  font-size: 0.875rem;
  color: #fff;
  background: #E16C47;
  border-radius: 9999px;
  text-decoration: none;
  transition: background 0.2s, transform 0.2s;
}
.nf-account__cta:hover {
  background: #c9563a;
  transform: translateY(-1px);
  text-decoration: none;
}
@media (max-width: 560px) {
  .nf-account__order { flex-direction: column; align-items: flex-start; gap: 10px; }
  .nf-account__order-meta { width: 100%; justify-content: space-between; }
}
/* END_SECTION:main-account */

/* START_SECTION:main-activate-account (INDEX:23) */
.nf-login {
  min-height: calc(100vh - 160px);
  padding: 4rem 1rem;
  background: var(--color-background, #F3F1E9);
  display: flex; align-items: flex-start; justify-content: center;
}
.nf-login__wrap {
  width: 100%; max-width: 420px; background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08); border-radius: 16px;
  padding: 2.5rem 2rem; box-shadow: 0 2px 12px rgba(38, 35, 32, 0.04);
}
.nf-login__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.75rem; letter-spacing: -0.02em;
  color: var(--color-foreground, #262320); margin: 0 0 0.375rem; text-align: center;
}
.nf-login__sub {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem; color: rgba(38, 35, 32, 0.65);
  margin: 0 0 2rem; text-align: center;
}
.nf-login__errors {
  background: rgba(225, 108, 71, 0.08);
  border: 1px solid rgba(225, 108, 71, 0.25);
  color: #c9563a; padding: 12px 14px; border-radius: 10px;
  font-size: 0.8125rem; margin-bottom: 1rem;
}
.nf-login__form { display: flex; flex-direction: column; gap: 1rem; }
.nf-login__field { display: flex; flex-direction: column; gap: 0.375rem; }
.nf-login__field label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; font-weight: 500;
  color: var(--color-foreground, #262320);
}
.nf-login__field input {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem; color: var(--color-foreground, #262320);
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.18);
  border-radius: 10px; transition: border-color 0.15s;
}
.nf-login__field input:focus {
  outline: none; border-color: #E16C47;
  box-shadow: 0 0 0 3px rgba(225, 108, 71, 0.15);
}
.nf-login__submit {
  display: flex; align-items: center; justify-content: center;
  width: 100%; padding: 14px 20px; margin-top: 0.5rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600; font-size: 0.9375rem; color: #fff;
  background: #E16C47; border: none; border-radius: 9999px;
  cursor: pointer; transition: background 0.2s, transform 0.2s;
}
.nf-login__submit:hover { background: #c9563a; transform: translateY(-1px); }
.nf-login__create {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; color: rgba(38, 35, 32, 0.7);
  text-align: center; margin: 1rem 0 0;
}
.nf-login__create a { color: #E16C47; font-weight: 600; text-decoration: none; }
.nf-login__create a:hover { text-decoration: underline; }
@media (max-width: 480px) {
  .nf-login__wrap { padding: 2rem 1.25rem; border-radius: 12px; }
  .nf-login__heading { font-size: 1.5rem; }
}
/* END_SECTION:main-activate-account */

/* START_SECTION:main-addresses (INDEX:24) */
.nf-account {
  min-height: calc(100vh - 160px);
  padding: 3rem 1rem 5rem;
  background: var(--color-background, #F3F1E9);
}
.nf-account__wrap { max-width: 720px; margin: 0 auto; }
.nf-account__header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap;
}
.nf-account__welcome {
  display: block; font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; font-weight: 500; color: rgba(38, 35, 32, 0.55);
  letter-spacing: 0.02em; text-transform: uppercase; margin-bottom: 0.25rem;
}
.nf-account__name {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.75rem; letter-spacing: -0.02em;
  color: var(--color-foreground, #262320); margin: 0;
}
.nf-account__logout {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; font-weight: 500;
  color: rgba(38, 35, 32, 0.7); text-decoration: none;
  padding: 8px 14px; border: 1px solid rgba(38, 35, 32, 0.15);
  border-radius: 9999px; transition: background 0.15s; cursor: pointer; background: transparent;
}
.nf-account__logout:hover {
  background: #fff; border-color: rgba(38, 35, 32, 0.3); text-decoration: none;
}
.nf-account__empty {
  text-align: center; padding: 3rem 1rem; background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08); border-radius: 12px;
}
.nf-account__empty-title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.125rem; margin: 0 0 0.25rem;
  color: var(--color-foreground, #262320);
}
.nf-account__empty-sub { font-size: 0.875rem; color: rgba(38, 35, 32, 0.6); margin: 0 0 1.5rem; }
.nf-account__cta {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 12px 24px; margin-bottom: 1.5rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600; font-size: 0.875rem; color: #fff;
  background: #E16C47; border: none; border-radius: 9999px;
  text-decoration: none; cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}
.nf-account__cta:hover { background: #c9563a; transform: translateY(-1px); text-decoration: none; }

.nf-address__list {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px;
}
.nf-address__card {
  position: relative; background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08); border-radius: 12px;
  padding: 20px;
}
.nf-address__badge {
  display: inline-block; font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.03em; text-transform: uppercase;
  background: #E16C47; color: #fff; padding: 3px 8px; border-radius: 9999px;
  margin-bottom: 10px;
}
.nf-address__body {
  font-size: 0.875rem; line-height: 1.6; color: var(--color-foreground, #262320);
  margin-bottom: 14px;
}
.nf-address__actions {
  display: flex; gap: 8px; flex-wrap: wrap;
}
.nf-address__form {
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 12px; padding: 24px; margin-bottom: 1.5rem;
}
.nf-address__form-title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1rem; margin: 0 0 1rem;
}
.nf-address__default {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.8125rem; color: rgba(38, 35, 32, 0.7); cursor: pointer;
}

.nf-login__form { display: flex; flex-direction: column; gap: 1rem; }
.nf-login__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.nf-login__field { display: flex; flex-direction: column; gap: 0.375rem; }
.nf-login__field label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; font-weight: 500; color: var(--color-foreground, #262320);
}
.nf-login__field input, .nf-login__field select {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem; color: var(--color-foreground, #262320);
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.18);
  border-radius: 10px; transition: border-color 0.15s;
}
.nf-login__field input:focus, .nf-login__field select:focus {
  outline: none; border-color: #E16C47;
  box-shadow: 0 0 0 3px rgba(225, 108, 71, 0.15);
}
.nf-login__submit {
  display: flex; align-items: center; justify-content: center;
  padding: 14px 20px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600; font-size: 0.9375rem; color: #fff;
  background: #E16C47; border: none; border-radius: 9999px;
  cursor: pointer; transition: background 0.2s, transform 0.2s;
}
.nf-login__submit:hover { background: #c9563a; transform: translateY(-1px); }
@media (max-width: 480px) {
  .nf-login__row { grid-template-columns: 1fr; }
}
/* END_SECTION:main-addresses */

/* START_SECTION:main-article (INDEX:25) */
/* ═══════════════════════════════════════
   ARTICLE PAGE — clean reading layout
   ═══════════════════════════════════════ */
.article-pg {
  max-width: 48rem;
  margin: 0 auto;
  padding: 6rem 1.5rem 4rem;
  font-family: var(--font-body, 'Inter', sans-serif);
}

/* ── Breadcrumb ── */
.article-pg__breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
  margin-bottom: 2.5rem;
  flex-wrap: wrap;
}
.article-pg__breadcrumb a {
  color: var(--color-text-muted, #71717a);
  text-decoration: none;
  transition: color 0.2s ease;
}
.article-pg__breadcrumb a:hover {
  color: var(--color-foreground, #262320);
}
.article-pg__breadcrumb span:last-child {
  color: var(--color-foreground, #262320);
}

/* ── Card container (matches legal template) ── */
.article-pg__card {
  background: #fff;
  border-radius: 1.5rem;
  padding: 3rem;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  animation: articleFadeIn 0.6s ease both;
}
@keyframes articleFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── Category tag ── */
.article-pg__category {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-accent, #2563eb);
  background: rgba(37, 99, 235, 0.08);
  padding: 0.2rem 0.625rem;
  border-radius: var(--radius-button);
  margin-bottom: 1rem;
}

/* ── Title ── */
.article-pg__title {
  font-size: 2.25rem;
  font-weight: 800;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.75rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

/* ── Meta ── */
.article-pg__meta {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
  margin-bottom: 2rem;
  flex-wrap: wrap;
}
.article-pg__meta-sep { opacity: 0.5; }

/* ── Featured image ── */
.article-pg__hero-img-wrap {
  width: 100%;
  border-radius: 0.75rem;
  overflow: hidden;
  margin-bottom: 2.5rem;
}
.article-pg__hero-img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* ── Article body typography ── */
.article-pg__body h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 2.5rem 0 1rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
  color: var(--color-foreground, #262320);
  line-height: 1.3;
}
.article-pg__body h2:first-child {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}
.article-pg__body h3 {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 2rem 0 0.75rem;
  color: var(--color-foreground, #262320);
  line-height: 1.3;
}
.article-pg__body h4 {
  font-size: 1.0625rem;
  font-weight: 600;
  margin: 1.75rem 0 0.625rem;
  color: var(--color-text-muted, #71717a);
  line-height: 1.4;
}
.article-pg__body p {
  line-height: 1.8;
  margin: 0 0 1.25rem;
  color: var(--color-body-text, #444);
}
.article-pg__body ul,
.article-pg__body ol {
  padding-left: 1.5rem;
  margin: 0 0 1.25rem;
}
.article-pg__body li {
  line-height: 1.8;
  margin-bottom: 0.5rem;
  color: var(--color-body-text, #444);
}
.article-pg__body a {
  color: var(--color-accent, #2563eb);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.article-pg__body a:hover { opacity: 0.7; }
.article-pg__body strong {
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.article-pg__body blockquote {
  border-left: 3px solid var(--color-border, #e5e5e5);
  padding-left: 1rem;
  margin: 1.5rem 0;
  color: var(--color-text-muted, #71717a);
  font-style: italic;
}
.article-pg__body pre,
.article-pg__body code {
  font-family: 'SF Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
}
.article-pg__body pre {
  background: var(--color-secondary, #F3F1E9);
  border-radius: 0.5rem;
  padding: 1rem 1.25rem;
  overflow-x: auto;
  margin: 1.5rem 0;
  font-size: 0.8125rem;
  line-height: 1.7;
}
.article-pg__body code {
  background: var(--color-secondary, #F3F1E9);
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
  font-size: 0.85em;
}
.article-pg__body pre code {
  background: none;
  padding: 0;
  border-radius: 0;
}
.article-pg__body img {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem;
  margin: 1.5rem 0;
  display: block;
}
.article-pg__body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: 0.875rem;
}
.article-pg__body th,
.article-pg__body td {
  text-align: left;
  padding: 0.625rem 0.75rem;
  border-bottom: 1px solid var(--color-border, #e5e5e5);
  line-height: 1.6;
}
.article-pg__body th {
  font-weight: 600;
  color: var(--color-foreground, #262320);
}

/* ── Tags row ── */
.article-pg__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.article-pg__tag-pill {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--color-text-muted, #71717a);
  background: var(--color-secondary, #F3F1E9);
  padding: 0.25rem 0.75rem;
  border-radius: var(--radius-button);
  text-decoration: none;
  transition: all 0.15s;
}
.article-pg__tag-pill:hover {
  background: var(--color-foreground, #262320);
  color: #fff;
  text-decoration: none;
}

/* ── Share ── */
.article-pg__share {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.article-pg__share-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin-right: 0.25rem;
}
.article-pg__share-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--color-text-muted, #71717a);
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #e5e5e5);
  border-radius: var(--radius-md, 8px);
  text-decoration: none;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.article-pg__share-btn:hover {
  color: var(--color-foreground, #262320);
  border-color: var(--color-foreground, #262320);
  text-decoration: none;
}

/* ── Author card ── */
.article-pg__author-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.article-pg__author-avatar {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--color-foreground, #262320);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  flex-shrink: 0;
}
.article-pg__author-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin: 0;
}
.article-pg__author-role {
  font-size: 0.75rem;
  color: var(--color-text-muted, #71717a);
  margin: 0;
}

/* ── Prev/Next nav ── */
.article-pg__nav {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.article-pg__nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  text-decoration: none;
  transition: opacity 0.2s;
}
.article-pg__nav-link:hover { opacity: 0.7; text-decoration: none; }
.article-pg__nav-link--next { margin-left: auto; }
.article-pg__nav-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted, #71717a);
}

/* ── Related articles ── */
.article-pg__related {
  margin-top: 3rem;
}
.article-pg__related-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 1.25rem;
  text-align: center;
}
.article-pg__related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
.article-pg__related-card {
  display: block;
  text-decoration: none;
  color: inherit;
  animation: articleFadeIn 0.6s ease both;
}
.article-pg__related-card:hover { text-decoration: none; }
.article-pg__related-img-wrap {
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 0.75rem;
  overflow: hidden;
  background: var(--color-secondary, #F3F1E9);
  margin-bottom: 0.625rem;
}
.article-pg__related-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.article-pg__related-card:hover .article-pg__related-img {
  transform: scale(1.04);
}
.article-pg__related-img--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}
.article-pg__related-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.25rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.article-pg__related-date {
  font-size: 0.75rem;
  color: var(--color-text-muted, #71717a);
}

/* ── Dark mode ── */
@media (prefers-color-scheme: dark) {
  .article-pg__card {
    background: #1e1e21;
    box-shadow: 0 2px 12px rgba(0,0,0,0.2);
  }
  .article-pg__title,
  .article-pg__body h2,
  .article-pg__body h3,
  .article-pg__body strong,
  .article-pg__body th {
    color: #f0f0f5;
  }
  .article-pg__body h4 { color: #a0a0b0; }
  .article-pg__body p,
  .article-pg__body li { color: #c8c8d4; }
  .article-pg__breadcrumb,
  .article-pg__breadcrumb a,
  .article-pg__meta,
  .article-pg__body blockquote { color: #8888a0; }
  .article-pg__breadcrumb span:last-child { color: #f0f0f5; }
  .article-pg__body h2 { border-top-color: #2e2e3a; }
  .article-pg__body th,
  .article-pg__body td { border-bottom-color: #2e2e3a; }
  .article-pg__body pre { background: #24242e; }
  .article-pg__body code { background: #24242e; }
  .article-pg__category { background: rgba(37, 99, 235, 0.15); }
  .article-pg__related-img-wrap { background: #24242e; }
  .article-pg__tag-pill { background: #24242e; color: #a0a0b0; }
  .article-pg__share-btn { background: #24242e; border-color: #2e2e3a; color: #a0a0b0; }
}

/* ── Responsive ── */
@media (max-width: 749px) {
  .article-pg {
    padding: 3rem 1rem 3rem;
  }
  .article-pg__card {
    padding: 2rem 1.25rem;
    border-radius: 1rem;
  }
  .article-pg__title { font-size: 1.5rem; }
  .article-pg__body h2 { font-size: 1.25rem; margin-top: 2rem; }
  .article-pg__body h3 { font-size: 1.0625rem; }
  .article-pg__related-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .article-pg__nav {
    flex-direction: column;
    gap: 0.75rem;
  }
  .article-pg__nav-link--next { margin-left: 0; }
}
/* END_SECTION:main-article */

/* START_SECTION:main-blog (INDEX:26) */
/* ═══════════════════════════════════════
   BLOG INDEX — Noo Journal
   ═══════════════════════════════════════ */
.blog-idx {
  max-width: 72rem;
  margin: 0 auto;
  padding: 5rem 1.5rem 4rem;
  font-family: var(--font-body, 'Inter', sans-serif);
}

/* ── Hero ── */
.blog-idx__hero {
  text-align: center;
  margin-bottom: 2.5rem;
}
.blog-idx__eyebrow {
  display: block;
  font-family: var(--font-accent, 'Cormorant Garamond', serif);
  font-size: 0.875rem;
  font-weight: 400;
  font-style: italic;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent, #E16C47);
  margin-bottom: 0.5rem;
}
.blog-idx__title {
  font-family: var(--font-heading, 'Inter', sans-serif);
  font-size: clamp(2rem, 5vw, 3rem);
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.75rem;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.blog-idx__description {
  font-size: 1.0625rem;
  color: rgba(38, 35, 32, 0.62);
  margin: 0;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
}

/* ── Tag filter pills ── */
.blog-idx__filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(38, 35, 32, 0.08);
}
.blog-idx__filter-pill {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.5rem 1.125rem;
  border-radius: 9999px;
  background: var(--color-background, #F3F1E9);
  color: rgba(38, 35, 32, 0.62);
  border: 1px solid rgba(38, 35, 32, 0.08);
  text-decoration: none;
  transition: all 180ms ease;
  white-space: nowrap;
}
.blog-idx__filter-pill:hover {
  color: #262320;
  border-color: rgba(38, 35, 32, 0.2);
  text-decoration: none;
}
.blog-idx__filter-pill--active {
  background: #262320;
  color: #F3F1E9;
  border-color: #262320;
}
.blog-idx__filter-pill--active:hover {
  background: #262320;
  color: #F3F1E9;
}

/* ── Featured article (first, full width) ── */
.blog-featured {
  margin-bottom: 3rem;
  animation: blogCardFadeIn 0.5s ease both;
}
.blog-featured__link {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 2.5rem;
  text-decoration: none;
  color: inherit;
  align-items: center;
}
.blog-featured__img-wrap {
  position: relative;
  aspect-ratio: 3/2;
  border-radius: 1rem;
  overflow: hidden;
  background: var(--color-background, #F3F1E9);
}
.blog-featured__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.blog-featured__link:hover .blog-featured__img {
  transform: scale(1.03);
}
.blog-featured__img--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}
.blog-featured__content {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
.blog-featured__title {
  font-family: var(--font-heading, 'Inter', sans-serif);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.015em;
}
.blog-featured__excerpt {
  font-size: 1rem;
  color: rgba(38, 35, 32, 0.62);
  margin: 0;
  line-height: 1.65;
}

/* ── Grid ── */
.blog-idx__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

/* ── Card ── */
.blog-card {
  animation: blogCardFadeIn 0.6s ease both;
}
@keyframes blogCardFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.blog-card__link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  height: 100%;
}
.blog-card__img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 0.75rem;
  overflow: hidden;
  background: var(--color-secondary, #F3F1E9);
  margin-bottom: 1rem;
}
.blog-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.blog-card__link:hover .blog-card__img {
  transform: scale(1.04);
}
.blog-card__img--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}
.blog-card__tag {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-accent, #E16C47);
  background: rgba(225, 108, 71, 0.08);
  padding: 0.2rem 0.625rem;
  border-radius: 9999px;
  margin-bottom: 0.5rem;
  width: fit-content;
}
.blog-card__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.375rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.blog-card__excerpt {
  font-size: 0.875rem;
  color: var(--color-text-muted, #71717a);
  margin: 0 0 0.75rem;
  line-height: 1.6;
  flex: 1;
}
.blog-card__meta {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  color: var(--color-text-muted, #71717a);
  margin-bottom: 0.5rem;
}
.blog-card__meta-sep { opacity: 0.5; }
.blog-card__read-more {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  transition: gap 0.2s ease;
}
.blog-card__link:hover .blog-card__read-more {
  gap: 0.5rem;
}

/* ── Pagination ── */
.blog-idx__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.blog-idx__pag-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  text-decoration: none;
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-button);
  transition: all 0.15s;
}
.blog-idx__pag-btn:hover {
  background: var(--color-secondary, #F3F1E9);
  border-color: var(--color-foreground, #262320);
  text-decoration: none;
}
.blog-idx__pag-btn--disabled {
  opacity: 0.35;
  pointer-events: none;
}
.blog-idx__pag-info {
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
}

/* ── Empty ── */
.blog-idx__empty {
  text-align: center;
  padding: 3rem 1rem;
  color: var(--color-text-muted, #71717a);
  font-size: 0.9375rem;
}

/* ── Responsive ── */
@media (max-width: 999px) {
  .blog-idx__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
  .blog-featured__link {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}
@media (max-width: 749px) {
  .blog-idx {
    padding: 3rem 1rem 3rem;
  }
  .blog-idx__filters {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 1.5rem;
    margin-left: -1rem;
    margin-right: -1rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .blog-idx__filters::-webkit-scrollbar { display: none; }
  .blog-idx__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .blog-featured__link {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .blog-featured__title { font-size: 1.5rem; }
}
/* END_SECTION:main-blog */

/* START_SECTION:main-cart (INDEX:27) */
/* ═══════════════════════════════════════
   CART PAGE — Full-page cart
   ═══════════════════════════════════════ */
.cart-pg {
  max-width: 72rem;
  margin: 0 auto;
  padding: 6rem 1.5rem 4rem;
  font-family: var(--font-body, 'Inter', sans-serif);
}

/* ── Breadcrumb ── */
.cart-pg__breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--color-text-muted, #71717a);
  margin-bottom: 1.5rem;
}
.cart-pg__breadcrumb a {
  color: var(--color-text-muted, #71717a);
  text-decoration: none;
  transition: color 0.2s ease;
}
.cart-pg__breadcrumb a:hover {
  color: var(--color-foreground, #262320);
}
.cart-pg__breadcrumb span:last-child {
  color: var(--color-foreground, #262320);
}

/* ── Title ── */
.cart-pg__title {
  font-size: 2rem;
  font-weight: 800;
  color: var(--color-foreground, #262320);
  margin: 0 0 2rem;
  letter-spacing: -0.02em;
  line-height: 1.2;
}
.cart-pg__count {
  font-weight: 400;
  font-size: 1.25rem;
  color: var(--color-text-muted, #71717a);
}

/* ── Two-column layout ── */
.cart-pg__layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 2.5rem;
  align-items: flex-start;
}

/* ── Items column ── */
.cart-pg__items {
  display: flex;
  flex-direction: column;
}
.cart-pg__item {
  display: flex;
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--color-border, #e5e5e5);
  position: relative;
  transition: opacity 0.2s ease;
}
.cart-pg__item:first-child {
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.cart-pg__item.is-updating {
  opacity: 0.5;
  pointer-events: none;
}
.cart-pg__item-img-link { flex-shrink: 0; }
.cart-pg__item-img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: var(--radius-image);
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #e5e5e5);
  display: block;
}
.cart-pg__item-img--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}
.cart-pg__item-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.cart-pg__item-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.5rem;
}
.cart-pg__item-name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  text-decoration: none;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cart-pg__item-name:hover {
  color: var(--color-primary-hover, #2a2a2d);
}
.cart-pg__item-remove {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  color: #bbb;
  padding: 2px;
  transition: color 0.15s;
}
.cart-pg__item-remove:hover { color: #E16C47; }
.cart-pg__item-variant {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 500;
  color: #666;
  background: #f0efea;
  border-radius: var(--radius-button);
  padding: 2px 8px;
  margin: 0;
  width: fit-content;
}
.cart-pg__item-price-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.cart-pg__item-price {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
}
.cart-pg__item-compare {
  font-size: 0.75rem;
  color: #999;
  text-decoration: line-through;
}
.cart-pg__item-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.25rem;
}
.cart-pg__item-line-total {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
}

/* ── Quantity selector ── */
.cart-pg__qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-md, 8px);
  overflow: hidden;
}
.cart-pg__qty-btn {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 15px;
  font-weight: 500;
  color: var(--color-foreground, #262320);
  transition: background 0.15s;
  user-select: none;
}
.cart-pg__qty-btn:hover { background: var(--color-surface, #F3F1E9); }
.cart-pg__qty-input {
  width: 40px;
  height: 34px;
  text-align: center;
  border: none;
  border-left: 1px solid var(--color-border, #deddd8);
  border-right: 1px solid var(--color-border, #deddd8);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  font-family: inherit;
  background: transparent;
  -moz-appearance: textfield;
}
.cart-pg__qty-input::-webkit-outer-spin-button,
.cart-pg__qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.cart-pg__continue-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 1.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text-muted, #71717a);
  text-decoration: none;
  transition: color 0.2s ease;
}
.cart-pg__continue-link:hover {
  color: var(--color-foreground, #262320);
}

/* ── Summary column ── */
.cart-pg__summary-col {
  position: sticky;
  top: 6rem;
}
.cart-pg__summary-card {
  background: #fff;
  border-radius: 1.5rem;
  padding: 2rem;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  border: 1px solid var(--color-border, #e5e5e5);
}
.cart-pg__summary-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 1.25rem;
}
.cart-pg__summary-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.875rem;
  color: var(--color-foreground, #262320);
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border, #f0f0f0);
}
.cart-pg__summary-row:last-of-type {
  border-bottom: none;
  margin-bottom: 0.75rem;
}
.cart-pg__summary-row span:last-child {
  font-weight: 700;
}
.cart-pg__summary-row--light span {
  font-weight: 400 !important;
  color: var(--color-text-muted, #71717a);
  font-size: 0.8125rem;
}
.cart-pg__shipping-note {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  color: var(--color-text-muted, #71717a);
  background: var(--color-secondary, #F3F1E9);
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  margin: 0.5rem 0 0.75rem;
}
.cart-pg__shipping-note svg { flex-shrink: 0; color: #E16C47; }

/* ── Discount ── */
.cart-pg__discount-wrap,
.cart-pg__note-wrap {
  border-top: 1px solid var(--color-border, #f0f0f0);
  padding: 0.75rem 0 0;
  margin-top: 0.5rem;
}
.cart-pg__discount-toggle,
.cart-pg__note-toggle {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-muted, #71717a);
  cursor: pointer;
  list-style: none;
  transition: color 0.2s;
}
.cart-pg__discount-toggle:hover,
.cart-pg__note-toggle:hover {
  color: var(--color-foreground, #262320);
}
.cart-pg__discount-toggle::-webkit-details-marker,
.cart-pg__note-toggle::-webkit-details-marker { display: none; }
.cart-pg__discount-inner {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.625rem;
}
.cart-pg__discount-input {
  flex: 1;
  height: 2.25rem;
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-md, 8px);
  padding: 0 0.75rem;
  font-size: 0.8125rem;
  font-family: inherit;
  color: var(--color-foreground, #262320);
  background: transparent;
}
.cart-pg__discount-input:focus {
  outline: none;
  border-color: var(--color-foreground, #262320);
}
.cart-pg__discount-btn {
  height: 2.25rem;
  padding: 0 1rem;
  background: var(--color-foreground, #262320);
  color: #fff;
  border: none;
  border-radius: var(--radius-md, 8px);
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: opacity 0.15s;
}
.cart-pg__discount-btn:hover { opacity: 0.85; }

/* ── Order note ── */
.cart-pg__note-input {
  width: 100%;
  margin-top: 0.625rem;
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-md, 8px);
  padding: 0.625rem 0.75rem;
  font-size: 0.8125rem;
  font-family: inherit;
  color: var(--color-foreground, #262320);
  background: transparent;
  resize: vertical;
}
.cart-pg__note-input:focus {
  outline: none;
  border-color: var(--color-foreground, #262320);
}

/* ── Checkout CTA ── */
.cart-pg__checkout-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.875rem 1.25rem;
  margin-top: 1rem;
  background: #E16C47;
  color: #fff;
  border: none;
  border-radius: var(--radius-full, 9999px);
  font-size: 0.9375rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(45,138,35,0.25);
  position: relative;
  overflow: hidden;
}
.cart-pg__checkout-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.08) 25%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.08) 75%, transparent 100%);
  background-size: 200% 100%;
  animation: cartPgShimmer 4s ease-in-out infinite;
  pointer-events: none;
  border-radius: inherit;
}
@keyframes cartPgShimmer {
  0% { background-position: 200% center; }
  100% { background-position: -200% center; }
}
.cart-pg__checkout-btn:hover {
  box-shadow: 0 4px 20px rgba(45,138,35,0.44);
  transform: translateY(-1px);
  filter: brightness(0.95);
  text-decoration: none;
}
.cart-pg__checkout-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(45,138,35,0.25);
}

/* Dynamic checkout */
.cart-pg__dynamic-checkout {
  margin-top: 0.75rem;
}
.cart-pg__dynamic-checkout [data-shopify="dynamic-checkout-cart"] {
  max-height: none !important;
}

/* ── Trust badges ── */
.cart-pg__trust-badges {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border, #f0f0f0);
}
.cart-pg__trust-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--color-text-muted, #71717a);
}
.cart-pg__trust-item svg { flex-shrink: 0; }

/* ── Payment icons ── */
.cart-pg__payment-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--color-border, #f0f0f0);
  flex-wrap: wrap;
}
.cart-pg__payment-label {
  font-size: 0.625rem;
  font-weight: 500;
  color: #999;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.cart-pg__payment-icons {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}
.cart-pg__payment-icon {
  height: 22px;
  width: auto;
  border-radius: 3px;
}

/* ── Upsell section ── */
.cart-pg__upsell {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border, #e5e5e5);
}
.cart-pg__upsell-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 1.25rem;
}
.cart-pg__upsell-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.cart-pg__upsell-card {
  display: block;
  text-decoration: none;
  color: inherit;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid var(--color-border, #e5e5e5);
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.cart-pg__upsell-card:hover {
  border-color: var(--color-foreground, #262320);
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.08);
  text-decoration: none;
}
.cart-pg__upsell-card-img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--color-secondary, #F3F1E9);
  margin-bottom: 0.625rem;
}
.cart-pg__upsell-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cart-pg__upsell-badge {
  position: absolute;
  top: 0.375rem;
  right: 0.375rem;
  background: #E16C47;
  color: #fff;
  font-size: 0.5625rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: var(--radius-button);
}
.cart-pg__upsell-card-title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.25rem;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cart-pg__upsell-card-price-row {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.cart-pg__upsell-card-price {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
}
.cart-pg__upsell-card-compare {
  font-size: 0.6875rem;
  color: #999;
  text-decoration: line-through;
}

/* ── Empty state ── */
.cart-pg__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4rem 1rem;
  text-align: center;
  animation: cartPgFadeIn 0.6s ease both;
}
@keyframes cartPgFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.cart-pg__empty-icon {
  color: var(--color-text-muted, #71717a);
  margin-bottom: 1.5rem;
  opacity: 0.5;
}
.cart-pg__empty-heading {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.5rem;
}
.cart-pg__empty-sub {
  font-size: 0.875rem;
  color: var(--color-text-muted, #71717a);
  margin: 0 0 1.5rem;
}
.cart-pg__empty-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  background: var(--color-foreground, #262320);
  color: #fff;
  border-radius: var(--radius-full, 9999px);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity 0.2s;
}
.cart-pg__empty-cta:hover { opacity: 0.85; text-decoration: none; }

/* ── Dark mode ── */
@media (prefers-color-scheme: dark) {
  .cart-pg__summary-card {
    background: #1e1e21;
    border-color: #2e2e3a;
    box-shadow: 0 2px 12px rgba(0,0,0,0.2);
  }
  .cart-pg__item-img { background: #24242e; border-color: #2e2e3a; }
  .cart-pg__item-variant { background: #24242e; color: #a0a0b0; }
  .cart-pg__upsell-card { background: #1e1e21; border-color: #2e2e3a; }
  .cart-pg__upsell-card-img-wrap { background: #24242e; }
  .cart-pg__discount-input,
  .cart-pg__note-input { border-color: #2e2e3a; color: #f0f0f5; }
  .cart-pg__shipping-note { background: #24242e; }
}

/* ── Responsive ── */
@media (max-width: 999px) {
  .cart-pg__layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .cart-pg__summary-col {
    position: static;
  }
  .cart-pg__upsell-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 749px) {
  .cart-pg {
    padding: 3rem 1rem 3rem;
  }
  .cart-pg__title { font-size: 1.5rem; }
  .cart-pg__summary-card { padding: 1.5rem; border-radius: 1rem; }
  .cart-pg__upsell-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 479px) {
  .cart-pg__upsell-grid {
    grid-template-columns: 1fr;
  }
}
/* END_SECTION:main-cart */

/* START_SECTION:main-login (INDEX:30) */
.nf-login {
  min-height: calc(100vh - 160px);
  padding: 4rem 1rem;
  background: var(--color-background, #F3F1E9);
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.nf-login__wrap {
  width: 100%;
  max-width: 420px;
  background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 16px;
  padding: 2.5rem 2rem;
  box-shadow: 0 2px 12px rgba(38, 35, 32, 0.04);
}

.nf-login__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: 1.75rem;
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.375rem;
  text-align: center;
}

.nf-login__sub {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem;
  color: rgba(38, 35, 32, 0.65);
  margin: 0 0 2rem;
  text-align: center;
}

.nf-login__errors {
  background: rgba(225, 108, 71, 0.08);
  border: 1px solid rgba(225, 108, 71, 0.25);
  color: #c9563a;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 0.8125rem;
  margin-bottom: 1rem;
}
.nf-login__errors ul { margin: 0; padding-left: 1.25rem; }

.nf-login__form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.nf-login__field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.nf-login__field label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-foreground, #262320);
}

.nf-login__field input {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
  color: var(--color-foreground, #262320);
  background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.18);
  border-radius: 10px;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.nf-login__field input:focus {
  outline: none;
  border-color: #E16C47;
  box-shadow: 0 0 0 3px rgba(225, 108, 71, 0.15);
}

.nf-login__forgot {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  color: rgba(38, 35, 32, 0.7);
  text-decoration: none;
  align-self: flex-end;
  margin-top: -0.5rem;
  transition: color 0.15s;
}
.nf-login__forgot:hover {
  color: #E16C47;
  text-decoration: underline;
}

.nf-login__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 14px 20px;
  margin-top: 0.5rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
  font-size: 0.9375rem;
  color: #fff;
  background: #E16C47;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}
.nf-login__submit:hover {
  background: #c9563a;
  transform: translateY(-1px);
}

.nf-login__create {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  color: rgba(38, 35, 32, 0.7);
  text-align: center;
  margin: 1rem 0 0;
}
.nf-login__create a {
  color: #E16C47;
  font-weight: 600;
  text-decoration: none;
}
.nf-login__create a:hover { text-decoration: underline; }

@media (max-width: 480px) {
  .nf-login__wrap {
    padding: 2rem 1.25rem;
    border-radius: 12px;
  }
  .nf-login__heading {
    font-size: 1.5rem;
  }
}

.nf-login__success {
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid rgba(34, 197, 94, 0.25);
  color: #15803d;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 0.8125rem;
  margin-bottom: 1rem;
}
.nf-login__state[hidden] { display: none; }
/* END_SECTION:main-login */

/* START_SECTION:main-order (INDEX:31) */
.nf-account {
  min-height: calc(100vh - 160px);
  padding: 3rem 1rem 5rem;
  background: var(--color-background, #F3F1E9);
}
.nf-account__wrap { max-width: 960px; margin: 0 auto; }
.nf-account__header {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap;
}
.nf-account__name {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.75rem; letter-spacing: -0.02em;
  color: var(--color-foreground, #262320); margin: 0;
}
.nf-account__back-link {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; color: rgba(38, 35, 32, 0.65);
  text-decoration: none; margin-bottom: 0.5rem; display: inline-block;
}
.nf-account__back-link:hover { color: #E16C47; }
.nf-order__date {
  font-size: 0.8125rem; color: rgba(38, 35, 32, 0.55);
  margin: 0.25rem 0 0;
}
.nf-order__status-group { display: flex; gap: 6px; flex-wrap: wrap; }
.nf-account__order-status {
  font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.03em;
  text-transform: uppercase; padding: 4px 10px; border-radius: 9999px;
  background: rgba(38, 35, 32, 0.06); color: rgba(38, 35, 32, 0.7);
}
.nf-account__order-status--fulfilled, .nf-account__order-status--paid { background: rgba(34, 197, 94, 0.14); color: #15803d; }
.nf-account__order-status--partial { background: rgba(234, 179, 8, 0.15); color: #a16207; }
.nf-account__order-status--cancelled, .nf-account__order-status--refunded { background: rgba(225, 108, 71, 0.14); color: #c9563a; }

.nf-account__section-title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.125rem;
  color: var(--color-foreground, #262320); margin: 0 0 1rem;
}
.nf-order__grid {
  display: grid; grid-template-columns: 1fr 320px; gap: 24px;
}
.nf-order__items {
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 12px; padding: 24px;
}
.nf-order__item {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 0; border-bottom: 1px solid rgba(38, 35, 32, 0.06);
}
.nf-order__item:last-child { border-bottom: none; }
.nf-order__item-img {
  width: 64px; height: 64px; border-radius: 8px; object-fit: cover;
  background: #F3F1E9; flex-shrink: 0;
}
.nf-order__item-main { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nf-order__item-title {
  font-weight: 600; font-size: 0.9375rem;
  color: var(--color-foreground, #262320); text-decoration: none;
}
.nf-order__item-title:hover { color: #E16C47; }
.nf-order__item-variant, .nf-order__item-qty {
  font-size: 0.75rem; color: rgba(38, 35, 32, 0.6);
}
.nf-order__item-price {
  font-weight: 600; font-size: 0.9375rem;
  color: var(--color-foreground, #262320);
}
.nf-order__summary {
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 12px; padding: 24px; align-self: start;
}
.nf-order__row {
  display: flex; justify-content: space-between;
  font-size: 0.875rem; color: rgba(38, 35, 32, 0.75);
  padding: 6px 0;
}
.nf-order__row--discount { color: #E16C47; }
.nf-order__row--total {
  font-weight: 700; font-size: 1rem;
  color: var(--color-foreground, #262320);
  border-top: 1px solid rgba(38, 35, 32, 0.1);
  margin-top: 6px; padding-top: 12px;
}
.nf-order__section-subtitle {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 0.875rem;
  color: var(--color-foreground, #262320);
  margin: 1.25rem 0 0.5rem;
}
.nf-order__address {
  font-size: 0.8125rem; line-height: 1.55;
  color: rgba(38, 35, 32, 0.75);
}
@media (max-width: 749px) {
  .nf-order__grid { grid-template-columns: 1fr; }
  .nf-order__item { flex-wrap: wrap; }
  .nf-order__item-img { width: 56px; height: 56px; }
  .nf-order__item-price { width: 100%; text-align: right; }
}
/* END_SECTION:main-order */

/* START_SECTION:main-register (INDEX:35) */
/* Relies on the shared .nf-login styles loaded on the login page.
   Own copy lives here for standalone register route. */
.nf-login {
  min-height: calc(100vh - 160px);
  padding: 4rem 1rem;
  background: var(--color-background, #F3F1E9);
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.nf-login__wrap {
  width: 100%;
  max-width: 420px;
  background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 16px;
  padding: 2.5rem 2rem;
  box-shadow: 0 2px 12px rgba(38, 35, 32, 0.04);
}
.nf-login__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.75rem; letter-spacing: -0.02em;
  color: var(--color-foreground, #262320); margin: 0 0 0.375rem; text-align: center;
}
.nf-login__sub {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem; color: rgba(38, 35, 32, 0.65);
  margin: 0 0 2rem; text-align: center;
}
.nf-login__errors {
  background: rgba(225, 108, 71, 0.08);
  border: 1px solid rgba(225, 108, 71, 0.25);
  color: #c9563a; padding: 12px 14px; border-radius: 10px;
  font-size: 0.8125rem; margin-bottom: 1rem;
}
.nf-login__form { display: flex; flex-direction: column; gap: 1rem; }
.nf-login__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.nf-login__field { display: flex; flex-direction: column; gap: 0.375rem; }
.nf-login__field label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; font-weight: 500; color: var(--color-foreground, #262320);
}
.nf-login__field input {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem; color: var(--color-foreground, #262320);
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.18);
  border-radius: 10px; transition: border-color 0.15s, box-shadow 0.15s;
}
.nf-login__field input:focus {
  outline: none; border-color: #E16C47;
  box-shadow: 0 0 0 3px rgba(225, 108, 71, 0.15);
}
.nf-login__submit {
  display: flex; align-items: center; justify-content: center;
  width: 100%; padding: 14px 20px; margin-top: 0.5rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600; font-size: 0.9375rem; color: #fff;
  background: #E16C47; border: none; border-radius: 9999px;
  cursor: pointer; transition: background 0.2s, transform 0.2s;
}
.nf-login__submit:hover { background: #c9563a; transform: translateY(-1px); }
.nf-login__create {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; color: rgba(38, 35, 32, 0.7);
  text-align: center; margin: 1rem 0 0;
}
.nf-login__create a { color: #E16C47; font-weight: 600; text-decoration: none; }
.nf-login__create a:hover { text-decoration: underline; }
@media (max-width: 480px) {
  .nf-login__wrap { padding: 2rem 1.25rem; border-radius: 12px; }
  .nf-login__heading { font-size: 1.5rem; }
  .nf-login__row { grid-template-columns: 1fr; }
}
/* END_SECTION:main-register */

/* START_SECTION:main-reset-password (INDEX:36) */
.nf-login {
  min-height: calc(100vh - 160px);
  padding: 4rem 1rem;
  background: var(--color-background, #F3F1E9);
  display: flex; align-items: flex-start; justify-content: center;
}
.nf-login__wrap {
  width: 100%; max-width: 420px; background: #fff;
  border: 1px solid rgba(38, 35, 32, 0.08); border-radius: 16px;
  padding: 2.5rem 2rem; box-shadow: 0 2px 12px rgba(38, 35, 32, 0.04);
}
.nf-login__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: 1.75rem; letter-spacing: -0.02em;
  color: var(--color-foreground, #262320); margin: 0 0 0.375rem; text-align: center;
}
.nf-login__sub {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem; color: rgba(38, 35, 32, 0.65);
  margin: 0 0 2rem; text-align: center;
}
.nf-login__errors {
  background: rgba(225, 108, 71, 0.08);
  border: 1px solid rgba(225, 108, 71, 0.25);
  color: #c9563a; padding: 12px 14px; border-radius: 10px;
  font-size: 0.8125rem; margin-bottom: 1rem;
}
.nf-login__form { display: flex; flex-direction: column; gap: 1rem; }
.nf-login__field { display: flex; flex-direction: column; gap: 0.375rem; }
.nf-login__field label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem; font-weight: 500;
  color: var(--color-foreground, #262320);
}
.nf-login__field input {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem; color: var(--color-foreground, #262320);
  background: #fff; border: 1px solid rgba(38, 35, 32, 0.18);
  border-radius: 10px; transition: border-color 0.15s;
}
.nf-login__field input:focus {
  outline: none; border-color: #E16C47;
  box-shadow: 0 0 0 3px rgba(225, 108, 71, 0.15);
}
.nf-login__submit {
  display: flex; align-items: center; justify-content: center;
  width: 100%; padding: 14px 20px; margin-top: 0.5rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600; font-size: 0.9375rem; color: #fff;
  background: #E16C47; border: none; border-radius: 9999px;
  cursor: pointer; transition: background 0.2s, transform 0.2s;
}
.nf-login__submit:hover { background: #c9563a; transform: translateY(-1px); }
@media (max-width: 480px) {
  .nf-login__wrap { padding: 2rem 1.25rem; border-radius: 12px; }
  .nf-login__heading { font-size: 1.5rem; }
}
/* END_SECTION:main-reset-password */

/* START_SECTION:main-search (INDEX:37) */
/* ═══════════════════════════════════════════════
   SEARCH PAGE
   ═══════════════════════════════════════════════ */

.search-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.5rem 1.5rem 4rem;
}

/* ── Breadcrumb ── */
.search-page__breadcrumb ol {
  display: flex;
  gap: 0.5rem;
  padding: 0;
  margin: 0 0 1.5rem;
  list-style: none;
  font-size: 0.875rem;
  color: var(--color-text-secondary, #666);
}
.search-page__breadcrumb li:not(:last-child)::after {
  content: '/';
  margin-inline-start: 0.5rem;
}
.search-page__breadcrumb a {
  color: inherit;
  text-decoration: none;
}
.search-page__breadcrumb a:hover {
  text-decoration: underline;
}
.search-page__breadcrumb [aria-current="page"] {
  color: var(--color-text, #262320);
}

/* ── Search bar ── */
.search-page__form {
  margin-bottom: 2rem;
}
.search-page__input-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-button);
  padding: 0.625rem 0.625rem 0.625rem 1.25rem;
  transition: border-color 0.2s;
}
.search-page__input-wrap:focus-within {
  border-color: var(--color-text, #262320);
}
.search-page__icon {
  flex-shrink: 0;
  color: var(--color-text-secondary, #999);
}
.search-page__input {
  flex: 1;
  border: none;
  background: transparent;
  font-size: 1rem;
  font-family: inherit;
  color: var(--color-text, #262320);
  outline: none;
  min-width: 0;
}
.search-page__input::placeholder {
  color: var(--color-text-secondary, #999);
}
.search-page__clear {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-secondary, #999);
  padding: 0.25rem;
  flex-shrink: 0;
}
.search-page__clear:hover {
  color: var(--color-text, #262320);
}
.search-page__submit {
  flex-shrink: 0;
  padding: 0.5rem 1.25rem;
  background: var(--color-primary, #262320);
  color: var(--color-primary-text, #fff);
  border: none;
  border-radius: var(--radius-button);
  font-size: 0.875rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: opacity 0.2s;
}
.search-page__submit:hover {
  opacity: 0.85;
}

/* ── Results count ── */
.search-page__count {
  font-size: 0.9375rem;
  color: var(--color-text-secondary, #666);
  margin-bottom: 1.5rem;
}

/* ── Results grid ── */
.search-page__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}
@media (max-width: 989px) {
  .search-page__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 549px) {
  .search-page__grid { grid-template-columns: 1fr; }
}

/* Override product card fixed width inside grid */
.search-page__grid .nf-card--l {
  width: 100%;
}

/* ── Fade-in animation ── */
.search-page__fade-in {
  opacity: 0;
  transform: translateY(12px);
  animation: searchFadeIn 0.4s ease forwards;
}
@keyframes searchFadeIn {
  to { opacity: 1; transform: translateY(0); }
}

/* ── Article card ── */
.search-page__article-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  border-radius: 0.75rem;
  overflow: hidden;
  border: 1px solid var(--color-border, #eee);
  background: var(--color-secondary, #F3F1E9);
  transition: border-color 0.2s;
}
.search-page__article-card:hover {
  border-color: var(--color-text, #262320);
}
.search-page__article-img-wrap {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}
.search-page__article-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.search-page__article-card:hover .search-page__article-img {
  transform: scale(1.04);
}
.search-page__article-info {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.search-page__type-badge {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-secondary, #999);
}
.search-page__article-title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.35;
  color: var(--color-text, #262320);
}
.search-page__article-excerpt {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-secondary, #666);
  margin: 0;
}
.search-page__read-more {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text, #262320);
  margin-top: 0.25rem;
}

/* ── Page card ── */
.search-page__page-card {
  display: block;
  text-decoration: none;
  color: inherit;
  border-radius: 0.75rem;
  border: 1px solid var(--color-border, #eee);
  background: var(--color-secondary, #F3F1E9);
  transition: border-color 0.2s;
}
.search-page__page-card:hover {
  border-color: var(--color-text, #262320);
}
.search-page__page-info {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.search-page__page-title {
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
  color: var(--color-text, #262320);
}
.search-page__page-excerpt {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text-secondary, #666);
  margin: 0;
}

/* ── Pagination ── */
.search-page__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  margin-top: 3rem;
}
.search-page__page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border-radius: var(--radius-button);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text, #262320);
  text-decoration: none;
  transition: background 0.2s;
}
.search-page__page-link:hover {
  background: var(--color-secondary, #F3F1E9);
}
.search-page__page-link--current {
  background: var(--color-primary, #262320);
  color: var(--color-primary-text, #fff);
}
.search-page__page-link--gap {
  color: var(--color-text-secondary, #999);
}

/* ── Empty state ── */
.search-page__empty {
  text-align: center;
  padding: 3rem 1rem;
}
.search-page__empty-icon {
  color: var(--color-text-secondary, #ccc);
  margin-bottom: 1rem;
}
.search-page__empty-heading {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0 0 1rem;
  color: var(--color-text, #262320);
}
.search-page__suggestions {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
  font-size: 0.9375rem;
  color: var(--color-text-secondary, #666);
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.search-page__browse {
  margin-top: 2rem;
}
.search-page__browse-label {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-secondary, #999);
  margin-bottom: 0.75rem;
}
.search-page__browse-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
}
.search-page__browse-link {
  display: inline-block;
  padding: 0.5rem 1rem;
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-button);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text, #262320);
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s;
}
.search-page__browse-link:hover {
  background: var(--color-secondary, #F3F1E9);
  border-color: var(--color-text, #262320);
}

/* ── Dark mode ── */
@media (prefers-color-scheme: dark) {
  .search-page__breadcrumb [aria-current="page"],
  .search-page__empty-heading,
  .search-page__article-title,
  .search-page__page-title,
  .search-page__read-more,
  .search-page__page-link,
  .search-page__browse-link {
    color: #f0f0f5;
  }
  .search-page__input {
    color: #f0f0f5;
  }
  .search-page__input-wrap {
    background: #1e1e22;
    border-color: #333;
  }
  .search-page__article-card,
  .search-page__page-card {
    background: #1e1e22;
    border-color: #333;
  }
  .search-page__article-card:hover,
  .search-page__page-card:hover {
    border-color: #666;
  }
  .search-page__page-link--current {
    background: #f0f0f5;
    color: #262320;
  }
  .search-page__browse-link {
    border-color: #444;
  }
  .search-page__browse-link:hover {
    background: #2a2a2e;
    border-color: #888;
  }
}
/* END_SECTION:main-search */

/* START_SECTION:newsroom-press-kits (INDEX:38) */
/* ── Newsroom: Press Kits ── */
.newsroom-kits {
  padding: var(--space-3xl) 0;
}

.newsroom-kits__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.newsroom-kits__heading {
  font-size: var(--font-size-2xl);
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 var(--space-xl);
}

.newsroom-kits__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
}

.newsroom-kits__card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--color-surface);
  display: flex;
  flex-direction: column;
}

.newsroom-kits__image-wrap {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #f5f5f5;
}

.newsroom-kits__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.newsroom-kits__body {
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  flex: 1;
}

.newsroom-kits__product {
  font-size: var(--font-size-lg);
  font-weight: 600;
  color: var(--color-text);
  margin: 0;
}

.newsroom-kits__files {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}

.newsroom-kits__file-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  text-decoration: none;
  color: var(--color-text);
  font-size: var(--font-size-sm);
  transition: background 0.15s ease;
}

.newsroom-kits__file-link:hover {
  background: var(--color-surface-alt);
}

.newsroom-kits__file-label {
  font-weight: 500;
}

.newsroom-kits__file-size {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  background: var(--color-surface-alt);
  padding: 2px 8px;
  border-radius: var(--radius-sm);
}

.newsroom-kits__download-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: var(--space-sm) var(--space-lg);
  background: #4aaf47;
  color: #fff;
  border-radius: var(--radius-md);
  text-decoration: none;
  font-size: var(--font-size-sm);
  font-weight: 600;
  margin-top: auto;
  transition: background 0.15s ease;
}

.newsroom-kits__download-all:hover {
  background: #3d9a3b;
}

@media (min-width: 768px) {
  .newsroom-kits__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .newsroom-kits__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* END_SECTION:newsroom-press-kits */

/* START_SECTION:newsroom-press-quotes (INDEX:39) */
/* ── Newsroom: Press Quotes ── */
.newsroom-quotes {
  padding: var(--space-3xl) 0;
  background: var(--color-surface-alt);
}

.newsroom-quotes__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.newsroom-quotes__heading {
  font-size: var(--font-size-2xl);
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 var(--space-xl);
}

.newsroom-quotes__track {
  display: flex;
  gap: var(--space-lg);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: var(--space-sm);
}

.newsroom-quotes__track::-webkit-scrollbar {
  display: none;
}

.newsroom-quotes__card {
  flex: 0 0 min(400px, 85vw);
  scroll-snap-align: start;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  background: var(--color-surface);
}

.newsroom-quotes__text {
  font-size: var(--font-size-lg);
  font-style: italic;
  line-height: 1.6;
  color: var(--color-text);
  margin: 0;
  flex: 1;
}

.newsroom-quotes__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  flex-wrap: wrap;
}

.newsroom-quotes__source {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.newsroom-quotes__logo-wrap {
  width: 80px;
  flex-shrink: 0;
}

.newsroom-quotes__logo {
  width: 100%;
  height: auto;
  display: block;
  opacity: 0.7;
}

.newsroom-quotes__source-name {
  font-style: normal;
  font-weight: 600;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.newsroom-quotes__article-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: #4aaf47;
  text-decoration: none;
}

.newsroom-quotes__article-link:hover {
  text-decoration: underline;
}

@media (min-width: 768px) {
  .newsroom-quotes__track {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    overflow: visible;
    scroll-snap-type: none;
  }

  .newsroom-quotes__card {
    flex: unset;
  }
}

@media (min-width: 1024px) {
  .newsroom-quotes__track {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* END_SECTION:newsroom-press-quotes */

/* START_SECTION:newsroom-releases (INDEX:40) */
/* ── Newsroom: Press Releases ── */
.newsroom-releases {
  padding: var(--space-3xl) 0;
}

.newsroom-releases__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.newsroom-releases__heading {
  font-size: var(--font-size-2xl);
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 var(--space-xl);
}

.newsroom-releases__track {
  display: flex;
  gap: var(--space-md);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: var(--space-sm);
}

.newsroom-releases__track::-webkit-scrollbar {
  display: none;
}

.newsroom-releases__card {
  flex: 0 0 280px;
  scroll-snap-align: start;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  background: var(--color-surface);
  transition: box-shadow 0.2s ease;
}

.newsroom-releases__card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.newsroom-releases__image-wrap {
  margin: calc(var(--space-lg) * -1) calc(var(--space-lg) * -1) 0;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  overflow: hidden;
}

.newsroom-releases__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.newsroom-releases__date {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.newsroom-releases__title {
  font-size: var(--font-size-md);
  font-weight: 600;
  color: var(--color-text);
  margin: 0;
  line-height: 1.4;
  flex: 1;
}

.newsroom-releases__title-link {
  color: inherit;
  text-decoration: none;
}

.newsroom-releases__title-link:hover {
  text-decoration: underline;
}

.newsroom-releases__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: #4aaf47;
  text-decoration: none;
  margin-top: auto;
}

.newsroom-releases__link:hover {
  text-decoration: underline;
}

@media (min-width: 768px) {
  .newsroom-releases__track {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: visible;
    scroll-snap-type: none;
  }

  .newsroom-releases__card {
    flex: unset;
  }
}

@media (min-width: 1024px) {
  .newsroom-releases__track {
    grid-template-columns: repeat(4, 1fr);
  }
}
/* END_SECTION:newsroom-releases */

/* START_SECTION:nooci-before-after (INDEX:41) */
.nooci-ba {
    padding: 80px 0;
    background: #F3F1E9;
  }

  .nooci-ba__header {
    text-align: center;
    margin-bottom: 48px;
  }

  .nooci-ba__eyebrow {
    display: block;
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #E16C47;
    margin-bottom: 12px;
  }

  .nooci-ba__heading {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    letter-spacing: -0.03em;
    color: #262320;
    margin: 0;
  }

  .nooci-ba__columns {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 40px;
    max-width: 800px;
    margin: 0 auto;
    align-items: start;
  }

  .nooci-ba__col-label {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 1rem;
    letter-spacing: -0.02em;
    color: #E16C47;
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(225, 108, 71, 0.2);
  }

  .nooci-ba__col-label--after {
    color: #4F576A;
    border-bottom-color: rgba(79, 87, 106, 0.2);
  }

  .nooci-ba__item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
    font-family: var(--font-body);
    font-size: 0.92rem;
    line-height: 1.5;
    color: #262320;
    opacity: 0.8;
  }

  .nooci-ba__item--after {
    opacity: 1;
  }

  .nooci-ba__x, .nooci-ba__check {
    flex-shrink: 0;
    margin-top: 2px;
    width: 14px;
    height: 14px;
  }

  .nooci-ba__divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding-top: 48px;
  }

  .nooci-ba__divider-line {
    width: 1px;
    height: 60px;
    background: rgba(38, 35, 32, 0.12);
  }

  .nooci-ba__divider-icon img {
    opacity: 0.15;
  }

  @media (max-width: 749px) {
    .nooci-ba { padding: 40px 0; }
    .nooci-ba__header { margin-bottom: 28px; }
    .nooci-ba__columns {
      grid-template-columns: 1fr;
      gap: 0;
    }
    .nooci-ba__col { padding: 0; }
    .nooci-ba__col-label {
      font-size: 0.875rem;
      margin-bottom: 14px;
      padding-bottom: 8px;
    }
    .nooci-ba__item {
      font-size: 0.8125rem;
      gap: 8px;
      margin-bottom: 10px;
      line-height: 1.45;
    }
    .nooci-ba__x, .nooci-ba__check {
      width: 12px;
      height: 12px;
      margin-top: 2px;
    }
    .nooci-ba__divider {
      flex-direction: row;
      padding: 10px 0;
      margin: 0;
    }
    .nooci-ba__divider-line {
      flex: 1;
      width: auto;
      height: 1px;
    }
    .nooci-ba__divider-icon img { width: 28px; height: 28px; }
  }
/* END_SECTION:nooci-before-after */

/* START_SECTION:nooci-benefits-grid (INDEX:42) */
.nooci-benefits-grid {
  padding: 64px 0;
}

.nooci-benefits-grid__container {
  border: 1px solid rgba(38, 35, 32, 0.1);
  border-radius: 12px;
  padding: 40px;
  background: #fff;
}

.nooci-benefits-grid__header {
  text-align: center;
  margin-bottom: 36px;
}

.nooci-benefits-grid__heading {
  font-family: var(--font-accent, 'Cormorant Garamond', serif);
  font-weight: 600;
  font-style: normal;
  font-size: clamp(26px, 3.5vw, 36px);
  letter-spacing: -0.03em;
  color: #262320;
  margin: 0 0 10px;
  line-height: 1.2;
}

.nooci-benefits-grid__subtitle {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 15px;
  font-weight: 400;
  color: #4F576A;
  margin: 0;
  letter-spacing: -0.03em;
  line-height: 1.5;
}

.nooci-benefits-grid__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.nooci-benefits-grid__card {
  display: flex;
  flex-direction: column;
}

.nooci-benefits-grid__image-wrap {
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  overflow: hidden;
  background: #F3F1E9;
}

.nooci-benefits-grid__image-wrap--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}

.nooci-benefits-grid__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nooci-benefits-grid__card-body {
  padding: 16px 4px 0;
}

.nooci-benefits-grid__card-heading {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: -0.03em;
  color: #262320;
  margin: 0 0 6px;
  line-height: 1.3;
}

.nooci-benefits-grid__card-desc {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 14px;
  font-weight: 400;
  color: #4F576A;
  margin: 0;
  letter-spacing: -0.03em;
  line-height: 1.5;
}

@media (max-width: 989px) {
  .nooci-benefits-grid__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

@media (max-width: 749px) {
  .nooci-benefits-grid {
    padding: 48px 0;
  }

  .nooci-benefits-grid__container {
    padding: 24px 20px;
  }

  .nooci-benefits-grid__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
/* END_SECTION:nooci-benefits-grid */

/* START_SECTION:nooci-color-block (INDEX:44) */
/* ── NOOCI Color Block ── */
.ncb {
  position: relative;
  width: 100%;
  background-color: var(--ncb-bg);
  color: var(--ncb-text);
  overflow: hidden;
}

.ncb__inner {
  position: relative;
  z-index: 2;
  max-width: 780px;
  margin: 0 auto;
  padding: 100px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.ncb__heading {
  font-family: var(--font-heading);
  font-weight: 600;
  letter-spacing: -0.03em;
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.1;
  margin: 0;
  color: inherit;
}

.ncb__body {
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  line-height: 1.65;
  max-width: 560px;
  color: inherit;
  opacity: 0.88;
}

.ncb__body p {
  margin: 0 0 0.5em;
}

.ncb__body p:last-child {
  margin-bottom: 0;
}

.ncb__cta {
  display: inline-block;
  background: var(--ncb-btn-bg);
  color: var(--ncb-btn-text);
  border-radius: 9999px;
  padding: 0.85em 2em;
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: -0.01em;
  text-decoration: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
  border: none;
  cursor: pointer;
}

.ncb__cta:hover {
  opacity: 0.88;
  transform: translateY(-1px);
}

/* ── Oversized background icon ── */
.ncb__icon-wrap {
  position: absolute;
  right: -4%;
  top: 50%;
  transform: translateY(-50%);
  width: 50%;
  max-width: 520px;
  pointer-events: none;
  z-index: 1;
}

.ncb__icon-img {
  width: 100%;
  height: auto;
  opacity: 0.1;
  display: block;
}

.ncb__curved-text {
  position: absolute;
  top: 10%;
  left: 10%;
  width: 80%;
  height: 80%;
  animation: ncb-spin 40s linear infinite;
  opacity: 0.35;
}

@keyframes ncb-spin {
  to { transform: rotate(360deg); }
}

/* ── Desktop ── */
@media (min-width: 768px) {
  .ncb__inner {
    padding: 160px 48px;
  }

  .ncb__icon-wrap {
    right: -2%;
    width: 42%;
  }
}

/* ── Mobile adjustments ── */
@media (max-width: 767px) {
  .ncb__icon-wrap {
    width: 65%;
    right: -12%;
    opacity: 0.7;
  }

  .ncb__curved-text {
    display: none;
  }
}
/* END_SECTION:nooci-color-block */

/* START_SECTION:nooci-compare-table (INDEX:45) */
.nooci-compare {
  padding: 64px 0;
}

.nooci-compare__header {
  text-align: center;
  margin-bottom: 40px;
}

.nooci-compare__eyebrow {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #E16C47;
  margin: 0 0 12px;
}

.nooci-compare__heading {
  font-family: var(--font-accent, 'Cormorant Garamond', serif);
  font-weight: 600;
  font-style: normal;
  font-size: clamp(28px, 4vw, 40px);
  letter-spacing: -0.03em;
  color: #262320;
  margin: 0;
  line-height: 1.2;
}

.nooci-compare__table-wrap {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  max-width: 900px;
  margin: 0 auto;
  box-shadow: 0 1px 3px rgba(38, 35, 32, 0.06);
}

.nooci-compare__col-headers {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 0;
  border-bottom: 1px solid rgba(38, 35, 32, 0.1);
}

.nooci-compare__col-label {
  padding: 20px 16px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #262320;
  display: flex;
  align-items: center;
  gap: 10px;
}

.nooci-compare__col-label--nooci {
  background: rgba(225, 108, 71, 0.06);
  justify-content: center;
  text-align: center;
  flex-direction: column;
  gap: 8px;
}

.nooci-compare__col-label--competitor {
  justify-content: center;
  text-align: center;
  color: #4F576A;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.4;
}

.nooci-compare__product-img {
  border-radius: 8px;
  object-fit: cover;
}

.nooci-compare__row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 0;
  border-bottom: 1px solid rgba(38, 35, 32, 0.06);
}

.nooci-compare__row:last-child {
  border-bottom: none;
}

.nooci-compare__cell {
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.nooci-compare__cell--feature {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 500;
  font-size: 14px;
  letter-spacing: -0.03em;
  color: #262320;
}

.nooci-compare__cell--nooci {
  background: rgba(225, 108, 71, 0.04);
  align-items: center;
  text-align: center;
}

.nooci-compare__cell--competitor {
  align-items: center;
  text-align: center;
}

.nooci-compare__indicator {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
  margin-bottom: 4px;
}

.nooci-compare__badge {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.nooci-compare__badge--yes {
  background: #262320;
}

.nooci-compare__badge--no {
  background: #E8E6E0;
}

.nooci-compare__badge-text {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.03em;
}

.nooci-compare__badge-text--yes {
  color: #262320;
}

.nooci-compare__badge-text--no {
  color: #999;
}

.nooci-compare__value {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  color: #4F576A;
  margin: 2px 0 0;
  letter-spacing: -0.03em;
}

@media (max-width: 749px) {
  .nooci-compare { padding: 40px 0; }
  .nooci-compare__header { margin-bottom: 24px; }

  /* Horizontal scroll for the table on mobile. Keep the visible
     edges INSIDE .page-width with a small internal margin so the
     rounded corners aren't clipped by the viewport edge. */
  .nooci-compare__table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    border-radius: 10px;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .nooci-compare__table-wrap::-webkit-scrollbar { display: none; }

  /* Force a minimum width so the table scrolls instead of cramming */
  .nooci-compare__col-headers,
  .nooci-compare__row {
    min-width: 520px;
  }

  .nooci-compare__col-headers {
    display: grid;
    grid-template-columns: minmax(140px, 1.2fr) 1fr 1fr;
    gap: 0;
    position: sticky;
    top: 0;
    z-index: 2;
  }

  .nooci-compare__col-label--feature {
    display: block;
    font-size: 11px;
    padding: 10px 12px;
  }
  .nooci-compare__col-label--nooci,
  .nooci-compare__col-label--competitor {
    padding: 10px 12px;
    font-size: 12px;
  }

  .nooci-compare__row {
    display: grid;
    grid-template-columns: minmax(140px, 1.2fr) 1fr 1fr;
    padding: 0;
  }

  .nooci-compare__cell--feature {
    padding: 10px 12px;
    font-size: 12px;
    font-weight: 600;
    grid-column: auto;
  }

  .nooci-compare__cell--nooci,
  .nooci-compare__cell--competitor {
    padding: 10px 12px;
    font-size: 12px;
  }
}
/* END_SECTION:nooci-compare-table */

/* START_SECTION:nooci-editorial (INDEX:46) */
.nooci-editorial {
    background-color: var(--color-background, #F3F1E9);
    color: var(--color-foreground, #262320);
    padding: 6rem 0;
  }

  .nooci-editorial--light {
    color: #F3F1E9;
  }

  .nooci-editorial--light .nooci-editorial__eyebrow {
    color: var(--color-coral, #E16C47);
  }

  .nooci-editorial--light .nooci-editorial__btn {
    background-color: #F3F1E9;
    color: var(--color-foreground, #262320);
  }

  /* ---- Centered layout ---- */
  .nooci-editorial--centered .nooci-editorial__inner {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .nooci-editorial--centered .nooci-editorial__heading-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 48rem;
  }

  .nooci-editorial--centered .nooci-editorial__body {
    max-width: 40rem;
  }

  /* ---- Split layout ---- */
  .nooci-editorial--split .nooci-editorial__inner {
    display: grid;
    grid-template-columns: 2fr 3fr;
    gap: 4rem;
    align-items: start;
  }

  .nooci-editorial--split .nooci-editorial__body {
    max-width: 40rem;
  }

  /* ---- Eyebrow ---- */
  .nooci-editorial__eyebrow {
    display: block;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-coral, #E16C47);
    margin-bottom: 1.25rem;
  }

  /* ---- Heading ---- */
  .nooci-editorial__heading {
    margin: 0 0 1.75rem;
    line-height: 1.15;
    font-size: clamp(1.75rem, 4vw, 3rem);
  }

  .nooci-editorial__heading--bold {
    font-family: var(--font-heading, 'Inter', sans-serif);
    font-weight: 500;
    letter-spacing: -0.03em;
  }

  .nooci-editorial__heading--editorial {
    font-family: var(--font-accent, 'Cormorant Garamond', serif);
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0;
    line-height: 1.2;
  }

  /* ---- Body ---- */
  .nooci-editorial__body {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 1.05rem;
    line-height: 1.75;
    opacity: 0.85;
  }

  .nooci-editorial__body p {
    margin: 0 0 1em;
  }

  .nooci-editorial__body p:last-child {
    margin-bottom: 0;
  }

  /* ---- CTA ---- */
  .nooci-editorial__cta {
    margin-top: 2.25rem;
  }

  .nooci-editorial__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.85em 2em;
    text-decoration: none;
    background-color: var(--color-coral, #E16C47);
    color: #fff;
    transition: opacity 0.25s ease, transform 0.25s ease;
    cursor: pointer;
    border: none;
  }

  .nooci-editorial__btn:hover {
    opacity: 0.85;
    transform: translateY(-1px);
  }

  @media (max-width: 749px) {
    .nooci-editorial {
      padding: 4rem 0;
    }

    .nooci-editorial--split .nooci-editorial__inner {
      grid-template-columns: 1fr;
      gap: 1.5rem;
    }
  }
/* END_SECTION:nooci-editorial */

/* START_SECTION:nooci-expert-endorsement (INDEX:48) */
.nooci-expert {
    padding: 72px 0;
  }

  .nooci-expert__inner {
    display: flex;
    align-items: center;
    gap: 48px;
    max-width: 800px;
    margin: 0 auto;
  }

  .nooci-expert__photo {
    flex-shrink: 0;
  }

  .nooci-expert__img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
  }

  .nooci-expert__photo--placeholder {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgba(38, 35, 32, 0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #262320;
    opacity: 0.3;
  }

  .nooci-expert__content {
    position: relative;
    background: #FBF8F2;
    border-left: 3px solid #E16C47;
    border-radius: 12px;
    padding: 28px 32px;
    box-shadow: 0 2px 0 rgba(38, 35, 32, 0.03), 0 12px 32px rgba(38, 35, 32, 0.06);
  }

  .nooci-expert__quote-mark {
    position: absolute;
    top: 12px;
    left: 18px;
  }

  .nooci-expert__quote {
    font-family: var(--font-accent, 'Cormorant Garamond', serif);
    font-weight: 400;
    font-style: normal;
    font-size: clamp(1.15rem, 2.2vw, 1.5rem);
    line-height: 1.5;
    color: #262320;
    margin: 0 0 20px;
    padding-left: 4px;
  }

  .nooci-expert__meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .nooci-expert__name {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 0.95rem;
    letter-spacing: -0.01em;
    color: #262320;
  }

  .nooci-expert__creds {
    font-family: var(--font-body);
    font-size: 0.8rem;
    color: #262320;
    opacity: 0.6;
    line-height: 1.4;
  }

  @media (max-width: 749px) {
    .nooci-expert { padding: 48px 0; }
    .nooci-expert__inner {
      flex-direction: column;
      text-align: left;
      gap: 20px;
    }
    .nooci-expert__content { padding: 22px 22px 22px 24px; }
    .nooci-expert__quote-mark { display: block; top: 10px; left: 14px; width: 28px; height: 22px; }
    .nooci-expert__quote { font-size: 1rem; padding-top: 8px; }
    .nooci-expert__meta { align-items: flex-start; }
  }
/* END_SECTION:nooci-expert-endorsement */

/* START_SECTION:nooci-founder-bio (INDEX:50) */
.fb {
  padding: 5rem 0;
  background: var(--color-background, #F3F1E9);
}
.fb__header {
  text-align: center;
  margin-bottom: 3rem;
}
.fb__eyebrow {
  display: inline-block;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-accent, #E16C47);
  margin-bottom: 0.75rem;
}
.fb__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: var(--color-foreground, #262320);
  margin: 0;
}

.fb__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr);
  gap: 3rem;
  align-items: start;
  max-width: 1040px;
  margin: 0 auto;
}

.fb__media {
  position: relative;
}
.fb__photo {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 18px;
  background: #e9e5d9;
}
.fb__photo-badge {
  position: absolute;
  bottom: -12px;
  left: -12px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: var(--color-accent, #E16C47);
  padding: 8px 16px;
  border-radius: 9999px;
  box-shadow: 0 6px 18px rgba(225, 108, 71, 0.3);
}

.fb__body {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.fb__name {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  letter-spacing: -0.02em;
  color: var(--color-foreground, #262320);
  margin: 0;
  line-height: 1.15;
}
.fb__role {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
  color: rgba(38, 35, 32, 0.6);
  margin: -0.75rem 0 0;
  letter-spacing: 0.01em;
}

.fb__credentials {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px 20px;
}
.fb__credential {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--color-foreground, #262320);
}
.fb__credential svg {
  flex-shrink: 0;
  margin-top: 2px;
}

.fb__bio {
  font-family: var(--font-accent, 'Cormorant Garamond', serif);
  font-size: 1.125rem;
  line-height: 1.65;
  color: rgba(38, 35, 32, 0.82);
  font-weight: 400;
  letter-spacing: 0.005em;
}
.fb__bio p { margin: 0 0 0.85em; }
.fb__bio p:last-child { margin-bottom: 0; }
.fb__bio em, .fb__bio i { font-style: italic; color: rgba(38,35,32,0.95); }
.fb__bio strong, .fb__bio b { font-weight: 600; color: var(--color-foreground,#262320); font-style: normal; }

.fb__photo--placeholder {
  display: flex; align-items: center; justify-content: center;
  background: rgba(38, 35, 32, 0.06);
}
.fb__photo-svg { width: 40%; height: 40%; opacity: 0.3; }

.fb__quote {
  position: relative;
  margin: 1rem 0 0;
  padding: 1.25rem 1.5rem 1.25rem 3rem;
  background: #fff;
  border-radius: 14px;
  border-left: 3px solid var(--color-accent, #E16C47);
}
.fb__quote-mark {
  position: absolute;
  top: 1.25rem;
  left: 1rem;
}
.fb__quote p {
  margin: 0;
  font-family: var(--font-accent, 'Cormorant Garamond', serif);
  font-size: 1.15rem;
  line-height: 1.45;
  color: var(--color-foreground, #262320);
  font-style: italic;
}
.fb__quote-attr {
  margin-top: 0.5rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  color: rgba(38, 35, 32, 0.6);
  font-style: normal;
}

.fb__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding: 12px 24px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
  font-size: 0.9375rem;
  color: #fff;
  background: var(--color-accent, #E16C47);
  border-radius: 9999px;
  text-decoration: none;
  transition: background 0.2s, transform 0.2s;
}
.fb__cta:hover {
  background: #c9563a;
  transform: translateY(-1px);
  text-decoration: none;
}

@media (max-width: 749px) {
  .fb { padding: 3rem 0; }
  .fb__header { margin-bottom: 1.5rem; }
  .fb__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .fb__photo { aspect-ratio: 4 / 4; border-radius: 14px; }
  .fb__credentials { grid-template-columns: 1fr; }
  .fb__quote { padding: 1rem 1.25rem 1rem 2.5rem; }
  .fb__quote-mark { top: 1rem; left: 0.75rem; width: 22px; height: 18px; }
  .fb__quote p { font-size: 1.05rem; }
}
/* END_SECTION:nooci-founder-bio */

/* START_SECTION:nooci-fullwidth-quote (INDEX:52) */
.nooci-fwq{position:relative;overflow:hidden;padding:80px 0;color:var(--color-foreground)}
@media(min-width:990px){.nooci-fwq{padding:140px 0}}
.nooci-fwq--dark{color:var(--color-background,#F3F1E9)}
.nooci-fwq__inner{position:relative;z-index:2;max-width:800px;margin:0 auto;text-align:center}
.nooci-fwq__quote{margin:0;padding:0;border:none}
.nooci-fwq__quote p{font-family:var(--font-accent,'Cormorant Garamond',serif);font-weight:400;font-style:italic;font-size:clamp(1.5rem,4vw,2.75rem);line-height:1.35;margin:0}
.nooci-fwq__attribution{display:block;font-family:var(--font-body);font-style:normal;font-size:0.875rem;font-weight:500;letter-spacing:0.05em;text-transform:uppercase;opacity:0.6;margin-top:2rem}
.nooci-fwq__brandmark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none}
.nooci-fwq__brandmark-img{display:block;width:240px;height:240px;opacity:0.04}
.nooci-fwq--dark .nooci-fwq__brandmark-img{filter:invert(1);opacity:0.06}
@media(min-width:990px){.nooci-fwq__brandmark-img{width:360px;height:360px}}
/* END_SECTION:nooci-fullwidth-quote */

/* START_SECTION:nooci-hero (INDEX:53) */
.nooci-hero {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 75svh;
    max-height: 800px;
    background-color: var(--color-background, #F3F1E9);
    color: var(--color-foreground, #262320);
    overflow: hidden;
  }

  .nooci-hero__media {
    position: absolute;
    inset: 0;
    z-index: 0;
  }

  .nooci-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .nooci-hero__overlay {
    position: absolute;
    inset: 0;
    background-color: var(--color-foreground, #262320);
    pointer-events: none;
  }

  .nooci-hero__content {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 6rem 1.5rem;
    width: 100%;
  }

  .nooci-hero__text {
    max-width: 52rem;
  }

  .nooci-hero__heading {
    font-family: var(--font-heading, 'Inter', sans-serif);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.08;
    font-size: clamp(2.4rem, 5.5vw, 4.5rem);
    margin: 0 0 1.5rem;
  }

  .nooci-hero__media ~ .nooci-hero__content .nooci-hero__heading {
    color: #fff;
  }

  .nooci-hero__subheading {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: clamp(1rem, 1.8vw, 1.25rem);
    line-height: 1.6;
    margin: 0 0 2.5rem;
    opacity: 0.8;
    max-width: 36rem;
    margin-inline: auto;
  }

  .nooci-hero__media ~ .nooci-hero__content .nooci-hero__subheading {
    color: #fff;
  }

  .nooci-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
  }

  .nooci-hero__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.85em 2em;
    text-decoration: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
    cursor: pointer;
    border: none;
  }

  .nooci-hero__btn:hover {
    opacity: 0.85;
    transform: translateY(-1px);
  }

  .nooci-hero__btn--primary {
    background-color: var(--color-coral, #E16C47);
    color: #fff;
  }

  .nooci-hero__btn--secondary {
    background-color: transparent;
    color: var(--color-foreground, #262320);
    border: 1.5px solid var(--color-foreground, #262320);
  }

  .nooci-hero__media ~ .nooci-hero__content .nooci-hero__btn--secondary {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.5);
  }

  /* ── Decorative sachet behind hero text ── */
  .nooci-hero__sachet-deco {
    position: absolute;
    right: 8%;
    top: 50%;
    z-index: 0;
    pointer-events: none;
    transform: translateY(-30%) rotate(-8deg);
    width: clamp(120px, 18vw, 280px);
    opacity: 0;
    -webkit-mask-image: linear-gradient(to top, transparent 0%, black 40%);
    mask-image: linear-gradient(to top, transparent 0%, black 40%);
    animation: nooci-sachet-hero-reveal 1500ms cubic-bezier(0.16, 1, 0.3, 1) 300ms forwards;
  }

  .nooci-hero__sachet-img {
    width: 100%;
    height: auto;
    display: block;
  }

  @keyframes nooci-sachet-hero-reveal {
    from {
      opacity: 0;
      transform: translateY(-10%) rotate(-10deg) scale(0.9);
    }
    to {
      opacity: 0.35;
      transform: translateY(-40%) rotate(-8deg) scale(1);
    }
  }

  /* Sachet sits between background (z:0) and content (z:1) */
  .nooci-hero__media ~ .nooci-hero__sachet-deco {
    z-index: 0;
  }

  .nooci-hero__sachet-deco + .nooci-hero__content {
    z-index: 1;
  }

  @media (max-width: 749px) {
    .nooci-hero__sachet-deco {
      right: -5%;
      width: clamp(80px, 25vw, 160px);
      opacity: 0;
    }
  }

  .nooci-hero__scroll {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    opacity: 0.5;
    color: var(--color-foreground, #262320);
  }

  /* Hide scroll indicator on mobile — too tight with the CTA stack */
  @media (max-width: 749px) {
    .nooci-hero__scroll { display: none; }
  }

  .nooci-hero__media ~ .nooci-hero__scroll {
    color: #fff;
  }

  .nooci-hero__scroll-dot {
    animation: nooci-scroll-bounce 2s ease-in-out infinite;
  }

  @keyframes nooci-scroll-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(8px); opacity: 0.3; }
  }

  @media (max-width: 749px) {
    .nooci-hero__content {
      padding: 4rem 1.25rem;
    }

    .nooci-hero__actions {
      flex-direction: column;
      align-items: center;
    }

    .nooci-hero__btn {
      width: 100%;
      max-width: 18rem;
    }
  }
/* END_SECTION:nooci-hero */

/* START_SECTION:nooci-image-text (INDEX:54) */
.nooci-it {
    padding: 4rem 0;
  }

  .nooci-it__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: center;
  }

  @media (min-width: 990px) {
    .nooci-it {
      padding: 6rem 0;
    }

    .nooci-it__grid {
      grid-template-columns: 1fr 1fr;
      gap: 0;
    }

    .nooci-it--image-right .nooci-it__media {
      order: 2;
    }

    .nooci-it--image-right .nooci-it__content {
      order: 1;
    }
  }

  .nooci-it__media {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
  }

  .nooci-it__img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 4 / 5;
    border-radius: 8px;
  }

  @media (min-width: 990px) {
    .nooci-it__img {
      aspect-ratio: 3 / 4;
      min-height: 500px;
    }
  }

  .nooci-it__media--placeholder {
    background: #e8e6de;
    aspect-ratio: 4 / 5;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .nooci-it__placeholder {
    width: 60%;
    height: auto;
    opacity: 0.3;
  }

  .nooci-it__content {
    padding: 2rem 0;
  }

  @media (min-width: 990px) {
    .nooci-it__content {
      padding: var(--space-3xl, 4rem);
    }
  }

  .nooci-it__eyebrow {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-accent, #E16C47);
    margin: 0 0 1rem;
  }

  .nooci-it__heading {
    font-family: var(--font-heading, 'Inter', sans-serif);
    font-weight: 500;
    letter-spacing: -0.03em;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    line-height: 1.15;
    color: var(--color-foreground, #262320);
    margin: 0 0 1.25rem;
  }

  .nooci-it__body {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 1rem;
    line-height: 1.7;
    color: var(--color-foreground, #262320);
    opacity: 0.8;
    margin: 0 0 2rem;
  }

  .nooci-it__body p {
    margin: 0 0 1em;
  }

  .nooci-it__body p:last-child {
    margin-bottom: 0;
  }

  .nooci-it__cta {
    display: inline-block;
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    background: var(--color-foreground, #262320);
    border-radius: 9999px;
    padding: 0.85em 2em;
    transition: opacity 0.25s ease;
  }

  .nooci-it__cta:hover {
    opacity: 0.85;
  }
/* END_SECTION:nooci-image-text */

/* START_SECTION:nooci-ingredients-detail (INDEX:55) */
/* ── NOOCI Ingredients Detail — grid cards + modal overlays ── */

.nid {
  width: 100%;
  padding: 5rem 0;
  background: #F3F1E9;
}

.nid__inner {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1.25rem;
}

/* ── Header ── */
.nid__header {
  text-align: center;
  margin-bottom: 3.5rem;
}

.nid__eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #E16C47;
  margin-bottom: 0.75rem;
}

.nid__heading {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  letter-spacing: -0.03em;
  color: #262320;
  margin: 0 0 0.6rem;
  line-height: 1.15;
}

.nid__subtitle {
  font-family: var(--font-accent);
  font-weight: 400;
  font-style: normal;
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  color: #262320;
  margin: 0;
  line-height: 1.5;
  max-width: 36rem;
  margin-inline: auto;
  opacity: 0.72;
}
.nid__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.25rem;
  padding: 0.75rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #262320;
  background: transparent;
  border: 1px solid rgba(38, 35, 32, 0.25);
  border-radius: 999px;
  text-decoration: none;
  transition: all 180ms ease;
}
.nid__cta:hover {
  background: #262320;
  color: #F3F1E9;
  border-color: #262320;
}
.nid__cta svg {
  transition: transform 180ms ease;
}
.nid__cta:hover svg {
  transform: translateX(3px);
}

/* ── Grid — 3-col desktop, horizontal scroll mobile ── */
.nid__grid {
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 0.5rem;
}

.nid__grid::-webkit-scrollbar {
  display: none;
}

@media (min-width: 750px) {
  .nid__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    overflow: visible;
    scroll-snap-type: none;
    padding-bottom: 0;
  }
}

/* allow 5 cards in the 3-col grid — last two center */
@media (min-width: 750px) {
  .nid__grid {
    justify-items: center;
  }

  .nid__card {
    width: 100%;
    max-width: 100%;
  }

  /* center the last row if fewer than 3 */
  .nid__grid::after {
    content: '';
    display: none;
  }
}

/* ── Card ── */
.nid__card {
  flex: 0 0 72%;
  max-width: 72%;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  background: transparent;
  border: 1px solid rgba(38, 35, 32, 0.12);
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  padding: 0;
  font: inherit;
  color: inherit;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.nid__card:hover,
.nid__card:focus-visible {
  border-color: rgba(38, 35, 32, 0.28);
  transform: translateY(-2px);
}

.nid__card:focus-visible {
  outline: 2px solid #E16C47;
  outline-offset: 2px;
}

@media (min-width: 750px) {
  .nid__card {
    flex: none;
    max-width: none;
  }
}

/* ── Card image ── */
.nid__card-image {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: rgba(38, 35, 32, 0.04);
}

.nid__card-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.nid__card:hover .nid__card-img {
  transform: scale(1.04);
}

.nid__card-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nid__card-placeholder-svg {
  width: 40%;
  height: auto;
  opacity: 0.15;
}

/* ── Card body ── */
.nid__card-body {
  padding: 1rem 1.25rem 1.25rem;
}

.nid__card-name {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.05rem;
  letter-spacing: -0.03em;
  color: #262320;
  margin: 0 0 0.15rem;
  line-height: 1.3;
}

.nid__card-tcm {
  font-family: var(--font-accent);
  font-weight: 400;
  font-style: normal;
  font-size: 0.9rem;
  color: #262320;
  opacity: 0.6;
  margin: 0 0 0.5rem;
  line-height: 1.3;
}

.nid__card-benefit {
  font-family: var(--font-body);
  font-size: 0.82rem;
  line-height: 1.55;
  color: #262320;
  opacity: 0.72;
  margin: 0;
}

/* ── Modal overlay ── */
.nid__modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.nid__modal--open {
  opacity: 1;
  visibility: visible;
}

.nid__modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(38, 35, 32, 0.45);
  cursor: pointer;
}

.nid__modal-panel {
  position: relative;
  z-index: 1;
  width: 90vw;
  max-width: 560px;
  max-height: 90vh;
  overflow-y: auto;
  background: #F3F1E9;
  border-radius: 16px;
  transform: translateY(12px);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.nid__modal--open .nid__modal-panel {
  transform: translateY(0);
}

/* ── Modal close button ── */
.nid__modal-close {
  position: sticky;
  top: 0;
  float: right;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 12px 12px 0 0;
  background: rgba(38, 35, 32, 0.06);
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  color: #262320;
  transition: background 0.2s ease;
}

.nid__modal-close:hover,
.nid__modal-close:focus-visible {
  background: rgba(38, 35, 32, 0.12);
}

.nid__modal-close:focus-visible {
  outline: 2px solid #E16C47;
  outline-offset: 2px;
}

/* ── Modal image ── */
.nid__modal-image {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: rgba(38, 35, 32, 0.04);
}

.nid__modal-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ── Modal content ── */
.nid__modal-content {
  padding: 1.75rem 2rem 2.25rem;
}

.nid__modal-name {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  letter-spacing: -0.03em;
  color: #262320;
  margin: 0 0 0.15rem;
  line-height: 1.2;
}

.nid__modal-tcm {
  font-family: var(--font-accent);
  font-weight: 400;
  font-style: normal;
  font-size: 1.05rem;
  color: #262320;
  opacity: 0.55;
  margin: 0 0 1.25rem;
  line-height: 1.3;
}

.nid__modal-desc,
.nid__modal-history,
.nid__modal-dosage {
  font-family: var(--font-body);
  font-size: 0.92rem;
  line-height: 1.65;
  color: #262320;
  margin-bottom: 1.5rem;
}

.nid__modal-desc p,
.nid__modal-history p,
.nid__modal-dosage p {
  margin: 0 0 0.5rem;
}

.nid__modal-label {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #E16C47;
  margin: 0 0 0.5rem;
}

/* ── Mobile tweaks ── */
@media (max-width: 749px) {
  .nid {
    padding: 3.5rem 0;
  }

  .nid__header {
    margin-bottom: 2.5rem;
  }

  .nid__card {
    flex: 0 0 68%;
    max-width: 68%;
  }

  .nid__modal-content {
    padding: 1.25rem 1.5rem 2rem;
  }

  .nid__modal-panel {
    max-height: 85vh;
    border-radius: 12px;
  }
}
/* END_SECTION:nooci-ingredients-detail */

/* START_SECTION:nooci-ingredients (INDEX:56) */
/* ── Ingredients Story — editorial ingredient showcase ── */
.ingredients-story {
  width: 100%;
  padding: 4rem 0;
}

.ingredients-story__inner {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1rem;
}

/* ── Header ── */
.ingredients-story__header {
  text-align: center;
  margin-bottom: 3.5rem;
}

.ingredients-story__eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: 0.75rem;
}

.ingredients-story__heading {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  letter-spacing: -0.03em;
  color: var(--color-foreground);
  margin: 0 0 0.6rem;
  line-height: 1.15;
}

.ingredients-story__subtitle {
  font-family: var(--font-accent);
  font-weight: 400;
  font-style: normal;
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  color: var(--color-navy);
  margin: 0;
  line-height: 1.5;
  max-width: 36rem;
  margin-inline: auto;
}

/* ── Row — desktop grid, mobile horizontal scroll ── */
.ingredients-story__row {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 0.5rem;
}

.ingredients-story__row::-webkit-scrollbar {
  display: none;
}

@media (min-width: 750px) {
  .ingredients-story__row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    overflow: visible;
    scroll-snap-type: none;
    padding-bottom: 0;
  }
}

/* ── Ingredient card ── */
.ingredients-story__card {
  flex: 0 0 72%;
  max-width: 72%;
  scroll-snap-align: start;
}

@media (min-width: 750px) {
  .ingredients-story__card {
    flex: none;
    max-width: none;
  }
}

/* ── Image area ── */
.ingredients-story__image-area {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 0.5rem;
  margin-bottom: 1.25rem;
  background: rgba(0, 0, 0, 0.03);
}

.ingredients-story__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ingredients-story__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.03);
}

.ingredients-story__placeholder-svg {
  width: 50%;
  height: auto;
  opacity: 0.2;
}

/* ── Text area ── */
.ingredients-story__text-area {
  border-top: 1px solid var(--color-border, rgba(0, 0, 0, 0.1));
  padding-top: 1rem;
}

.ingredients-story__name {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.05rem;
  letter-spacing: -0.02em;
  color: var(--color-foreground);
  margin: 0 0 0.2rem;
  line-height: 1.3;
}

.ingredients-story__tcm-name {
  font-family: var(--font-accent);
  font-weight: 400;
  font-style: normal;
  font-size: 0.9rem;
  color: var(--color-navy);
  margin: 0 0 0.6rem;
  line-height: 1.4;
}

.ingredients-story__description {
  font-family: var(--font-body);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--color-foreground);
  opacity: 0.75;
  margin: 0 0 0.6rem;
}

.ingredients-story__badge {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-coral);
  letter-spacing: 0.01em;
  line-height: 1.4;
}

/* ── Footer CTA ── */
.ingredients-story__footer {
  text-align: center;
  margin-top: 3rem;
}

.ingredients-story__cta {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-background);
  background: var(--color-foreground);
  border: none;
  border-radius: 9999px;
  padding: 0.85em 2em;
  text-decoration: none;
  transition: opacity 0.3s ease;
}

.ingredients-story__cta:hover,
.ingredients-story__cta:focus-visible {
  opacity: 0.85;
}

/* ── Mobile: full-viewport scroll with inline padding ── */
@media (max-width: 749px) {
  .ingredients-story {
    padding: 3rem 0;
  }

  .ingredients-story__header {
    margin-bottom: 2.5rem;
  }

  .ingredients-story__row {
    /* Full-bleed: scroll area reaches viewport edges */
    margin-left: calc(-1 * var(--page-padding, 16px));
    margin-right: calc(-1 * var(--page-padding, 16px));
    padding-left: 0;
    padding-right: 0;
  }
  /* Inline padding via spacers so first/last cards align with grid */
  .ingredients-story__row::before,
  .ingredients-story__row::after {
    content: '';
    flex-shrink: 0;
    width: var(--page-padding, 16px);
  }

  .ingredients-story__card {
    flex: 0 0 72%;
    max-width: 72%;
  }
}
/* END_SECTION:nooci-ingredients */

/* START_SECTION:nooci-inline-cta (INDEX:57) */
.inline-cta { padding: 2.5rem 0; background: var(--bg); }
.inline-cta__inner { max-width: 720px; margin: 0 auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.inline-cta__eyebrow {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--color-accent, #E16C47);
  margin: 0;
}
.inline-cta__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-size: clamp(1.125rem, 2vw, 1.375rem); font-weight: 600;
  line-height: 1.3; letter-spacing: -0.01em;
  color: var(--color-foreground, #262320); margin: 0;
  max-width: 560px;
}
.inline-cta__btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 24px; margin-top: 6px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem; font-weight: 700;
  color: #fff; background: var(--color-accent, #E16C47);
  border-radius: 9999px; text-decoration: none;
  box-shadow: 0 6px 18px rgba(225,108,71,0.28);
  transition: background 0.2s, transform 0.2s;
}
.inline-cta__btn:hover { background: #c9563a; transform: translateY(-1px); text-decoration: none; }
.inline-cta__micro {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem; color: rgba(38,35,32,0.55);
  margin: 2px 0 0;
}
@media (max-width: 749px) { .inline-cta { padding: 2rem 0; } }
/* END_SECTION:nooci-inline-cta */

/* START_SECTION:nooci-is-this-for-you (INDEX:58) */
.itfy { padding: 4rem 0; background: {{ section.settings.bg_color | default: '#F3F1E9' }}; }
.itfy__inner { max-width: 960px; margin: 0 auto; text-align: center; }
.itfy__eyebrow {
  display: inline-block;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--color-accent, #E16C47);
  padding: 4px 12px; background: rgba(225,108,71,0.08);
  border-radius: 9999px; margin-bottom: 0.75rem;
}
.itfy__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600; font-size: clamp(1.5rem, 3vw, 2.25rem);
  line-height: 1.15; letter-spacing: -0.02em;
  color: var(--color-foreground, #262320); margin: 0 0 0.5rem;
}
.itfy__sub {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 1rem; line-height: 1.55;
  color: rgba(38,35,32,0.7); margin: 0 auto 2rem; max-width: 560px;
}
.itfy__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
  text-align: left; margin-top: 1rem;
}
.itfy__col {
  background: #fff; border-radius: 14px; padding: 24px 24px 20px;
  border: 1px solid rgba(38,35,32,0.08);
}
.itfy__col--no { background: #FBF8F2; }
.itfy__col-head {
  display: flex; align-items: center; gap: 10px;
  padding-bottom: 14px; margin-bottom: 14px;
  border-bottom: 1px solid rgba(38,35,32,0.08);
}
.itfy__col-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 9999px;
}
.itfy__col--yes .itfy__col-icon { background: rgba(76, 149, 108, 0.14); color: #3E8A60; }
.itfy__col--no  .itfy__col-icon { background: rgba(38,35,32,0.08); color: rgba(38,35,32,0.55); }
.itfy__col-title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-size: 1rem; font-weight: 600; margin: 0;
  color: var(--color-foreground, #262320);
}
.itfy__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.itfy__item {
  position: relative; padding-left: 22px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem; line-height: 1.5;
  color: rgba(38,35,32,0.82);
}
.itfy__col--yes .itfy__item::before {
  content: ''; position: absolute; left: 4px; top: 0.55em;
  width: 8px; height: 8px; border-radius: 9999px; background: #4C956C;
}
.itfy__col--no .itfy__item::before {
  content: ''; position: absolute; left: 2px; top: 0.65em;
  width: 10px; height: 2px; background: rgba(38,35,32,0.35);
}
.itfy__cta-row { margin-top: 2rem; text-align: center; }
.itfy__cta {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 26px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 1rem; font-weight: 700; color: #fff;
  background: var(--color-accent, #E16C47);
  border-radius: 9999px; text-decoration: none;
  box-shadow: 0 6px 18px rgba(225,108,71,0.28);
  transition: background 0.2s, transform 0.2s;
}
.itfy__cta:hover { background: #c9563a; transform: translateY(-1px); text-decoration: none; }
@media (max-width: 749px) {
  .itfy { padding: 3rem 0; }
  .itfy__grid { grid-template-columns: 1fr; gap: 14px; }
  .itfy__col { padding: 20px; }
}
/* END_SECTION:nooci-is-this-for-you */

/* START_SECTION:nooci-problem-agitate (INDEX:60) */
.nooci-problem {
    padding: 80px 0;
  }

  .nooci-problem__header {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 56px;
  }

  .nooci-problem__eyebrow {
    display: block;
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #E16C47;
    margin-bottom: 16px;
  }

  .nooci-problem__heading {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    letter-spacing: -0.03em;
    line-height: 1.15;
    color: #262320;
    margin: 0 0 16px;
  }

  .nooci-problem__subtitle {
    font-family: var(--font-accent, 'Cormorant Garamond', serif);
    font-weight: 400;
    font-style: normal;
    font-size: clamp(1.05rem, 2vw, 1.25rem);
    line-height: 1.5;
    color: #262320;
    opacity: 0.7;
    margin: 0;
  }

  .nooci-problem__grid {
    display: grid;
    grid-template-columns: repeat(var(--nooci-problem-cols, 4), 1fr);
    gap: 20px;
  }
  @media (max-width: 989px) {
    .nooci-problem__grid { grid-template-columns: repeat(2, 1fr); }
  }

  .nooci-problem__card {
    padding: 32px 28px;
    border: 1px solid rgba(38, 35, 32, 0.1);
    border-radius: 12px;
    transition: border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }

  .nooci-problem__card:hover {
    border-color: #E16C47;
  }

  .nooci-problem__icon {
    color: #E16C47;
    margin-bottom: 16px;
  }

  .nooci-problem__card-title {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 1.1rem;
    letter-spacing: -0.02em;
    color: #262320;
    margin: 0 0 10px;
  }

  .nooci-problem__card-body {
    font-family: var(--font-body);
    font-size: 0.9rem;
    line-height: 1.6;
    color: #262320;
    opacity: 0.75;
    margin: 0;
  }

  .nooci-problem__stat {
    text-align: center;
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid rgba(38, 35, 32, 0.1);
  }

  .nooci-problem__stat-number {
    display: block;
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: clamp(2.5rem, 5vw, 3.5rem);
    letter-spacing: -0.03em;
    color: #E16C47;
    line-height: 1;
  }

  .nooci-problem__stat-text {
    display: block;
    font-family: var(--font-body);
    font-size: 0.95rem;
    color: #262320;
    opacity: 0.7;
    margin-top: 8px;
  }

  @media (max-width: 749px) {
    .nooci-problem { padding: 56px 0; }
    .nooci-problem__grid { grid-template-columns: 1fr; gap: 16px; }
    .nooci-problem__header { margin-bottom: 40px; }
  }
/* END_SECTION:nooci-problem-agitate */

/* START_SECTION:nooci-product-trio (INDEX:61) */
/* ── Product Trio — editorial 3-up ── */
.product-trio {
  width: 100%;
  padding: 4rem 0;
}

.product-trio__inner {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1rem;
}

.product-trio__header {
  text-align: center;
  margin-bottom: 3.5rem;
}

.product-trio__heading {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  letter-spacing: -0.03em;
  color: var(--color-foreground);
  margin: 0 0 0.5rem;
  line-height: 1.15;
}

.product-trio__subheading {
  font-family: var(--font-accent);
  font-weight: 400;
  font-style: normal;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  color: var(--color-navy);
  margin: 0;
  line-height: 1.5;
}

/* ── Grid ── */
.product-trio__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

@media (min-width: 750px) {
  .product-trio__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
  }
}

/* ── Product item ── */
.product-trio__item {
  text-align: center;
}

.product-trio__image-link {
  display: block;
  text-decoration: none;
}

.product-trio__image-wrap {
  position: relative;
  overflow: hidden;
  margin-bottom: 1.5rem;
}

.product-trio__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.product-trio__placeholder {
  background: var(--color-background);
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-trio__placeholder-svg {
  width: 60%;
  height: auto;
  opacity: 0.3;
}

/* ── Details ── */
.product-trio__details {
  padding: 0 0.5rem;
}

.product-trio__product-title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.125rem;
  letter-spacing: -0.02em;
  color: var(--color-foreground);
  margin: 0 0 0.5rem;
  line-height: 1.3;
}

.product-trio__product-title a {
  text-decoration: none;
  color: inherit;
}

.product-trio__product-title a:hover {
  color: var(--color-accent);
}

.product-trio__description {
  font-family: var(--font-body);
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--color-navy);
  margin: 0 0 0.75rem;
  max-width: 28ch;
  margin-inline: auto;
}

.product-trio__price {
  font-family: var(--font-body);
  font-size: 0.95rem;
  color: var(--color-foreground);
  margin: 0 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.product-trio__price-compare {
  color: var(--color-navy);
  opacity: 0.5;
  font-size: 0.85rem;
}

.product-trio__price-current {
  font-weight: 600;
}

.product-trio__cta {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground);
  background: transparent;
  border: 1.5px solid var(--color-foreground);
  border-radius: 9999px;
  padding: 0.7em 1.8em;
  text-decoration: none;
  transition: background 0.3s ease, color 0.3s ease;
}

.product-trio__cta:hover,
.product-trio__cta:focus-visible {
  background: var(--color-foreground);
  color: var(--color-background);
}

/* ── Mobile spacing ── */
@media (max-width: 749px) {
  .product-trio {
    padding: 3rem 0;
  }

  .product-trio__header {
    margin-bottom: 2.5rem;
  }

  .product-trio__image-wrap {
    max-width: 20rem;
    margin-inline: auto;
    margin-bottom: 1.25rem;
  }
}
/* END_SECTION:nooci-product-trio */

/* START_SECTION:nooci-social-proof-strip (INDEX:62) */
nooci-sps-marquee,
.nooci-sps {
  display: block;
  padding: 0.625rem 0;
  background-color: #4F576A;
  overflow: hidden;
}

/* Marquee container — always has overflow hidden */
.nooci-sps__marquee {
  position: relative;
  overflow: hidden;
}

/* Gradient fades at edges — only shown when marquee is active */
.nooci-sps__fade {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 3rem;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  transition: opacity 200ms ease;
}
.nooci-sps__fade--left {
  left: 0;
  background: linear-gradient(to right, #4F576A, transparent);
}
.nooci-sps__fade--right {
  right: 0;
  background: linear-gradient(to left, #4F576A, transparent);
}
.nooci-sps.is-marquee .nooci-sps__fade {
  opacity: 1;
}

/* Track — holds content + clones when marqueeing */
.nooci-sps__track {
  display: flex;
  width: max-content;
  will-change: transform;
}

/* When NOT marqueeing: center content on a single line */
.nooci-sps:not(.is-marquee) .nooci-sps__track {
  width: 100%;
  justify-content: center;
}

.nooci-sps__inner {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 0;
  white-space: nowrap;
  justify-content: center;
}
.nooci-sps:not(.is-marquee) .nooci-sps__inner {
  flex-wrap: nowrap;
}

/* ── Badge: INLINE mode (matches live NOOCI — no box, clean icon + text) ── */
.nooci-sps--inline .nooci-sps__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  margin: 0;
  background: transparent;
  border: none;
  color: #ffffff;
  flex-shrink: 0;
  position: relative;
}
.nooci-sps--inline .nooci-sps__badge + .nooci-sps__badge::before,
.nooci-sps--inline .nooci-sps__badge + .nooci-sps__claim::before,
.nooci-sps--inline .nooci-sps__claim + .nooci-sps__claim::before,
.nooci-sps--inline .nooci-sps__claim + .nooci-sps__badge::before {
  content: '';
  position: absolute;
  left: 0;
  top: 25%;
  height: 50%;
  width: 1px;
  background: rgba(255, 255, 255, 0.2);
}
.nooci-sps--inline .nooci-sps__badge-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.nooci-sps--inline .nooci-sps__badge-icon svg,
.nooci-sps--inline .nooci-sps__badge-icon-img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.nooci-sps--inline .nooci-sps__badge-text {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 600;
  color: #ffffff;
  white-space: nowrap;
}

/* ── Badge: BOXED mode ── */
.nooci-sps--boxed .nooci-sps__badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 6px;
  margin: 0 3px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
}
.nooci-sps--boxed .nooci-sps__badge-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.nooci-sps--boxed .nooci-sps__badge-icon svg,
.nooci-sps--boxed .nooci-sps__badge-icon-img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.nooci-sps--boxed .nooci-sps__badge-text {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #ffffff;
  line-height: 1.15;
  white-space: nowrap;
}

/* ── Claim items (icon + text, works in both modes) ── */
.nooci-sps__claim {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  position: relative;
  flex-shrink: 0;
}
.nooci-sps__claim-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: #ffffff;
}
.nooci-sps__claim-icon svg,
.nooci-sps__claim-icon-img {
  width: 16px;
  height: 16px;
  object-fit: contain;
}
.nooci-sps__claim-text {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 600;
  color: #ffffff;
  white-space: nowrap;
}

/* Clones for marquee — never interactive */
[data-clone] {
  pointer-events: none;
  user-select: none;
}

@media (prefers-reduced-motion: reduce) {
  .nooci-sps.is-marquee .nooci-sps__track {
    animation: none !important;
    transform: none !important;
  }
}
/* END_SECTION:nooci-social-proof-strip */

/* START_SECTION:nooci-sticky-product-bar (INDEX:63) */
.spb {
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translate(-50%, 140%);
  z-index: 60;
  width: min(calc(100% - 24px), 720px);
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 18px 50px rgba(38, 35, 32, 0.18), 0 0 0 1px rgba(38, 35, 32, 0.06);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.25s;
}
.spb[data-visible='true'] {
  transform: translate(-50%, 0);
  opacity: 1;
  pointer-events: auto;
}
.spb__inner { display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 10px; }
.spb__left {
  display: flex; align-items: center; gap: 12px;
  flex: 1 1 auto; min-width: 0;
  color: inherit; text-decoration: none;
}
.spb__img {
  width: 52px; height: 52px; border-radius: 10px;
  object-fit: cover; flex: 0 0 auto;
  background: #F3F1E9;
}
.spb__img--placeholder svg { width: 100%; height: 100%; display: block; }
.spb__meta { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.spb__title {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-size: 0.9375rem; font-weight: 600;
  line-height: 1.15; margin: 0;
  color: var(--color-foreground, #262320);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.spb__price { margin: 0; display: inline-flex; align-items: baseline; gap: 6px; flex-wrap: wrap; font-family: var(--font-body, 'Inter', sans-serif); font-size: 0.8125rem; }
.spb__price-sub { font-weight: 700; color: var(--color-foreground, #262320); }
.spb__price-compare { color: rgba(38,35,32,0.45); text-decoration: line-through; }
.spb__price-label { color: rgba(38,35,32,0.55); font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.06em; }
.spb__cta {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 11px 18px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem; font-weight: 700;
  color: #fff; background: var(--color-accent, #E16C47);
  border-radius: 9999px; text-decoration: none;
  white-space: nowrap; flex: 0 0 auto;
  transition: background 0.2s;
}
.spb__cta:hover { background: #c9563a; text-decoration: none; }
@media (max-width: 640px) {
  .spb { bottom: 10px; }
  .spb__inner { padding: 8px 10px 8px 8px; gap: 8px; }
  .spb__img { width: 44px; height: 44px; }
  .spb__title { font-size: 0.875rem; }
  .spb__price-label { display: none; }
  .spb__cta { padding: 10px 14px; font-size: 0.8125rem; }
}
/* END_SECTION:nooci-sticky-product-bar */

/* START_SECTION:nooci-subscription-incentive (INDEX:64) */
.nooci-si {
  padding: 5rem 0;
  background-color: var(--color-dawn, #F3E891);
}

.nooci-si__header {
  text-align: center;
  margin-bottom: 3rem;
}

.nooci-si__heading {
  font-family: var(--font-heading, 'Inter', sans-serif);
  font-weight: 600;
  letter-spacing: -0.03em;
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  line-height: 1.12;
  color: var(--color-foreground, #262320);
  margin: 0 0 0.75rem;
}

.nooci-si__subtitle {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--color-foreground, #262320);
  opacity: 0.75;
  margin: 0;
  max-width: 32rem;
  margin-inline: auto;
}

.nooci-si__columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  max-width: 720px;
  margin: 0 auto;
}

.nooci-si__col {
  padding: 2.5rem 2rem;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.nooci-si__col--onetime {
  background-color: rgba(38, 35, 32, 0.06);
}

.nooci-si__col--subscribe {
  background-color: #fff;
  position: relative;
  box-shadow: 0 2px 16px rgba(38, 35, 32, 0.08);
}

.nooci-si__badge {
  position: absolute;
  top: -0.625rem;
  right: 1.5rem;
  background-color: var(--color-coral, #E16C47);
  color: #fff;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.35em 1em;
  border-radius: 9999px;
}

.nooci-si__col-label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-foreground, #262320);
  opacity: 0.6;
}

.nooci-si__col-price {
  font-family: var(--font-heading, 'Inter', sans-serif);
  font-weight: 500;
  font-size: clamp(1.25rem, 3.4vw, 1.75rem);
  letter-spacing: -0.03em;
  color: var(--color-foreground, #262320);
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  flex-wrap: wrap;
  line-height: 1.15;
  word-break: break-word;
}

.nooci-si__col-savings {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-coral, #E16C47);
  letter-spacing: 0;
}

.nooci-si__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.nooci-si__list-item {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9rem;
  line-height: 1.5;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.nooci-si__list-item--positive {
  color: var(--color-foreground, #262320);
}

.nooci-si__list-item--neutral {
  color: var(--color-foreground, #262320);
  opacity: 0.7;
}

.nooci-si__list-item--muted {
  color: var(--color-foreground, #262320);
  opacity: 0.4;
  text-decoration: line-through;
}

.nooci-si__check {
  color: var(--color-coral, #E16C47);
  flex-shrink: 0;
}

.nooci-si__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
  font-size: 0.95rem;
  padding: 0.85em 2em;
  text-decoration: none;
  background-color: var(--color-coral, #E16C47);
  color: #fff;
  transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
  border: none;
  margin-top: 0.5rem;
  width: 100%;
}

.nooci-si__cta:hover {
  opacity: 0.88;
  transform: translateY(-1px);
}

@media (max-width: 749px) {
  .nooci-si {
    padding: 3.5rem 0;
  }

  .nooci-si__columns {
    grid-template-columns: 1fr;
  }

  .nooci-si__col {
    padding: 2rem 1.5rem;
  }
}
/* END_SECTION:nooci-subscription-incentive */

/* START_SECTION:nooci-testimonial-cards (INDEX:65) */
.nooci-tc {
  padding: 5rem 0;
  background-color: var(--color-background, #F3F1E9);
}

.nooci-tc__header {
  text-align: center;
  margin-bottom: 3rem;
}

.nooci-tc__eyebrow {
  display: block;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-coral, #E16C47);
  margin-bottom: 1rem;
}

.nooci-tc__heading {
  font-family: var(--font-heading, 'Inter', sans-serif);
  font-weight: 600;
  letter-spacing: -0.03em;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  line-height: 1.15;
  color: var(--color-foreground, #262320);
  margin: 0;
}

.nooci-tc__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.nooci-tc__card {
  background-color: var(--color-secondary, #F3F1E9);
  border: 1px solid rgba(38, 35, 32, 0.08);
  border-radius: 12px;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.5rem;
}

.nooci-tc__quote {
  margin: 0;
  padding: 0;
  border: none;
}

.nooci-tc__quote p {
  font-family: var(--font-accent, 'Cormorant Garamond', serif);
  font-weight: 400;
  font-style: normal;
  font-size: clamp(1.1rem, 1.8vw, 1.35rem);
  line-height: 1.5;
  color: var(--color-foreground, #262320);
  margin: 0;
}

.nooci-tc__footer {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.nooci-tc__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}

.nooci-tc__avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nooci-tc__meta {
  display: flex;
  flex-direction: column;
}

.nooci-tc__name {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  line-height: 1.3;
}

.nooci-tc__duration {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem;
  color: var(--color-foreground, #262320);
  opacity: 0.55;
  line-height: 1.3;
}

@media (max-width: 989px) {
  .nooci-tc__grid {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x mandatory;
    gap: 12px;
    padding-bottom: 0.5rem;
    /* Full-bleed: overflow beyond .page-width so cards reach viewport edges */
    margin-left: calc(-1 * max(1rem, (100vw - var(--page-width, 1152px)) / 2));
    margin-right: calc(-1 * max(1rem, (100vw - var(--page-width, 1152px)) / 2));
    padding-left: max(1rem, (100vw - var(--page-width, 1152px)) / 2);
    padding-right: max(1rem, (100vw - var(--page-width, 1152px)) / 2);
    /* Snap aligns cards with the content grid, not viewport edge */
    scroll-padding-inline-start: max(1rem, (100vw - var(--page-width, 1152px)) / 2);
  }

  .nooci-tc__grid::-webkit-scrollbar { display: none; }

  .nooci-tc__card {
    /* 75% of viewport = peek at next card for scroll affordance */
    min-width: 75vw;
    max-width: 300px;
    scroll-snap-align: start;
    flex-shrink: 0;
    padding: 1.25rem;
    /* White bg for contrast against the page background on mobile */
    background: #fff !important;
    border-color: rgba(38, 35, 32, 0.08) !important;
  }
}

@media (max-width: 749px) {
  .nooci-tc {
    padding: 3.5rem 0;
  }

  .nooci-tc__header {
    margin-bottom: 2rem;
  }
}
/* END_SECTION:nooci-testimonial-cards */

/* START_SECTION:nooci-vsl-hero (INDEX:66) */
.vsl-hero {
  padding: 3rem 0 4rem;
  background: var(--color-background, #F3F1E9);
}
.vsl-hero__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  max-width: 820px;
}
.vsl-hero__video { max-width: 760px; margin-left: auto; margin-right: auto; }

.vsl-hero__eyebrow {
  display: inline-block;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-accent, #E16C47);
  padding: 4px 12px;
  background: rgba(225, 108, 71, 0.08);
  border-radius: 9999px;
  margin-bottom: 0.5rem;
}

.vsl-hero__eyebrow-rating {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0.25rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(38,35,32,0.78);
}
.vsl-hero__eyebrow-rating .vsl-hero__stars {
  display: inline-flex;
  gap: 1px;
}

.vsl-hero__heading {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  font-size: clamp(1.75rem, 4vw, 3rem);
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--color-foreground, #262320);
  margin: 0;
  max-width: 820px;
}

.vsl-hero__subheading {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: clamp(0.9375rem, 1.2vw, 1rem);
  line-height: 1.5;
  color: rgba(38, 35, 32, 0.68);
  margin: 0 0 0.5rem;
  max-width: 560px;
}

.vsl-hero__video {
  width: 100%;
  margin-top: 0.75rem;
  margin-bottom: 0.5rem;
}
.vsl-hero__video-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 18px 60px rgba(38, 35, 32, 0.18);
}
.vsl-hero__video-wrap video,
.vsl-hero__video-wrap iframe,
.vsl-hero__video-player {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.vsl-hero__video-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #4F576A 0%, #262320 100%);
}
.vsl-hero__video-placeholder-img,
.vsl-hero__video-placeholder-svg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; opacity: 0.55;
}
.vsl-hero__play-btn {
  position: relative;
  z-index: 1;
  width: 76px; height: 76px;
  border-radius: 9999px;
  background: rgba(225, 108, 71, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.vsl-hero__play-btn svg { margin-left: 4px; }
.vsl-hero__video-hint {
  position: absolute; bottom: 16px; right: 16px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  color: #fff;
  background: rgba(0,0,0,0.7);
  padding: 6px 10px;
  border-radius: 6px;
}
.vsl-hero__video-caption {
  font-size: 0.8125rem;
  color: rgba(38, 35, 32, 0.55);
  margin: 0.75rem 0 0;
}

.vsl-hero__chapters {
  width: 100%;
  max-width: 760px;
  margin: 0.25rem auto 0.25rem;
  text-align: left;
  border-top: 1px solid rgba(38, 35, 32, 0.08);
  border-bottom: 1px solid rgba(38, 35, 32, 0.08);
}
.vsl-hero__chapters-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 2px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(38, 35, 32, 0.6);
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.vsl-hero__chapters-toggle::-webkit-details-marker { display: none; }
.vsl-hero__chapters-caret { transition: transform 0.2s; }
.vsl-hero__chapters[open] .vsl-hero__chapters-caret { transform: rotate(180deg); }
.vsl-hero__chapters-list {
  list-style: none;
  padding: 0 0 12px;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 24px;
}
.vsl-hero__chapter {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 6px 0;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  line-height: 1.35;
  color: rgba(38, 35, 32, 0.78);
}
.vsl-hero__chapter-time {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--color-accent, #E16C47);
  min-width: 44px;
  font-size: 0.75rem;
}
.vsl-hero__chapter-title { font-weight: 500; }
@media (max-width: 749px) {
  .vsl-hero__chapters-list { grid-template-columns: 1fr; gap: 2px; }
}

.vsl-hero__risk-reversal {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.8125rem;
  color: rgba(38, 35, 32, 0.6);
  margin: 10px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.vsl-hero__cta-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 0.5rem;
}
.vsl-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  background: var(--color-accent, #E16C47);
  border-radius: 9999px;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(225, 108, 71, 0.28);
  transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
}
.vsl-hero__cta:hover {
  background: #c9563a;
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(225, 108, 71, 0.35);
  text-decoration: none;
}
.vsl-hero__cta-secondary {
  display: inline-flex;
  align-items: center;
  padding: 14px 22px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-color: rgba(38, 35, 32, 0.25);
}
.vsl-hero__cta-secondary:hover {
  text-decoration-color: #E16C47;
  color: #E16C47;
}

.vsl-hero__social-proof {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 0.5rem;
  font-size: 0.8125rem;
  color: rgba(38, 35, 32, 0.72);
}
.vsl-hero__stars {
  display: inline-flex;
  gap: 2px;
}

.vsl-hero__press {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(38, 35, 32, 0.1);
  width: 100%;
}
.vsl-hero__press-label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(38, 35, 32, 0.55);
}
.vsl-hero__press-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  flex-wrap: wrap;
}
.vsl-hero__press-logo {
  height: 24px;
  width: auto;
  object-fit: contain;
  opacity: 0.6;
  filter: grayscale(1);
  transition: opacity 0.2s;
}
.vsl-hero__press-logo:hover {
  opacity: 1;
  filter: none;
}

@media (max-width: 749px) {
  .vsl-hero { padding: 2rem 0 3rem; }
  .vsl-hero__inner { gap: 0.75rem; padding: 0 1rem; }
  .vsl-hero__video-wrap { border-radius: 12px; }
  .vsl-hero__press-logos { gap: 20px; }
  .vsl-hero__press-logo { height: 18px; }
  .vsl-hero__cta { padding: 13px 22px; font-size: 0.9375rem; }
}
/* END_SECTION:nooci-vsl-hero */

/* START_SECTION:pdp-app-download (INDEX:67) */
/* Chameleon section: inherits predecessor's background, collapses margins */
  .pdp-app-cta-section {
    margin-top: 0 !important;
    padding: 0;
    background-color: #fff;
  }
  .theme-dark .pdp-app-cta-section {
    background-color: #1e1e21;
  }
  /* On PDP, also paint the preceding reviews wrapper white */
  .pdp-reviews-section {
    background-color: #fff;
  }
  .theme-dark .pdp-reviews-section {
    background-color: #1e1e21;
  }
  .pdp-app-cta {
    padding-block: 12px 2rem;
  }

  .pdp-app-cta__inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-radius: var(--radius-xl, 1rem);
    min-height: 80px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  }

  /* Background variants */
  .pdp-app-cta--light .pdp-app-cta__inner {
    background-color: #f8f7f4;
    color: #262320;
  }

  .pdp-app-cta--dark .pdp-app-cta__inner {
    background-color: #262320;
    color: #f8f7f4;
  }

  .pdp-app-cta--accent .pdp-app-cta__inner {
    background-color: #00b140;
    color: #fff;
  }

  /* Icon */
  .pdp-app-cta__icon {
    flex-shrink: 0;
  }

  .pdp-app-cta__icon img {
    width: 40px;
    height: 40px;
    border-radius: 0.5rem;
    object-fit: cover;
  }

  /* Text */
  .pdp-app-cta__text {
    flex: 1;
    min-width: 0;
  }

  .pdp-app-cta__title {
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0;
  }

  .pdp-app-cta__desc {
    font-size: 0.8125rem;
    line-height: 1.4;
    margin: 0.125rem 0 0;
    opacity: 0.75;
  }

  /* Badges */
  .pdp-app-cta__badges {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
  }

  .pdp-app-cta__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-button);
    font-size: 0.8125rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity 0.2s ease;
    line-height: 1;
  }

  .pdp-app-cta__badge:hover {
    opacity: 0.8;
  }

  .pdp-app-cta__badge-icon {
    flex-shrink: 0;
  }

  /* Light / accent variant badges */
  .pdp-app-cta--light .pdp-app-cta__badge,
  .pdp-app-cta--accent .pdp-app-cta__badge {
    background-color: #262320;
    color: #fff;
  }

  /* Dark variant badges */
  .pdp-app-cta--dark .pdp-app-cta__badge {
    background-color: #fff;
    color: #262320;
  }

  /* Mobile: compact stack */
  @media screen and (max-width: 749px) {
    .pdp-app-cta__inner {
      flex-wrap: wrap;
      gap: 0.75rem;
      padding: 1rem;
    }

    .pdp-app-cta__text {
      flex-basis: calc(100% - 56px);
    }

    .pdp-app-cta__badges {
      width: 100%;
    }

    .pdp-app-cta__badge {
      flex: 1;
      justify-content: center;
      padding: 0.5rem 0.75rem;
      font-size: 0.75rem;
    }
  }
/* END_SECTION:pdp-app-download */

/* START_SECTION:pdp-before-after (INDEX:68) */
.pdp-before-after {
    padding: 4rem 0;
  }

  @media screen and (min-width: 750px) {
    .pdp-before-after {
      padding: 5rem 0;
    }
  }

  .pdp-before-after__inner {
    max-width: 56rem;
    margin: 0 auto;
    padding: 0 1.25rem;
  }

  /* Header */
  .pdp-before-after__header {
    text-align: center;
    margin-bottom: 2.5rem;
  }

  .pdp-before-after__title {
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #262320;
    margin: 0 0 0.5rem;
  }

  @media screen and (min-width: 750px) {
    .pdp-before-after__title {
      font-size: 2.25rem;
    }
  }

  .pdp-before-after__subtitle {
    font-size: 0.9375rem;
    color: rgba(26, 26, 46, 0.55);
    margin: 0 auto;
    max-width: 480px;
    line-height: 1.6;
  }

  /* Slider container */
  .pdp-before-after__slider {
    display: block;
  }

  .pdp-before-after__container {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl, 1rem);
    aspect-ratio: 16 / 9;
    cursor: ew-resize;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
  }

  @media screen and (max-width: 749px) {
    .pdp-before-after__container {
      aspect-ratio: 4 / 3;
    }
  }

  .pdp-before-after__container--active {
    cursor: grabbing;
  }

  /* Images */
  .pdp-before-after__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }

  .pdp-before-after__before-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
  }

  /* Handle */
  .pdp-before-after__handle {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateX(-50%);
    outline: none;
  }

  .pdp-before-after__handle-line {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
    background: #fff;
    transform: translateX(-50%);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
  }

  .pdp-before-after__handle-knob {
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    color: #262320;
    transition: transform 150ms ease;
    z-index: 1;
  }

  .pdp-before-after__handle:hover .pdp-before-after__handle-knob,
  .pdp-before-after__handle:focus-visible .pdp-before-after__handle-knob {
    transform: scale(1.1);
  }

  .pdp-before-after__handle:focus-visible .pdp-before-after__handle-knob {
    outline: 2px solid #262320;
    outline-offset: 2px;
  }

  /* Labels */
  .pdp-before-after__label {
    position: absolute;
    top: 1rem;
    z-index: 4;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0.375rem 0.75rem;
    border-radius: 2rem;
    pointer-events: none;
  }

  .pdp-before-after__label--before {
    left: 1rem;
  }

  .pdp-before-after__label--after {
    right: 1rem;
  }

  /* Demo placeholders — shown when no images uploaded */
  .pdp-before-after__demo-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
  }

  .pdp-before-after__demo-panel--before {
    background: linear-gradient(135deg, #e8e5e0 0%, #d4d1cc 100%);
  }

  .pdp-before-after__demo-panel--after {
    background: linear-gradient(135deg, #c8e6c9 0%, #a5d6a7 100%);
  }

  .pdp-before-after__demo-text {
    font-size: 1.5rem;
    font-weight: 700;
    color: rgba(26, 26, 46, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.1em;
  }

  .pdp-before-after__demo-subtext {
    font-size: 0.75rem;
    color: rgba(26, 26, 46, 0.25);
    text-align: center;
    max-width: 200px;
  }

  /* Mobile */
  @media screen and (max-width: 749px) {
    .pdp-before-after__title {
      font-size: 1.5rem;
    }

    .pdp-before-after__header {
      margin-bottom: 1.5rem;
    }

    .pdp-before-after__handle-knob {
      width: 36px;
      height: 36px;
    }

    .pdp-before-after__handle-knob svg {
      width: 16px;
      height: 16px;
    }
  }
/* END_SECTION:pdp-before-after */

/* START_SECTION:pdp-benefits (INDEX:69) */
.pdp-benefits {
    padding-block: 4rem;
  }

  .pdp-benefits__header {
    text-align: center;
    margin-block-end: 3rem;
  }

  .pdp-benefits__eyebrow {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-text-muted);
    margin-block-end: 0.5rem;
  }

  .pdp-benefits__title {
    font-size: var(--font-size-3xl);
    font-weight: 600;
    letter-spacing: var(--tracking-tight);
    color: var(--color-foreground);
  }

  .pdp-benefits__subtitle {
    color: var(--color-text-muted);
    margin-block-start: 0.75rem;
    max-width: 42rem;
    margin-inline: auto;
    line-height: var(--line-height-base);
  }

  .pdp-benefits__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .pdp-benefits__card {
    text-align: center;
    background: transparent;
  }

  .pdp-benefits__image-wrapper {
    aspect-ratio: 3 / 4;
    background-color: var(--color-secondary);
    border-radius: var(--radius-xl);
    margin-block-end: 1rem;
    overflow: hidden;
  }

  .pdp-benefits__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .pdp-benefits__card-title {
    font-weight: 600;
    margin-block-end: 0.5rem;
    color: var(--color-foreground);
  }

  .pdp-benefits__card-desc {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    line-height: var(--line-height-base);
  }

  @media screen and (min-width: 750px) {
    .pdp-benefits {
      padding-block: 5rem;
    }

    .pdp-benefits__grid {
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    }

    .pdp-benefits__image-wrapper {
      aspect-ratio: 3 / 4;
    }

    /* 2-column variant */
    .pdp-benefits[data-columns="2"] .pdp-benefits__grid {
      grid-template-columns: repeat(2, 1fr);
      max-width: 48rem;
      margin-inline: auto;
    }

    /* 4-column variant */
    .pdp-benefits[data-columns="4"] .pdp-benefits__grid {
      grid-template-columns: repeat(4, 1fr);
    }
  }
/* END_SECTION:pdp-benefits */

/* START_SECTION:pdp-breadcrumb (INDEX:70) */
.pdp-breadcrumb-section {
  background: var(--color-background, #F3F1E9);
  margin: 0;
  padding: 0;
}
.pdp-breadcrumb {
  padding: 8px 0 6px;
  background: var(--color-background, #F3F1E9);
}
.pdp-breadcrumb__list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 11px;
  line-height: 1.3;
  color: var(--color-text-secondary, #888);
  overflow: hidden;
}
.pdp-breadcrumb__item {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.pdp-breadcrumb__item--current {
  flex-shrink: 1;
  min-width: 0;
}
.pdp-breadcrumb__item:not(:last-child)::after {
  content: '/';
  margin: 0 8px;
  color: var(--color-border, #ccc);
  font-size: 11px;
}
.pdp-breadcrumb__item a {
  color: var(--color-text-secondary, #888);
  text-decoration: none;
  transition: color 0.2s ease;
  position: relative;
  width: fit-content;
}
.pdp-breadcrumb__item a::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--color-foreground, #262320);
  transition: width 0.25s ease;
}
.pdp-breadcrumb__item a:hover {
  color: var(--color-foreground, #262320);
  text-decoration: none !important;
}
.pdp-breadcrumb__item a:hover::after {
  width: 100%;
}
.pdp-breadcrumb__item--current {
  color: var(--color-foreground, #262320);
  font-weight: 500;
  max-width: 260px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* END_SECTION:pdp-breadcrumb */

/* START_SECTION:pdp-bundle-upsell (INDEX:71) */
/* ═══════════════════════════════════════
   BUNDLE UPSELL — matches App CTA design
   ═══════════════════════════════════════ */
/* Breaker section — blends with preceding section bg */
.pdp-bundle-section {
  margin-top: 0 !important;
  padding-top: 0;
}
.pdp-bundle {
  padding-block: 12px 2rem;
  position: relative;
  z-index: 2;
}

/* When bundle follows a hero section — overlap it */
.shopify-section:has(.hero-bb) + .shopify-section > .pdp-bundle,
.shopify-section:has(.cl-hero) + .shopify-section > .pdp-bundle {
  margin-top: -1.5rem;
  padding-top: 0;
}
.pdp-bundle__container {
  max-width: 72rem;
  margin: 0 auto;
}
.pdp-bundle__inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.5rem;
  border-radius: var(--radius-xl, 1rem);
  min-height: 80px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0,0,0,0.02);
  color: #262320;
}
/* Dark scheme handled globally via body.theme-dark */

/* Icon / thumbnail */
.pdp-bundle__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 0.625rem;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.06);
}
.pdp-bundle__icon-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.pdp-bundle__icon svg {
  color: #999;
}

/* Text */
.pdp-bundle__text {
  flex: 1;
  min-width: 0;
}
.pdp-bundle__title {
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.3;
  margin: 0;
}
.pdp-bundle__title a {
  color: #262320;
  text-decoration: none;
}
.pdp-bundle__title a:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pdp-bundle__desc {
  font-size: 0.8125rem;
  line-height: 1.4;
  margin: 0.125rem 0 0;
  opacity: 0.75;
  color: #262320;
}
.pdp-bundle__compare {
  color: #999;
  text-decoration: line-through;
  font-weight: 400;
}

/* Badges / CTAs — same pattern as App CTA badges */
.pdp-bundle__badges {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.pdp-bundle__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-button);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.2s ease;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
}
.pdp-bundle__badge:hover { opacity: 0.8; }
.pdp-bundle__badge-plus {
  display: inline-block;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-width 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease, margin 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  margin-right: 0;
}
@media (hover: hover) {
  .pdp-bundle__badge--primary:hover .pdp-bundle__badge-plus {
    max-width: 1.25rem;
    opacity: 1;
    margin-right: 0.25rem;
  }
}
.pdp-bundle__badge--primary {
  background: #262320;
  color: #fff;
  border: none;
  font-weight: 600;
  overflow: hidden;
}
.pdp-bundle__badge--primary.is-adding {
  pointer-events: none;
  opacity: 0.7;
}
.pdp-bundle__badge--primary.is-added {
  background: #22c55e;
}
.pdp-bundle__badge--secondary {
  background: transparent;
  color: #262320;
  border: 1px solid rgba(0,0,0,0.15);
}
.pdp-bundle__badge--secondary:hover {
  border-color: #262320;
  opacity: 1;
}

/* ── Tier fallback ── */
.pdp-bundle__inner--tiers {
  flex-wrap: wrap;
}
.pdp-bundle__tiers {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
}
.pdp-bundle__tier {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.5rem 0.75rem;
  border-radius: 0.625rem;
  background: #F3F1E9;
  min-width: 56px;
}
.pdp-bundle__tier-pct {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  color: #262320;
}
.pdp-bundle__tier-label {
  font-size: 0.625rem;
  font-weight: 500;
  color: #262320;
  opacity: 0.6;
  white-space: nowrap;
}

/* ── Dark mode for bundle section ── */
.theme-dark .pdp-bundle__inner {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.1);
  box-shadow: none;
  color: #f5f5f5;
}
.theme-dark .pdp-bundle__title { color: #f5f5f5; }
.theme-dark .pdp-bundle__desc { color: rgba(255,255,255,0.6); }
.theme-dark .pdp-bundle__tier {
  background: rgba(255,255,255,0.1);
}
.theme-dark .pdp-bundle__tier-pct { color: #f5f5f5; }
.theme-dark .pdp-bundle__tier-label { color: rgba(255,255,255,0.6); }
.theme-dark .pdp-bundle__badge--secondary {
  color: #f5f5f5;
  border-color: rgba(255,255,255,0.3);
}
.theme-dark .pdp-bundle__badge--secondary:hover {
  border-color: #f5f5f5;
}
.theme-dark .pdp-bundle__badge--primary {
  background: #f5f5f5;
  color: #262320;
}

/* Mobile: compact stack */
@media screen and (max-width: 749px) {
  .pdp-bundle__inner {
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1rem;
  }
  .pdp-bundle__badges {
    width: 100%;
    flex-direction: column;
  }
  .pdp-bundle__badge {
    width: 100%;
    justify-content: center;
    padding: 0.625rem 1rem;
  }
  /* Tier pills: horizontal row, equal width, centered */
  .pdp-bundle__tiers {
    width: 100%;
    justify-content: center;
  }
  .pdp-bundle__tier {
    flex: 1;
    min-width: 0;
  }
  .pdp-bundle__inner--tiers .pdp-bundle__badge {
    margin-top: 0.25rem;
  }
}
/* END_SECTION:pdp-bundle-upsell */

/* START_SECTION:pdp-comparison (INDEX:72) */
.comparison {
    padding-block: 4rem;
  }

  .comparison__header {
    text-align: center;
    margin-block-end: 2.5rem;
  }

  .comparison__title {
    font-size: var(--font-size-3xl);
    font-weight: 600;
    letter-spacing: var(--tracking-tight);
    color: var(--color-foreground);
    margin-block-end: 0.75rem;
  }

  .comparison__subtitle {
    color: var(--color-text-muted);
    max-width: 36rem;
    margin-inline: auto;
    line-height: var(--line-height-base);
  }

  .comparison__table-wrap {
    overflow-x: auto;
    margin-inline: -1rem;
    padding-inline: 1rem;
    -webkit-overflow-scrolling: touch;
  }

  .comparison__table {
    width: 100%;
    min-width: 640px;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 1rem;
    overflow: hidden;
  }

  .comparison__th {
    padding: 1rem 1.25rem;
    font-size: var(--font-size-sm);
    white-space: nowrap;
  }

  .comparison__th--feature {
    text-align: start;
    font-weight: 500;
    color: var(--color-text-muted);
    border-block-end: 2px solid rgba(0,0,0,0.06);
    width: 200px;
    background: rgba(0,0,0,0.02);
  }

  .comparison__th--nooci {
    text-align: center;
    font-weight: 600;
    border-block-end: 2px solid #E16C47;
    background: rgba(45, 138, 35, 0.1);
    border-start-start-radius: 0.5rem;
    border-start-end-radius: 0.5rem;
    position: relative;
  }

  .comparison__th--nooci::before {
    content: '';
    position: absolute;
    inset: 0;
    border-left: 2px solid rgba(45, 138, 35, 0.2);
    border-right: 2px solid rgba(45, 138, 35, 0.2);
    border-top: 2px solid rgba(45, 138, 35, 0.2);
    border-radius: 0.5rem 0.5rem 0 0;
    pointer-events: none;
  }

  .comparison__nooci-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
  }

  .comparison__nooci-header span {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #262320;
  }

  .comparison__logo {
    height: 1.25rem;
    width: auto;
  }

  .comparison__logo--dark { display: none; }

  .comparison__th--competitor {
    text-align: center;
    font-weight: 500;
    color: var(--color-text-muted);
    border-block-end: 2px solid rgba(0,0,0,0.06);
    border-left: 1px solid rgba(0,0,0,0.06);
  }

  .comparison__value--competitor {
    border-left: 1px solid rgba(0,0,0,0.06);
  }

  .comparison__row--alt {
    background: rgba(0, 0, 0, 0.015);
  }

  .comparison__row:hover td {
    background: rgba(0, 0, 0, 0.03);
    transition: background 0.15s ease;
  }

  .comparison__row:hover .comparison__value--nooci {
    background: rgba(45, 138, 35, 0.1) !important;
  }

  .comparison__feature {
    padding: 0.875rem 1.25rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-foreground);
    border-block-end: 1px solid rgba(0, 0, 0, 0.06);
    border-right: 1px solid rgba(0, 0, 0, 0.06);
  }

  .comparison__value {
    padding: 0.875rem 1.25rem;
    font-size: var(--font-size-sm);
    text-align: center;
    border-block-end: 1px solid rgba(0, 0, 0, 0.06);
  }

  .comparison__value--nooci {
    font-weight: 600;
    background: rgba(45, 138, 35, 0.06);
    color: #262320;
    border-left: 2px solid rgba(45, 138, 35, 0.2);
    border-right: 2px solid rgba(45, 138, 35, 0.2);
  }

  /* Last row bottom border for NOOCI column */
  .comparison__row:last-child .comparison__value--nooci {
    border-bottom: 2px solid rgba(45, 138, 35, 0.2);
    border-radius: 0 0 0.5rem 0.5rem;
  }

  .comparison__value--competitor {
    color: var(--color-text-muted);
  }

  .comparison__check,
  .comparison__x {
    display: inline-block;
    vertical-align: middle;
  }

  .comparison__footer {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    text-align: center;
    margin-block-start: 1.5rem;
  }

  .comparison__price-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }

  .comparison__price-compare {
    color: #999;
    font-weight: 400;
    font-size: 0.8125rem;
    text-decoration: line-through;
  }

  .comparison__price-current {
    font-weight: 700;
    color: #16a34a;
  }

  @media screen and (min-width: 750px) {
    .comparison {
      padding-block: 5rem;
    }

    .comparison__title {
      font-size: var(--font-size-4xl);
    }
  }
/* END_SECTION:pdp-comparison */

/* START_SECTION:pdp-faq (INDEX:73) */
.faq-section {
    display: block;
    padding-block: 4rem;
  }

  .faq-section__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  /* --- Header --- */
  .faq-section__header {
    margin-block-end: 2rem;
    padding-inline: 0.25rem;
  }

  .faq-section__title {
    font-size: var(--font-size-3xl);
    font-weight: 600;
    letter-spacing: var(--tracking-tight);
    color: var(--color-foreground);
    margin-block-end: 0.75rem;
  }

  .faq-section__subtitle {
    color: var(--color-text-muted);
    line-height: var(--line-height-base);
  }

  /* --- Accordion --- */
  .faq-section__accordion {
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    overflow: hidden;
    background: inherit;
  }

  .faq-section__item {
    border-block-end: 1px solid var(--color-border);
  }

  .faq-section__item:last-child {
    border-block-end: none;
  }

  .faq-section__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1rem 1.25rem;
    text-align: start;
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    font-size: var(--font-size-sm);
    color: var(--color-foreground);
  }

  .faq-section__question-text {
    padding-inline-end: 1rem;
    line-height: var(--line-height-base);
  }

  .faq-section__chevron {
    flex-shrink: 0;
    color: var(--color-text-muted);
    transition: transform var(--duration-base) var(--ease-default);
  }

  .faq-section__question[aria-expanded="true"] .faq-section__chevron {
    transform: rotate(180deg);
  }

  .faq-section__answer {
    padding-inline: 1.25rem;
    padding-block-end: 1.25rem;
    margin-block-start: -0.25rem;
  }

  .faq-section__answer[hidden] {
    display: none;
  }

  .faq-section__answer p {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    line-height: var(--line-height-relaxed);
  }

  /* --- Help CTA --- */
  .faq-section__help-cta {
    margin-block-start: 1.25rem;
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    text-align: center;
  }

  .faq-section__help-cta a {
    color: var(--color-foreground);
    text-decoration: underline;
    text-underline-offset: 2px;
  }

  .faq-section__help-cta a:hover {
    color: var(--color-link-hover, var(--color-foreground));
  }

  /* --- Sidebar App CTA --- */
  .faq-section__sidebar {
    order: -1;
  }

  .faq-section__app-cta {
    border-radius: var(--radius-xl);
    overflow: hidden;
    background: linear-gradient(165deg, #15803d 0%, #22c55e 50%, #16a34a 100%);
    padding: 1.5rem;
    text-align: center;
    color: #fff;
  }

  .faq-section__app-icon {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
  }

  .faq-section__app-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 0.5rem;
    color: #fff;
  }

  .faq-section__app-desc {
    font-size: 0.8125rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.65);
    margin: 0 0 1rem;
  }

  .faq-section__app-features {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .faq-section__app-features li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: rgba(255, 255, 255, 0.85);
  }

  .faq-section__app-features svg {
    flex-shrink: 0;
    color: #fff;
  }

  .faq-section__app-stores {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    margin-bottom: 0.75rem;
  }

  .faq-section__store-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    border-radius: var(--radius-full, 9999px);
    background: #fff;
    color: #262320;
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 200ms ease, transform 200ms ease;
    white-space: nowrap;
  }

  .faq-section__store-badge svg { color: #262320; }

  .faq-section__store-badge:hover {
    background: #f0f0f0;
    transform: translateY(-1px);
    text-decoration: none;
  }

  .faq-section__app-free {
    display: block;
    font-size: 0.6875rem;
    color: rgba(255, 255, 255, 0.4);
  }

  @media screen and (min-width: 640px) {
    .faq-section__question {
      padding: 1.25rem;
      font-size: var(--font-size-base);
    }

    .faq-section__answer {
      padding-inline: 1.25rem;
      padding-block-end: 1.25rem;
    }

    .faq-section__answer p {
      font-size: var(--font-size-sm);
    }
  }

  @media screen and (min-width: 990px) {
    .faq-section {
      padding-block: 5rem;
    }

    .faq-section__grid {
      grid-template-columns: 1fr 300px;
      gap: 3rem;
    }

    .faq-section__title {
      font-size: var(--font-size-4xl);
    }

    .faq-section__sidebar {
      order: 0;
      position: sticky;
      inset-block-start: 6rem;
      align-self: start;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .faq-section__chevron {
      transition: none;
    }
  }

  /* ── Dark mode for wellness / collection pages ── */
  .faq-section--dark { background: #0d0d14; }
  .faq-section--dark .faq-section__title { color: #f5f5f5; }
  .faq-section--dark .faq-section__subtitle { color: rgba(255,255,255,0.55); }
  .faq-section--dark .faq-section__accordion { background: #1a1a1d; border-color: rgba(255,255,255,0.08); }
  .faq-section--dark .faq-section__item { border-color: rgba(255,255,255,0.06); }
  .faq-section--dark .faq-section__question { color: #f5f5f5; }
  .faq-section--dark .faq-section__chevron { color: rgba(255,255,255,0.4); }
  .faq-section--dark .faq-section__answer { color: rgba(255,255,255,0.65); }
  .faq-section--dark .faq-section__help-cta { color: rgba(255,255,255,0.5); }
  .faq-section--dark .faq-section__help-cta a { color: #f5f5f5; }
  .faq-section--dark .faq-section__sidebar { color: #f5f5f5; }
  /* App CTA keeps brand green on both light and dark */
  .faq-section--dark .faq-section__app-title { color: #f5f5f5; }
  .faq-section--dark .faq-section__app-desc { color: rgba(255,255,255,0.55); }
  .faq-section--dark .faq-section__app-features li { color: rgba(255,255,255,0.65); }
  /* Store badges stay white on both light and dark */
  .faq-section--dark .faq-section__app-free { color: rgba(255,255,255,0.4); }
/* END_SECTION:pdp-faq */

/* START_SECTION:pdp-hero (INDEX:74) */
/* ========================================
   PDP Hero — 2-column product detail
   ======================================== */

.pdp-hero {
  display: block;
  padding-block-start: 0;
  padding-block-end: var(--space-lg, 2rem);
  overflow-x: clip;
  max-width: 100%;
}
/* Reserve space at the bottom of the page for the sticky add-to-cart bar
   so nothing hides behind it on mobile */
@media (max-width: 749px) {
  pdp-hero ~ *, pdp-hero ~ section:last-of-type {
    padding-bottom: 90px;
  }
}
/* Top padding handled by pdp-breadcrumb bottom padding for equal spacing */

.pdp-hero__grid {
  display: grid;
  /* minmax(0, 1fr) — NOT plain 1fr. `1fr` defaults to minmax(auto, 1fr),
     which lets intrinsic-min-width children (like the 8-slide flex
     .pdp-hero__carousel) push the track wider than the viewport on
     mobile, overflowing the page to the right. minmax(0, 1fr) caps the
     min at 0 so the carousel is forced to fit the column. */
  grid-template-columns: minmax(0, 1fr);
  column-gap: 1rem;
  row-gap: 0.5rem;
}

/* ---- Gallery ---- */

.pdp-hero__gallery-sticky {
  position: relative;
}

/* Mobile: full-bleed gallery — touches viewport left/right edges */
@media (max-width: 749px) {
  .pdp-hero__gallery {
    margin-left: -16px;
    margin-right: -16px;
  }
  .pdp-hero__main-image {
    border-radius: 0;
  }
  .pdp-hero__thumbnails {
    padding-left: 16px;
    padding-right: 16px;
  }
}

.pdp-hero__main-image {
  position: relative;
  aspect-ratio: 1 / 1;
  background-color: var(--gallery-bg, var(--color-background, #F3F1E9));
  overflow: hidden;
}
.pdp-hero__main-image--bordered {
  border: 1px solid var(--color-border, #eee);
  border-radius: var(--radius-image);
  overflow: hidden;
}

.pdp-hero__carousel {
  display: flex;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  height: 100%;
  scrollbar-width: none;
}

.pdp-hero__carousel::-webkit-scrollbar {
  display: none;
}

.pdp-hero__slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  scroll-snap-align: center;
}

.pdp-hero__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  user-select: none;
  cursor: zoom-in;
}

/* Video in gallery — GIF-like autoplay, no controls */
.pdp-hero__slide video,
.pdp-hero__slide iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none; /* prevents accidental clicks opening fullscreen */
}
/* Belt-and-braces: hide any user-agent-rendered controls */
.pdp-hero__slide video::-webkit-media-controls,
.pdp-hero__slide video::-webkit-media-controls-panel,
.pdp-hero__slide video::-webkit-media-controls-enclosure {
  display: none !important;
  -webkit-appearance: none !important;
}
.pdp-hero__slide video::-webkit-media-controls-start-playback-button {
  display: none !important;
  -webkit-appearance: none !important;
}
/* Smooth image transitions when switching carousel slides */
.pdp-hero__slide img {
  content-visibility: auto;
  contain-intrinsic-size: 800px;
}

.pdp-hero__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.75rem;
  height: 2.75rem;
  border-radius: var(--radius-full, 9999px);
  background-color: rgba(255, 255, 255, 0.9);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  z-index: 2;
  padding: 0;
  color: var(--color-foreground, #262320);
  transition: opacity 0.2s ease;
}

.pdp-hero__arrow:hover {
  background-color: #fff;
}
.pdp-hero__arrow.is-disabled {
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}

.pdp-hero__arrow--prev {
  inset-inline-start: 0.5rem;
}

.pdp-hero__arrow--next {
  inset-inline-end: 0.5rem;
}

.pdp-hero__thumbnails {
  display: flex;
  gap: 0.375rem;
  margin-block-start: 0.5rem;
  overflow-x: auto;
  padding-block-end: 0.375rem;
  scrollbar-width: none;
}

.pdp-hero__thumbnails::-webkit-scrollbar {
  display: none;
}

.pdp-hero__thumb {
  position: relative;
  flex-shrink: 0;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 0.5rem;
  border: 2px solid var(--color-border, #eee);
  overflow: hidden;
  cursor: pointer;
  padding: 0;
  background: var(--color-background, #F3F1E9);
  transition: border-color 0.2s ease;
}

.pdp-hero__thumb:hover {
  border-color: var(--color-text-muted, #aaa);
}

.pdp-hero__thumb--active,
.pdp-hero__thumb--active:hover {
  border-color: var(--color-foreground, #262320);
}

.pdp-hero__thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  user-select: none;
}

.pdp-hero__thumb-video-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1;
  color: #fff;
  pointer-events: none;
}

/* ---- Product Info ---- */

.pdp-hero__info {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-inline: 0;
  min-width: 0;
  overflow: visible;
}

/* Rating — reserve fixed height to prevent layout shift, fades in */
.pdp-hero__rating {
  display: flex;
  flex-direction: row;
  gap: 0.375rem;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
  opacity: 1 !important;
  height: 15px;
  min-height: 15px;
}
.pdp-hero__rating.is-visible {
  opacity: 1;
}

.pdp-hero__rating:hover {
  opacity: 1;
  text-decoration: none;
}
.pdp-hero__rating:hover .pdp-hero__rating-count,
.pdp-hero__rating:hover .pdp-hero__rating-score {
  text-decoration: none;
}
a.pdp-hero__rating,
a.pdp-hero__rating:hover,
a.pdp-hero__rating:focus,
a.pdp-hero__rating:visited {
  text-decoration: none !important;
}

/* Rating Trustpilot stars image — renders instantly, no fade */
.pdp-hero__rating-tp-stars {
  width: 80px;
  height: 15px;
  flex-shrink: 0;
  opacity: 1 !important;
}

/* Review text fades in once Judge.me injects it */
.pdp-hero__rating-text {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-secondary, #71717a);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.pdp-hero__rating-text:not(:empty) {
  opacity: 1;
}

.pdp-hero__rating-score {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-secondary, #262320);
}

.pdp-hero__rating-count {
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--color-text-secondary, #71717a);
}

/* Eyebrow + Title group — tight spacing between product name and headline */
.pdp-hero__title-group {
  display: flex;
  flex-direction: column;
  gap: 0.125rem; /* 2px between eyebrow and headline */
}
.pdp-hero__eyebrow-title {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--color-accent, #E16C47);
}

/* Title — 20% smaller per design direction */
.pdp-hero__title {
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.15;
  margin: 0;
  color: var(--color-foreground, #262320);
}

/* Price */
.pdp-hero__price {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 0.5rem;
  margin-block-start: -0.25rem;
}

/* Price — deliberately understated; the product sells itself, not
   the number. Current + compare use the same font-size, differentiated
   only by weight and strikethrough. */
.pdp-hero__price-current {
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
}

.pdp-hero__price-compare {
  font-size: 1.0625rem;
  font-weight: 400;
  color: rgba(38, 35, 32, 0.45);
  text-decoration: line-through;
}

.pdp-hero__price-save {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 2px 8px;
  font-size: 0.6875rem;
  font-weight: 600;
  color: #fff;
  background: #E16C47;
  border: none;
  border-radius: 9999px;
  letter-spacing: 0.02em;
  line-height: 1.3;
}
.pdp-hero__price-save[hidden] { display: none; }

/* Total savings line */
.pdp-hero__price-total-savings {
  margin-top: 0.125rem;
  font-size: 0.75rem;
  line-height: 1.3;
  color: #E16C47;
  font-weight: 500;
}
.pdp-hero__price-total-savings strong { font-weight: 700; }
.pdp-hero__price-total-savings[hidden] { display: none; }


/* Subheadline — rich text content from product.description */
.pdp-hero__subheadline {
  margin: 0;
  color: var(--color-text-secondary, #666);
  line-height: 1.625;
  font-size: 1rem;
}
.pdp-hero__subheadline p { margin: 0 0 0.75em; }
.pdp-hero__subheadline p:last-child { margin-bottom: 0; }
.pdp-hero__subheadline strong,
.pdp-hero__subheadline b {
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.pdp-hero__subheadline em,
.pdp-hero__subheadline i { font-style: italic; }
.pdp-hero__subheadline a {
  color: var(--color-accent, #E16C47);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pdp-hero__subheadline a:hover { text-decoration-thickness: 2px; }
.pdp-hero__subheadline ul,
.pdp-hero__subheadline ol {
  margin: 0.5em 0 0.75em;
  padding-left: 1.25em;
}
.pdp-hero__subheadline li { margin: 0.25em 0; }
.pdp-hero__subheadline h1,
.pdp-hero__subheadline h2,
.pdp-hero__subheadline h3 {
  font-family: var(--font-heading, 'GTF Good Sans', sans-serif);
  font-weight: 600;
  margin: 0.75em 0 0.4em;
  color: var(--color-foreground, #262320);
  letter-spacing: -0.02em;
}
.pdp-hero__subheadline h1 { font-size: 1.125rem; }
.pdp-hero__subheadline h2 { font-size: 1.0625rem; }
.pdp-hero__subheadline h3 { font-size: 1rem; }
.pdp-hero__subheadline blockquote {
  margin: 0.75em 0;
  padding: 0.25em 0.75em;
  border-left: 2px solid var(--color-accent, #E16C47);
  font-style: italic;
  color: rgba(38, 35, 32, 0.7);
}

/* Tags — hidden mobile, flex desktop — positioned above description */
.pdp-hero__tags {
  display: none;
  margin-bottom: 6px;
}

.pdp-hero__tag {
  font-size: var(--font-size-xs, 0.75rem);
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-full, 9999px);
  background-color: rgba(0, 0, 0, 0.04);
  color: var(--color-foreground, #262320);
  white-space: nowrap;
}

/* USP Cards */
.pdp-hero__usps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  margin-top: 4px;
  margin-bottom: 4px;
}

.pdp-hero__usp {
  display: flex;
  flex-direction: row;
  gap: 0.75rem;
  align-items: flex-start;
}

.pdp-hero__usp-icon {
  width: 2rem;
  height: 2rem;
  min-width: 2rem;
  border-radius: var(--radius-full, 9999px);
  background-color: var(--color-secondary, #eae9e4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-foreground, #262320);
  overflow: hidden;
}
.pdp-hero__usp-icon img {
  width: 16px;
  height: 16px;
  object-fit: contain;
}

.pdp-hero__usp-text {
  display: flex;
  flex-direction: column;
}

.pdp-hero__usp-title {
  font-weight: 500;
  font-size: var(--font-size-sm, 0.875rem);
  color: var(--color-foreground, #262320);
}

.pdp-hero__usp-desc {
  font-size: var(--font-size-xs, 0.75rem);
  color: var(--color-text-muted, #999);
}

/* ---- Linked Options (sibling products) ---- */
.pdp-hero__linked-options {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-block-end: 1.25rem;
  padding-block-end: 1.25rem;
  border-bottom: 1px solid var(--color-border, #deddd8);
}

.pdp-hero__linked-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.pdp-hero__linked-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
}

.pdp-hero__linked-selected {
  font-weight: 400;
  color: var(--color-text-secondary, #666);
}

/* Linked swatches */
.pdp-hero__linked-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.pdp-hero__linked-swatch {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 9999px;
  border: 2px solid transparent;
  transition: border-color 200ms ease;
  text-decoration: none;
}

.pdp-hero__linked-swatch:hover {
  border-color: var(--color-foreground, #262320);
}

.pdp-hero__linked-swatch--active {
  border-color: var(--color-foreground, #262320);
  cursor: default;
}

/* Linked pills */
.pdp-hero__linked-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.pdp-hero__linked-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 1rem;
  border-radius: 9999px;
  border: 1.5px solid var(--color-border, #deddd8);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-foreground, #262320);
  background: transparent;
  transition: all 200ms ease;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
}

.pdp-hero__linked-pill:hover {
  border-color: var(--color-foreground, #262320);
}

.pdp-hero__linked-pill--active {
  background-color: var(--color-foreground, #262320);
  border-color: var(--color-foreground, #262320);
  color: #fff;
  cursor: default;
  pointer-events: none;
}

/* ---- Variant Selectors ---- */
.pdp-hero__variants {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.pdp-hero__option {
  border: none;
  padding: 0;
  margin: 0;
}

.pdp-hero__option-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-foreground, #262320);
  margin-block-end: 0.5rem;
  display: block;
}

.pdp-hero__option-selected {
  font-weight: 400;
  color: var(--color-text-secondary, #666);
}

/* Color swatches */
.pdp-hero__swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.pdp-hero__swatch {
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 9999px;
  border: 2px solid transparent;
  transition: border-color 200ms ease;
}

.pdp-hero__swatch--active,
.pdp-hero__swatch:hover {
  border-color: var(--color-foreground, #262320);
}

.pdp-hero__swatch-dot {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 9999px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.pdp-hero__swatch-dot--image {
  display: flex;
  align-items: center;
  justify-content: center;
}
.pdp-hero__swatch-dot--image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 9999px;
}

/* Pill buttons */
.pdp-hero__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.pdp-hero__pill {
  cursor: pointer;
  padding: 0.5rem 1rem;
  border-radius: 9999px;
  border: 1.5px solid var(--color-border, #deddd8);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-foreground, #262320);
  background: transparent;
  transition: all 200ms ease;
  white-space: nowrap;
}

.pdp-hero__pill:hover {
  border-color: var(--color-foreground, #262320);
}

.pdp-hero__pill--active {
  background-color: var(--color-foreground, #262320);
  border-color: var(--color-foreground, #262320);
  color: #fff;
}

.pdp-hero__pill--unavailable {
  opacity: 0.4;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* ── Quantity + CTA Row ── */
.pdp-hero__cta-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}

.pdp-hero__qty {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--color-border, #deddd8);
  border-radius: var(--radius-full, 9999px);
  background: #fff;
  overflow: hidden;
  flex-shrink: 0;
}
.pdp-hero__qty-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 100%;
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--color-foreground, #262320);
  transition: background 0.25s ease, color 0.25s ease;
  padding: 0;
}
.pdp-hero__qty-btn:hover {
  background: rgba(45, 138, 35, 0.07);
  color: #E16C47;
}
.pdp-hero__qty-btn:active {
  background: rgba(45, 138, 35, 0.13);
  color: #E16C47;
}
.pdp-hero__qty-input {
  width: 32px;
  text-align: center;
  border: none;
  background: transparent;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  color: var(--color-foreground, #262320);
  -moz-appearance: textfield;
  padding: 0;
  line-height: 1;
}
.pdp-hero__qty-input::-webkit-outer-spin-button,
.pdp-hero__qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.pdp-hero__qty-input:focus {
  outline: none;
}

/* CTA Button */
.pdp-hero__cta {
  position: relative;
  flex: 1;
  min-width: 0;
  height: 52px;
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--radius-button);
  background-color: #E16C47;
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 600;
  font-family: inherit;
  letter-spacing: 0.01em;
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(45, 138, 35, 0.25);
  transition: box-shadow 0.25s ease, transform 0.2s ease, background-color 0.2s ease;
}

.pdp-hero__cta:hover {
  box-shadow: 0 4px 16px rgba(45, 138, 35, 0.4);
  transform: translateY(-1px);
}

.pdp-hero__cta:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(45, 138, 35, 0.25);
}

/* CTA disabled / sold out state */
.pdp-hero__cta:disabled,
.pdp-hero__cta--sold-out {
  opacity: 1;
  cursor: not-allowed;
  background: #e4e4e7;
  color: #999;
  box-shadow: none;
  pointer-events: none;
  border: none;
  font-size: 0.875rem;
}
.pdp-hero__cta--sold-out::before { display: none; }

.pdp-hero__cta:disabled:hover {
  transform: none;
  box-shadow: none;
}

.pdp-hero__cta-text {
  position: relative;
  z-index: 1;
  transition: opacity 0.2s;
}
.pdp-hero__cta-loader,
.pdp-hero__cta-check {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  z-index: 2;
  font-weight: 600;
  font-size: 0.9375rem;
  opacity: 0;
  transition: opacity 0.2s;
}
.pdp-hero__cta-loader[hidden],
.pdp-hero__cta-check[hidden] { display: none; }
/* When visible (hidden removed), show as flex but don't block clicks when at opacity 0 */
.pdp-hero__cta-loader,
.pdp-hero__cta-check { pointer-events: none; }
.pdp-hero__cta.is-adding .pdp-hero__cta-text { opacity: 0; }
.pdp-hero__cta.is-adding .pdp-hero__cta-loader { opacity: 1; }
.pdp-hero__cta.is-adding { background-color: #c9563a; box-shadow: 0 2px 12px rgba(225, 108, 71, 0.35); }
.pdp-hero__cta.is-added { background-color: #c9563a; }
.pdp-hero__cta.is-added .pdp-hero__cta-text { opacity: 0; }
.pdp-hero__cta.is-added .pdp-hero__cta-check { opacity: 1; }
.pdp-hero__cta-loader svg { animation: spin 0.7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Stats Strip ── */
.pdp-hero__stats-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  background: rgba(225, 108, 71, 0.06);
  border-radius: 8px;
  padding: 0.4rem 0.75rem;
  margin-bottom: 0.75rem;
}
.pdp-hero__stat {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: #262320;
  white-space: nowrap;
}
.pdp-hero__stat svg { flex-shrink: 0; }
.pdp-hero__stat-sep {
  color: rgba(38, 35, 32, 0.25);
  font-size: 13px;
}

/* ── Selling Plan Radio Cards ── */
.pdp-hero__sp-cards {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  border: none;
  padding: 0;
  margin: 0 0 1rem;
}
.pdp-hero__sp-card {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  border: 1.5px solid rgba(38, 35, 32, 0.15);
  border-radius: 12px;
  padding: 0.875rem 1rem;
  cursor: pointer;
  transition: border-color 250ms cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 250ms cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}
.pdp-hero__sp-card--active {
  border-color: #E16C47;
}
.pdp-hero__sp-radio {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}
.pdp-hero__sp-card-radio {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid rgba(38, 35, 32, 0.25);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 200ms ease;
  margin-top: 3px;
}
.pdp-hero__sp-card--active .pdp-hero__sp-card-radio {
  border-color: #E16C47;
}
.pdp-hero__sp-card--active .pdp-hero__sp-card-radio::after {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #E16C47;
}
.pdp-hero__sp-card-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.pdp-hero__sp-card-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.pdp-hero__sp-card-label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.03em;
  color: #262320;
}
.pdp-hero__sp-card-badge {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: #E16C47;
  color: #fff;
  padding: 2px 8px;
  border-radius: 9999px;
  white-space: nowrap;
}
.pdp-hero__sp-card-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  flex-wrap: wrap;
}
.pdp-hero__sp-card-detail {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  color: rgba(38, 35, 32, 0.55);
}
.pdp-hero__sp-card-frequency {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.6875rem;
  font-weight: 600;
  color: #E16C47;
  background: rgba(225, 108, 71, 0.09);
  border-radius: 9999px;
  letter-spacing: 0.01em;
}
.pdp-hero__sp-card-frequency svg { flex-shrink: 0; }
.pdp-hero__sp-card-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
  flex-shrink: 0;
  margin-left: auto;
}
.pdp-hero__sp-card-compare {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  color: rgba(38, 35, 32, 0.4);
  text-decoration: line-through;
}
.pdp-hero__sp-card-price {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.03em;
  color: #262320;
}

/* ── Subscription perks inside card ── */
.pdp-hero__sp-card-perks-divider {
  height: 1px;
  background: rgba(225, 108, 71, 0.15);
  margin: 8px 0 6px;
}
.pdp-hero__sp-gift {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 2px 0 8px;
  padding: 7px 10px;
  border-radius: 8px;
  background: linear-gradient(90deg, rgba(225,108,71,0.10), rgba(243,232,145,0.35));
  border: 1px dashed rgba(225,108,71,0.45);
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.75rem;
  line-height: 1.3;
  color: #262320;
}
.pdp-hero__sp-gift svg { color: #E16C47; flex: 0 0 auto; }
.pdp-hero__sp-gift strong { font-weight: 700; }
.pdp-hero__sp-card-perks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.pdp-hero__sp-perk {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 11.5px;
  color: rgba(38, 35, 32, 0.65);
}
.pdp-hero__sp-perk svg {
  flex-shrink: 0;
}

/* ── Gift Incentive Card ── */
.pdp-hero__gift-incentive {
  margin-top: 1rem;
}
.pdp-hero__gift-card {
  border: 1px solid rgba(38, 35, 32, 0.12);
  border-radius: 12px;
  overflow: hidden;
}
.pdp-hero__gift-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 1rem;
  background: rgba(225, 108, 71, 0.08);
}
.pdp-hero__gift-card-title {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #262320;
}
.pdp-hero__gift-card-savings {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  background: #262320;
  color: #F3F1E9;
  padding: 2px 8px;
  border-radius: 4px;
}
.pdp-hero__gift-card-rows {
  padding: 0 1rem;
}
.pdp-hero__gift-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(38, 35, 32, 0.06);
}
.pdp-hero__gift-row:last-child { border-bottom: none; }
.pdp-hero__gift-row-name {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 14px;
  font-weight: 500;
  color: #262320;
}
.pdp-hero__gift-row-prices {
  display: flex;
  align-items: center;
  gap: 6px;
}
.pdp-hero__gift-row-compare {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 13px;
  color: rgba(38, 35, 32, 0.4);
  text-decoration: line-through;
}
.pdp-hero__gift-row-price {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 14px;
  font-weight: 600;
  color: #262320;
}
.pdp-hero__gift-row-free {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 14px;
  font-weight: 600;
  color: #E16C47;
}
.pdp-hero__gift-card-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 0.75rem 1rem;
  border-top: 1px solid rgba(38, 35, 32, 0.06);
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  line-height: 1.5;
  color: rgba(38, 35, 32, 0.7);
}
.pdp-hero__gift-note-icon { font-size: 16px; flex-shrink: 0; }

/* Countdown */
.pdp-hero__countdown-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.875rem;
  background: rgba(38, 35, 32, 0.03);
  border-radius: 10px;
}
.pdp-hero__countdown-label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.03em;
  color: #E16C47;
  white-space: nowrap;
}
.pdp-hero__countdown {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-body, 'Inter', sans-serif);
}
.pdp-hero__cd-block {
  display: flex;
  align-items: baseline;
  gap: 2px;
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #262320;
}
.pdp-hero__cd-unit {
  font-size: 10px;
  font-weight: 500;
  color: rgba(38, 35, 32, 0.5);
}
.pdp-hero__cd-sep {
  font-size: 13px;
  font-weight: 600;
  color: rgba(38, 35, 32, 0.3);
}

/* (sub trust points moved inside subscription card as perks) */
.pdp-hero__sp-option:not(.pdp-hero__sp-option--active) .pdp-hero__sp-save {
  background: rgba(225, 108, 71, 0.12);
  color: #E16C47;
}

/* ── Sticky Add to Cart Bar ── */
.pdp-sticky-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 60; /* above gallery arrows (z-index: 2) and header (z-index: 50) */
  background: #fff;
  border-top: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
  transform: translateY(100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}
.pdp-sticky-bar[hidden] { display: block; }
.pdp-sticky-bar.is-visible { transform: translateY(0); }

.pdp-sticky-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.625rem 0;
  gap: 0.75rem;
}

.pdp-sticky-bar__info {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
  flex: 1 1 0;
  overflow: hidden;
}
.pdp-sticky-bar__thumb {
  flex-shrink: 0;
}
.pdp-sticky-bar__thumb-img {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  object-fit: cover;
}
.pdp-sticky-bar__meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 0.125rem;
}

.pdp-sticky-bar__title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #262320;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pdp-sticky-bar__pricing {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
  flex-wrap: wrap;
}

.pdp-sticky-bar__price {
  font-size: clamp(0.8125rem, 2.5vw, 1.0625rem);
  font-weight: 700;
  color: #262320;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.pdp-sticky-bar__compare {
  font-size: clamp(0.6875rem, 2vw, 0.8125rem);
  color: rgba(38, 35, 32, 0.45);
  text-decoration: line-through;
  white-space: nowrap;
}

.pdp-sticky-bar__save {
  font-size: 0.6875rem;
  font-weight: 600;
  color: #16a34a;
  background: rgba(22,163,74,0.08);
  padding: 1px 6px;
  border-radius: 9999px;
  white-space: nowrap;
}

.pdp-sticky-bar__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  min-width: 0;
  background: #E16C47;
  color: #fff;
  border: none;
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s, transform 0.2s;
}

/* ── Sticky bar — mobile redesign (<=749px) ──
   All info must fit: price + compare + save + dropdown + CTA.
   Single row can't hold everything at 327px, so use TWO rows:
   Row 1 (top, compact):  [ Price ]  [ Compare ]  [ Save badge ]
   Row 2 (bottom, main):  [ Dropdown ]  [ Big CTA ]
   Thumb + title are hidden (redundant — visible in main buy box above). */
@media (max-width: 749px) {
  .pdp-sticky-bar {
    padding-inline: 10px;
  }
  .pdp-sticky-bar__inner {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    grid-template-areas:
      "info info"
      "select btn";
    gap: 6px 8px;
    padding: 8px 0;
    align-items: center;
  }
  /* Row 1: pricing only (thumb + title hidden) */
  .pdp-sticky-bar__info {
    grid-area: info;
    flex: 0 0 auto;
    min-width: 0;
    overflow: visible;
    display: flex;
    align-items: baseline;
  }
  .pdp-sticky-bar__thumb,
  .pdp-sticky-bar__title {
    display: none !important;
  }
  .pdp-sticky-bar__meta {
    flex: 1 1 auto;
    min-width: 0;
    gap: 0;
  }
  .pdp-sticky-bar__pricing {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: nowrap;
    overflow: hidden;
  }
  .pdp-sticky-bar__price {
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
  }
  .pdp-sticky-bar__compare {
    font-size: 0.75rem;
    line-height: 1.2;
    white-space: nowrap;
    color: rgba(38, 35, 32, 0.5);
  }
  .pdp-sticky-bar__save-badge {
    display: inline-flex !important;
    font-size: 0.625rem;
    padding: 1px 6px;
    line-height: 1.3;
    margin-left: auto; /* push to right edge of row */
  }
  /* Row 2: dropdown + CTA — matching heights (40px) */
  .pdp-sticky-bar__sp-toggle { display: none; }
  .pdp-sticky-bar__sp-select-wrap {
    grid-area: select;
    display: inline-flex;
    flex: 0 0 auto;
    height: 40px;
  }
  .pdp-sticky-bar__sp-select {
    height: 40px;
    padding: 0 26px 0 12px;
    font-size: 0.8125rem;
    line-height: 1;
    box-sizing: border-box;
  }
  .pdp-sticky-bar__btn {
    grid-area: btn;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: 40px;
    padding: 0 0.75rem;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1;
    justify-content: center;
    box-sizing: border-box;
  }
}

/* Very narrow phones (<340px) — hide compare strikethrough if tight */
@media (max-width: 339px) {
  .pdp-sticky-bar__compare { display: none; }
}
.pdp-sticky-bar__btn.is-adding {
  pointer-events: none;
}
.pdp-sticky-bar__btn.is-added {
  background: #c9563a;
}
.pdp-sticky-bar__btn:hover {
  background: #c9563a;
  box-shadow: 0 4px 16px rgba(225, 108, 71, 0.4);
  transform: translateY(-1px);
}
.pdp-sticky-bar__btn:disabled {
  background: #e4e4e7;
  color: #999;
  box-shadow: none;
  cursor: not-allowed;
}

/* Dark mode */
.theme-dark .pdp-sticky-bar {
  background: rgba(30, 30, 50, 0.95);
  border-color: rgba(255,255,255,0.1);
  box-shadow: 0 -4px 20px rgba(0,0,0,0.4);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.theme-dark .pdp-sticky-bar__title { color: #f5f5f5; }
.theme-dark .pdp-sticky-bar__price { color: #f5f5f5; }
.theme-dark .pdp-sticky-bar__compare { color: rgba(255,255,255,0.4); }
.theme-dark .pdp-sticky-bar__btn { background: #E16C47; color: #fff; }

/* Shimmer pseudo-element */
.pdp-hero__cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.08) 25%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.08) 75%,
    transparent 100%
  );
  background-size: 200% 100%;
  animation: ctaShimmer 4s ease-in-out infinite;
  pointer-events: none;
  border-radius: inherit;
}

@keyframes ctaShimmer {
  0% {
    background-position: 200% center;
  }
  100% {
    background-position: -200% center;
  }
}

/* Dynamic Checkout Button — match main CTA dimensions */
.pdp-hero__dynamic-checkout {
  margin-top: 0;
  position: relative;
  min-height: 52px;
  width: 100%;
}

/* Skeleton loader while Shopify JS loads the real button */
.pdp-hero__dynamic-checkout-skeleton {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  transition: opacity 0.3s;
}
.pdp-hero__dynamic-checkout-skeleton-btn {
  width: 100%;
  height: 52px;
  border-radius: var(--radius-button);
  background: linear-gradient(90deg, #eae9e4 25%, #F3F1E9 50%, #eae9e4 75%);
  background-size: 200% 100%;
  animation: skeletonPulse 1.5s ease-in-out infinite;
}
@keyframes skeletonPulse {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
/* Hide skeleton once JS marks it loaded */
.pdp-hero__dynamic-checkout.is-loaded .pdp-hero__dynamic-checkout-skeleton {
  opacity: 0;
  pointer-events: none;
}
.pdp-hero__dynamic-checkout .shopify-payment-button {
  margin: 0;
  width: 100%;
  min-height: 52px;
}
.pdp-hero__dynamic-checkout .shopify-payment-button__button {
  width: 100%;
  min-height: 52px !important;
  height: 52px !important;
  max-height: 52px !important;
  padding: 0 2rem !important;
  box-sizing: border-box;
  border-radius: var(--radius-button) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  letter-spacing: 0.01em;
  transition: box-shadow 0.25s ease, transform 0.2s ease;
  line-height: 1.2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}
/* Target all nested elements Shopify injects */
.pdp-hero__dynamic-checkout .shopify-payment-button__button--unbranded,
.pdp-hero__dynamic-checkout .shopify-payment-button__button--branded {
  border-radius: var(--radius-button) !important;
  height: 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
}
/* Force iframe inside dynamic checkout to match */
.pdp-hero__dynamic-checkout .shopify-payment-button__button iframe {
  min-height: 52px !important;
  max-height: 52px !important;
  border-radius: var(--radius-button) !important;
}
/* Target the div wrapper Shopify adds around the button */
.pdp-hero__dynamic-checkout .shopify-payment-button__button > div {
  border-radius: var(--radius-button) !important;
  overflow: hidden !important;
  height: 52px !important;
}
.pdp-hero__dynamic-checkout .shopify-payment-button__button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}
.pdp-hero__dynamic-checkout .shopify-payment-button__button--unbranded {
  background-color: #262320 !important;
  color: #fff !important;
}
.pdp-hero__dynamic-checkout .shopify-payment-button__button--unbranded:hover {
  background-color: #111122 !important;
}
.pdp-hero__dynamic-checkout .shopify-payment-button__more-options {
  display: none;
}
/* CMS editor preview — force rounded corners on all possible wrappers */
.pdp-hero__dynamic-checkout .shopify-payment-button__button *,
.pdp-hero__dynamic-checkout .shopify-payment-button__button *::before,
.pdp-hero__dynamic-checkout .shopify-payment-button__button *::after {
  border-radius: 999px !important;
}

/* Product form gap */
.pdp-hero__info form[data-product-form] {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* Accordions */
.pdp-hero__accordions {
  border-block-start: 1px solid var(--color-border, #deddd8);
  padding-block-start: 0;
  margin-top: 0;
}

.pdp-hero__accordion {
  border-block-end: 1px solid var(--color-border, #deddd8);
}

.pdp-hero__accordion-trigger {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-block: 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: 500;
  color: var(--color-foreground, #262320);
  text-align: start;
  font-family: inherit;
}

.pdp-hero__accordion-chevron {
  transition: transform 0.25s ease;
  flex-shrink: 0;
}

.pdp-hero__accordion-trigger[aria-expanded="true"] .pdp-hero__accordion-chevron {
  transform: rotate(180deg);
}

.pdp-hero__accordion-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.25s ease;
}

.pdp-hero__accordion-trigger[aria-expanded="true"] + .pdp-hero__accordion-content {
  grid-template-rows: 1fr;
}

.pdp-hero__accordion-body {
  overflow: hidden;
}

.pdp-hero__accordion-text {
  margin: 0;
  padding-block-end: 0.75rem;
  font-size: var(--font-size-sm, 0.875rem);
  color: var(--color-text-secondary, #666);
  line-height: 1.5;
}


/* ─── Discount Timer ─── */
.pdp-hero__discount-timer { }
.pdp-hero__discount-timer[hidden] { display: none; }
.pdp-hero__discount-timer-inner {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #deddd8);
  border-radius: 10px;
  font-size: 12px;
  color: var(--color-text-secondary, #666);
}
.pdp-hero__discount-timer-inner svg { color: #888; flex-shrink: 0; }
.pdp-hero__discount-timer-label { font-weight: 500; }
.pdp-hero__discount-timer-digits {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: auto;
  font-size: 13px;
  color: var(--color-foreground, #262320);
}

/* ─── Compatible With — inside accordion, logo grid ─── */
.pdp-hero__compat-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pdp-hero__compat-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  height: 40px;
  background: #fff;
  border: 1px solid var(--color-border, #deddd8);
  border-radius: 8px;
  padding: 6px 10px;
}
.pdp-hero__compat-logo span {
  font-size: 10px;
  font-weight: 600;
  color: #555;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}
.pdp-hero__compat-logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}


/* ─── Feature Prompts (App / Bundle / Student) ─── */
/* Unified single-line prompt — follows trust badge visual language */
.pdp-hero__feature-prompt { }
.pdp-hero__feature-prompt[hidden] { display: none; }
.pdp-hero__feature-prompt-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #deddd8);
  border-radius: var(--radius-card);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, background 0.15s;
}
.pdp-hero__feature-prompt-link:hover {
  border-color: var(--color-foreground, #262320);
  text-decoration: none;
}
.pdp-hero__feature-prompt-link > svg:first-child {
  flex-shrink: 0;
  color: var(--color-foreground, #262320);
}
.pdp-hero__feature-prompt-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.pdp-hero__feature-prompt-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--color-foreground, #262320);
}
.pdp-hero__feature-prompt-desc {
  font-size: 11px;
  color: var(--color-text-muted, #999);
}
.pdp-hero__feature-prompt-arrow {
  flex-shrink: 0;
  color: #bbb;
  transition: transform 0.15s;
}
.pdp-hero__feature-prompt-link:hover .pdp-hero__feature-prompt-arrow {
  transform: translateX(2px);
  color: var(--color-foreground, #262320);
}

/* ---- Desktop ---- */

@media (min-width: 768px) {
  .pdp-hero {
    padding-block: 0 3rem;
  }

  .pdp-hero__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: 1.5rem;
    row-gap: 0.5rem;
  }

  .pdp-hero__gallery-sticky {
    position: sticky;
    top: 12px;
    align-self: start;
  }

  .pdp-hero__main-image {
    border-radius: 0.5rem;
  }

  .pdp-hero__arrow {
    width: 2.5rem;
    height: 2.5rem;
  }

  .pdp-hero__thumb {
    width: 4rem;
    height: 4rem;
  }

  .pdp-hero__info {
    padding-inline: 0;
  }

  .pdp-hero__title {
    font-size: 2.25rem;
  }

  .pdp-hero__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0;
    margin-bottom: 6px;
  }

}

@media (min-width: 1024px) {
  .pdp-hero__grid {
    column-gap: 3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pdp-hero__cta::before {
    animation: none;
  }
  .pdp-hero__carousel {
    scroll-behavior: auto;
  }
  .pdp-hero__accordion-content {
    transition: none;
  }
  .pdp-hero__accordion-chevron {
    transition: none;
  }
}

/* ─── Back In Stock Notify Form ─── */
.pdp-hero__notify {
  margin-top: 12px;
  border-radius: 1rem;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.pdp-hero__notify[hidden] { display: none; }
.pdp-hero__notify-inner {
  padding: 1.25rem;
  text-align: left;
}
.pdp-hero__notify-icon {
  margin-block-end: 0.5rem;
  color: #999;
}
.pdp-hero__notify-heading {
  font-size: 15px;
  font-weight: 700;
  color: #262320;
  margin: 0 0 0.75rem;
}
.pdp-hero__notify-input-wrap {
  display: flex;
  gap: 8px;
}
.pdp-hero__notify-input {
  flex: 1;
  padding: 0.625rem 0.875rem;
  font-size: 13px;
  font-family: inherit;
  border: 1.5px solid rgba(0,0,0,0.12);
  border-radius: 8px;
  background: #f9f9f7;
  color: #262320;
  outline: none;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.pdp-hero__notify-input:focus {
  border-color: #E16C47;
  background: #fff;
}
.pdp-hero__notify-input::placeholder { color: #999; }
.pdp-hero__notify-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 120px;
  padding: 0.625rem 1.25rem;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: #E16C47;
  border: none;
  border-radius: var(--radius-button);
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(225,108,71,0.25);
  transition: box-shadow 0.25s ease, transform 0.2s ease, background 0.2s ease;
}
.pdp-hero__notify-btn:hover { background: #c85d3b; box-shadow: 0 4px 16px rgba(225,108,71,0.4); transform: translateY(-1px); }
.pdp-hero__notify-btn:active { transform: translateY(0); box-shadow: 0 2px 8px rgba(225,108,71,0.25); }
.pdp-hero__notify-btn:disabled { opacity: 0.8; cursor: not-allowed; transform: none; }
.pdp-hero__notify-btn.is-loading [data-notify-btn-text] { opacity: 0; }
.pdp-hero__notify-btn.is-loading .pdp-hero__notify-spinner { opacity: 1; }
.pdp-hero__notify-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s;
  pointer-events: none;
}
.pdp-hero__notify-spinner svg { animation: spin 0.6s linear infinite; }
.pdp-hero__notify-spinner[hidden] { display: none !important; }
.pdp-hero__notify-input--error { border-color: #ef4444 !important; background: #fef2f2 !important; }
.pdp-hero__notify-input--error::placeholder { color: #ef4444; }
.theme-dark .pdp-hero__notify-input--error { background: rgba(239,68,68,0.1) !important; }
.pdp-hero__notify-disclaimer {
  font-size: 10px;
  color: #999;
  margin: 6px 0 0;
}
/* Dark mode notify */
.theme-dark .pdp-hero__notify {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.1);
  box-shadow: none;
}
.theme-dark .pdp-hero__notify-icon { color: rgba(255,255,255,0.5); }
.theme-dark .pdp-hero__notify-heading { color: #f5f5f5; }
.theme-dark .pdp-hero__notify-input {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.15);
  color: #f5f5f5;
}
.theme-dark .pdp-hero__notify-input::placeholder { color: rgba(255,255,255,0.4); }
.theme-dark .pdp-hero__notify-input:focus { border-color: rgba(255,255,255,0.4); background: rgba(255,255,255,0.12); }
.theme-dark .pdp-hero__notify-btn { background: #f5f5f5; color: #262320; }
.theme-dark .pdp-hero__notify-btn:hover { background: #e0e0e0; }
.theme-dark .pdp-hero__notify-disclaimer { color: rgba(255,255,255,0.4); }
.theme-dark .pdp-hero__notify-success-title { color: #f5f5f5; }
.theme-dark .pdp-hero__notify-success-desc { color: rgba(255,255,255,0.6); }
.theme-dark .pdp-hero__notify-btn { background: #E16C47; color: #fff; }
.theme-dark .pdp-hero__notify-btn:hover { background: #248a1a; }
.pdp-hero__notify-success {
  text-align: center;
}
.pdp-hero__notify-success[hidden] { display: none; }
.pdp-hero__notify-success-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem;
  animation: notifySuccessIn 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes notifySuccessIn {
  from { transform: scale(0.8); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
.pdp-hero__notify-success-icon {
  margin-bottom: 0.25rem;
}
.pdp-hero__notify-success-title {
  font-size: 16px;
  font-weight: 700;
  color: #262320;
  margin: 0;
}
.pdp-hero__notify-success-desc {
  font-size: 12px;
  color: #666;
  margin: 0;
  max-width: 20rem;
}

/* Urgency Module (inventory wrapper) */
.pdp-hero__urgency-module {
  margin-top: 4px;
}

/* Stock Inventory */
.pdp-hero__inventory { }
.pdp-hero__inventory-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  color: #888;
}
.pdp-hero__inventory-left {
  display: flex;
  align-items: center;
  gap: 6px;
}
.pdp-hero__inventory-dot {
  --dot-color: #22c55e;
  position: relative;
  width: 6px;
  height: 6px;
}
.pdp-hero__inventory-dot::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: var(--dot-color);
}
.pdp-hero__inventory-dot::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  background: var(--dot-color);
  opacity: 0.5;
  animation: ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}
.pdp-hero__inventory-dot.is-out::after { animation: none; opacity: 0; }
@keyframes ping {
  75%, 100% { transform: scale(2); opacity: 0; }
}
.pdp-hero__inventory-status { color: #16a34a; font-weight: 500; }

/* Inventory progress bar */
.pdp-hero__inventory-bar {
  width: 100%;
  height: 4px;
  background: #eee;
  border-radius: 9999px;
  margin-top: 8px;
  overflow: hidden;
}
.pdp-hero__inventory-fill {
  height: 100%;
  background: linear-gradient(90deg, #22c55e 0%, #16a34a 100%);
  border-radius: 9999px;
  width: 68%;
  transition: width 0.6s ease;
}
.pdp-hero__inventory-right {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #888;
}
.pdp-hero__inventory-sep {
  color: rgba(0,0,0,0.15);
}
.pdp-hero__inventory-country {
  display: flex;
  align-items: center;
  gap: 4px;
}
.pdp-hero__inventory-timer {
  display: flex;
  align-items: center;
  gap: 4px;
  font-variant-numeric: tabular-nums;
  color: #888;
}
.pdp-hero__inventory-timer svg { flex-shrink: 0; }
.pdp-hero__inventory-timer[hidden] { display: none; }

/* Shipping line — sits under inventory bar */
.pdp-hero__shipping {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: #888;
  margin-top: 6px;
}
.pdp-hero__shipping svg { flex-shrink: 0; color: #888; }
.pdp-hero__shipping strong { color: #888; font-weight: 600; }

/* Trust Badges */
/* App blocks (Loox micro-reviews, etc.) — discreet under CTA */
.pdp-hero__app-block {
  margin-top: 12px;
  max-width: 100%;
  /* NOTE: no overflow clipping here. Loox Snippets Widget positions its
     scroll arrows slightly outside its own bounding box (intentional —
     arrows sit on the edge), and overflow: clip/hidden would crop them.
     The viewport-level safety net lives on .pdp-hero. */
}
.pdp-hero__app-block:empty {
  display: none;
}

/* ── Flush-align Loox Cards Carousel (and any @app block) with product form ──
   Strip horizontal padding/margin on the OUTER wrapper levels only.
   IMPORTANT: do NOT force width:100% on descendants — that breaks the
   carousel's flex layout (slides would each take 100% and the track
   would burst out the right side of the viewport, pushing the whole
   page off-screen on mobile). */
.pdp-hero__app-block > *,
.pdp-hero__app-block > * > * {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100%;
  box-sizing: border-box;
}
/* Known Loox container classes — belt and suspenders */
.pdp-hero__app-block [class*="loox-product-carousel"],
.pdp-hero__app-block [class*="loox-card-carousel"],
.pdp-hero__app-block [class*="loox-carousel"],
.pdp-hero__app-block [id*="looxReviews"],
.pdp-hero__app-block [id*="loox-card-carousel"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100%;
}

/* NOTE: Loox Cards Carousel renders its cards + arrows inside a
   cross-origin <iframe src="loox.io/widget/...">. Our theme CSS can
   only style the outer wrapper (.loox-v2-carousel-container) — anything
   inside the iframe (card padding, arrow size/position, etc.) must be
   configured in the Loox app settings inside Shopify admin.
   The outer wrapper already has zero padding (verified in DevTools). */

.pdp-hero__trust-badges {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #666;
  margin-top: 4px;
  /* Horizontal scroll on mobile so all badges are reachable */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex-wrap: nowrap;
}
.pdp-hero__trust-badges::-webkit-scrollbar { display: none; }
.pdp-hero__trust-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  flex-shrink: 0;
}
.pdp-hero__trust-badge svg { color: #16a34a; flex-shrink: 0; }
.pdp-hero__trust-sep { color: rgba(0,0,0,0.15); flex-shrink: 0; }

/* Included Items */
.pdp-hero__included-list p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--color-foreground, #262320);
  margin: 0;
}
.pdp-hero__included-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 14px;
  line-height: 1.6;
  color: var(--color-foreground, #262320);
  padding: 0.125rem 0;
}
.pdp-hero__included-qty {
  color: var(--color-text-secondary, #666);
  font-size: 13px;
  flex-shrink: 0;
  margin-left: 1rem;
}
/* Rich text variant for What's Included */
.pdp-hero__included-richtext {
  font-size: 14px;
  line-height: 1.6;
  color: var(--color-foreground, #262320);
}
.pdp-hero__included-richtext ul,
.pdp-hero__included-richtext ol {
  padding-left: 1.25rem;
  margin: 0;
}
.pdp-hero__included-richtext li {
  padding: 0.125rem 0;
}
.pdp-hero__included-richtext p {
  margin: 0 0 0.25rem;
}

/* Certification Logos */
.pdp-hero__cert-logos {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 24px;
  padding: 12px 0;
}
.pdp-hero__cert-logos img {
  height: 40px;
  width: auto;
  object-fit: contain;
  opacity: 0.8;
}
.theme-dark .pdp-hero__cert-logos img {
  filter: invert(1) brightness(2);
  opacity: 0.9;
}
.pdp-hero__accordion-answer p { font-size: 14px; color: #666; margin-bottom: 8px; }

/* Ingredient icons — small colored SVGs before each <strong> in Key Ingredients tab */
.pdp-hero__accordion-answer--ingredients p {
  position: relative;
  padding-left: 24px;
}
.pdp-hero__accordion-answer--ingredients p::before {
  content: '';
  position: absolute;
  left: 0;
  top: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  flex-shrink: 0;
}
.pdp-hero__accordion-answer--ingredients p:nth-child(1)::before {
  background: #E16C47;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M8 1.5C5.5 1.5 2 4 2 7.5S5.5 14.5 8 14.5s6-3 6-6.5S10.5 1.5 8 1.5zm0 2c.8 0 2.5 1.2 3.2 2.5.4.7.3 1.5-.2 2-.5.5-1.2.5-1.8.2C8.5 8.3 8 8 8 8s-.5.3-1.2.7c-.6.3-1.3.3-1.8-.2s-.6-1.3-.2-2C5.5 5.2 7.2 4 8 3.5z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M8 1.5C5.5 1.5 2 4 2 7.5S5.5 14.5 8 14.5s6-3 6-6.5S10.5 1.5 8 1.5zm0 2c.8 0 2.5 1.2 3.2 2.5.4.7.3 1.5-.2 2-.5.5-1.2.5-1.8.2C8.5 8.3 8 8 8 8s-.5.3-1.2.7c-.6.3-1.3.3-1.8-.2s-.6-1.3-.2-2C5.5 5.2 7.2 4 8 3.5z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.pdp-hero__accordion-answer--ingredients p:nth-child(2)::before {
  background: #4F576A;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M12 2C9.5 2 8 4.5 8 7c0 1-.3 2-.8 2.8L4 14l1.5 1 2.5-3.2c.6.1 1.2.2 1.8.2 3.3 0 6-2.7 6-6s-1.5-4-3.8-4z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M12 2C9.5 2 8 4.5 8 7c0 1-.3 2-.8 2.8L4 14l1.5 1 2.5-3.2c.6.1 1.2.2 1.8.2 3.3 0 6-2.7 6-6s-1.5-4-3.8-4z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.pdp-hero__accordion-answer--ingredients p:nth-child(3)::before {
  background: #F3E891;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M13 3C10 3 8 5 8 8v5h1v-5c0-2 1.5-4 4-4V3zM3 5c2.5 0 4 2 4 4v4h1V9c0-3-2-5-5-5v1z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M13 3C10 3 8 5 8 8v5h1v-5c0-2 1.5-4 4-4V3zM3 5c2.5 0 4 2 4 4v4h1V9c0-3-2-5-5-5v1z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.pdp-hero__accordion-answer--ingredients p:nth-child(4)::before {
  background: #9EADD2;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Ccircle cx='8' cy='8' r='5.5'/%3E%3Ccircle cx='8' cy='8' r='2.5' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Ccircle cx='8' cy='8' r='5.5'/%3E%3Ccircle cx='8' cy='8' r='2.5' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") center/contain no-repeat;
}
.pdp-hero__accordion-answer--ingredients p:nth-child(5)::before {
  background: #E16C47;
  opacity: 0.7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M8 1L6 5H2l3.5 3-1.2 5L8 10.5 11.7 13l-1.2-5L14 5h-4L8 1z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M8 1L6 5H2l3.5 3-1.2 5L8 10.5 11.7 13l-1.2-5L14 5h-4L8 1z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* How to Enjoy steps */
.pdp-hero__how-to-steps {
  display: flex;
  gap: 16px;
  padding: 4px 0;
}
.pdp-hero__how-step {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}
.pdp-hero__how-step-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #E16C47;
  color: #fff;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 12px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  letter-spacing: -0.03em;
}
.pdp-hero__how-step-text {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 13px;
  font-weight: 400;
  color: #262320;
  letter-spacing: -0.03em;
  line-height: 1.4;
}
@media (max-width: 549px) {
  .pdp-hero__how-to-steps {
    flex-direction: column;
    gap: 10px;
  }
}

/* Doc Buttons */
.pdp-hero__doc-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding-top: 4px;
  margin-top: 0;
}
.pdp-hero__doc-buttons {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pdp-hero__doc-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 500;
  color: #262320;
  background: transparent;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 9999px;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
  font-family: inherit;
  line-height: 1;
}
.pdp-hero__doc-btn:hover {
  background: #262320;
  color: #fff;
  border-color: #262320;
  text-decoration: none;
}
.pdp-hero__sku {
  font-size: 11px;
  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
  color: #999;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Tech Specs Modal */
.pdp-hero__modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: none;
  align-items: center;
  justify-content: center;
}
.pdp-hero__modal-overlay.is-open {
  display: flex;
}
.pdp-hero__modal-overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.pdp-hero__modal {
  position: relative;
  background: var(--color-background, #faf9f6);
  border-radius: var(--radius-card);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  max-width: 32rem;
  width: calc(100% - 2rem);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  animation: fadeSlideIn 0.3s ease-out;
}
@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.pdp-hero__modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  border-bottom: 1px solid var(--color-border, #deddd8);
  flex-shrink: 0;
}
.pdp-hero__modal-title {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
  color: var(--color-foreground, #262320);
}
.pdp-hero__modal-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 8px;
  color: #888;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s, background 0.2s;
}
.pdp-hero__modal-close:hover {
  color: var(--color-foreground, #262320);
  background: var(--color-secondary, #eae9e4);
}
.pdp-hero__modal-body {
  overflow-y: auto;
  padding: 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.pdp-hero__specs-section { }
.pdp-hero__specs-section--last { padding-bottom: 8px; }
.pdp-hero__specs-heading {
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 12px 0;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--color-foreground, #262320);
}
.pdp-hero__specs-bar {
  width: 4px;
  height: 16px;
  border-radius: 100px;
  flex-shrink: 0;
}
.pdp-hero__specs-rows {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pdp-hero__specs-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(0,0,0,0.04);
}
.pdp-hero__specs-row:last-child { border-bottom: none; }
.pdp-hero__specs-row span:first-child {
  font-size: 12px;
  color: #888;
}
.pdp-hero__specs-row span:last-child {
  font-size: 12px;
  font-weight: 500;
  text-align: right;
  color: var(--color-foreground, #262320);
}
.pdp-hero__specs-modes {
  margin-top: 12px;
  background: rgba(0,0,0,0.02);
  border-radius: 8px;
  padding: 12px;
}
.pdp-hero__specs-modes-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #888;
  margin-bottom: 8px;
}
.pdp-hero__specs-mode {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  padding: 3px 0;
}
.pdp-hero__specs-mode-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.pdp-hero__specs-mode-name {
  font-weight: 500;
  min-width: 70px;
}
.pdp-hero__specs-mode-wave {
  color: #888;
  flex: 1;
}
.pdp-hero__specs-mode-density {
  color: #888;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
  font-size: 10px;
}
.pdp-hero__specs-certs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 8px 0;
}
.pdp-hero__specs-certs img {
  height: 32px;
  width: auto;
  object-fit: contain;
  opacity: 0.7;
}

/* ── Frequently Bundled Together ── */
.pdp-hero__fb {
  margin-top: 16px;
  padding: 18px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.pdp-hero__fb-title {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #262320;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}
.pdp-hero__fb-cards {
  display: flex;
  align-items: stretch;
  gap: 8px;
  margin-bottom: 14px;
}
.pdp-hero__fb-card {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 12px 8px;
  background: #F7F5EF;
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  min-width: 0;
}
.pdp-hero__fb-card img {
  width: 96px;
  height: 96px;
  object-fit: contain;
  border-radius: 6px;
  background: #fff;
}
.pdp-hero__fb-card-label {
  font-size: 0.8125rem;
  line-height: 1.25;
  text-align: center;
  color: #262320;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pdp-hero__fb-card-price {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #262320;
}
.pdp-hero__fb-plus {
  align-self: center;
  font-size: 1.5rem;
  font-weight: 300;
  color: rgba(38,35,32,0.5);
  line-height: 1;
}
.pdp-hero__fb-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  background: rgba(225, 108, 71, 0.06);
  border: 1px solid rgba(225, 108, 71, 0.18);
  border-radius: 8px;
  margin-bottom: 12px;
}
.pdp-hero__fb-row {
  display: flex;
  justify-content: space-between;
  font-size: 0.8125rem;
  color: rgba(38,35,32,0.72);
}
.pdp-hero__fb-row--bundle { color: #262320; }
.pdp-hero__fb-row s { opacity: 0.6; }
.pdp-hero__fb-savings {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 0.8125rem;
  color: #E16C47;
  font-weight: 600;
  margin-top: 2px;
}
.pdp-hero__fb-savings strong { font-size: 0.9375rem; font-weight: 700; }
.pdp-hero__fb-pct { font-size: 0.75rem; opacity: 0.85; }
.pdp-hero__fb-sub-label { font-size: 0.6875rem; color: #15803d; font-weight: 500; letter-spacing: 0; }
.pdp-hero__fb-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 12px;
  background: #E16C47;
  color: #fff;
  border: none;
  border-radius: 9999px;
  font-size: 0.9375rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s;
}
.pdp-hero__fb-cta:hover:not(:disabled) { background: #c9563a; }
.pdp-hero__fb-cta:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}
@media (max-width: 479px) {
  .pdp-hero__fb-card img { width: 72px; height: 72px; }
  .pdp-hero__fb { padding: 10px; margin-top: 8px; margin-bottom: 0; }
}

/* ── Pairs Well With — vertical stacked, boxed white ── */
.pdp-hero__cross-sell {
  margin-top: 8px;
}
.pdp-hero__cross-sell-box {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: var(--radius-card);
  padding: 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.02);
}
.pdp-hero__cross-sell-title {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #999;
  margin-bottom: 0.75rem;
}
/* ── Skeleton loader ── */
.pdp-hero__cross-sell-skeleton {
  display: flex;
  gap: 10px;
}
.pdp-hero__cross-sell-skeleton-card {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: var(--radius-card);
  border: 1px solid #eee;
  background: #fff;
}
.pdp-hero__cross-sell-skeleton-img {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: var(--radius-image);
  background: #f0eeea;
  animation: crossSellPulse 1.5s ease-in-out infinite;
}
.pdp-hero__cross-sell-skeleton-lines {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pdp-hero__cross-sell-skeleton-line {
  height: 10px;
  border-radius: 4px;
  background: #f0eeea;
  animation: crossSellPulse 1.5s ease-in-out infinite;
}
.pdp-hero__cross-sell-skeleton-line:nth-child(2) { animation-delay: 0.15s; }
.pdp-hero__cross-sell-skeleton-line:nth-child(3) { animation-delay: 0.3s; }
.pdp-hero__cross-sell-skeleton-btn {
  flex-shrink: 0;
  width: 52px;
  height: 30px;
  border-radius: 6px;
  background: #f0eeea;
  animation: crossSellPulse 1.5s ease-in-out infinite;
  animation-delay: 0.2s;
}
@keyframes crossSellPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.pdp-hero__cross-sell-skeleton[hidden] { display: none; }

/* ── Stack: vertical list inside the white box ── */
.pdp-hero__cross-sell-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.pdp-hero__cross-sell-stack:empty { display: none; }
.pdp-hero__cross-sell-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid #f0f0f0;
}
.pdp-hero__cross-sell-card:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.pdp-hero__cross-sell-card:first-child {
  padding-top: 0;
}
.pdp-hero__cross-sell-img {
  position: relative;
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: var(--radius-image);
  overflow: hidden;
  background: #F3F1E9;
  border: 1px solid #eee;
}
.pdp-hero__cross-sell-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.pdp-hero__cross-sell-card:hover .pdp-hero__cross-sell-img img {
  transform: scale(1.04);
}
/* Badge removed — no discount label on cross-sell images */
.pdp-hero__cross-sell-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.pdp-hero__cross-sell-name {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--color-foreground, #262320);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pdp-hero__cross-sell-desc {
  font-size: 11px;
  line-height: 1.35;
  color: var(--color-text-secondary, #666);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pdp-hero__cross-sell-pricing {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 1px;
}
.pdp-hero__cross-sell-price {
  font-size: 13px;
  font-weight: 700;
  color: var(--color-foreground, #262320);
}
.pdp-hero__cross-sell-compare {
  font-size: 11px;
  color: var(--color-text-muted, #999);
  text-decoration: line-through;
}
.pdp-hero__cross-sell-add {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0.5rem 1rem;
  background: #262320;
  color: #fff;
  border: none;
  border-radius: var(--radius-button);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  font-family: inherit;
  white-space: nowrap;
  overflow: hidden;
  line-height: 1;
}
.pdp-hero__cross-sell-add-plus {
  display: inline-block;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-width 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease, margin 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  margin-right: 0;
}
@media (hover: hover) {
  .pdp-hero__cross-sell-add:hover .pdp-hero__cross-sell-add-plus {
    max-width: 1rem;
    opacity: 1;
    margin-right: 0.2rem;
  }
}
.pdp-hero__cross-sell-add:hover {
  opacity: 0.8;
}
.pdp-hero__cross-sell-add.is-adding {
  pointer-events: none;
  opacity: 0.7;
}
.pdp-hero__cross-sell-add.is-added {
  background: #E16C47;
  pointer-events: none;
}

/* ---- Lightbox ---- */

.pdp-hero__lightbox {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  align-items: center;
  justify-content: center;
}

.pdp-hero__lightbox.is-open {
  display: flex;
}

.pdp-hero__lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.95);
}

.pdp-hero__lightbox-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 10;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms ease;
}

.pdp-hero__lightbox-close:hover {
  background: rgba(255, 255, 255, 0.2);
}

.pdp-hero__lightbox-counter {
  position: absolute;
  top: 1.25rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.875rem;
  font-weight: 500;
}

.pdp-hero__lightbox-stage {
  position: relative;
  z-index: 5;
  max-width: 56rem;
  max-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pdp-hero__lightbox-img {
  max-width: 100%;
  max-height: 80vh;
  object-fit: contain;
  border-radius: 0.5rem;
  user-select: none;
}

.pdp-hero__lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms ease;
}

.pdp-hero__lightbox-nav:hover {
  background: rgba(255, 255, 255, 0.2);
}

.pdp-hero__lightbox-nav--prev {
  left: 1rem;
}

.pdp-hero__lightbox-nav--next {
  right: 1rem;
}

.pdp-hero__lightbox-thumbs {
  position: absolute;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 10;
  display: flex;
  gap: 0.5rem;
}

.pdp-hero__lightbox-thumb {
  width: 4rem;
  height: 4rem;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.2);
  opacity: 0.6;
  cursor: pointer;
  padding: 0;
  background: none;
  transition: opacity 200ms ease, border-color 200ms ease;
  flex-shrink: 0;
}

.pdp-hero__lightbox-thumb--active {
  border-color: #fff;
  opacity: 1;
}

.pdp-hero__lightbox-thumb:hover {
  opacity: 0.9;
}

.pdp-hero__lightbox-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Breadcrumb moved to standalone pdp-breadcrumb.liquid section */

/* ─── Description ─── */
.pdp-hero__desc-wrap {
  position: relative;
}
.pdp-hero__desc-content {
  /* Always fully visible — no clamp / Read More toggle */
  max-height: none;
  overflow: visible;
}
/* Smaller description on mobile — takes less vertical space */
@media (max-width: 749px) {
  .pdp-hero__desc-wrap,
  .pdp-hero__desc-content,
  .pdp-hero__subheadline {
    font-size: 0.8125rem; /* 13px */
    line-height: 1.5;
  }
}
/* Always-open variant — belt-and-suspenders override for any CSS that
   references .is-expanded; keeps container fully expanded. */
.pdp-hero__desc-wrap--always-open .pdp-hero__desc-content {
  max-height: none !important;
  overflow: visible !important;
}
.pdp-hero__desc-wrap.is-expanded .pdp-hero__desc-content {
  max-height: 60em;
}
.pdp-hero__desc-fade {
  position: absolute;
  bottom: 2.1rem;
  left: 0;
  right: 0;
  height: 1.8em;
  background: linear-gradient(to bottom, transparent, var(--section-bg, var(--color-background, #F3F1E9)));
  pointer-events: none;
  transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.pdp-hero__desc-wrap.is-expanded .pdp-hero__desc-fade {
  opacity: 0;
}

/* Full-width divider with centered pill button */
.pdp-hero__desc-divider {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  width: 100%;
}
.pdp-hero__desc-divider-line {
  flex: 1;
  height: 1px;
  background: var(--color-border, #e4e4e7);
}
.pdp-hero__desc-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #e4e4e7;
  color: #262320;
  border: none;
  border-radius: 9999px;
  padding: 4px 13px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s ease, transform 0.15s ease;
}
.pdp-hero__desc-toggle:hover {
  background: #d4d4d8;
}
.pdp-hero__desc-toggle:active {
  transform: scale(0.97);
}
.pdp-hero__desc-toggle-icon {
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  flex-shrink: 0;
}
.pdp-hero__desc-wrap.is-expanded .pdp-hero__desc-toggle-icon {
  transform: rotate(180deg);
}
/* Expanded = same bg, same color — unified look */
.pdp-hero__desc-wrap.is-expanded .pdp-hero__desc-toggle {
  background: #e4e4e7;
  color: #262320;
}
.pdp-hero__desc-wrap.is-expanded .pdp-hero__desc-toggle:hover {
  background: #d4d4d8;
}

/* ─── Installments ─── */
.pdp-hero__installments {
  margin-top: -0.5rem;
}
.pdp-hero__installments form {
  margin: 0;
  padding: 0;
}
.pdp-hero__installments shopify-payment-terms {
  font-size: 12px;
  font-family: inherit;
  color: #888;
}
.pdp-hero__installments .shopify-installments {
  font-size: 12px;
  color: #888;
  margin: 0;
  padding: 0;
}
.pdp-hero__installments .shopify-installments__content {
  font-size: 12px;
  color: #888;
}
/* Hide "Check your purchasing power" button */
.pdp-hero__installments .shopify-installments__learn-more,
.pdp-hero__installments shopify-payment-terms button,
.pdp-hero__installments .shopify-installments button {
  display: none !important;
}

/* Title sizes */
/* Size modifiers — all reduced ~20% per design direction */
.pdp-hero__title--sm { font-size: 1.2rem; }
.pdp-hero__title--md { font-size: 1.6rem; }
.pdp-hero__title--lg { font-size: 2rem; }
@media (min-width: 750px) {
  .pdp-hero__title--sm { font-size: 1.4rem; }
  .pdp-hero__title--md { font-size: 1.8rem; }
  .pdp-hero__title--lg { font-size: 2.4rem; }
}

/* ── Mobile Sticky Add-to-Cart ── */
.pdp-hero__mobile-sticky {
  display: none;
}
@media (max-width: 749px) {
  .pdp-hero__mobile-sticky {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 90;
    transform: translateY(100%);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .pdp-hero__mobile-sticky.is-visible {
    transform: translateY(0);
  }
  .pdp-hero__mobile-sticky[hidden] { display: none; }
  .pdp-hero__mobile-sticky-fade {
    height: 2rem;
    background: linear-gradient(to bottom, transparent, var(--section-bg, var(--color-background, #F3F1E9)));
    pointer-events: none;
  }
  .theme-dark .pdp-hero__mobile-sticky-fade {
    background: linear-gradient(to bottom, transparent, var(--section-bg, #141416));
  }
  .pdp-hero__mobile-sticky-bar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: #fff;
    border-top: 1px solid #eee;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.06);
  }
  .pdp-hero__mobile-sticky-qty {
    display: flex;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
  }
  .pdp-hero__mobile-sticky-qty button {
    width: 2rem;
    height: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    font-size: 1rem;
    font-family: inherit;
    cursor: pointer;
    color: #262320;
  }
  .pdp-hero__mobile-sticky-qty span {
    width: 1.5rem;
    text-align: center;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #262320;
  }
  .pdp-hero__mobile-sticky-add {
    flex: 1;
    padding: 0.625rem 0;
    background: #262320;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.2s;
  }
  .pdp-hero__mobile-sticky-add:hover { background: #2a2a2d; }
  .pdp-hero__mobile-sticky-add.is-added { background: #c9563a; }
  .pdp-hero__mobile-sticky-checkout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.625rem 0.75rem;
    background: #5a31f4;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.2s;
  }
  .pdp-hero__mobile-sticky-checkout:hover { background: #4a28c4; }
}

/* ── Dark scheme overrides ── */
.theme-dark .pdp-hero__doc-btn {
  color: #f5f5f5;
  border-color: rgba(255,255,255,0.25);
}
.theme-dark .pdp-hero__doc-btn svg { stroke: #f5f5f5; }
.theme-dark .pdp-hero__doc-btn:hover {
  background: #fff;
  color: #262320 !important;
  border-color: #fff;
}
.theme-dark .pdp-hero__doc-btn:hover svg { stroke: #262320 !important; }
.theme-dark .pdp-hero__specs-heading {
  color: #f5f5f5;
}
.theme-dark .pdp-hero__specs-row span:last-child {
  color: #f5f5f5;
}
.theme-dark .pdp-hero__specs-row {
  border-bottom-color: rgba(255,255,255,0.06);
}
.theme-dark .pdp-hero__modal-title {
  color: #f5f5f5;
}
.theme-dark .pdp-hero__modal-body {
  color: rgba(255,255,255,0.8);
}
.theme-dark .pdp-hero__modal {
  background: #262320;
}
.theme-dark .pdp-hero__modal-close {
  color: rgba(255,255,255,0.5);
}
.theme-dark .pdp-hero__modal-close:hover {
  color: #f5f5f5;
  background: rgba(255,255,255,0.1);
}
.theme-dark .pdp-hero__specs-modes {
  background: rgba(255,255,255,0.05);
}
/* END_SECTION:pdp-hero */

/* START_SECTION:pdp-how-to-use (INDEX:75) */
.how-to-use {
    display: block;
    padding-block: 4rem;
  }

  .how-to-use__container {
    max-width: 72rem;
    padding-inline: 1rem;
  }

  .how-to-use__header {
    text-align: center;
    margin-block-end: 2.5rem;
  }

  .how-to-use__title {
    font-size: var(--font-size-3xl);
    font-weight: 600;
    letter-spacing: var(--tracking-tight);
    color: var(--color-foreground);
  }

  .how-to-use__subtitle {
    color: var(--color-text-muted);
    margin-block-start: 0.5rem;
  }

  /* Slider wrapper — positions arrows and fades */
  .how-to-use__slider-wrap {
    position: relative;
  }

  /* Scroll container */
  .how-to-use__scroll {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-block-end: 1rem;
    scrollbar-width: none;
    scroll-behavior: smooth;
  }

  .how-to-use__scroll::-webkit-scrollbar {
    display: none;
  }

  .how-to-use__card {
    flex: 0 0 65vw;
    scroll-snap-align: center;
  }

  .how-to-use__card-inner {
    border-radius: var(--radius-xl);
    overflow: hidden;
    background: #f0ede8;
    height: 100%;
  }

  .how-to-use__media-wrapper {
    aspect-ratio: 4 / 5;
    overflow: hidden;
    position: relative;
  }

  .how-to-use__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .how-to-use__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: none;
    position: absolute;
    inset: 0;
  }

  .how-to-use__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e8e5e0;
    padding: 2rem;
  }

  .how-to-use__placeholder svg {
    width: 100%;
    height: auto;
    opacity: 0.4;
  }

  .how-to-use__text {
    padding: 1rem;
  }

  .how-to-use__step-label {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-foreground);
    display: block;
  }

  .how-to-use__step-title {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-foreground);
    margin-block-start: 0.25rem;
  }

  .how-to-use__step-desc {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin-block-start: 0.125rem;
    line-height: var(--line-height-base);
  }

  /* ── Arrows (gallery style) ── */
  .how-to-use__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #262320;
    transition: opacity 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    padding: 0;
  }

  .how-to-use__arrow:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    transform: translateY(-50%) scale(1.05);
  }

  .how-to-use__arrow--prev {
    left: -0.5rem;
  }

  .how-to-use__arrow--next {
    right: -0.5rem;
  }

  .how-to-use__arrow[disabled] {
    opacity: 0;
    pointer-events: none;
  }

  /* ── Gradient fades (same as "You Might Like") ── */
  .how-to-use__fade {
    position: absolute;
    top: 0;
    bottom: 1rem;
    width: 3rem;
    z-index: 2;
    pointer-events: none;
    opacity: 0;
    transition: opacity 300ms ease;
  }

  .how-to-use__fade--left {
    left: 0;
    background: linear-gradient(to right, var(--section-bg, var(--color-background, #fff)) 0%, transparent 100%);
  }

  .how-to-use__fade--right {
    right: 0;
    background: linear-gradient(to left, var(--section-bg, var(--color-background, #fff)) 0%, transparent 100%);
  }

  .how-to-use__fade--visible {
    opacity: 1;
  }

  /* ── Page-view dots (fewer dots = groups of cards) ── */
  .how-to-use__pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-block-start: 1rem;
  }

  .how-to-use__page-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: var(--radius-full);
    background: var(--color-border);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: width 200ms ease, background-color 200ms ease;
  }

  .how-to-use__page-dot--active {
    width: 1.5rem;
    height: 0.5rem;
    background: var(--color-foreground);
  }

  /* Tablet: 3 visible */
  @media screen and (min-width: 750px) {
    .how-to-use {
      padding-block: 5rem;
    }

    .how-to-use__container {
      padding-inline: 1.5rem;
    }

    .how-to-use__title {
      font-size: var(--font-size-4xl);
    }

    .how-to-use__card {
      flex: 0 0 calc(33.333% - 0.67rem);
    }

    .how-to-use__arrow--prev {
      left: 0.5rem;
    }

    .how-to-use__arrow--next {
      right: 0.5rem;
    }

    .how-to-use__arrow {
      width: 40px;
      height: 40px;
    }
  }

  /* Desktop: grid for ≤5 items, slider for 6+ */
  @media screen and (min-width: 990px) {
    .how-to-use--grid .how-to-use__scroll {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      gap: 1rem;
      overflow-x: visible;
      scroll-snap-type: none;
      padding-block-end: 0;
    }

    .how-to-use--grid .how-to-use__pager,
    .how-to-use--grid .how-to-use__arrow,
    .how-to-use--grid .how-to-use__fade {
      display: none;
    }

    .how-to-use--slider .how-to-use__card {
      flex: 0 0 calc(20% - 0.8rem);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .how-to-use__page-dot,
    .how-to-use__arrow {
      transition: none;
    }
  }
/* END_SECTION:pdp-how-to-use */

/* START_SECTION:pdp-image-grid (INDEX:76) */
.pdp-image-grid {
    padding: 4rem 0;
  }

  @media screen and (min-width: 750px) {
    .pdp-image-grid {
      padding: 5rem 0;
    }
  }

  .pdp-image-grid__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.25rem;
  }

  /* Header */
  .pdp-image-grid__header {
    text-align: center;
    margin-bottom: 2.5rem;
  }

  .pdp-image-grid__title {
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #262320;
    margin: 0 0 0.5rem;
  }

  @media screen and (min-width: 750px) {
    .pdp-image-grid__title {
      font-size: 2.25rem;
    }
  }

  .pdp-image-grid__subtitle {
    font-size: 0.9375rem;
    color: rgba(26, 26, 46, 0.55);
    margin: 0 auto;
    max-width: 560px;
    line-height: 1.6;
  }

  /* Grid layouts */
  .pdp-image-grid__grid {
    display: grid;
    gap: var(--grid-gap, 1rem);
  }

  /* 1 block: full width */
  .pdp-image-grid--count-1 .pdp-image-grid__grid {
    grid-template-columns: 1fr;
  }

  /* 2 blocks: 2 equal columns */
  .pdp-image-grid--count-2 .pdp-image-grid__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* 3 blocks: 3 equal columns */
  .pdp-image-grid--count-3 .pdp-image-grid__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* 4 blocks: 2x2 grid */
  .pdp-image-grid--count-4 .pdp-image-grid__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* 5+ blocks: auto-fit */
  .pdp-image-grid--count-5 .pdp-image-grid__grid,
  .pdp-image-grid--count-6 .pdp-image-grid__grid,
  .pdp-image-grid--count-7 .pdp-image-grid__grid,
  .pdp-image-grid--count-8 .pdp-image-grid__grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }

  /* Item */
  .pdp-image-grid__item {
    position: relative;
  }

  .pdp-image-grid__link {
    display: block;
    text-decoration: none;
    color: inherit;
  }

  /* Media container */
  .pdp-image-grid__media {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl, 1rem);
    background: #f0efea;
  }

  .pdp-image-grid__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: var(--image-ratio, auto);
    transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .pdp-image-grid__media--zoomable:hover .pdp-image-grid__img {
    transform: scale(1.03);
  }

  /* Video */
  .pdp-image-grid__video {
    display: block;
    width: 100%;
    aspect-ratio: var(--image-ratio, 16 / 9);
    border: 0;
    border-radius: var(--radius-xl, 1rem);
  }

  /* Placeholder */
  .pdp-image-grid__placeholder {
    aspect-ratio: var(--image-ratio, 1 / 1);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e8e7e3;
  }

  .pdp-image-grid__placeholder-svg {
    width: 60%;
    height: 60%;
    opacity: 0.3;
  }

  /* Caption overlay */
  .pdp-image-grid__caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 2.5rem 1.25rem 1.25rem;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
    border-radius: 0 0 var(--radius-xl, 1rem) var(--radius-xl, 1rem);
  }

  .pdp-image-grid__caption-text {
    font-size: 0.875rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.01em;
  }

  /* Mobile responsive */
  @media screen and (max-width: 749px) {
    .pdp-image-grid__title {
      font-size: 1.5rem;
    }

    .pdp-image-grid__header {
      margin-bottom: 1.5rem;
    }

    /* 1-2 blocks stay single column on mobile */
    .pdp-image-grid--count-1 .pdp-image-grid__grid,
    .pdp-image-grid--count-2 .pdp-image-grid__grid {
      grid-template-columns: 1fr;
    }

    /* 3+ blocks: 2 columns on mobile */
    .pdp-image-grid--count-3 .pdp-image-grid__grid,
    .pdp-image-grid--count-4 .pdp-image-grid__grid,
    .pdp-image-grid--count-5 .pdp-image-grid__grid,
    .pdp-image-grid--count-6 .pdp-image-grid__grid,
    .pdp-image-grid--count-7 .pdp-image-grid__grid,
    .pdp-image-grid--count-8 .pdp-image-grid__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
/* END_SECTION:pdp-image-grid */

/* START_SECTION:pdp-recommendations (INDEX:77) */
.pdp-recommendations {
    display: block;
    padding: 3rem 0;
    background: transparent;
  }
  .pdp-recommendations--dark {
    background: transparent;
  }
  .pdp-recommendations--dark .pdp-recommendations__tab {
    color: rgba(255,255,255,0.5);
  }
  .pdp-recommendations--dark .pdp-recommendations__tab--active {
    color: #f5f5f5;
  }
  .pdp-recommendations--dark .pdp-recommendations__tab::after {
    background: #f5f5f5;
  }
  .pdp-recommendations--dark .pdp-recommendations__arrow {
    background: #1e1e21;
    border-color: rgba(255,255,255,0.1);
    color: #f5f5f5;
  }
  .pdp-recommendations--dark .pdp-recommendations__dot,
  .pdp-recommendations--dark .pdp-recommendations__page-dot {
    background: rgba(255,255,255,0.2);
  }
  .pdp-recommendations--dark .pdp-recommendations__dot--active,
  .pdp-recommendations--dark .pdp-recommendations__page-dot--active {
    background: #f5f5f5;
  }
  .pdp-recommendations--dark .pdp-recommendations__empty {
    color: rgba(255,255,255,0.4);
  }
  /* Hide add-to-cart + quick view buttons inside recommendations */
  .pdp-recommendations .nf-card__actions { display: none; }
  .pdp-recommendations .nf-card__add-btn { display: none; }
  .pdp-recommendations .nf-card__quick-view { display: none; }

  .pdp-recommendations__section-title {
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--color-foreground, #262320);
    margin: 0;
    padding: 0.375rem 0;
  }
  .pdp-recommendations--dark .pdp-recommendations__section-title { color: #f5f5f5; }
  .pdp-recommendations--dark .pdp-recommendations__tab-container {
    background: rgba(255,255,255,0.08);
  }
  .pdp-recommendations--dark .pdp-recommendations__tab-container:has(.pdp-recommendations__section-title) {
    background: transparent;
    padding: 0;
  }
  .pdp-recommendations--dark .pdp-recommendations__tab--active {
    background: #f5f5f5;
    color: #262320;
  }
  .pdp-recommendations--dark .pdp-recommendations__tab--active:hover {
    color: #262320;
  }
  .pdp-recommendations--dark .pdp-recommendations__browse-link {
    color: rgba(255,255,255,0.5);
  }
  .pdp-recommendations--dark .pdp-recommendations__browse-link:hover {
    color: #f5f5f5;
  }
  .pdp-recommendations--dark .pdp-recommendations__fade--left {
    background: linear-gradient(to right, #141416 0%, transparent 100%);
  }
  .pdp-recommendations--dark .pdp-recommendations__fade--right {
    background: linear-gradient(to left, #141416 0%, transparent 100%);
  }
  .pdp-recommendations--dark .nf-card__title { color: #f5f5f5; }
  .pdp-recommendations--dark .nf-card__price { color: #f5f5f5; }
  .pdp-recommendations--dark .nf-card__review-count { color: rgba(255,255,255,0.5); }
  .pdp-recommendations--dark .nf-card__star { color: #f5f5f5; }
  .pdp-recommendations--dark .nf-card__compare { color: rgba(255,255,255,0.4); }
  .pdp-recommendations--dark .nf-card__desc { color: rgba(255,255,255,0.45); }
  .pdp-recommendations--dark .nf-card__tag { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.55); }
  .pdp-recommendations--dark .nf-card__add-btn { background: #f5f5f5; color: #262320; }
  .pdp-recommendations--dark .nf-card__add-btn:hover { background: #e0e0e0; }

  @media screen and (min-width: 750px) {
    .pdp-recommendations {
      padding: 4rem 0;
    }
  }

  .pdp-recommendations__inner {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 1rem;
  }

  .pdp-recommendations__header {
    margin-bottom: 1.5rem;
  }

  .pdp-recommendations__tabs-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
  }

  .pdp-recommendations__tab-container {
    display: inline-flex;
    gap: 0.25rem;
    background: rgba(0, 0, 0, 0.05);
    border-radius: var(--radius-button);
    padding: 0.25rem;
  }
  /* When only a section title is inside (collection context), strip pill bg */
  .pdp-recommendations__tab-container:has(.pdp-recommendations__section-title) {
    background: transparent;
    padding: 0;
  }

  .pdp-recommendations__tab {
    padding: 0.375rem 1rem;
    border: none;
    border-radius: var(--radius-button);
    font-size: 0.875rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: background 200ms ease, color 200ms ease, box-shadow 200ms ease;
    background: transparent;
    color: #71717a;
    white-space: nowrap;
  }

  .pdp-recommendations__tab:hover {
    color: #262320;
  }

  .pdp-recommendations__tab--active {
    background: #262320;
    color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  }

  .pdp-recommendations__tab--active:hover {
    color: #fff;
  }

  .pdp-recommendations__browse-link,
  .pdp-recommendations__browse-link:hover {
    font-size: 0.75rem;
    font-weight: 400;
    text-decoration: none;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
  }

  .pdp-recommendations__browse-link {
    color: #71717a;
    transition: color 200ms ease;
  }

  .pdp-recommendations__browse-link:hover {
    color: #262320;
  }

  .pdp-recommendations__browse-arrow {
    font-size: 0.6875rem;
  }

  .pdp-recommendations__browse-link--desktop {
    display: none;
  }

  .pdp-recommendations__browse-link--mobile {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
  }

  .pdp-recommendations__panel {
    display: none;
  }

  .pdp-recommendations__panel--active {
    display: block;
  }

  .pdp-recommendations__slider-wrap {
    position: relative;
  }

  .pdp-recommendations__slider {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 0.5rem;
  }

  .pdp-recommendations__slider::-webkit-scrollbar {
    display: none;
  }

  .pdp-recommendations__fade {
    position: absolute;
    top: 0;
    bottom: 0.5rem;
    width: 3rem;
    z-index: 2;
    pointer-events: none;
    opacity: 0;
    transition: opacity 300ms ease;
  }

  .pdp-recommendations__fade--left {
    left: 0;
    background: linear-gradient(to right, var(--section-bg, var(--color-background, #f0efea)) 0%, transparent 100%);
  }

  .pdp-recommendations__fade--right {
    right: 0;
    background: linear-gradient(to left, var(--section-bg, var(--color-background, #f0efea)) 0%, transparent 100%);
  }

  .pdp-recommendations__fade--visible {
    opacity: 1;
  }

  .pdp-recommendations__card {
    flex: 0 0 200px;
    min-width: 200px;
  }

  .pdp-recommendations__card .nf-card {
    width: 100%;
  }

  .pdp-recommendations__card-link,
  .pdp-recommendations__card-link:hover {
    display: block;
    text-decoration: none;
    color: inherit;
  }

  .pdp-recommendations__card-image-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 0.75rem;
    overflow: hidden;
    background: #f5f5f7;
    margin-bottom: 0.625rem;
    border: 1px solid #e5e5e5;
    transition: border-color 200ms ease;
  }

  .pdp-recommendations__card-link:hover .pdp-recommendations__card-image-wrap {
    border-color: rgba(26, 26, 46, 0.2);
  }

  .pdp-recommendations__card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 300ms ease;
  }

  .pdp-recommendations__card-link:hover .pdp-recommendations__card-image {
    transform: scale(1.05);
  }

  .pdp-recommendations__badge {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-button);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.4;
  }

  .pdp-recommendations__badge--bestseller {
    background: #3b82f6;
  }

  .pdp-recommendations__badge--new {
    background: #8b5cf6;
  }

  .pdp-recommendations__badge--limited {
    background: #ef4444;
  }


  .pdp-recommendations__card-info {
    padding: 0 0.125rem;
  }

  .pdp-recommendations__card-title {
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    color: #262320;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
  }

  .pdp-recommendations__card-rating {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-bottom: 0.375rem;
  }

  .pdp-recommendations__stars {
    color: #f59e0b;
    font-size: 0.8125rem;
    line-height: 1;
    letter-spacing: 0.05em;
  }

  .pdp-recommendations__review-count {
    font-size: 0.75rem;
    color: #71717a;
  }

  .pdp-recommendations__card-price {
    font-size: 15px;
    font-weight: 700;
    color: #262320;
    margin: 0.125rem 0 0;
  }

  .pdp-recommendations__empty {
    text-align: center;
    padding: 3rem 1rem;
    color: #71717a;
    font-size: 0.9375rem;
  }

  .pdp-recommendations__loading {
    text-align: center;
    padding: 3rem 1rem;
    color: #71717a;
    font-size: 0.9375rem;
    width: 100%;
  }

  /* ── Arrows (gallery style) ── */
  .pdp-recommendations__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #262320;
    transition: opacity 200ms ease, transform 200ms ease, box-shadow 200ms ease;
    padding: 0;
  }

  .pdp-recommendations__arrow:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    transform: translateY(-50%) scale(1.05);
  }

  .pdp-recommendations__arrow--prev { left: 0.5rem; }
  .pdp-recommendations__arrow--next { right: 0.5rem; }

  .pdp-recommendations__arrow[disabled] {
    opacity: 0;
    pointer-events: none;
  }

  /* ── Page dots ── */
  .pdp-recommendations__pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1rem;
  }

  .pdp-recommendations__page-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    background: var(--color-border, #deddd8);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: width 200ms ease, background-color 200ms ease;
  }

  .pdp-recommendations__page-dot--active {
    width: 1.5rem;
    background: var(--color-foreground, #262320);
  }

  @media screen and (min-width: 750px) {
    .pdp-recommendations__browse-link--desktop {
      display: inline-flex;
    }

    .pdp-recommendations__browse-link--mobile {
      display: none;
    }

    .pdp-recommendations__card {
      flex: 0 0 200px;
      min-width: 200px;
    }

    .pdp-recommendations__arrow {
      width: 40px;
      height: 40px;
    }
    .pdp-recommendations__arrow--prev { left: 0.5rem; }
    .pdp-recommendations__arrow--next { right: 0.5rem; }
  }
/* END_SECTION:pdp-recommendations */

/* START_SECTION:pdp-reviews (INDEX:78) */
.pdp-reviews {
    padding: 72px 0 80px;
    background: var(--color-bg, #ffffff);
  }

  .pdp-reviews__inner {
    max-width: 960px;
    margin: 0 auto;
  }

  .pdp-reviews__header {
    text-align: center;
    margin-bottom: 40px;
  }

  .pdp-reviews__trust-badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
  }

  .pdp-reviews__trust-text {
    font-family: var(--font-body);
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text, #262320);
    opacity: 0.55;
  }

  .pdp-reviews__title {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: var(--color-text, #262320);
    margin: 0 0 8px;
  }

  .pdp-reviews__subtitle {
    font-family: var(--font-body);
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--color-text, #262320);
    opacity: 0.7;
    margin: 0;
  }

  /* Loox widget container */
  .pdp-reviews__loox-widget {
    min-height: 200px;
  }

  /* Loox iframe — ensure it renders at a reasonable height.
     Loox uses postMessage to resize, but on local dev (127.0.0.1)
     the cross-origin resize can fail. This ensures visibility. */
  .pdp-reviews__loox-widget iframe {
    min-height: 600px !important;
    width: 100% !important;
    display: block !important;
  }

  /* Override Loox default star color to match brand coral */
  .pdp-reviews .loox-rating .loox-icon,
  .pdp-reviews .loox-rating span,
  .loox-rating .loox-icon {
    color: #E16C47 !important;
  }

  @media (max-width: 749px) {
    .pdp-reviews {
      padding: 56px 0 64px;
    }
  }
/* END_SECTION:pdp-reviews */

/* START_SECTION:pdp-text-media (INDEX:79) */
.pdp-text-media {
    padding-block: 4rem;
  }

  .pdp-text-media--light {
    background: #ffffff;
    color: var(--color-foreground);
  }

  .pdp-text-media--dark {
    background: #262320;
    color: #ffffff;
  }

  .pdp-text-media__container {
    max-width: 72rem;
    padding-inline: 1rem;
  }

  /* ---- Mobile: always stacked ---- */
  .pdp-text-media__container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }

  /* ---- Media ---- */
  .pdp-text-media__image--split-left,
  .pdp-text-media__image--split-right {
    aspect-ratio: 1 / 1;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: var(--radius-xl);
    display: block;
  }

  .pdp-text-media__image--stacked {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: var(--radius-xl);
    display: block;
  }

  .pdp-text-media__video-wrap {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl);
  }

  .pdp-text-media__video-wrap--split-left,
  .pdp-text-media__video-wrap--split-right {
    aspect-ratio: 1 / 1;
  }

  .pdp-text-media__video-wrap--stacked {
    aspect-ratio: 16 / 9;
  }

  .pdp-text-media__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
  }

  .pdp-text-media__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0ede8;
    border-radius: var(--radius-xl);
    padding: 3rem;
  }

  .pdp-text-media__placeholder--split-left,
  .pdp-text-media__placeholder--split-right {
    aspect-ratio: 1 / 1;
  }

  .pdp-text-media__placeholder--stacked {
    aspect-ratio: 16 / 9;
  }

  .pdp-text-media__placeholder svg {
    width: 60%;
    height: auto;
    opacity: 0.35;
  }

  /* ---- Content ---- */
  .pdp-text-media__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
  }

  .pdp-text-media__eyebrow {
    font-size: var(--font-size-xs, 0.75rem);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    opacity: 0.6;
  }

  .pdp-text-media__heading {
    font-size: var(--font-size-3xl);
    font-weight: 600;
    letter-spacing: var(--tracking-tight);
    line-height: 1.15;
  }

  .pdp-text-media__body {
    font-size: var(--font-size-base);
    line-height: var(--line-height-base);
    max-width: 32rem;
    opacity: 0.75;
  }

  .pdp-text-media--dark .pdp-text-media__body {
    opacity: 0.7;
  }

  .pdp-text-media__button {
    display: inline-block;
    margin-block-start: 0.5rem;
    padding: 0.75rem 1.75rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-decoration: none;
    border-radius: var(--radius-full, 9999px);
    transition: opacity var(--duration-base) var(--ease-default);
    align-self: flex-start;
  }

  .pdp-text-media--light .pdp-text-media__button {
    background: var(--color-foreground);
    color: #ffffff;
  }

  .pdp-text-media--light .pdp-text-media__button:hover {
    opacity: 0.85;
  }

  .pdp-text-media--dark .pdp-text-media__button {
    background: #ffffff;
    color: #262320;
  }

  .pdp-text-media--dark .pdp-text-media__button:hover {
    opacity: 0.85;
  }

  /* ---- Stacked layout: center content ---- */
  .pdp-text-media--stacked .pdp-text-media__content {
    align-items: center;
    text-align: center;
  }

  .pdp-text-media--stacked .pdp-text-media__button {
    align-self: center;
  }

  /* ---- Tablet ---- */
  @media screen and (min-width: 750px) {
    .pdp-text-media {
      padding-block: 5rem;
    }

    .pdp-text-media__container {
      padding-inline: 1.5rem;
    }

    .pdp-text-media__heading {
      font-size: var(--font-size-4xl);
    }
  }

  /* ---- Desktop: side-by-side for split layouts ---- */
  @media screen and (min-width: 990px) {
    .pdp-text-media--split-left .pdp-text-media__container,
    .pdp-text-media--split-right .pdp-text-media__container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3rem;
      align-items: center;
    }

    /* split-right: swap visual order so text is left, media is right */
    .pdp-text-media--split-right .pdp-text-media__media {
      order: 2;
    }

    .pdp-text-media--split-right .pdp-text-media__content {
      order: 1;
    }

    .pdp-text-media__image--split-left,
    .pdp-text-media__image--split-right {
      aspect-ratio: 1 / 1;
    }

    .pdp-text-media__video-wrap--split-left,
    .pdp-text-media__video-wrap--split-right {
      aspect-ratio: 1 / 1;
    }

    .pdp-text-media__placeholder--split-left,
    .pdp-text-media__placeholder--split-right {
      aspect-ratio: 1 / 1;
    }

    /* Stacked stays single column on desktop */
    .pdp-text-media--stacked .pdp-text-media__container {
      flex-direction: column;
      gap: 2.5rem;
    }
  }
/* END_SECTION:pdp-text-media */

/* START_SECTION:pdp-treatment-modes (INDEX:80) */
.treatment-modes {
    display: block;
    position: relative;
    min-height: 600px;
    overflow: hidden;
    color: #fff;
  }

  .treatment-modes__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
  }

  .treatment-modes__bg-img,
  .treatment-modes__bg-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: opacity 0.7s ease;
  }

  .treatment-modes__bg-video {
    position: absolute;
    inset: 0;
  }

  .treatment-modes__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.70), rgba(0, 0, 0, 0.40), rgba(0, 0, 0, 0.20));
  }

  .treatment-modes__content {
    position: relative;
    z-index: 2;
    max-width: 72rem;
    margin-inline: auto;
    padding: 4rem 1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 600px;
  }

  .treatment-modes__header {
    margin-block-end: 2rem;
  }

  .treatment-modes__eyebrow {
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255, 255, 255, 0.6);
    display: block;
    margin-block-end: 0.5rem;
  }

  .treatment-modes__title {
    font-size: 1.875rem;
    font-weight: 600;
    letter-spacing: -0.025em;
    color: #fff;
    line-height: 1.2;
  }

  .treatment-modes__body {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }

  /* --- Tab list --- */
  .treatment-modes__list {
    display: flex;
    flex-direction: column;
  }

  .treatment-modes__item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.625rem 0;
    text-align: start;
    font-family: inherit;
    position: relative;
  }

  .treatment-modes__item-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    transition: transform 0.3s ease;
  }

  .treatment-modes__item .treatment-modes__item-row {
    transform: translateX(-0.625rem);
  }

  .treatment-modes__item:hover .treatment-modes__item-row {
    transform: translateX(0);
  }

  .treatment-modes__item--active .treatment-modes__item-row {
    transform: translateX(0);
  }

  .treatment-modes__indicator {
    width: 2px;
    height: 1.25rem;
    border-radius: 9999px;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .treatment-modes__item--active .treatment-modes__indicator {
    opacity: 1;
  }

  .treatment-modes__concern {
    font-size: 1rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.4);
    transition: color 0.3s ease;
  }

  .treatment-modes__item:hover .treatment-modes__concern {
    color: rgba(255, 255, 255, 0.7);
  }

  .treatment-modes__item--active .treatment-modes__concern {
    color: #fff;
  }

  /* Progress bar — under concern text, fixed width */
  .treatment-modes__progress {
    display: block;
    width: 100%;
    height: 2px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 9999px;
    overflow: hidden;
    margin-top: 0.375rem;
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .treatment-modes__item--active .treatment-modes__progress {
    opacity: 1;
  }

  .treatment-modes__progress-fill {
    display: block;
    height: 100%;
    width: 0%;
    border-radius: 9999px;
    /* will-change: width removed — width transitions cannot be GPU-composited */
  }

  /* --- Info card --- */
  .treatment-modes__panels {
    position: relative;
  }

  .treatment-modes__card {
    max-width: 24rem;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 1rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
    color: #262320 !important;
    animation: treatmentCardIn 0.3s ease;
  }

  /* hidden attribute is natively handled by browsers — no CSS needed */
  .treatment-modes__card--hidden {
    display: none;
  }

  @keyframes treatmentCardIn {
    from {
      opacity: 0;
      transform: translateY(8px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .treatment-modes__card-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-block-end: 0.25rem;
    color: #262320 !important;
  }

  .treatment-modes__card-desc {
    font-size: 0.875rem;
    color: #6b7280 !important;
    line-height: 1.625;
    margin-block-end: 0.75rem;
  }

  .treatment-modes__card-desc strong {
    font-weight: 500;
  }

  .treatment-modes__wavelength {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;
    color: #888;
    margin-top: 0.5rem;
  }
  .treatment-modes__wavelength-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
  }

  /* Nav inside card */
  .treatment-modes__nav {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-block-start: 1rem;
    padding-block-start: 0.75rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
  }

  .treatment-modes__nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.15);
    background: none;
    color: #262320;
    cursor: pointer;
    transition: background-color 0.2s ease;
  }

  .treatment-modes__nav-btn:hover {
    background: rgba(0, 0, 0, 0.05);
  }

  .treatment-modes__counter {
    font-size: 0.75rem;
    color: #6b7280;
  }

  .treatment-modes__counter-current {
    color: #262320;
    font-weight: 600;
  }

  /* --- Desktop --- */
  @media screen and (min-width: 750px) {
    .treatment-modes {
      min-height: 700px;
    }

    .treatment-modes__content {
      padding: 5rem 1.5rem;
      min-height: 700px;
    }

    .treatment-modes__header {
      margin-block-end: 3rem;
    }

    .treatment-modes__title {
      font-size: 2.25rem;
    }

    .treatment-modes__body {
      flex-direction: row;
      align-items: flex-end;
      justify-content: space-between;
      gap: 4rem;
    }

    .treatment-modes__list {
      flex-shrink: 0;
      min-width: 180px;
    }

    .treatment-modes__item {
      padding: 0.75rem 0;
    }

    .treatment-modes__concern {
      font-size: 1.125rem;
    }

    .treatment-modes__card {
      padding: 1.5rem;
    }
  }

  @media screen and (min-width: 990px) {
    .treatment-modes__title {
      font-size: 3rem;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .treatment-modes__card {
      animation: none;
    }

    .treatment-modes__progress-fill {
      transition: none;
    }

    .treatment-modes__bg-img {
      transition: none;
    }

    .treatment-modes__item-row,
    .treatment-modes__concern,
    .treatment-modes__indicator {
      transition: none;
    }
  }
/* END_SECTION:pdp-treatment-modes */

/* START_SECTION:pdp-video-testimonials (INDEX:81) */
/* ── Section wrapper ── */
  .pdp-video-testimonials {
    display: block;
    padding: 4rem 0;
  }

  @media screen and (min-width: 750px) {
    .pdp-video-testimonials {
      padding: 5rem 0;
    }
  }

  .pdp-video-testimonials__inner {
    max-width: 72rem;
    margin: 0 auto;
    padding: 0 1rem;
  }

  /* ── Header ── */
  .pdp-video-testimonials__header {
    text-align: center;
    margin-bottom: 2rem;
  }

  .pdp-video-testimonials__title {
    font-size: 1.875rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--color-foreground, #262320);
    margin: 0 0 0.5rem;
  }

  @media screen and (min-width: 750px) {
    .pdp-video-testimonials__title {
      font-size: 2.25rem;
    }
  }

  .pdp-video-testimonials__subtitle {
    font-size: 0.9375rem;
    color: var(--color-text-muted, rgba(26, 26, 46, 0.55));
    margin: 0 auto;
    max-width: 480px;
    line-height: 1.6;
  }

  /* ── Slider wrapper ── */
  .pdp-video-testimonials__slider-wrap {
    position: relative;
  }

  .pdp-video-testimonials__slider {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.5rem;
    scrollbar-width: none;
  }

  .pdp-video-testimonials__slider::-webkit-scrollbar {
    display: none;
  }

  /* ── Card sizing ── */
  .pdp-video-testimonials__card {
    flex: 0 0 45vw;
    max-width: 200px;
    scroll-snap-align: start;
  }

  @media screen and (min-width: 750px) {
    .pdp-video-testimonials__card {
      flex: 0 0 calc(25% - 0.75rem);
      max-width: 240px;
    }
  }

  @media screen and (min-width: 990px) {
    .pdp-video-testimonials__card {
      flex: 0 0 calc(20% - 0.8rem);
      max-width: 220px;
    }
  }

  /* ── Video area — 9:16 portrait ── */
  .pdp-video-testimonials__video-wrap {
    position: relative;
    aspect-ratio: 9 / 16;
    border-radius: var(--radius-xl, 1rem);
    overflow: hidden;
    background: #262320;
    cursor: pointer;
  }

  .pdp-video-testimonials__thumb {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .pdp-video-testimonials__thumb[hidden] { display: none; }

  /* ── Play button — matches collection-video design ── */
  .pdp-video-testimonials__play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: none;
    border: none;
    cursor: pointer;
    z-index: 3;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;
    padding: 0;
    opacity: 0.85;
  }

  .pdp-video-testimonials__play-btn svg circle {
    transition: fill 0.25s ease, stroke 0.25s ease;
  }

  .pdp-video-testimonials__play-btn:hover {
    transform: translate(-50%, -50%) scale(1.15);
    opacity: 1;
  }

  .pdp-video-testimonials__play-btn:hover svg circle {
    fill: rgba(0,0,0,0.55);
    stroke: rgba(255,255,255,0.5);
  }

  .pdp-video-testimonials__play-btn:active {
    transform: translate(-50%, -50%) scale(0.95);
  }

  .pdp-video-testimonials__play-btn[hidden] { display: none; }

  /* ── Inline player controls — adapted for vertical cards ── */
  .pdp-video-testimonials__controls {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 4;
    background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, transparent 100%);
    padding: 1.5rem 0.5rem 0.375rem;
  }
  .pdp-video-testimonials__controls[hidden] { display: none; }

  .pdp-video-testimonials__progress {
    width: 100%;
    height: 3px;
    background: rgba(255,255,255,0.25);
    border-radius: 2px;
    cursor: pointer;
    margin-bottom: 0.375rem;
  }
  .pdp-video-testimonials__progress-bar {
    height: 100%;
    background: #fff;
    width: 0%;
    border-radius: 2px;
    transition: width 0.15s linear;
  }
  .pdp-video-testimonials__controls-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.375rem;
  }
  .pdp-video-testimonials__playpause {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 22px;
    padding: 0;
    background: rgba(26, 26, 46, 0.65);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: none;
    border-radius: var(--radius-button, 9999px);
    color: #fff;
    cursor: pointer;
    transition: background 0.2s, opacity 0.25s;
    flex-shrink: 0;
  }
  .pdp-video-testimonials__playpause:hover {
    background: rgba(26, 26, 46, 0.85);
  }
  .pdp-video-testimonials__icon-play[hidden],
  .pdp-video-testimonials__icon-pause[hidden] { display: none; }
  .pdp-video-testimonials__time {
    font-size: 0.625rem;
    color: rgba(255,255,255,0.8);
    font-variant-numeric: tabular-nums;
  }
  .pdp-video-testimonials__controls-right {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }
  .pdp-video-testimonials__mute,
  .pdp-video-testimonials__fullscreen {
    background: rgba(255,255,255,0.15);
    border: none;
    border-radius: 0.25rem;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
  }
  .pdp-video-testimonials__mute,
  .pdp-video-testimonials__fullscreen {
    width: 24px;
    height: 24px;
    padding: 0;
  }
  .pdp-video-testimonials__mute:hover,
  .pdp-video-testimonials__fullscreen:hover { background: rgba(255,255,255,0.3); }

  /* ── Inline iframe wrap (YouTube/Vimeo) ── */
  .pdp-video-testimonials__iframe-wrap {
    position: absolute;
    inset: 0;
    z-index: 2;
  }
  .pdp-video-testimonials__iframe-wrap[hidden] { display: none; }
  .pdp-video-testimonials__iframe-wrap iframe {
    width: 100%;
    height: 100%;
    border: none;
  }

  /* ── Inline native video ── */
  .pdp-video-testimonials__native-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #111;
    z-index: 2;
  }

  /* ── Arrows (gallery style) ── */
  /* Arrows removed — infinite marquee scroll */
  .pdp-video-testimonials__arrow { display: none; }

  /* ── Gradient fades ── */
  .pdp-video-testimonials__fade {
    position: absolute;
    top: 0;
    bottom: 0.5rem;
    width: 3rem;
    z-index: 2;
    pointer-events: none;
    opacity: 0;
    transition: opacity 300ms ease;
  }

  .pdp-video-testimonials__fade--left {
    left: 0;
    background: linear-gradient(to right, var(--section-bg, var(--color-background, #fff)) 0%, transparent 100%);
  }

  .pdp-video-testimonials__fade--right {
    right: 0;
    background: linear-gradient(to left, var(--section-bg, var(--color-background, #fff)) 0%, transparent 100%);
  }

  .pdp-video-testimonials__fade--visible {
    opacity: 1;
  }

  /* ── Page dots ── */
  .pdp-video-testimonials__pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1rem;
  }

  .pdp-video-testimonials__page-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    background: var(--color-border, #deddd8);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: width 200ms ease, background-color 200ms ease;
  }

  .pdp-video-testimonials__page-dot--active {
    width: 1.5rem;
    background: var(--color-foreground, #262320);
  }

  /* ── Responsive play button ── */
  @media (max-width: 749px) {
    .pdp-video-testimonials__play-btn svg { width: 40px; height: 40px; }
  }

  /* ── Reduced motion ── */
  @media (prefers-reduced-motion: reduce) {
    .pdp-video-testimonials__play-btn,
    .pdp-video-testimonials__arrow,
    .pdp-video-testimonials__page-dot {
      transition: none;
    }
  }
/* END_SECTION:pdp-video-testimonials */

/* START_SECTION:pdp-works-with (INDEX:82) */
/* Breaker section — blends with preceding section bg */
  .pdp-works-with-section {
    margin-top: 0 !important;
    padding-top: 0;
  }
  .pdp-works-with {
    display: block;
    padding-block: 1.5rem 2rem;
  }

  .pdp-works-with__inner {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1rem 1.5rem;
    border-radius: var(--radius-xl, 1rem);
    min-height: 80px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  }

  /* Background variants */
  .pdp-works-with--light .pdp-works-with__inner {
    background-color: #f8f7f4;
    color: #262320;
  }

  .pdp-works-with--dark .pdp-works-with__inner {
    background-color: #262320;
    color: #f8f7f4;
    border-color: rgba(255, 255, 255, 0.1);
  }

  .pdp-works-with--accent .pdp-works-with__inner {
    background-color: #00b140;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.15);
  }

  .pdp-works-with__title {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
    margin: 0;
    flex-shrink: 0;
  }

  /* Logos area — overflow hidden for marquee */
  .pdp-works-with__logos-area {
    flex: 1;
    min-width: 0;
    overflow: hidden;
  }

  /* Track — holds all logo groups, animated via JS */
  .pdp-works-with__track {
    display: flex;
    width: max-content;
    will-change: transform;
  }

  /* Animation is now driven by JS via element.animate() — no CSS keyframes needed */

  /* Logo groups */
  .pdp-works-with__logos {
    display: flex;
    align-items: center;
    flex-shrink: 0;
  }

  .pdp-works-with__logo-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding-inline: 1.25rem;
  }

  .pdp-works-with__logo-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    text-decoration: none;
    color: inherit;
    width: 100%;
    height: 100%;
  }

  .pdp-works-with__logo-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.04);
    flex-shrink: 0;
    overflow: hidden;
    position: relative;
  }

  .pdp-works-with--dark .pdp-works-with__logo-wrap {
    background: rgba(255, 255, 255, 0.08);
  }

  .pdp-works-with--accent .pdp-works-with__logo-wrap {
    background: rgba(255, 255, 255, 0.15);
  }

  .pdp-works-with__logo-img {
    height: 24px;
    width: auto;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.6;
    transition: filter 0.2s ease, opacity 0.2s ease;
  }

  .pdp-works-with__logo-wrap:hover .pdp-works-with__logo-img {
    filter: grayscale(0%);
    opacity: 1;
  }

  .pdp-works-with--dark .pdp-works-with__logo-img {
    filter: grayscale(100%) brightness(2);
  }

  .pdp-works-with--dark .pdp-works-with__logo-wrap:hover .pdp-works-with__logo-img {
    filter: grayscale(0%) brightness(1.5);
    opacity: 1;
  }

  .pdp-works-with__logo-text {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--color-text-secondary, #666);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 80px;
    text-align: center;
  }

  .pdp-works-with__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: opacity 0.2s ease;
  }

  .pdp-works-with--light .pdp-works-with__cta { color: #262320; }
  .pdp-works-with--dark .pdp-works-with__cta { color: #f8f7f4; }
  .pdp-works-with--accent .pdp-works-with__cta { color: #fff; }

  .pdp-works-with__cta:hover { opacity: 0.7; }

  @media screen and (max-width: 749px) {
    .pdp-works-with__inner {
      flex-wrap: wrap;
      gap: 0.75rem;
      padding: 1rem;
    }

    .pdp-works-with__title {
      width: 100%;
      text-align: center;
    }

    .pdp-works-with__logos-area { width: 100%; }
    .pdp-works-with__logo-img { height: 18px; }
    .pdp-works-with__logo-wrap { padding-inline: 0.5rem; width: 44px; height: 44px; }
    .pdp-works-with__cta { width: 100%; justify-content: center; }
  }

  /* prefers-reduced-motion handled in JS */
/* END_SECTION:pdp-works-with */

/* START_SECTION:popup-modal (INDEX:83) */
/* ── Popup Modal ── */
.popup-modal {
  position: fixed;
  z-index: 999;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}

.popup-modal[aria-hidden="false"] {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
}

/* ── Centered mode ── */
.popup-modal--centered {
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.popup-modal--centered .popup-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.popup-modal--centered[aria-hidden="false"] .popup-modal__backdrop {
  opacity: 1;
}

.popup-modal--centered .popup-modal__card {
  position: relative;
  max-width: 480px;
  width: 100%;
  transform: scale(0.9);
  opacity: 0;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
}

.popup-modal--centered[aria-hidden="false"] .popup-modal__card {
  transform: scale(1);
  opacity: 1;
}

/* ── Corner mode ── */
.popup-modal--corner {
  bottom: 1.5rem;
  right: 1.5rem;
}

.popup-modal--corner .popup-modal__card {
  width: 360px;
  max-width: calc(100vw - 2rem);
  transform: translateY(1.5rem);
  opacity: 0;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease;
}

.popup-modal--corner[aria-hidden="false"] .popup-modal__card {
  transform: translateY(0);
  opacity: 1;
}

/* ── Card ── */
.popup-modal__card {
  background: #fff;
  border-radius: 1.25rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15), 0 4px 16px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

@media (prefers-color-scheme: dark) {
  .popup-modal__card {
    background: #1e1e2e;
    color: #f0f0f5;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4), 0 4px 16px rgba(0, 0, 0, 0.2);
  }
  .popup-modal__input {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #f0f0f5 !important;
  }
  .popup-modal__input::placeholder { color: rgba(255, 255, 255, 0.4) !important; }
  .popup-modal__disclaimer { color: rgba(255, 255, 255, 0.4) !important; }
  .popup-modal__desc { color: rgba(255, 255, 255, 0.6) !important; }
  .popup-modal__close { color: rgba(255, 255, 255, 0.5) !important; }
  .popup-modal__close:hover { color: #fff !important; background: rgba(255, 255, 255, 0.1) !important; }
}

/* ── Close button ── */
.popup-modal__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  background: transparent;
  border: none;
  padding: 0.375rem;
  border-radius: 50%;
  cursor: pointer;
  color: #666;
  transition: color 0.2s ease, background 0.2s ease;
  line-height: 0;
}

.popup-modal__close:hover {
  color: #111;
  background: rgba(0, 0, 0, 0.06);
}

/* ── Image ── */
.popup-modal__image-wrap {
  width: 100%;
  overflow: hidden;
}

.popup-modal__image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* ── Body ── */
.popup-modal__body {
  padding: 1.5rem;
}

.popup-modal__title {
  font-family: var(--font-heading, inherit);
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 0.5rem;
  color: inherit;
}

.popup-modal__desc {
  font-size: 0.875rem;
  line-height: 1.5;
  color: #555;
  margin: 0 0 1.25rem;
}

/* ── Form ── */
.popup-modal__fields {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.popup-modal__input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #ddd;
  border-radius: 0.625rem;
  font-size: 0.9375rem;
  font-family: inherit;
  background: #fafafa;
  color: #111;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  -webkit-appearance: none;
  appearance: none;
}

.popup-modal__input:focus {
  outline: none;
  border-color: #262320;
  box-shadow: 0 0 0 3px rgba(26, 26, 46, 0.1);
}

.popup-modal__input::placeholder {
  color: #999;
}

.popup-modal__submit {
  display: block;
  width: 100%;
  margin-top: 0.75rem;
  padding: 0.8rem;
  background: #262320;
  color: #fff;
  border: none;
  border-radius: 0.625rem;
  font-size: 0.9375rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease;
}

.popup-modal__submit:hover {
  background: #111122;
}

.popup-modal__submit:active {
  transform: scale(0.98);
}

.popup-modal__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ── Success ── */
.popup-modal__success {
  text-align: center;
  padding: 1rem 0;
}

.popup-modal__success svg {
  margin-bottom: 0.75rem;
}

.popup-modal__success-text {
  font-size: 0.9375rem;
  font-weight: 500;
  color: inherit;
  margin: 0;
  line-height: 1.4;
}

/* ── Disclaimer ── */
.popup-modal__disclaimer {
  font-size: 0.6875rem;
  color: #888;
  line-height: 1.4;
  margin: 1rem 0 0;
}

/* ── Hide form on success ── */
.popup-modal__form[hidden] { display: none; }

/* ── Mobile corner mode becomes full-width ── */
@media (max-width: 480px) {
  .popup-modal--corner {
    bottom: 0;
    right: 0;
    left: 0;
  }
  .popup-modal--corner .popup-modal__card {
    width: 100%;
    max-width: 100%;
    border-radius: 1.25rem 1.25rem 0 0;
  }
}
/* END_SECTION:popup-modal */

/* START_SECTION:press-bar (INDEX:84) */
.press-bar {
    display: block;
    background-color: #F3E891;
    padding-block: 0.75rem;
  }

  .press-bar__eyebrow {
    font-family: var(--font-body, 'Inter', sans-serif);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(38, 35, 32, 0.6);
    text-align: center;
    margin: 0 0 0.5rem;
  }

  /* Marquee */
  .press-bar__marquee {
    position: relative;
    overflow: hidden;
    padding-block: 0.375rem;
  }

  /* Gradient fades */
  .press-bar__fade {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 5rem;
    z-index: 2;
    pointer-events: none;
  }

  .press-bar__fade--left {
    left: 0;
    background: linear-gradient(to right, var(--section-bg, #F3E891), transparent);
  }

  .press-bar__fade--right {
    right: 0;
    background: linear-gradient(to left, var(--section-bg, #F3E891), transparent);
  }

  /* Track — holds all logo groups, animated via JS */
  .press-bar__track {
    display: flex;
    width: max-content;
    will-change: transform;
  }

  /* Animation is now driven by JS via element.animate() — no CSS keyframes needed */

  .press-bar__logos {
    display: flex;
    align-items: center;
    flex-shrink: 0;
  }

  .press-bar__logo-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding-inline: 2rem;
  }

  .press-bar__logo-img {
    width: auto;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
    filter: none;
    opacity: 1;
    transition: opacity 200ms ease;
  }

  .press-bar__logo-wrap:hover .press-bar__logo-img {
    opacity: 0.85;
  }

  /* Size variants */
  .press-bar__logo-img--lg {
    height: 2.5rem;
  }

  .press-bar__logo-img--md {
    height: 2.5rem;
  }

  .press-bar__logo-img--sm {
    height: 2rem;
  }

  .press-bar__logo-text {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-foreground, #262320);
    white-space: nowrap;
  }

  /* Mobile: cap logo heights so wide logos (Bloomberg, Bustle) don't dominate */
  @media screen and (max-width: 749px) {
    .press-bar__logo-img--lg,
    .press-bar__logo-img--md {
      height: 1.5rem;
      max-width: 90px;
    }
    .press-bar__logo-img--sm {
      height: 1.25rem;
      max-width: 70px;
    }
  }

  @media screen and (min-width: 750px) {
    .press-bar {
      padding-block: 1.25rem;
    }

    .press-bar__fade {
      width: 8rem;
    }

    .press-bar__logo-wrap {
      padding-inline: 3rem;
    }

    .press-bar__logo-img--lg {
      height: 2.5rem;
    }

    .press-bar__logo-img--md {
      height: 2rem;
    }

    .press-bar__logo-img--sm {
      height: 1.75rem;
    }

    .press-bar__marquee {
      padding-block: 0.5rem;
    }
  }

  /* prefers-reduced-motion handled in JS */
/* END_SECTION:press-bar */

/* START_SECTION:sale-banner (INDEX:86) */
/* ── Sale Banner ── */
.sale-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--sale-bg, #000);
  color: var(--sale-fg, #fff);
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-100%);
  animation: saleBannerSlideDown 0.4s ease forwards;
  will-change: transform;
}

.sale-banner[hidden] { display: none; }

.sale-banner.sale-banner--closing {
  animation: saleBannerSlideUp 0.3s ease forwards;
}

@keyframes saleBannerSlideDown {
  from { transform: translateY(-100%); }
  to   { transform: translateY(0); }
}
@keyframes saleBannerSlideUp {
  from { transform: translateY(0); }
  to   { transform: translateY(-100%); }
}

.sale-banner__inner {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 0 48px;
  max-width: 1400px;
  width: 100%;
  justify-content: center;
}

.sale-banner__headline {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Countdown */
.sale-banner__countdown {
  display: flex;
  align-items: center;
  gap: 2px;
}

.sale-banner__digit {
  font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', 'Consolas', monospace;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: rgba(255,255,255,0.12);
  padding: 3px 6px;
  border-radius: 4px;
  min-width: 28px;
  text-align: center;
  color: var(--sale-accent);
}

.sale-banner__sep {
  font-family: 'SF Mono', monospace;
  font-weight: 700;
  font-size: 13px;
  opacity: 0.5;
  margin: 0 1px;
}

/* CTA */
.sale-banner__cta {
  display: inline-flex;
  align-items: center;
  padding: 5px 16px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--sale-accent);
  color: var(--sale-bg, #000);
  border-radius: 4px;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.2s ease;
}
.sale-banner__cta:hover { opacity: 0.85; }

/* Close */
.sale-banner__close {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--sale-fg);
  opacity: 0.5;
  cursor: pointer;
  padding: 6px;
  line-height: 0;
  transition: opacity 0.2s ease;
}
.sale-banner__close:hover { opacity: 1; }

/* ── Body offset when banner is visible ── */
html.has-sale-banner {
  --sale-banner-height: 52px;
}
html.has-sale-banner body {
  padding-top: var(--sale-banner-height);
}

/* ── Responsive ── */
@media (max-width: 749px) {
  .sale-banner { height: 44px; }
  html.has-sale-banner { --sale-banner-height: 44px; }

  .sale-banner__inner {
    gap: 10px;
    padding: 0 40px 0 12px;
    flex-wrap: nowrap;
  }

  .sale-banner__headline {
    font-size: 11px;
    flex: 1;
    min-width: 0;
  }

  .sale-banner__digit {
    font-size: 11px;
    padding: 2px 4px;
    min-width: 22px;
  }

  .sale-banner__sep { font-size: 11px; }

  .sale-banner__cta {
    font-size: 10px;
    padding: 4px 10px;
  }

  .sale-banner__close { right: 8px; }
}

/* Stack on very small screens */
@media (max-width: 479px) {
  .sale-banner__cta { display: none; }
}
/* END_SECTION:sale-banner */

/* CSS from snippet stylesheet tags */
/* START_SNIPPET:brand-gradient (INDEX:87) */
.nf-brand-gradient {
  background:
    radial-gradient(ellipse at 20% 80%, rgba(225, 108, 71, 0.25) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(79, 87, 106, 0.2) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 50%, rgba(170, 125, 44, 0.12) 0%, transparent 55%),
    radial-gradient(circle at 70% 65%, rgba(158, 173, 210, 0.1) 0%, transparent 40%),
    linear-gradient(155deg, #262320 0%, #353230 25%, #3d3a37 45%, #353230 65%, #262320 100%);
}
/* END_SNIPPET:brand-gradient */

/* START_SNIPPET:breadcrumbs (INDEX:88) */
.breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0;
    margin: 0;
    list-style: none;
    font-size: var(--font-size-sm, 0.875rem);
    color: var(--color-text-secondary, #666);
  }

  .breadcrumbs__item:not(:last-child)::after {
    content: '/';
    margin-inline-start: 0.5rem;
  }

  .breadcrumbs__item a {
    color: inherit;
    text-decoration: none;
  }

  .breadcrumbs__item a:hover {
    text-decoration: underline;
  }

  .breadcrumbs__item[aria-current="page"] {
    color: var(--color-text, #1a1a1a);
  }
/* END_SNIPPET:breadcrumbs */

/* START_SNIPPET:country-selector (INDEX:89) */
.country-selector select {
    appearance: none;
    padding: 0.5rem 2rem 0.5rem 0.75rem;
    border: 1px solid var(--color-border, #e5e5e5);
    border-radius: var(--radius-sm, 4px);
    background: var(--color-background, #fff);
    font-size: var(--font-size-sm, 0.875rem);
    cursor: pointer;
  }
/* END_SNIPPET:country-selector */

/* START_SNIPPET:price-display (INDEX:106) */
.price {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
  }

  .price__current {
    font-size: var(--font-size-2xl, 1.5rem);
    font-weight: 700;
    color: var(--color-text, #1a1a1a);
  }

  .price--on-sale .price__current {
    color: var(--color-sale, #e74c3c);
  }

  .price__compare {
    font-size: var(--font-size-lg, 1.125rem);
    color: var(--color-text-secondary, #666);
    text-decoration: line-through;
  }

  .price__save-badge {
    display: inline-flex;
    padding: 0.125rem 0.5rem;
    background: var(--color-sale, #e74c3c);
    color: #fff;
    font-size: var(--font-size-sm, 0.875rem);
    font-weight: 600;
    border-radius: var(--radius-sm, 4px);
  }
/* END_SNIPPET:price-display */

/* START_SNIPPET:product-card (INDEX:107) */
/* ═══════════════════════════════════════════════
   NF-CARD — Unified product card system
   Sizes: L (section) · M (mega menu) · S (cart upsell)
   Schemes: light · dark (wellness)
   ═══════════════════════════════════════════════ */

/* ── Base — unboxed clean card ── */
.nf-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: transparent;
  transition: opacity 0.2s ease;
}

.nf-card:hover {
  /* no opacity change — use image zoom instead */
}

/* ── Image — all corners rounded, consistent bg across all instances ── */
.nf-card__img-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--color-secondary, #F3F1E9);
  border: 1px solid var(--color-border, #eee);
  border-radius: 0.75rem;
}
.nf-card--dark .nf-card__img-wrap {
  background: #1a1a1d;
  border-color: rgba(255,255,255,0.06);
}

.nf-card__img-wrap--portrait {
  aspect-ratio: 3 / 4;
}

.nf-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.nf-card--zoom:hover .nf-card__img {
  transform: none;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ── Badge ── */
.nf-card__badge {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  padding: 0.125rem 0.5rem;
  border-radius: var(--radius-button);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  line-height: 1.4;
  letter-spacing: 0.02em;
}

.nf-card__badge--sale { background: #E16C47; }
.nf-card__badge--bestseller { background: #3b82f6; }
.nf-card__badge--new { background: #8b5cf6; }
.nf-card__badge--sold-out { background: #ef4444; }

/* ── Info — clean, no box ── */
.nf-card__info {
  padding: 0.625rem 0.125rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  flex: 1;
}
.nf-card__desc {
  font-size: 11px;
  line-height: 1.4;
  color: #71717a;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nf-card--dark .nf-card__desc { color: rgba(255,255,255,0.45); }
.nf-card__tags {
  display: flex;
  gap: 0.25rem;
  flex-wrap: wrap;
  margin-top: 0.25rem;
}
.nf-card__tag {
  font-size: 9px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 0.125rem 0.5rem;
  border-radius: var(--radius-button);
  background: #e4e3de;
  color: #555;
  line-height: 1.4;
}
.nf-card--dark .nf-card__tag { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.55); }

.nf-card__title {
  font-size: 13px;
  font-weight: 600;
  margin: 0;
  color: #262320;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.4;
  transition: color 0.2s ease;
}

/* ── Review line ── */
.nf-card__review {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.nf-card__stars {
  display: flex;
  align-items: center;
  gap: 1px;
  flex-shrink: 0;
}

.nf-card__stars svg {
  flex-shrink: 0;
}

.nf-card__review-count {
  font-size: 11px;
  color: #71717a;
  line-height: 1;
}

/* ── Price ── */
.nf-card__price-row {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.125rem;
}

.nf-card__price {
  font-size: 15px;
  font-weight: 700;
  color: #262320;
}

.nf-card__compare {
  font-size: 11px;
  color: #999;
  text-decoration: line-through;
}

/* ── Actions container — stacked vertically, Quick View on top ── */
.nf-card__actions {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin-top: 0.5rem;
}
.nf-card__actions .nf-card__add-btn {
  margin-top: 0;
  width: 100%;
  order: 2;
}
.nf-card__actions .nf-card__quick-view {
  width: 100%;
  margin-top: 0;
  order: 1;
}
@media (max-width: 749px) {
  .nf-card__actions .nf-card__quick-view { display: none; }
}

/* ── Add button — full width, animated + / text ── */
/* Spinner uses global @keyframes spin */
.nf-card__add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.5rem 1rem;
  background: #262320;
  color: #fff;
  border: none;
  border-radius: var(--radius-button);
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  overflow: hidden;
  line-height: 1;
  transition: opacity 0.2s ease;
}
.nf-card__add-plus {
  display: inline-block;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-width 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease, margin 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  margin-right: 0;
}
.nf-card__add-text {
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
/* Desktop: show + on hover */
@media (hover: hover) {
  .nf-card__add-btn:hover .nf-card__add-plus {
    max-width: 1.25rem;
    opacity: 1;
    margin-right: 0.25rem;
  }
}
/* Mobile: always show + */
@media (hover: none) {
  .nf-card__add-plus {
    max-width: 1.25rem;
    opacity: 1;
    margin-right: 0.25rem;
  }
}
.nf-card__add-btn:hover { opacity: 0.8; }
.nf-card__add-btn.is-adding { pointer-events: none; opacity: 0.85; }
.nf-card__add-btn.is-adding .nf-card__add-text,
.nf-card__add-btn.is-adding .nf-card__add-plus { display: none; }
.nf-card__add-btn.is-adding .nf-card__add-loader { display: inline-flex !important; }
.nf-card__add-btn.is-added { background: #22c55e; pointer-events: none; }
.nf-card__add-loader[hidden] { display: none; }

/* L size uses same pill dimensions */
.nf-card--dark .nf-card__add-btn { background: #f5f5f5; color: #262320; }
.nf-card--dark .nf-card__add-btn:hover { background: #e0e0e0; }

/* ═══════════════════════════════════════
   SIZE: L (section-level cards)
   ═══════════════════════════════════════ */
.nf-card--l {
  width: 200px;
  flex-shrink: 0;
  scroll-snap-align: start;
}

@media (max-width: 749px) {
  .nf-card--l { width: 180px; }
}

/* ═══════════════════════════════════════
   SIZE: M (mega menu cards)
   ═══════════════════════════════════════ */
.nf-card--m {
  width: 180px;
  flex-shrink: 0;
  padding: 0;
}

.nf-card--m .nf-card__info {
  padding: 0.5rem 0.625rem;
}

.nf-card--m .nf-card__title {
  -webkit-line-clamp: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
  overflow: hidden;
}

.nf-card--m:hover .nf-card__title {
  color: #3b82f6;
}

/* ═══════════════════════════════════════
   SIZE: S (cart upsell cards)
   ═══════════════════════════════════════ */
.nf-card--s {
  width: 160px;
  flex-shrink: 0;
  scroll-snap-align: start;
}

.nf-card--s .nf-card__info {
  padding: 0.375rem 0.5rem 0.25rem;
}

.nf-card--s .nf-card__title {
  font-size: 12px;
}

.nf-card--s .nf-card__price {
  font-size: 14px;
}

.nf-card--s .nf-card__badge {
  font-size: 8px;
  padding: 1px 6px;
}

@media (max-width: 749px) {
  .nf-card--s { width: 145px; }
  .nf-card--s .nf-card__info { padding: 0.25rem 0.375rem; }
}

/* ═══════════════════════════════════════
   SCHEME: Dark (wellness)
   ═══════════════════════════════════════ */
.nf-card--dark {
  background: transparent;
  border-color: transparent;
}

.nf-card--dark:hover {
  border-color: transparent;
}

.nf-card--dark .nf-card__img-wrap {
  background: #1a1a1d;
}

.nf-card--dark .nf-card__title {
  color: var(--card-dark-text, #f5f5f5);
}

.nf-card--dark .nf-card__price {
  color: var(--card-dark-text, #f5f5f5);
}

/* Stars stay orange in dark mode — no override needed */
.nf-card--dark .nf-card__review-count {
  color: rgba(255,255,255,0.55);
}

.nf-card--dark .nf-card__compare {
  color: rgba(255,255,255,0.4);
}

.nf-card--dark:hover .nf-card__title {
  color: var(--card-dark-accent, #fbbf24);
}

.nf-card--dark .nf-card__add-btn {
  background: #f5f5f5;
  color: #1a1a1a;
}

.nf-card--dark .nf-card__add-btn:hover {
  background: #fff;
}

/* ── Quick View button ── */
.nf-card__quick-view {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 0.25rem;
  padding: 0.5rem 1rem;
  background: transparent;
  color: #262320;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: var(--radius-button);
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1;
  transition: border-color 0.2s, opacity 0.2s;
}
.nf-card__quick-view:hover { border-color: #262320; opacity: 0.8; }
.nf-card--dark .nf-card__quick-view { color: #f5f5f5; border-color: rgba(255,255,255,0.2); }
.nf-card--dark .nf-card__quick-view:hover { border-color: #f5f5f5; }
@media (max-width: 749px) { .nf-card__quick-view { display: none; } }
/* END_SNIPPET:product-card */

/* START_SNIPPET:quick-view-modal (INDEX:109) */
/* ═══════════════════════════════════════════════
   QUICK VIEW MODAL
   ═══════════════════════════════════════════════ */

/* ── Overlay container ── */
.qv-modal {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.qv-modal[hidden] { display: none; }
.qv-modal.is-open {
  pointer-events: auto;
  opacity: 1;
}

/* ── Backdrop ── */
.qv-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

/* ── Panel ── */
.qv-modal__panel {
  --qv-bg: #fff;
  --qv-text: #262320;
  --qv-text-muted: #71717a;
  --qv-border: rgba(0,0,0,0.08);
  --qv-footer-fade: #fff;

  position: relative;
  width: 56rem;
  max-width: calc(100vw - 2rem);
  max-height: 90vh;
  background: var(--qv-bg);
  border-radius: 1rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.22);
  transform: translateY(30px) scale(0.98);
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.qv-modal.is-open .qv-modal__panel {
  transform: translateY(0) scale(1);
}

/* ── Dark theme panel ── */
.theme-dark .qv-modal__panel {
  --qv-bg: #1e1e21;
  --qv-text: #f5f5f5;
  --qv-text-muted: rgba(255,255,255,0.55);
  --qv-border: rgba(255,255,255,0.12);
  --qv-footer-fade: #1e1e21;
  --color-border: rgba(255,255,255,0.12);
  --color-foreground: #f5f5f5;
}
/* Dark QV: all borders/separators inherit --qv-border */
.theme-dark .qv-modal__scroll .pdp-hero__accordion {
  border-color: var(--qv-border) !important;
}
.theme-dark .qv-modal__scroll hr,
.theme-dark .qv-modal__scroll .pdp-hero__desc-divider-line {
  border-color: var(--qv-border) !important;
  background-color: var(--qv-border) !important;
}
/* Catch hardcoded border colors */
.theme-dark .qv-modal__scroll .pdp-hero__inventory-bar {
  background: rgba(255,255,255,0.12) !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__accordion-trigger {
  color: var(--qv-text) !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__accordion-chevron {
  color: var(--qv-text) !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__accordion-answer,
.theme-dark .qv-modal__scroll .pdp-hero__accordion-body {
  color: var(--qv-text-muted) !important;
}
/* Light QV: ensure accordions use proper light border */
.qv-modal__scroll .pdp-hero__accordion {
  border-color: rgba(0,0,0,0.08);
}

/* ── Close button ── */
.qv-modal__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 10;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--qv-bg);
  border: 1px solid var(--qv-border);
  border-radius: 50%;
  color: var(--qv-text);
  cursor: pointer;
  transition: opacity 0.2s, transform 0.2s;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.qv-modal__close:hover {
  opacity: 0.8;
  transform: scale(1.06);
}

/* ── Scrollable content area ── */
.qv-modal__scroll {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* ═══ PDP HERO OVERRIDES INSIDE MODAL ═══ */

/* Remove page-level padding/width constraints */
.qv-modal__scroll .page-width {
  padding: 0 !important;
  max-width: none !important;
}

/* Hero section padding reset */
.qv-modal__scroll .pdp-hero {
  padding-block: 0.5rem 0.5rem !important;
}

/* Grid: two columns on wide modal, single column on narrow */
.qv-modal__scroll .pdp-hero__grid {
  grid-template-columns: 1fr 1fr !important;
  column-gap: 1.5rem !important;
  row-gap: 0.5rem !important;
  padding: 0 1rem;
}

/* Gallery: sticky so it stays visible while scrolling product details */
.qv-modal__scroll .pdp-hero__gallery-sticky {
  position: sticky !important;
  top: 0 !important;
  align-self: flex-start;
}

/* Gallery image: rounded, normal cursor, block lightbox */
.qv-modal__scroll .pdp-hero__main-image,
.qv-modal__scroll .pdp-hero__slide,
.qv-modal__scroll .pdp-hero__gallery,
.qv-modal__scroll .pdp-hero__carousel {
  cursor: default !important;
}
.qv-modal__scroll .pdp-hero__main-image {
  border-radius: 0.5rem !important;
  border: 1px solid var(--qv-border) !important;
}
/* Block the lightbox overlay and expand icons */
.qv-modal__scroll .pdp-hero__expand-icon,
.qv-modal__scroll .pdp-hero__zoom-icon,
.qv-modal__scroll [data-lightbox-trigger],
.qv-modal__scroll .pdp-hero__lightbox,
.qv-modal__scroll .pdp-hero__4d-trigger {
  display: none !important;
}
/* Slides: default cursor */
.qv-modal__scroll .pdp-hero__slide {
  cursor: default !important;
}

/* Gallery arrows: keep clickable, smaller */
.qv-modal__scroll .pdp-hero__arrow {
  width: 2rem;
  height: 2rem;
}

/* Thumbnails: keep clickable, smaller */
.qv-modal__scroll .pdp-hero__thumbnails {
  padding-inline: 0;
  gap: 0.25rem;
}
.qv-modal__scroll .pdp-hero__thumb {
  width: 2.75rem;
  height: 2.75rem;
}

/* ── Info column: tighter spacing, allow pulse overflow ── */
.qv-modal__scroll .pdp-hero__info {
  padding-inline: 0 !important;
  padding-top: 0.25rem;
  overflow: visible !important;
}
.qv-modal__scroll .pdp-hero__inventory,
.qv-modal__scroll .pdp-hero__inventory-info,
.qv-modal__scroll .pdp-hero__inventory-left {
  overflow: visible !important;
}

/* Title: smaller for modal */
.qv-modal__scroll .pdp-hero__title {
  font-size: 1.25rem !important;
  line-height: 1.3 !important;
}

/* Description: smaller */
.qv-modal__scroll .pdp-hero__description,
.qv-modal__scroll [data-desc-content] {
  font-size: 0.8125rem !important;
  line-height: 1.55 !important;
}

/* ── Hide elements that belong on the full PDP only ── */
.qv-modal__scroll [data-qty-selector],
.qv-modal__scroll [data-add-to-cart],
.qv-modal__scroll .pdp-hero__cta-row,
.qv-modal__scroll .pdp-hero__dynamic-checkout,
.qv-modal__scroll .pdp-hero__cross-sell,
.qv-modal__scroll .pdp-hero__mobile-sticky,
.qv-modal__scroll .pdp-hero__feature-prompt,
.qv-modal__scroll .pdp-hero__gallery-sticky::after {
  display: none !important;
}

/* ── Description fade — must use panel bg, not section bg ── */
.qv-modal .qv-modal__scroll .pdp-hero__desc-fade {
  background: linear-gradient(to bottom, transparent, var(--qv-bg, #fff)) !important;
}
.theme-dark .qv-modal .qv-modal__scroll .pdp-hero__desc-fade {
  background: linear-gradient(to bottom, transparent, var(--qv-bg, #1e1e21)) !important;
}

/* ── Price: smaller + thinner in modal to distinguish from title ── */
.qv-modal__scroll .pdp-hero__price-current {
  font-size: 1.125rem !important;
  font-weight: 400 !important;
}
.qv-modal__scroll .pdp-hero__price-row {
  margin-top: 0.125rem !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__price-current {
  color: #f5f5f5 !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__price-compare {
  color: rgba(255,255,255,0.4) !important;
}

/* ── Read More toggle — unified grey, dark mode override in QV ── */
.theme-dark .qv-modal__scroll .pdp-hero__desc-toggle {
  background: rgba(255,255,255,0.12) !important;
  color: #f5f5f5 !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__desc-toggle:hover {
  background: rgba(255,255,255,0.18) !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__desc-wrap.is-expanded .pdp-hero__desc-toggle {
  background: rgba(255,255,255,0.12) !important;
  color: #f5f5f5 !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__desc-divider-line {
  background: rgba(255,255,255,0.12) !important;
}

/* ── Accordion — dark mode text ── */
.theme-dark .qv-modal__scroll .pdp-hero__accordion-trigger {
  color: #f5f5f5 !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__accordion-content {
  color: rgba(255,255,255,0.65) !important;
}
.theme-dark .qv-modal__scroll .pdp-hero__accordion {
  border-color: rgba(255,255,255,0.1) !important;
}

/* ── Keep visible: variant picker, price, reviews, description, accordion, trust, shipping, inventory ── */

/* ── Loading spinner ── */
.qv-modal__loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem;
}
.qv-modal__spinner {
  width: 24px;
  height: 24px;
  border: 2px solid var(--qv-border);
  border-top-color: var(--qv-text);
  border-radius: 50%;
  animation: qvSpin 0.6s linear infinite;
}
@keyframes qvSpin {
  to { transform: rotate(360deg); }
}

/* ── Footer: Add to Cart + View Full ── */
.qv-modal__footer {
  flex-shrink: 0;
  position: relative;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid var(--qv-border);
  background: var(--qv-bg);
}
.qv-modal__footer-row {
  display: flex;
  gap: 0.5rem;
  align-items: stretch;
}

/* Add to Cart button */
.qv-modal__add-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.25rem;
  background: #E16C47;
  color: #fff;
  border: none;
  border-radius: var(--radius-button);
  font-size: 0.875rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(45, 138, 35, 0.25);
  transition: box-shadow 0.2s, transform 0.2s;
}
.qv-modal__add-btn:hover {
  box-shadow: 0 4px 16px rgba(45, 138, 35, 0.4);
  transform: translateY(-1px);
}
.qv-modal__add-btn.is-adding {
  pointer-events: none;
  opacity: 0.7;
}
.qv-modal__add-btn.is-added {
  background: #22c55e;
  box-shadow: none;
}

/* View Full link */
.qv-modal__full-link {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--qv-text);
  text-decoration: none;
  border: 1.5px solid var(--qv-border);
  border-radius: var(--radius-button);
  transition: border-color 0.2s, background 0.2s;
}
.qv-modal__full-link:hover {
  border-color: var(--qv-text);
}

/* ── Responsive: single column on narrower viewports ── */
@media (max-width: 899px) {
  .qv-modal__scroll .pdp-hero__grid {
    grid-template-columns: 1fr !important;
  }
}

/* ── Hide on mobile entirely (Quick View buttons are hidden on mobile too) ── */
@media (max-width: 749px) {
  .qv-modal { display: none !important; }
}
/* END_SNIPPET:quick-view-modal */

/* START_SNIPPET:tech-specs-modal (INDEX:112) */
.tech-specs-modal {
    position: fixed;
    inset: 0;
    margin: auto;
    max-width: min(90vw, 600px);
    max-height: 80vh;
    padding: 0;
    border: none;
    border-radius: var(--radius-lg, 12px);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
  }

  .tech-specs-modal::backdrop {
    background: rgba(0, 0, 0, 0.5);
  }

  .tech-specs-modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-md, 1.5rem);
    border-block-end: 1px solid var(--color-border, #e5e5e5);
  }

  .tech-specs-modal__title {
    margin: 0;
    font-size: var(--font-size-xl, 1.25rem);
  }

  .tech-specs-modal__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
    border-radius: 50%;
  }

  .tech-specs-modal__close:hover {
    background: var(--color-background-secondary, #f5f5f5);
  }

  .tech-specs-modal__content {
    padding: var(--space-md, 1.5rem);
    overflow-y: auto;
    max-height: calc(80vh - 5rem);
  }

  .tech-specs-modal__list {
    margin: 0;
  }

  .tech-specs-modal__row {
    display: flex;
    justify-content: space-between;
    padding-block: 0.75rem;
    border-block-end: 1px solid var(--color-border, #e5e5e5);
  }

  .tech-specs-modal__row:last-child {
    border-block-end: none;
  }

  .tech-specs-modal__label {
    font-weight: 600;
    color: var(--color-text, #1a1a1a);
  }

  .tech-specs-modal__value {
    margin: 0;
    color: var(--color-text-secondary, #666);
    text-align: end;
  }
/* END_SNIPPET:tech-specs-modal */