/** Shopify CDN: Minification failed

Line 16501:0 Unexpected "}"

**/
/* ============================================
   PERLE DE LUMINA — Theme CSS Part 1
   Google Fonts, Variables, Reset, Typography,
   Utilities, Buttons, Skip-link, Announcement Bar,
   Navbar, Trust Bar, Footer, Cart Drawer
   ============================================ */

/* ------------------------------------------
   Self-hosted fonts only (Google Fonts loaded via <link> in layout/theme.liquid
   — @import here era duplicat și render-blocking, scos pentru a accelera FCP)
   ------------------------------------------ */

/* Canela Deck — Premium heading font */
@font-face {
  font-family: 'Canela Deck';
  src: url('CanelaDeck-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Canela Deck';
  src: url('CanelaDeck-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Canela Deck';
  src: url('CanelaDeck-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Canela Deck';
  src: url('CanelaDeck-RegularItalic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* ------------------------------------------
   CSS Variables
   ------------------------------------------ */
:root {
  /* Premium Color Palette */
  --background: #FAFAF8;
  --foreground: #2C2825;
  --card: #FFFFFF;
  --primary: #C4A082;
  --primary-light: #D4B896;
  --primary-dark: #A8855F;
  --primary-foreground: #FFFFFF;
  --muted: #F0EBE5;
  --muted-foreground: #8A8480;
  --accent: #D4C5B9;
  --accent-foreground: #2C2825;
  --border: rgba(44, 40, 37, 0.08);
  --border-strong: rgba(44, 40, 37, 0.15);
  --star: #D4A843;
  --destructive: #C44D56;
  --success: #4A7C59;

  /* Typography */
  --font-heading: 'Canela Deck', 'Playfair Display', Georgia, serif;
  --font-body: 'DM Sans', system-ui, -apple-system, sans-serif;

  /* Radius - subtle, refined */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-full: 9999px;

  /* Spacing - generous for premium feel */
  --section-py: 5rem;
  --section-py-lg: 7rem;
  --section-px: 1.25rem;
  --section-px-md: 2.5rem;
  --section-px-lg: 4rem;
  --max-width: 1400px;

  /* Shadows - subtle, barely visible */
  --shadow-sm: 0 1px 3px rgba(44, 40, 37, 0.04);
  --shadow-md: 0 4px 16px rgba(44, 40, 37, 0.06);
  --shadow-lg: 0 12px 40px rgba(44, 40, 37, 0.08);
  --shadow-xl: 0 24px 60px rgba(44, 40, 37, 0.1);

  /* Transitions - smooth, refined */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Layout */
  --announcement-height: 40px;
  --navbar-height: 72px;
  --header-height: calc(var(--announcement-height) + var(--navbar-height));
}

/* ------------------------------------------
   Reset
   ------------------------------------------ */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.7;
  color: var(--foreground);
  letter-spacing: 0.01em;
  background: var(--background);
  min-height: 100vh;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Main content — clear fixed header */
#main-content {
  padding-top: var(--header-height);
}

/* Templates where hero is full-bleed (homepage, collection) — remove extra padding */
.template--index #main-content,
.template--collection #main-content {
  padding-top: 0;
}

/* When announcement bar is closed */
.announcement-bar--hidden {
  --announcement-height: 0px;
  --header-height: var(--navbar-height);
}
.announcement-bar--hidden .navbar {
  top: 0;
}

a {
  text-decoration: none;
  color: inherit;
}

button {
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  color: inherit;
}

input,
textarea,
select {
  font-family: inherit;
  outline: none;
}

ul,
ol {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  font-weight: 500;
  line-height: 1.2;
}

p {
  margin: 0;
}

/* ------------------------------------------
   Typography
   ------------------------------------------ */
h1 { font-size: 3rem; }
h2 { font-size: 2.25rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }

/* ------------------------------------------
   Utilities
   ------------------------------------------ */
.container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

@media (min-width: 768px) {
  .container {
    padding: 0 var(--section-px-md);
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.no-scroll {
  overflow: hidden;
}

.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

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

::selection {
  background: var(--primary);
  color: #fff;
}

/* ------------------------------------------
   Buttons
   ------------------------------------------ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  padding: 1rem 2.5rem;
  border-radius: var(--radius-sm);
  transition: all var(--transition-base);
  cursor: pointer;
  border: none;
  font-family: inherit;
}

.btn--primary {
  background: var(--foreground);
  color: var(--background);
}

.btn--primary:hover {
  background: var(--primary);
}

.btn--outline {
  border: 1px solid var(--primary);
  color: var(--primary);
  background: transparent;
}

.btn--outline:hover {
  background: var(--primary);
  color: #fff;
}

.btn--sm {
  padding: 0.625rem 1.25rem;
  font-size: 10px;
}

.btn--full {
  width: 100%;
}

/* ------------------------------------------
   Skip Link
   ------------------------------------------ */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  background: var(--foreground);
  color: var(--background);
  padding: 0.75rem 1.5rem;
  z-index: 9999;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

.skip-link:focus {
  top: 0;
}

/* ------------------------------------------
   Announcement Bar
   ------------------------------------------ */
.announcement-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: var(--announcement-height);
  background: var(--primary);
  color: #fff;
}

.announcement-bar__container {
  max-width: var(--max-width);
  margin: 0 auto;
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.announcement-bar__messages {
  position: relative;
  overflow: hidden;
  height: 100%;
  display: flex;
  align-items: center;
}

.announcement-bar__message {
  position: absolute;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(100%);
  transition: all 0.3s ease;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}

.announcement-bar__message--active {
  opacity: 1;
  transform: translateY(0);
  position: relative;
}

.announcement-bar__close {
  position: absolute;
  right: 1rem;
  opacity: 0.7;
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.announcement-bar__close:hover {
  opacity: 1;
}

/* ------------------------------------------
   Navbar — CRITICAL LAYOUT
   ------------------------------------------ */
.navbar {
  position: fixed;
  top: var(--announcement-height);
  left: 0;
  right: 0;
  z-index: 90;
  background: transparent;
  padding: 1.5rem 0;
  border-bottom: 1px solid transparent;
  transition: all var(--transition-base);
}

.navbar--scrolled {
  background: rgba(250, 249, 247, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  padding: 1rem 0;
}

.navbar__container {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: 90%;
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0;
}

/* Left */
.navbar__left {
  display: flex;
  align-items: center;
  gap: 2rem;
  justify-self: start;
}

.navbar__hamburger {
  display: flex;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
}

@media (min-width: 1024px) {
  .navbar__hamburger {
    display: none;
  }
}

.navbar__hamburger span {
  display: block;
  width: 20px;
  height: 1.5px;
  background: var(--foreground);
  transition: all 0.3s ease;
}

.navbar__nav {
  display: none;
  align-items: center;
  gap: 2rem;
}

@media (min-width: 1024px) {
  .navbar__nav {
    display: flex;
  }
}

.navbar__link {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--foreground);
  transition: color var(--transition-base);
}

.navbar__link:hover {
  color: var(--primary);
}

/* Center */
.navbar__center {
  justify-self: center;
}

.navbar__brand {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  text-decoration: none;
}

.navbar__logo {
  object-fit: contain;
  max-height: 60px;
}

.navbar__brand-name {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
  display: none;
}

@media (min-width: 640px) {
  .navbar__brand-name {
    display: block;
  }
}

/* Right */
.navbar__right {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  justify-self: end;
}

.navbar__action {
  color: var(--foreground);
  transition: color var(--transition-base);
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.navbar__action:hover {
  color: var(--primary);
}

.navbar__action svg {
  width: 20px;
  height: 20px;
}

.navbar__cart-btn {
  position: relative;
}

.navbar__cart-count {
  position: absolute;
  top: -4px;
  right: -4px;
  background: var(--primary);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--background);
  transition: opacity 0.15s ease;
}

.navbar__cart-count--empty {
  opacity: 0;
  pointer-events: none;
}

/* Mobile Menu */
.navbar__mobile-overlay {
  position: fixed;
  inset: 0;
  background: rgba(61, 56, 52, 0.4);
  z-index: 99998 !important;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}

.navbar__mobile-overlay--open,
.navbar__mobile-overlay--visible {
  opacity: 1;
  pointer-events: auto;
}

.navbar__mobile-menu {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  height: 100% !important;
  width: 92vw;
  max-width: 420px;
  background: #FAFAF8 !important;
  z-index: 99999 !important;
  transform: translateX(-100%);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  padding: 2rem 1.25rem;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* When mobile menu is open: hide announcement bar (full opacity 0 ca să nu cause re-paint flash la close) */
body.mobile-menu-open .announcement-bar {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.2s ease;
}

.navbar__mobile-menu--open {
  transform: translateX(0);
}

.navbar__mobile-close {
  align-self: flex-end;
  margin-bottom: 2rem;
}

.navbar__mobile-nav {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.navbar__mobile-nav a {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

.navbar__mobile-social {
  margin-top: auto;
  padding-top: 2rem;
  border-top: 1px solid var(--border);
  display: flex;
  gap: 1rem;
}

.navbar__mobile-social span {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
}

/* ------------------------------------------
   Trust Bar
   ------------------------------------------ */
.trust-bar {
  background: var(--muted);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 1rem 0;
}

.trust-bar__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
}

@media (min-width: 768px) {
  .trust-bar__container {
    gap: 4rem;
  }
}

.trust-bar__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
}

.trust-bar__item svg {
  width: 14px;
  height: 14px;
  color: var(--primary);
}

/* ------------------------------------------
   Footer
   ------------------------------------------ */
.footer {
  background: var(--foreground);
  color: rgba(250, 249, 247, 0.8);
  padding-top: 8rem;
  padding-bottom: 3rem;
}

.footer__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

@media (min-width: 768px) {
  .footer__container {
    padding: 0 var(--section-px-md);
  }
}

.footer__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  margin-bottom: 4rem;
}

@media (min-width: 768px) {
  .footer__grid {
    grid-template-columns: 2fr 1fr 1fr;
    gap: 3rem;
  }
}

.footer__column--brand .footer__brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
}

.footer__logo {
  width: 40px;
  height: 40px;
  filter: invert(1);
}

.footer__brand-name {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  color: var(--primary);
}

.footer__description {
  color: rgba(250, 249, 247, 0.6);
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 1rem;
}

.footer__rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
}

.footer__stars {
  display: flex;
  color: var(--star);
}

.footer__stars svg {
  width: 14px;
  height: 14px;
}

.footer__rating-text {
  font-size: 12px;
  color: rgba(250, 249, 247, 0.5);
}

.footer__social {
  display: flex;
  gap: 1rem;
}

.footer__social-link {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(250, 249, 247, 0.2);
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(250, 249, 247, 0.7);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
  transition: all var(--transition-base);
}

.footer__social-link:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.footer__heading {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: rgba(250, 249, 247, 0.4);
  margin-bottom: 2rem;
}

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

.footer__link {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: rgba(250, 249, 247, 0.6);
  transition: color var(--transition-base);
}

.footer__link:hover {
  color: var(--primary);
}

.footer__column--newsletter .footer__newsletter-text {
  color: rgba(250, 249, 247, 0.6);
  font-size: 14px;
  margin-bottom: 1.5rem;
}

.footer__newsletter-form {
  display: flex;
  border-bottom: 1px solid rgba(250, 249, 247, 0.2);
  padding-bottom: 0.5rem;
}

.footer__newsletter-input {
  flex: 1;
  background: transparent;
  border: none;
  color: rgba(250, 249, 247, 1);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.footer__newsletter-input::placeholder {
  color: rgba(250, 249, 247, 0.3);
}

.footer__newsletter-btn {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: rgba(250, 249, 247, 0.7);
  background: none;
  border: none;
  cursor: pointer;
  transition: color var(--transition-base);
  white-space: nowrap;
}

.footer__newsletter-btn:hover {
  color: var(--primary);
}

.footer__payments {
  border-top: 1px solid rgba(250, 249, 247, 0.1);
  padding-top: 2rem;
  margin-bottom: 2rem;
}

.footer__payments-icons {
  display: flex;
  justify-content: center;
  gap: 2rem;
  flex-wrap: wrap;
}

.footer__payment-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: rgba(250, 249, 247, 0.4);
}

.footer__disclaimer {
  margin: 0 0 1.25rem;
  padding: 1.25rem 0 0;
  border-top: 1px solid rgba(250, 249, 247, 0.1);
  font-size: 11px;
  font-style: italic;
  color: rgba(250, 249, 247, 0.55);
  letter-spacing: 0.01em;
  line-height: 1.6;
  text-align: center;
}

.footer__bottom {
  border-top: 1px solid rgba(250, 249, 247, 0.1);
  padding-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(250, 249, 247, 0.4);
}

/* If both disclaimer + bottom present, remove top border on bottom (disclaimer already has it) */
.footer__disclaimer + .footer__bottom {
  border-top: 0;
  padding-top: 1rem;
}

@media (min-width: 768px) {
  .footer__bottom {
    flex-direction: row;
    justify-content: space-between;
  }
}

.footer__legal {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  justify-content: center;
}

.footer__legal-link {
  transition: color var(--transition-base);
}

.footer__legal-link:hover {
  color: var(--primary);
}

/* ------------------------------------------
   Cart Drawer Overlay
   ------------------------------------------ */
.cart-drawer__overlay {
  position: fixed;
  inset: 0;
  background: rgba(61, 56, 52, 0.3);
  z-index: 110;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}

.cart-drawer__overlay--visible {
  opacity: 1;
  pointer-events: auto;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

/* ------------------------------------------
   Cart Drawer
   ------------------------------------------ */
.cart-drawer {
  position: fixed;
  right: 0;
  top: 0;
  height: 100%;
  width: 100%;
  max-width: 28rem;
  background: var(--card);
  z-index: 120;
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-lg);
  overflow: hidden;
}

/* Cart items area scrolează independent */
.cart-drawer__items {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
}

/* Sticky bottom — discount + trust + footer + payments */
.cart-drawer__sticky-bottom {
  flex-shrink: 0;
  border-top: 1px solid var(--border);
  background: var(--card);
  box-shadow: 0 -4px 16px rgba(44, 40, 37, 0.05);
}

.cart-drawer--open {
  transform: translateX(0);
}

/* Header */
.cart-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.25rem;
  border-bottom: 1px solid var(--border);
}

.cart-drawer__title {
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.cart-drawer__count {
  color: var(--muted-foreground);
}

.cart-drawer__close {
  padding: 0.5rem;
  border-radius: 50%;
  transition: background var(--transition-fast);
  display: flex;
  align-items: center;
  justify-content: center;
}

.cart-drawer__close:hover {
  background: var(--muted);
}

/* Timer */
.cart-drawer__timer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem;
  background: #FEF9E7;
  border-bottom: 1px solid rgba(217, 183, 90, 0.3);
  font-size: 10px;
  color: var(--muted-foreground);
}

.cart-drawer__timer svg {
  color: #B8860B;
}

.cart-drawer__timer strong {
  color: #8B6914;
  font-weight: 700;
}

/* Shipping */
.cart-drawer__shipping {
  padding: 1rem 1.5rem;
  background: var(--muted);
  border-bottom: 1px solid var(--border);
}

.cart-drawer__shipping-text {
  font-size: 12px;
  text-align: center;
  margin-bottom: 0.5rem;
  color: var(--muted-foreground);
}

.cart-drawer__shipping-text strong {
  color: var(--foreground);
}

.cart-drawer__shipping-text--complete {
  color: var(--primary);
  font-weight: 700;
}

.cart-drawer__shipping-bar {
  height: 6px;
  background: var(--border);
  border-radius: var(--radius-full);
  overflow: hidden;
}

.cart-drawer__shipping-progress {
  height: 100%;
  background: var(--primary);
  border-radius: var(--radius-full);
  transition: width 0.5s ease;
}

/* Items */
.cart-drawer__items {
  padding: 0.875rem 1.25rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.cart-drawer__item {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cart-drawer__item-row {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}

.cart-drawer__item-image-link {
  flex-shrink: 0;
}

.cart-drawer__item-image {
  width: 80px;
  height: 96px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  background: var(--muted);
}

.cart-drawer__item-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.cart-drawer__item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}

.cart-drawer__item-title {
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  color: var(--foreground);
}

.cart-drawer__item-variant {
  font-size: 12px;
  color: var(--muted-foreground);
  margin: 0;
}

.cart-drawer__item-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.625rem;
}

.cart-drawer__item-col-left {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.cart-drawer__item-col-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  min-width: 0;
}

.cart-drawer__item-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.cart-drawer__item-quantity {
  display: flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}

.cart-drawer__quantity-btn {
  padding: 0.375rem 0.625rem;
  color: var(--muted-foreground);
  transition: all var(--transition-fast);
}

.cart-drawer__quantity-btn:hover {
  background: var(--muted);
  color: var(--foreground);
}

.cart-drawer__quantity-value {
  padding: 0 0.75rem;
  font-size: 12px;
  font-weight: 700;
}

.cart-drawer__item-price {
  font-size: 14px;
  font-weight: 700;
}

.cart-drawer__item-remove {
  flex-shrink: 0;
  color: var(--muted-foreground);
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color var(--transition-fast);
}

.cart-drawer__item-remove:hover {
  color: var(--destructive);
}

/* Empty State */
.cart-drawer__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  gap: 1.5rem;
  color: var(--muted-foreground);
}

.cart-drawer__empty svg {
  opacity: 0.3;
}

.cart-drawer__empty-text {
  font-size: 14px;
}

/* Upsell — compact, aerisit */
.cart-drawer__upsell {
  padding: 0.875rem 0 0;
  margin-top: 1rem;
  border-top: 1px solid var(--border);
}

.cart-drawer__upsell-product[hidden] {
  display: none !important;
}

.cart-drawer__upsell-label {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--foreground);
  margin: 0 0 0.875rem;
}

.cart-drawer__upsell-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.cart-drawer__upsell-product {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.75rem;
  background: #FAF7F2;
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  transition: border-color var(--transition-fast), background var(--transition-fast);
}

.cart-drawer__upsell-product:hover {
  border-color: rgba(168, 50, 58, 0.2);
}

.cart-drawer__upsell-image-link {
  display: block;
  width: 52px;
  height: 52px;
}

.cart-drawer__upsell-image {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}

.cart-drawer__upsell-info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow: hidden;
}

.cart-drawer__upsell-title {
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0.01em;
  line-height: 1.25;
  color: var(--foreground);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

.cart-drawer__upsell-price {
  display: block;
}

/* Discount — compact */
.cart-drawer__discount {
  padding: 0.375rem 1rem;
}

.cart-drawer__discount-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--muted-foreground);
  cursor: pointer;
  padding: 0.25rem 0;
}

.cart-drawer__discount-toggle svg {
  width: 12px;
  height: 12px;
}

.cart-drawer__discount-form {
  display: flex;
  gap: 0.375rem;
  margin-top: 0;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.25s ease, margin-top 0.25s ease, opacity 0.2s ease;
}

.cart-drawer__discount-form--open {
  max-height: 60px;
  margin-top: 0.375rem;
  opacity: 1;
}

.cart-drawer__discount-input {
  flex: 1;
  min-width: 0;
  border: 1px solid var(--border);
  padding: 0.375rem 0.625rem;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: var(--radius-sm);
  background: transparent;
}

/* Trust — compact, icon inline cu text */
.cart-drawer__trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  padding: 0.5rem 1.25rem;
  background: var(--muted);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.cart-drawer__trust-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  text-align: left;
  min-width: 0;
}

.cart-drawer__trust-item svg {
  width: 11px;
  height: 11px;
  color: var(--primary-dark);
  flex-shrink: 0;
}

.cart-drawer__trust-item span {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  color: var(--muted-foreground);
  line-height: 1.15;
}

/* Footer — compact */
.cart-drawer__footer {
  padding: 0.875rem 1.25rem 1rem;
}

.cart-drawer__subtotal {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.625rem;
}

.cart-drawer__subtotal-label {
  font-size: 13px;
  color: var(--muted-foreground);
}

.cart-drawer__subtotal-price {
  font-size: 17px;
  font-weight: 700;
  color: var(--foreground);
}

.cart-drawer__shipping-note {
  font-size: 10px;
  color: var(--muted-foreground);
  text-align: center;
  margin-bottom: 0.625rem;
}

.cart-drawer__checkout {
  margin-bottom: 0.5rem;
  background: var(--primary);
  color: #fff;
  padding: 0.875rem 1.25rem;
}

.cart-drawer__view-cart {
  display: block;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted-foreground);
  margin-bottom: 0.625rem;
}

.cart-drawer__view-cart:hover {
  color: var(--primary);
}

.cart-drawer__payment-methods {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
}

.cart-drawer__payment-methods svg {
  height: 16px;
  width: auto;
  opacity: 0.45;
}

.cart-drawer__payment-methods img {
  max-height: 24px;
  width: auto;
  object-fit: contain;
  opacity: 0.85;
}
/* ============================================================
   theme-part2.css
   Homepage sections & snippets
   Design tokens defined in theme.css — not redeclared here.
   ============================================================ */

/* ---------------------------------------------------------------
   HERO V2 — Fullwidth image + text overlay
   --------------------------------------------------------------- */

.hero-v2 {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin-top: calc(-1 * var(--header-height, 112px));
}

.hero-v2__bg {
  position: relative;
  width: 100%;
  z-index: 0;
}

.hero-v2__bg-img {
  width: 100%;
  height: 900px;
  object-fit: cover;
  display: block;
}

.hero-v2__bg-img--mobile {
  display: none;
}

@media (max-width: 767px) {
  .hero-v2__bg-img {
    height: 700px;
  }
  .hero-v2__bg-img--desktop {
    display: none;
  }
  .hero-v2__bg-img--mobile {
    display: block;
  }
}

.hero-v2__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  padding-top: var(--header-height, 112px);
}

.hero-v2__content {
  width: 100%;
  padding: 3rem 2rem 3.5rem;
}

.hero-v2__label {
  display: inline-block;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.95);
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 8px rgba(0,0,0,0.4);
}

.hero-v2__title {
  margin: 0 0 1rem;
}

.hero-v2__title-line {
  display: block;
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 3.5rem);
  font-weight: 600;
  line-height: 1.1;
  color: #fff;
  letter-spacing: -0.02em;
  text-shadow: 0 2px 24px rgba(0,0,0,0.7), 0 2px 6px rgba(0,0,0,0.6), 0 0 1px rgba(0,0,0,0.5);
}

.hero-v2__description {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #fff;
  max-width: 32rem;
  margin: 0 0 1.5rem;
  white-space: pre-line;
  text-shadow: 0 1px 12px rgba(0,0,0,0.7), 0 1px 4px rgba(0,0,0,0.55);
}

.hero-v2__cta {
  display: inline-block;
  padding: 1rem 2.5rem;
  background: #fff;
  color: var(--foreground);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  border-radius: var(--radius-sm, 4px);
  transition: all 0.3s ease;
  margin-bottom: 1.5rem;
}

.hero-v2__cta:hover {
  background: var(--primary);
  color: #fff;
}

.hero-v2__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.hero-v2__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.75rem;
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 100px;
  font-size: 0.6875rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  letter-spacing: 0.03em;
}

.hero-v2__badge svg {
  flex-shrink: 0;
  opacity: 0.8;
}

/* Desktop */
@media (min-width: 768px) {
  .hero-v2__content {
    padding: 4rem 5rem 4.5rem;
    max-width: 50%;
  }

  .hero-v2__description {
    font-size: 1rem;
  }
}

@media (min-width: 1024px) {
  .hero-v2__content {
    padding: 10rem 5rem;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .hero-v2__overlay {
    height: 100%;
    align-items: stretch;
  }

  .hero-v2__content {
    padding: 7rem 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    min-height: 100%;
  }

  .hero-v2__title-line {
    font-size: clamp(1.5rem, 7vw, 2.25rem);
    font-weight: 700;
  }

  .hero-v2__description {
    font-size: 0.875rem;
    line-height: 1.6;
    margin-bottom: 1.25rem;
    font-weight: 500;
  }

  .hero-v2__cta {
    padding: 0.875rem 2rem;
    font-size: 0.625rem;
    width: 100%;
    text-align: center;
    margin-top: auto;
  }

  .hero-v2__badges {
    gap: 0.5rem;
  }

  .hero-v2__badge {
    font-size: 0.5625rem;
    padding: 0.25rem 0.625rem;
  }
}

/* ---------------------------------------------------------------
   HERO (legacy)
   --------------------------------------------------------------- */

.hero {
  min-height: 75vh;
  width: 100%;
  overflow: hidden;
  background: #F5F0EC;
  position: relative;
  max-width: 100vw;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, var(--foreground) 1px, transparent 0);
  background-size: 40px 40px;
  opacity: 0.03;
  pointer-events: none;
}

.hero__container {
  display: grid;
  grid-template-columns: 1fr;
  min-height: auto;
  max-width: var(--max-width);
  margin: 0 auto;
  position: relative;
  z-index: 10;
}

.hero__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 5rem 1.5rem 2.5rem;
  order: 2;
}

.hero__label {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 11px;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 1.5rem;
}

.hero__label-dash {
  width: 32px;
  height: 1px;
  background: var(--primary);
}

.hero__title {
  margin-bottom: 1.5rem;
}

.hero__title-line {
  display: block;
  font-size: clamp(2.25rem, 5.5vw, 5.5rem);
  letter-spacing: -0.02em;
  line-height: 0.95;
  font-family: var(--font-heading);
  font-weight: 500;
}

.hero__title-line--italic {
  font-style: italic;
  color: var(--primary);
}

.hero__description {
  font-size: 14px;
  color: var(--muted-foreground);
  max-width: 28rem;
  line-height: 1.8;
  letter-spacing: 0.02em;
  margin-bottom: 2rem;
}

.hero__ctas {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: stretch;
  margin-bottom: 2.5rem;
}

.hero__btn--primary {
  background: var(--foreground);
  color: var(--background);
  padding: 1rem 2.5rem;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  border-radius: var(--radius-sm);
  transition: all var(--transition-slow);
  display: block;
  text-align: center;
  box-sizing: border-box;
}

.hero__btn--primary:hover {
  background: var(--primary);
}

.hero__btn--secondary {
  display: block;
  text-align: center;
  padding: 1rem 2.5rem;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  border-radius: var(--radius-sm);
  border: 1px solid var(--foreground);
  color: var(--foreground);
  background: transparent;
  transition: all var(--transition-slow);
  box-sizing: border-box;
}

.hero__btn--secondary:hover {
  background: var(--foreground);
  color: var(--background);
}

.hero__btn--play {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--foreground);
  width: 100%;
  box-sizing: border-box;
}

.hero__play-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(61, 56, 52, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-slow);
}

.hero__play-icon svg {
  width: 13px;
  height: 13px;
}

.hero__btn--play:hover .hero__play-icon {
  border-color: var(--primary);
  background: rgba(201, 167, 160, 0.05);
}

/* Social proof */

.hero__social-proof {
  border-top: 1px solid rgba(61, 56, 52, 0.1);
  padding-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.hero__avatars {
  display: flex;
}

.hero__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--accent);
  border: 2.5px solid #F5F0EC;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 700;
  color: rgba(61, 56, 52, 0.6);
  margin-left: -10px;
}

.hero__avatar:first-child {
  margin-left: 0;
}

.hero__avatar--img {
  padding: 0;
  overflow: hidden;
  background: none;
}

.hero__avatar--img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}

.hero__proof-text {}

.hero__stars {
  display: flex;
  gap: 1px;
  color: var(--star);
  margin-bottom: 2px;
}

.hero__stars svg {
  width: 11px;
  height: 11px;
  fill: currentColor;
}

.hero__proof-text span {
  font-size: 10px;
  color: var(--muted-foreground);
}

/* Countdown */

.hero__countdown {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.hero__countdown-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.hero__countdown-number {
  background: rgba(61, 56, 52, 0.1);
  backdrop-filter: blur(4px);
  padding: 0.375rem 0.75rem;
  min-width: 44px;
  text-align: center;
  border-radius: 2px;
}

.hero__countdown-number span:first-child {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}

.hero__countdown-number span:last-child {
  display: block;
  font-size: 7px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
  margin-top: 2px;
}

.hero__countdown-separator {
  color: rgba(61, 56, 52, 0.3);
  font-size: 18px;
}

/* Hero visual */

.hero__visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  order: 1;
  min-height: 40vh;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(212, 197, 185, 0.4), rgba(237, 232, 227, 0.6), rgba(201, 167, 160, 0.2));
}

.hero__circle {
  position: relative;
  width: 100%;
  max-width: 32rem;
  aspect-ratio: 1;
  margin: 2rem;
}

.hero__circle--decorative {
  position: absolute;
  inset: -30px;
  border: 1px solid rgba(201, 167, 160, 0.1);
  border-radius: 50%;
  pointer-events: none;
  animation: heroRotate 60s linear infinite;
}

.hero__circle--decorative-2 {
  position: absolute;
  inset: -60px;
  border: 1px dashed rgba(212, 197, 185, 0.2);
  border-radius: 50%;
  pointer-events: none;
  animation: heroRotate 80s linear infinite reverse;
}

.hero__product {
  position: absolute;
  border-radius: 50%;
  overflow: hidden;
}

.hero__product img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero__product--center {
  width: 224px;
  height: 224px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  box-shadow: var(--shadow-xl);
  border: 4px solid rgba(255, 255, 255, 0.5);
}

.hero__product--left {
  width: 112px;
  height: 112px;
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(-16px);
  z-index: 10;
  opacity: 0.8;
  box-shadow: var(--shadow-lg);
  animation: heroFloat 5s ease-in-out infinite;
}

.hero__product--left:hover {
  opacity: 1;
}

.hero__product--right {
  width: 112px;
  height: 112px;
  right: 0;
  top: 50%;
  transform: translateY(-50%) translateX(16px);
  z-index: 10;
  opacity: 0.8;
  box-shadow: var(--shadow-lg);
  animation: heroFloat 4.5s ease-in-out infinite 1s;
}

.hero__product--right:hover {
  opacity: 1;
}

/* Hero badges */

.hero__badge {
  position: absolute;
  z-index: 20;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  box-shadow: var(--shadow-lg);
  padding: 1rem;
  border-radius: var(--radius);
  display: none;
}

.hero__badge--bottom {
  bottom: 2rem;
  left: 2rem;
}

.hero__badge--top {
  top: 8rem;
  right: 2rem;
}

.hero__badge svg {
  width: 36px;
  height: 36px;
  padding: 8px;
  border-radius: 50%;
  background: rgba(201, 167, 160, 0.15);
  color: var(--primary);
}

.hero__badge p:first-of-type {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
}

.hero__badge p:last-of-type {
  font-size: 9px;
  color: var(--muted-foreground);
}

/* Hero responsive - mobile first overrides */

@media (max-width: 639px) {
  .hero {
    min-height: auto;
    padding-top: 0;
  }

  .hero__content {
    padding: 2rem 1.25rem 2rem;
    text-align: center;
    align-items: center;
  }

  .hero__title {
    margin-bottom: 1rem;
  }

  .hero__title-line {
    font-size: clamp(2.25rem, 9vw, 3rem);
  }

  .hero__description {
    font-size: 13px;
    line-height: 1.65;
    margin-bottom: 1.25rem;
    max-width: 32ch;
  }

  .hero__label {
    font-size: 9px;
    letter-spacing: 0.2em;
    margin-bottom: 1rem;
    justify-content: center;
  }

  .hero__ctas {
    margin-bottom: 1.5rem;
    justify-content: center;
  }

  .hero__btn--primary {
    padding: 0.75rem 1.75rem;
    font-size: 0.8125rem;
  }

  .hero__visual {
    min-height: 45vh;
    max-height: 50vh;
    padding-top: var(--header-height, 112px);
  }

  .hero__visual img {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }

  .hero__social-proof {
    justify-content: center;
  }

  .hero__product--center {
    width: 180px;
    height: 180px;
    top: 60%;
  }

  .hero__product--left {
    width: 90px;
    height: 90px;
    left: 10%;
    top: 60%;
    transform: translateY(-50%);
  }

  .hero__product--right {
    width: 90px;
    height: 90px;
    right: 3%;
    top: 60%;
    transform: translateY(-50%);
  }

  .hero__countdown {
    gap: 0.375rem;
  }

  .hero__countdown-number {
    min-width: 38px;
    padding: 0.25rem 0.5rem;
    font-size: 16px;
  }

  .hero__countdown-separator {
    font-size: 15px;
  }

  .hero__countdown-label {
    font-size: 8px;
  }

  .hero__social-proof {
    padding-top: 1.5rem;
    gap: 1rem;
  }

  .hero__avatar {
    width: 32px;
    height: 32px;
    font-size: 8px;
  }

  .hero__proof-text span {
    font-size: 11px;
  }
}

@media (min-width: 640px) {
  .hero__ctas {
    flex-direction: row;
    align-items: center;
  }

  .hero__btn--primary {
    display: inline-block;
    width: auto;
  }

  .hero__btn--play {
    width: auto;
    justify-content: flex-start;
  }

  .hero__social-proof {
    flex-direction: row;
    align-items: center;
    gap: 1.5rem;
  }

  .hero__content {
    padding: 7rem 2.5rem 3rem;
  }

  .hero__description {
    font-size: 15px;
  }

  .hero__title {
    margin-bottom: 2rem;
  }
}

@media (min-width: 768px) {
  .hero {
    min-height: 85vh;
  }

  .hero__circle--decorative {
    inset: -50px;
  }

  .hero__circle--decorative-2 {
    inset: -90px;
  }

  .hero__product--center {
    width: 288px;
    height: 288px;
  }

  .hero__product--left {
    width: 144px;
    height: 144px;
    transform: translateY(-50%) translateX(-32px);
  }

  .hero__product--right {
    width: 144px;
    height: 144px;
    transform: translateY(-50%) translateX(32px);
  }

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

@media (min-width: 1024px) {
  .hero {
    min-height: 100vh;
  }

  .hero__container {
    grid-template-columns: 1fr 1fr;
    min-height: 100vh;
  }

  .hero__content {
    padding: 10rem 5rem 5rem 7rem;
    order: 1;
  }

  .hero__title {
    margin-bottom: 2.5rem;
  }

  .hero__description {
    margin-bottom: 2.5rem;
  }

  .hero__ctas {
    margin-bottom: 3.5rem;
  }

  .hero__visual {
    order: 2;
    min-height: 100vh;
  }

  .hero__badge--bottom {
    bottom: 3rem;
    left: 3rem;
  }

  .hero__badge--top {
    top: 9rem;
    right: 3rem;
  }
}


/* ---------------------------------------------------------------
   MARQUEE
   --------------------------------------------------------------- */

.marquee {
  padding: 1.25rem 0;
  background: var(--muted);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}

.marquee__track {
  display: flex;
  animation: marqueeScroll var(--marquee-speed, 40s) linear infinite;
  white-space: nowrap;
}

.marquee__inner {
  display: flex;
  align-items: center;
  gap: 3rem;
  flex-shrink: 0;
  padding-right: 3rem;
}

.marquee__item {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.marquee__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(201, 167, 160, 0.4);
  flex-shrink: 0;
}


/* ---------------------------------------------------------------
   PRESS
   --------------------------------------------------------------- */

.press {
  padding: var(--section-py) 0;
  background: var(--background);
  border-bottom: 1px solid var(--border);
}

.press__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

.press__label {
  text-align: center;
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  margin-bottom: 2.5rem;
}

.press__logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  opacity: 0.25;
  transition: opacity 0.7s;
}

.press__logos:hover {
  opacity: 0.5;
}

.press__logo {
  font-family: var(--font-heading);
  font-size: 18px;
  letter-spacing: 0.1em;
  color: var(--foreground);
  cursor: default;
}

.press__logo-image {
  height: 24px;
  width: auto;
  object-fit: contain;
}

@media (min-width: 768px) {
  .press__container {
    padding: 0 var(--section-px-md);
  }

  .press__logos {
    justify-content: space-between;
    gap: 3rem;
  }

  .press__logo {
    font-size: 24px;
  }

  .press__logo-image {
    height: 32px;
  }
}


/* ---------------------------------------------------------------
   STATS BAR
   --------------------------------------------------------------- */

.stats-bar {
  padding: var(--section-py) 0;
  background: rgba(212, 197, 185, 0.3);
}

.stats-bar__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
}

.stats-bar__item {
  text-align: center;
}

.stats-bar__icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(196, 160, 130, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  margin: 0 auto 0.75rem;
}

.stats-bar__icon svg {
  width: 22px;
  height: 22px;
}

.stats-bar__number {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  margin-bottom: 0.25rem;
}

.stats-bar__label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted-foreground);
}

@media (min-width: 768px) {
  .stats-bar__container {
    grid-template-columns: repeat(4, 1fr);
    padding: 0 var(--section-px-md);
  }

  .stats-bar__number {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
  }
}


/* ---------------------------------------------------------------
   VALUE PROPS
   --------------------------------------------------------------- */

.value-props {
  padding: var(--section-py) 0;
  background: var(--background);
}

.value-props__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

.value-props__header {
  text-align: center;
  margin-bottom: 4rem;
}

.value-props__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 0.75rem;
  display: block;
}

.value-props__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 3rem);
  letter-spacing: -0.01em;
}

.value-props__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.value-props__card {
  text-align: left;
}

.value-props__icon-wrap {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(196, 160, 130, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  margin: 0 auto 1.5rem;
  transition: all var(--transition-slow);
}

.value-props__icon-wrap:hover {
  background: var(--primary);
  color: white;
}

.value-props__icon-wrap svg {
  width: 28px;
  height: 28px;
  stroke-width: 1;
  color: var(--primary);
}

.value-props__card-title {
  font-family: var(--font-heading);
  font-size: clamp(1.125rem, 2vw, 1.375rem);
  font-weight: 400;
  margin-bottom: 1rem;
}

.value-props__card-text {
  color: var(--muted-foreground);
  font-size: 14px;
  line-height: 1.7;
}

@media (min-width: 768px) {
  .value-props__container {
    padding: 0 var(--section-px-md);
  }

  .value-props__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 4rem;
  }

  .value-props__card {
    text-align: left;
  }

  .value-props__icon-wrap {
    margin: 0 0 1.5rem;
  }
}


/* ---------------------------------------------------------------
   FEATURED PRODUCTS
   --------------------------------------------------------------- */

.featured-products {
  padding: var(--section-py) 0;
  background: var(--muted);
  overflow: hidden;
}

.featured-products__container {
  max-width: var(--max-width);
  margin: 0 auto;
}

.featured-products__header {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 0 var(--section-px) 4rem;
}

.featured-products__header-text {}

.featured-products__label {
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 0.5rem;
}

.featured-products__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 5vw, 3.75rem);
  letter-spacing: -0.01em;
}

.featured-products__link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-bottom: 1px solid var(--foreground);
  padding-bottom: 0.25rem;
  transition: all var(--transition-base);
}

.featured-products__link:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.featured-products__link svg {
  width: 14px;
  height: 14px;
}

.featured-products__scroll {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  padding: 0 var(--section-px) 3rem;
  scroll-snap-type: x mandatory;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.featured-products__scroll::-webkit-scrollbar {
  display: none;
}

.featured-products__card {
  min-width: 320px;
  flex: 0 0 calc(33.333% - 1.333rem);
  scroll-snap-align: start;
  transition: transform 0.3s;
}

.featured-products__card:hover {
  transform: translateY(-8px);
}

@media (min-width: 768px) {
  .featured-products__header {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0 var(--section-px-md) 4rem;
  }

  .featured-products__scroll {
    gap: 2rem;
    padding: 0 var(--section-px-md) 3rem;
  }

  .featured-products__card {
    min-width: 380px;
  }
}


/* ---------------------------------------------------------------
   SPLIT LIFESTYLE
   --------------------------------------------------------------- */

.split-lifestyle {}

.split-lifestyle__container {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 80vh;
}

.split-lifestyle__image-col {
  position: relative;
  overflow: hidden;
  min-height: 400px;
}

.split-lifestyle__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.split-lifestyle__image-placeholder {
  width: 100%;
  height: 100%;
  background: var(--muted);
}

.split-lifestyle__content-col {
  background: var(--foreground);
  color: var(--background);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem;
}

.split-lifestyle__content {
  max-width: 32rem;
}

.split-lifestyle__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(250, 249, 247, 0.4);
  display: block;
  margin-bottom: 1.5rem;
}

.split-lifestyle__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 3rem);
  letter-spacing: -0.01em;
  margin-bottom: 1.5rem;
  line-height: 1.15;
  color: var(--background);
}

.split-lifestyle__text {
  color: rgba(250, 249, 247, 0.6);
  line-height: 1.7;
  margin-bottom: 2rem;
}

.split-lifestyle__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.split-lifestyle__stat {
  text-align: center;
  border: 1px solid rgba(250, 249, 247, 0.2);
  padding: 1.25rem 0.75rem;
  border-radius: var(--radius-sm);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

.split-lifestyle__stat-number {
  display: block;
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--background);
  line-height: 1.2;
}

.split-lifestyle__stat-label {
  display: block;
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: rgba(250, 249, 247, 0.6);
}

.split-lifestyle__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--primary);
  border-bottom: 1px solid var(--primary);
  padding-bottom: 0.25rem;
}

@media (min-width: 768px) {
  .split-lifestyle__container {
    grid-template-columns: 1fr 1fr;
  }

  .split-lifestyle__content-col {
    padding: 6rem;
  }
}


/* ---------------------------------------------------------------
   RITUAL BENEFITS
   --------------------------------------------------------------- */

.ritual-benefits {}

.ritual-benefits__container {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 80vh;
}

.ritual-benefits__image-col {
  position: relative;
  overflow: hidden;
  min-height: 400px;
  background: var(--muted);
}

.ritual-benefits__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ritual-benefits__image-placeholder {
  width: 100%;
  height: 100%;
  background: var(--muted);
}

.ritual-benefits__content-col {
  background: var(--foreground);
  color: var(--background);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem;
}

.ritual-benefits__content {
  max-width: 32rem;
}

.ritual-benefits__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(250, 249, 247, 0.4);
  display: block;
  margin-bottom: 1.5rem;
}

.ritual-benefits__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 3rem);
  font-style: italic;
  letter-spacing: -0.01em;
  margin-bottom: 1.5rem;
  line-height: 1.15;
  color: var(--background);
}

.ritual-benefits__text {
  color: rgba(250, 249, 247, 0.6);
  line-height: 1.7;
  margin-bottom: 2.5rem;
}

.ritual-benefits__list {
  list-style: none;
  padding: 0;
  margin: 0 0 2.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.ritual-benefits__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: rgba(250, 249, 247, 0.75);
  font-size: 0.9375rem;
  line-height: 1.5;
}

.ritual-benefits__check {
  flex-shrink: 0;
  color: rgba(250, 249, 247, 0.35);
}

.ritual-benefits__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--primary);
  border-bottom: 1px solid var(--primary);
  padding-bottom: 0.25rem;
}

@media (min-width: 768px) {
  .ritual-benefits__container {
    grid-template-columns: 1fr 1fr;
  }

  .ritual-benefits__content-col {
    padding: 6rem;
  }
}


/* ---------------------------------------------------------------
   COMPARISON TABLE
   --------------------------------------------------------------- */

.comparison-table {
  padding: 5rem 1.5rem;
  background: var(--background);
}

.comparison-table__wrapper {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.comparison-table__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 1rem;
}

.comparison-table__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-bottom: 1rem;
  color: var(--foreground);
}

.comparison-table__subtitle {
  color: var(--text-muted);
  line-height: 1.6;
  margin-bottom: 3rem;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.comparison-table__table-wrap {
  overflow-x: auto;
  margin-bottom: 1.5rem;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 1px 12px rgba(0,0,0,0.04);
  border: 1px solid var(--border, #e8e4df);
}

.comparison-table__table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 0.9375rem;
}

.comparison-table__table thead th {
  font-size: 0.6875rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 1.25rem 2rem;
  border-bottom: 1px solid var(--border, #e8e4df);
  font-weight: 500;
  color: var(--text-muted);
  background: var(--muted, #faf8f5);
}

.comparison-table__table thead th:first-child {
  border-radius: 16px 0 0 0;
}

.comparison-table__table thead th:last-child {
  border-radius: 0 16px 0 0;
}

.comparison-table__col-ours {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  color: var(--primary) !important;
}

.comparison-table__col-other {
  text-align: center;
}

.comparison-table__table tbody td {
  padding: 1.25rem 2rem;
  border-bottom: 1px solid var(--border, #e8e4df);
  vertical-align: middle;
}

.comparison-table__table tbody tr:last-child td {
  border-bottom: none;
}

.comparison-table__table tbody tr:last-child td:first-child {
  border-radius: 0 0 0 16px;
}

.comparison-table__table tbody tr:last-child td:last-child {
  border-radius: 0 0 16px 0;
}

.comparison-table__x {
  color: #dc2626;
  font-size: 1.125rem;
  font-weight: 400;
}

.comparison-table__checkmark--muted {
  color: var(--muted-foreground);
}

.comparison-table__feature {
  font-weight: 600;
  color: var(--foreground);
}

.comparison-table__ours {
  text-align: center;
  color: var(--foreground);
}

.comparison-table__ours-text,
.comparison-table__other-text {
  display: block;
  font-size: 0.8125rem;
  margin-top: 0.25rem;
}

.comparison-table__checkmark {
  color: #16a34a;
  vertical-align: middle;
}

.comparison-table__other {
  text-align: center;
  color: var(--text-muted);
}

.comparison-table__footnote {
  font-size: 0.8125rem;
  color: var(--text-muted);
  text-align: center;
  margin-top: 1.5rem;
  font-style: italic;
}

@media (max-width: 639px) {
  .comparison-table {
    padding: 3rem 1rem;
  }

  .comparison-table__wrapper {
    max-width: 100%;
  }

  .comparison-table__title {
    font-size: 1.375rem;
    margin-bottom: 0.75rem;
  }

  .comparison-table__subtitle {
    font-size: 0.8125rem;
    margin-bottom: 2rem;
  }

  .comparison-table__table-wrap {
    border-radius: 12px;
  }

  .comparison-table__table {
    font-size: 0.75rem;
  }

  .comparison-table__table thead th {
    font-size: 0.5625rem;
    padding: 0.75rem 0.625rem;
    letter-spacing: 0.12em;
  }

  .comparison-table__table thead th:first-child {
    border-radius: 12px 0 0 0;
  }

  .comparison-table__table thead th:last-child {
    border-radius: 0 12px 0 0;
  }

  .comparison-table__table {
    font-size: 0.6875rem;
    table-layout: fixed;
  }

  .comparison-table__table thead th {
    font-size: 0.5rem;
    padding: 0.625rem 0.375rem;
    letter-spacing: 0.1em;
    text-align: center;
    vertical-align: bottom;
  }

  .comparison-table__table thead th:first-child {
    text-align: left;
    border-radius: 12px 0 0 0;
  }

  .comparison-table__table thead th:last-child {
    border-radius: 0 12px 0 0;
  }

  .comparison-table__table tbody td {
    padding: 0.625rem 0.375rem;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid var(--border, #e8e4df);
  }

  .comparison-table__table tbody td:first-child {
    text-align: left;
  }

  .comparison-table__col-ours {
    background: rgba(196, 160, 130, 0.1);
  }

  .comparison-table__table thead th:nth-child(2) {
    background: rgba(196, 160, 130, 0.15);
  }

  .comparison-table__table tbody td:nth-child(2) {
    background: rgba(196, 160, 130, 0.08);
  }

  .comparison-table__feature {
    font-size: 0.6875rem;
    white-space: normal;
    line-height: 1.3;
  }

  .comparison-table__ours-text,
  .comparison-table__other-text {
    display: none;
  }

  .comparison-table__footnote {
    font-size: 0.6875rem;
    padding: 0 0.5rem;
  }

  .comparison-table__table tbody tr:last-child td {
    border-bottom: none;
  }

  .comparison-table__table tbody tr:last-child td:first-child {
    border-radius: 0 0 0 12px;
  }

  .comparison-table__table tbody tr:last-child td:last-child {
    border-radius: 0 0 12px 0;
  }
}

@media (min-width: 768px) {
  .comparison-table {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   FAQ
   --------------------------------------------------------------- */

.faq {
  padding: 5rem 1.5rem;
  background: var(--background);
}

.faq__wrapper {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
}

.faq__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 1rem;
}

.faq__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-bottom: 3rem;
  color: var(--foreground);
}

.faq__accordion {
  text-align: left;
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  overflow: hidden;
}

.faq__item {
  border-bottom: 1px solid var(--border);
}

.faq__item:last-child {
  border-bottom: none;
}

.faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  cursor: pointer;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--foreground);
  list-style: none;
  -webkit-user-select: none;
  user-select: none;
}

.faq__question::-webkit-details-marker {
  display: none;
}

.faq__question::marker {
  display: none;
  content: '';
}

.faq__chevron {
  flex-shrink: 0;
  color: var(--text-muted);
  transition: transform 0.25s ease;
}

.faq__item[open] .faq__chevron {
  transform: rotate(180deg);
}

.faq__answer {
  padding: 0 1.5rem 1.25rem;
  color: var(--text-muted);
  line-height: 1.7;
  font-size: 0.9375rem;
}

.faq__answer p {
  margin: 0;
}

@media (max-width: 749px) {
  .faq {
    padding: 3rem 24px;
  }

  .faq__title {
    font-size: 1.5rem;
    margin-bottom: 2rem;
  }

  .faq__question {
    padding: 1rem 1.125rem;
    font-size: 0.875rem;
    min-height: 48px;
  }

  .faq__answer {
    padding: 0 1.125rem 1rem;
    font-size: 0.875rem;
    line-height: 1.65;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .faq {
    padding: 5rem 2rem;
  }
}

@media (min-width: 990px) {
  .faq {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   TESTIMONIAL PARALLAX
   --------------------------------------------------------------- */

.testimonial-parallax {
  position: relative;
  padding: var(--section-py-lg) 0;
  background: var(--foreground);
  color: var(--background);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.testimonial-parallax__bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.15;
}

.testimonial-parallax__container {
  position: relative;
  z-index: 10;
  text-align: center;
  max-width: 56rem;
  padding: 0 var(--section-px);
}

.testimonial-parallax__stars {
  display: flex;
  justify-content: center;
  gap: 2px;
  margin-bottom: 1.5rem;
  color: var(--star);
}

.testimonial-parallax__stars svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.testimonial-parallax__quote {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 3rem);
  line-height: 1.4;
  font-style: italic;
  margin-bottom: 2rem;
  color: var(--background);
}

.testimonial-parallax__attribution {}

.testimonial-parallax__name {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-bottom: 0.25rem;
  color: var(--background);
}

.testimonial-parallax__role {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: rgba(250, 249, 247, 0.5);
}

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

  .testimonial-parallax__container {
    padding: 0 24px;
    max-width: 100%;
  }

  .testimonial-parallax__quote {
    font-size: 1.25rem;
    line-height: 1.5;
  }

  .testimonial-parallax__quote p {
    margin: 0;
  }

  .testimonial-parallax__stars svg {
    width: 16px;
    height: 16px;
  }

  .testimonial-parallax__name {
    font-size: 12px;
  }

  .testimonial-parallax__role {
    font-size: 11px;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .testimonial-parallax {
    padding: 8rem 0;
  }

  .testimonial-parallax__container {
    padding: 0 2.5rem;
  }

  .testimonial-parallax__quote {
    font-size: clamp(1.5rem, 3vw, 2.25rem);
  }
}

@media (min-width: 990px) {
  .testimonial-parallax {
    padding: 12rem 0;
  }
}


/* ---------------------------------------------------------------
   REVIEWS GRID
   --------------------------------------------------------------- */

.reviews-grid {
  padding: var(--section-py) 0;
  background: var(--background);
}

.reviews-grid__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

.reviews-grid__header {
  text-align: center;
  margin-bottom: 4rem;
}

.reviews-grid__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 0.75rem;
}

.reviews-grid__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 3rem);
  margin-bottom: 1rem;
}

.reviews-grid__overall {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.reviews-grid__overall-stars {
  display: flex;
  color: var(--star);
}

.reviews-grid__overall-stars svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.reviews-grid__overall-text {
  font-size: 14px;
  color: var(--muted-foreground);
}

.reviews-grid__carousel-wrap {
  position: relative;
}

.reviews-grid__grid {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 0.5rem;
}

.reviews-grid__grid::-webkit-scrollbar {
  display: none;
}

.reviews-grid__grid > *,
.reviews-grid__grid > div {
  flex: 0 0 calc(33.333% - 1rem);
  min-width: 300px;
  scroll-snap-align: start;
}

.reviews-grid__nav {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 2rem;
}

.reviews-grid__nav-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1.5px solid var(--border, #e0dcd7);
  background: transparent;
  color: var(--foreground);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.2s, background 0.2s;
}

.reviews-grid__nav-btn:hover {
  border-color: var(--primary);
  background: var(--primary);
  color: #fff;
}

.reviews-grid__card {
  border: 1px solid var(--border);
  padding: 2rem;
  border-radius: var(--radius-sm);
  background: var(--card);
  transition: border-color var(--transition-base);
}

.reviews-grid__card:hover {
  border-color: rgba(201, 167, 160, 0.3);
}

.reviews-grid__card-stars {
  display: flex;
  gap: 1px;
  margin-bottom: 1rem;
  color: var(--star);
}

.reviews-grid__card-stars svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.reviews-grid__card-text {
  font-size: 14px;
  font-style: italic;
  color: var(--muted-foreground);
  line-height: 1.7;
  margin-bottom: 1.5rem;
  overflow-wrap: break-word;
  word-break: break-word;
}

.reviews-grid__card-author {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.reviews-grid__card-name {
  font-size: 14px;
  font-weight: 700;
}

.reviews-grid__card-location {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
}

.reviews-grid__card-badge {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--success);
  background: rgba(74, 124, 89, 0.08);
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.reviews-grid__card-badge svg {
  width: 10px;
  height: 10px;
}

@media (max-width: 749px) {
  .reviews-grid {
    padding: 3rem 0;
  }

  .reviews-grid__container {
    padding: 0 24px;
  }

  .reviews-grid__header {
    margin-bottom: 2.5rem;
  }

  .reviews-grid__title {
    font-size: 1.5rem;
  }

  .reviews-grid__overall {
    flex-direction: column;
    gap: 0.5rem;
  }

  .reviews-grid__overall-text {
    font-size: 13px;
    text-align: center;
  }

  .reviews-grid__grid > *,
  .reviews-grid__grid > div {
    flex: 0 0 85%;
    min-width: 280px;
  }

  .reviews-grid__card {
    padding: 1.5rem;
  }

  .reviews-grid__card-text {
    font-size: 13px;
    margin-bottom: 1rem;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .reviews-grid__container {
    padding: 0 2.5rem;
  }

  .reviews-grid__grid > *,
  .reviews-grid__grid > div {
    flex: 0 0 calc(50% - 0.75rem);
    min-width: 300px;
  }
}

@media (min-width: 990px) {
  .reviews-grid__container {
    padding: 0 var(--section-px-md);
  }

  .reviews-grid__grid > *,
  .reviews-grid__grid > div {
    flex: 0 0 calc(33.333% - 1rem);
  }
}


/* ---------------------------------------------------------------
   HOW IT WORKS
   --------------------------------------------------------------- */

.how-it-works {
  padding: var(--section-py) 0;
  background: var(--muted);
}

.how-it-works__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

.how-it-works__header {
  text-align: center;
  margin-bottom: 4rem;
}

.how-it-works__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 0.75rem;
}

.how-it-works__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 3rem);
}

.how-it-works__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.how-it-works__card {}

.how-it-works__image-wrap {
  position: relative;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: rgba(212, 197, 185, 0.3);
  margin-bottom: 1.5rem;
  border-radius: var(--radius-sm);
}

.how-it-works__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s;
}

.how-it-works__card:hover .how-it-works__image {
  transform: scale(1.05);
}

.how-it-works__image-placeholder {
  width: 100%;
  height: 100%;
  background: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-foreground);
  font-size: 14px;
}

.how-it-works__step-number {
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--primary);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
}

.how-it-works__card-title {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  margin-bottom: 0.75rem;
}

.how-it-works__card-text {
  color: var(--muted-foreground);
  font-size: 14px;
  line-height: 1.7;
}

@media (min-width: 768px) {
  .how-it-works__container {
    padding: 0 var(--section-px-md);
  }

  .how-it-works__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
  }
}


/* ---------------------------------------------------------------
   UGC GRID
   --------------------------------------------------------------- */

.ugc-grid {
  padding: var(--section-py) 0;
  background: var(--background);
}

.ugc-grid__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
}

.ugc-grid__header {
  text-align: center;
  margin-bottom: 4rem;
}

.ugc-grid__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 0.75rem;
}

.ugc-grid__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 3rem);
  margin-bottom: 1rem;
}

.ugc-grid__subtitle {
  font-size: 14px;
  color: var(--muted-foreground);
}

.ugc-grid__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

.ugc-grid__item {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1;
  border-radius: var(--radius-sm);
  cursor: pointer;
}

.ugc-grid__item--featured {
  grid-column: span 2;
  grid-row: span 2;
  aspect-ratio: auto;
}

.ugc-grid__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s;
}

.ugc-grid__item:hover .ugc-grid__image {
  transform: scale(1.1);
}

.ugc-grid__image-placeholder {
  width: 100%;
  height: 100%;
  background: var(--accent);
}

.ugc-grid__overlay {
  position: absolute;
  inset: 0;
  background: rgba(61, 56, 52, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s;
}

.ugc-grid__item:hover .ugc-grid__overlay {
  opacity: 1;
}

.ugc-grid__handle {
  color: white;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  font-size: 12px;
}

@media (min-width: 768px) {
  .ugc-grid__container {
    padding: 0 var(--section-px-md);
  }

  .ugc-grid__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
  }
}


/* ---------------------------------------------------------------
   GUARANTEE
   --------------------------------------------------------------- */

.guarantee {
  padding: 5rem 1.5rem;
  background: var(--foreground);
  color: var(--background);
}

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

.guarantee__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(250, 249, 247, 0.4);
  display: block;
  margin-bottom: 1rem;
}

.guarantee__heading {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  letter-spacing: -0.01em;
  line-height: 1.2;
  color: var(--background);
}

.guarantee__container {
  max-width: var(--max-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.guarantee__item {
  text-align: center;
}

.guarantee__icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(250, 249, 247, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
}

.guarantee__icon svg {
  width: 24px;
  height: 24px;
  stroke-width: 1.5;
  color: rgba(250, 249, 247, 0.6);
}

.guarantee__title {
  display: block;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-bottom: 0.75rem;
  color: var(--background);
  font-weight: 700;
}

.guarantee__desc {
  display: block;
  font-size: 0.875rem;
  color: rgba(250, 249, 247, 0.45);
  line-height: 1.7;
  max-width: 22rem;
  margin: 0 auto;
}

.guarantee__payments {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  margin-top: 3.5rem;
  padding-top: 2rem;
}

.guarantee__payments span {
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(250, 249, 247, 0.3);
}

@media (min-width: 768px) {
  .guarantee {
    padding: 7rem 2rem;
  }

  .guarantee__container {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* ---------------------------------------------------------------
   NEWSLETTER
   --------------------------------------------------------------- */

.newsletter {
  background: var(--background);
}

.newsletter__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 5rem var(--section-px);
}

.newsletter__content {
  max-width: 42rem;
  margin: 0 auto;
  text-align: center;
}

.newsletter__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  margin-bottom: 1rem;
  letter-spacing: -0.01em;
}

.newsletter__text {
  font-size: 0.9375rem;
  color: var(--muted-foreground);
  line-height: 1.6;
  margin-bottom: 2.5rem;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

.newsletter__error {
  color: var(--destructive);
  font-size: 14px;
  margin-bottom: 1rem;
}

.newsletter__success {
  color: var(--primary);
  font-size: 14px;
  margin-bottom: 1rem;
  font-weight: 700;
}

.newsletter__form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-width: 34rem;
  margin: 0 auto;
}

.newsletter__input {
  flex: 1;
  border: 1px solid var(--border);
  padding: 1rem 1.5rem;
  font-size: 14px;
  background: var(--card);
  border-radius: var(--radius-sm);
  outline: none;
  transition: border-color var(--transition-base);
}

.newsletter__input:focus {
  border-color: var(--primary);
}

.newsletter__btn {
  background: var(--primary);
  color: white;
  padding: 1rem 2.5rem;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-radius: var(--radius-sm);
  white-space: nowrap;
  cursor: pointer;
  border: none;
  transition: background var(--transition-base);
}

.newsletter__btn:hover {
  background: rgba(201, 167, 160, 0.9);
}

.newsletter__privacy {
  font-size: 11px;
  color: var(--muted-foreground);
  margin-top: 1.25rem;
}

.newsletter__trust-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem 2.5rem;
  padding: 1.5rem 1.5rem;
  border-top: 1px solid var(--border);
}

.newsletter__trust-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.newsletter__trust-item svg {
  color: var(--muted-foreground);
  flex-shrink: 0;
}

.newsletter__trust-item span {
  font-size: 10px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--foreground);
}

@media (min-width: 640px) {
  .newsletter__form {
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .newsletter__container {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   PRODUCT CARD
   --------------------------------------------------------------- */

.product-card {
  position: relative;
}

.product-card__image-wrap {
  position: relative;
  aspect-ratio: 3/4;
  overflow: hidden;
  background: #F0EBE5;
  margin-bottom: 1rem;
  border-radius: 0.375rem;
}

.product-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (hover: hover) and (pointer: fine) {
  .product-card:hover .product-card__image {
    transform: scale(1.05);
  }
}

.product-card__image--hover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.5s ease;
}

@media (hover: hover) and (pointer: fine) {
  .product-card:hover .product-card__image--hover {
    opacity: 1;
  }
}

.product-card__badges {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.375rem;
  z-index: 2;
  max-width: calc(100% - 1.5rem);
}

.product-card__badge {
  display: inline-block;
  padding: 0.375rem 0.75rem;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--foreground);
  border-radius: 0.25rem;
  line-height: 1;
}

.product-card__badge--sale {
  background: var(--destructive);
  color: #fff;
}

.product-card__badge--soldout {
  background: var(--foreground);
  color: #fff;
  opacity: 0.85;
}

.product-card__badge--bestseller {
  background: #C0392B;
  color: #fff;
}

.product-card__badge--nou {
  background: #4A5043;
  color: #fff;
}

.product-card__badge--favorit {
  background: #C97B63;
  color: #fff;
}

.product-card__badge--esential {
  background: #3D3834;
  color: #fff;
}

.product-card__badge--editie-limitata {
  background: #C0392B;
  color: #fff;
}

.product-card__badge--premium {
  background: #C28B2D;
  color: #fff;
}

.product-card__badge--stoc-limitat {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  color: var(--foreground);
  border: 1px solid var(--border);
}

/* --- Color swatch (top-right) --- */
.product-card__swatch {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 3;
  width: auto;
  height: auto;
  border-radius: 0;
  border: none;
  cursor: default;
}

.product-card__swatch-dot {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.8);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

/* --- Viewers --- */
.product-card__viewers {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  color: var(--muted-foreground);
}

.product-card__viewers svg {
  flex-shrink: 0;
  color: var(--muted-foreground);
}

/* --- Variants --- */
/* --- Eco icons on card image --- */
.product-card__eco-icons {
  position: absolute;
  bottom: 0.625rem;
  left: 0.625rem;
  display: flex;
  gap: 0.375rem;
  z-index: 2;
}

/* Eco icons: mereu in info area, pe ambele breakpoint-uri */
.product-card__eco-icons--on-image {
  display: none;
}

.product-card__eco-icons--in-info {
  display: flex;
  position: static;
  gap: 0.625rem;
  margin: 0.3125rem 0 0;
  flex-wrap: wrap;
}

.product-card__eco-icons--in-info .product-card__eco-icon {
  height: auto;
  padding: 0;
  min-width: auto;
  background: transparent;
  color: var(--muted-foreground);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  gap: 0.25rem;
}

.product-card__eco-icons--in-info .product-card__eco-icon span {
  max-width: none;
  opacity: 1;
  font-size: 0.5625rem;
  letter-spacing: 0.04em;
  color: var(--muted-foreground);
  text-transform: uppercase;
}

.product-card__eco-icons--in-info .product-card__eco-icon svg {
  width: 10px;
  height: 10px;
  color: var(--primary-dark);
}

.product-card__eco-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  height: 28px;
  padding: 0 0.5rem;
  min-width: 28px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  color: #15803d;
  transition: all 0.25s ease;
  overflow: hidden;
  cursor: default;
}

.product-card__eco-icon span {
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;
  font-size: 0.5625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  opacity: 0;
  transition: max-width 0.3s ease, opacity 0.2s ease;
}

.product-card__eco-icon:hover span {
  max-width: 80px;
  opacity: 1;
}

.product-card__eco-icon:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.product-card__eco-icon svg {
  flex-shrink: 0;
}

.product-card__variants {
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  margin: 0.125rem 0 0;
}

.product-card__info {
  padding: 0 0.125rem;
}

.product-card__title-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin-bottom: 0.375rem;
}

.product-card__title {
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--foreground);
  line-height: 1.3;
  margin: 0;
}

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

.product-card__price {
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--foreground);
  white-space: nowrap;
  flex-shrink: 0;
  display: inline-flex;
  align-items: baseline;
  gap: 0.3125rem;
}

.product-card__price-from-label {
  font-size: 0.6875rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted-foreground);
}

.product-card__price-from {
  font-weight: 600;
  color: var(--foreground);
}

.product-card__price-compare {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--muted-foreground, #888);
  opacity: 0.7;
}

.product-card__price-compare s {
  text-decoration: line-through;
}

.product-card__price--compare {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-decoration: line-through;
  margin-left: 0.25rem;
}


.product-card__meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.25rem;
}

.product-card__rating {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  text-decoration: none;
  color: inherit;
}

.product-card__rating-text {
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--muted-foreground, #666);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: rgba(0,0,0,0.15);
}

.product-card__rating:hover .product-card__rating-text {
  text-decoration-color: currentColor;
}

.product-card__stars {
  display: flex;
  gap: 1px;
}

.product-card__star {
  color: #D4A843;
}

.product-card__star--empty {
  color: #D1CDC7;
}

.product-card__rating-count {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}


/* ---------------------------------------------------------------
   STAR RATING
   --------------------------------------------------------------- */

.star-rating {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}

.star-rating__stars {
  display: flex;
  gap: 1px;
}

.star-rating__star {
  color: var(--star);
}

.star-rating__star--filled {
  color: var(--star);
}

.star-rating__star--empty {
  color: var(--star);
}

.star-rating__star--partial {
  color: var(--star);
}

.star-rating__count {
  font-size: 10px;
  color: var(--muted-foreground);
}


/* ---------------------------------------------------------------
   TRUST BADGES
   --------------------------------------------------------------- */

.trust-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2rem;
}

.trust-badges__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.trust-badges__icon {
  color: var(--primary);
}

.trust-badges__icon svg {
  width: 14px;
  height: 14px;
}

.trust-badges__label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--muted-foreground);
}


/* ---------------------------------------------------------------
   PAYMENT LOGOS
   --------------------------------------------------------------- */

.payment-logos {
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.payment-logos__item {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(61, 56, 52, 0.25);
}


/* ---------------------------------------------------------------
   ANIMATIONS
   --------------------------------------------------------------- */

@keyframes marqueeScroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@keyframes heroRotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes heroFloat {
  0%,
  100% {
    transform: translateY(-50%) translateX(-16px);
  }
  50% {
    transform: translateY(calc(-50% - 12px)) translateX(-16px);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
/* ============================================================
   theme-part3.css
   Product, Collection, Cart, Blog, Article, Page, 404 sections
   ============================================================ */

/* ============================================================
   PRODUCT PAGE
   ============================================================ */

.product {
  padding-bottom: 0;
}

/* --- Breadcrumbs --- */
.product__breadcrumbs {
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
  background: var(--background);
}

.product__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.product__breadcrumbs-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.product__breadcrumbs-item {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-family: var(--font-body);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-foreground);
}

.product__breadcrumbs-item--active {
  color: var(--foreground);
  font-weight: 500;
}

.product__breadcrumbs-link {
  color: var(--muted-foreground);
  text-decoration: none;
  transition: color 0.2s;
}

.product__breadcrumbs-link:hover {
  color: var(--primary);
}

.product__breadcrumbs-separator {
  margin: 0 0.5rem;
  color: var(--muted-foreground);
  opacity: 0.5;
}

/* --- Social proof banner --- */
.product__social-proof-banner {
  background: var(--muted);
  padding: 0.625rem 0;
  text-align: center;
}

.product__social-proof-text {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--foreground);
  margin: 0;
}

.product__icon {
  flex-shrink: 0;
}

.product__icon--flame {
  color: #ef4444;
}

/* --- Main layout --- */
.product__layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  padding: 2rem 0 3rem;
  align-items: start;
}

/* --- Gallery --- */
.product__gallery {
  position: relative;
  align-self: start;
}

.product__gallery-sticky {
  position: sticky;
  top: calc(var(--header-height, 80px) + 1.5rem);
}

.product__gallery-main {
  margin-bottom: 0.75rem;
}

.product__gallery-main-image {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
  background: var(--muted);
}

.product__gallery-image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 0.75rem;
}

.product__gallery-video-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 0.75rem;
  overflow: hidden;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product__gallery-video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
  border: none;
}

.product__gallery-video-wrap iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.product__gallery-thumb-video {
  position: relative;
  width: 100%;
  height: 100%;
}

.product__gallery-thumb-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 28px;
  height: 28px;
  background: rgba(0,0,0,0.5);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product__gallery-thumb-play svg {
  margin-left: 2px;
}

.product__gallery-fullscreen-btn {
  position: absolute;
  bottom: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: none;
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: background 0.2s;
  pointer-events: auto !important;
}

.product__gallery-fullscreen-btn:hover {
  background: rgba(0,0,0,0.75);
}

.product__gallery-video-wrap:fullscreen,
.product__gallery-video-wrap:-webkit-full-screen {
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product__gallery-video-wrap:fullscreen .product__gallery-video,
.product__gallery-video-wrap:fullscreen iframe,
.product__gallery-video-wrap:-webkit-full-screen .product__gallery-video,
.product__gallery-video-wrap:-webkit-full-screen iframe {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.product__gallery-placeholder {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: var(--muted);
  border-radius: 0.75rem;
}

.product__badge {
  position: relative;
  top: auto;
  left: auto;
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  width: fit-content;
  z-index: 2;
}

.product__badge--sale {
  background: #ef4444;
  color: #fff;
}

.product__badge--discount {
  background: #ef4444;
  color: #fff;
}

.product__gallery-thumbs {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}

.product__gallery-thumb {
  flex-shrink: 0;
  width: 72px;
  height: 90px;
  border: 2px solid transparent;
  border-radius: 0.5rem;
  overflow: hidden;
  cursor: pointer;
  background: var(--muted);
  padding: 0;
  transition: border-color 0.2s, opacity 0.2s;
}

.product__gallery-thumb:hover {
  border-color: var(--accent);
}

.product__gallery-thumb--active {
  border-color: var(--primary);
}

.product__gallery-thumb-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* --- Product details sidebar --- */
.product__details {
  position: relative;
}

.product__details-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.product__type-label {
  font-size: 0.75rem;
  font-family: var(--font-body);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--primary);
  font-weight: 600;
}

.product__stock-status {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  font-weight: 500;
}

.product__stock-status--in-stock {
  color: #16a34a;
}

.product__stock-status--out-of-stock {
  color: #ef4444;
}

.product__stock-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #16a34a;
  animation: stockPulse 2s ease-in-out infinite;
}

@keyframes stockPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* --- Title --- */
.product__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--foreground);
  margin: 0 0 0.75rem;
}

/* --- Rating --- */
.product__rating {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.product__rating-stars {
  display: flex;
  gap: 0.125rem;
}

.product__star {
  color: var(--star);
}

.product__star--filled {
  color: var(--star);
}

.product__rating-count {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

/* --- Price --- */
.product__price-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.product__price {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--foreground);
}

.product__price--sale {
  color: #ef4444;
  font-size: 1.5rem;
  font-weight: 700;
}

.product__price--compare {
  font-size: 1rem;
  color: var(--muted-foreground);
  font-weight: 400;
}

.product__price--compare s {
  text-decoration: line-through;
}

/* --- Live viewers --- */
.product__live-viewers {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.product__live-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #16a34a;
  animation: stockPulse 1.5s ease-in-out infinite;
}

.product__live-text {
  font-size: 0.8125rem;
}

/* --- Short description --- */
.product__description-short {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--muted-foreground);
  margin-bottom: 1.25rem;
}

/* --- Stock progress bar --- */
/* stock-bar: styles defined later in file */

/* --- Trust badges --- */
.product__trust-badges {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  margin-bottom: 1.5rem;
  padding: 1rem;
  background: var(--muted);
  border-radius: 0.75rem;
}

.product__trust-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
  text-align: center;
}

.product__trust-icon {
  color: var(--primary);
  flex-shrink: 0;
}

.product__trust-label {
  font-size: 0.6875rem;
  font-weight: 500;
  color: var(--foreground);
  line-height: 1.3;
}

/* --- Product form --- */
.product__form {
  margin-bottom: 1rem;
}

.product__variant-select {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.product__option {
  margin-bottom: 1rem;
}

.product__option-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--foreground);
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.product__option-values {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.product__option-btn {
  padding: 0.5rem 1.25rem;
  border: 1.5px solid var(--border);
  border-radius: 0.5rem;
  background: var(--background);
  color: var(--foreground);
  font-size: 0.8125rem;
  font-family: var(--font-body);
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.product__option-btn:hover {
  border-color: var(--primary);
}

.product__option-btn--selected {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.product__option-btn--disabled {
  opacity: 0.35;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* --- Quantity + ATC row --- */
.product__add-to-cart-row {
  display: flex;
  gap: 0.75rem;
  margin-top: 1rem;
}

.product__quantity {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--border);
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--background);
  flex-shrink: 0;
}

.product__quantity-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 44px;
  border: none;
  background: transparent;
  color: var(--foreground);
  cursor: pointer;
  transition: background 0.15s;
}

.product__quantity-btn:hover {
  background: var(--muted);
}

.product__quantity-input {
  width: 44px;
  height: 44px;
  border: none;
  background: transparent;
  text-align: center;
  font-size: 0.9375rem;
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--foreground);
  -moz-appearance: textfield;
}

.product__quantity-input::-webkit-outer-spin-button,
.product__quantity-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.product__add-to-cart-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  height: 48px;
  padding: 0 2rem;
  border: none;
  border-radius: 0.5rem;
  background: var(--primary);
  color: #fff;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(201, 167, 160, 0.35);
  transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}

.product__add-to-cart-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(201, 167, 160, 0.45);
}

.product__add-to-cart-btn:active:not(:disabled) {
  transform: translateY(0);
}

.product__add-to-cart-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.product__add-to-cart-text {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}

.product__add-to-cart-text--success {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}

/* --- Wishlist --- */
.product__wishlist-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  justify-content: center;
  padding: 0.625rem 1rem;
  border: 1.5px solid var(--border);
  border-radius: 0.5rem;
  background: transparent;
  color: var(--foreground);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s;
  margin-bottom: 1.25rem;
}

.product__wishlist-btn:hover {
  border-color: var(--primary);
  color: var(--primary);
}

/* --- Micro trust --- */
.product__micro-trust {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  padding: 0.75rem 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  margin-bottom: 1.25rem;
}

.product__micro-trust-item {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  white-space: nowrap;
}

.product__micro-trust-item svg {
  color: var(--primary);
  flex-shrink: 0;
}

/* --- Accordions --- */
.product__accordions {
  margin-bottom: 1.25rem;
}

.product__accordion {
  border-bottom: 1px solid var(--border);
}

.product__accordion-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--foreground);
  cursor: pointer;
  list-style: none;
}

.product__accordion-header::-webkit-details-marker {
  display: none;
}

.product__accordion-icon {
  transition: transform 0.3s;
  flex-shrink: 0;
  color: var(--muted-foreground);
}

.product__accordion[open] .product__accordion-icon {
  transform: rotate(180deg);
}

.product__accordion-body {
  padding: 0 0 1.25rem;
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--muted-foreground);
}

.product__accordion-body p {
  margin: 0 0 0.5rem;
}

.product__accordion-body ol,
.product__accordion-body ul {
  margin: 0;
  padding-left: 1.25rem;
}

.product__accordion-body li {
  margin-bottom: 0.375rem;
}

/* --- Highlights strip --- */
.product__highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.375rem;
  margin-bottom: 1.25rem;
}

@media (min-width: 640px) {
  .product__highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }
}

.product__highlight-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.3rem 0.5rem;
  background: var(--muted);
  border-radius: 100px;
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--foreground);
  letter-spacing: 0.02em;
}

@media (min-width: 640px) {
  .product__highlight-tag {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    gap: 0.375rem;
  }
}

.product__highlight-tag svg {
  color: var(--primary);
  flex-shrink: 0;
}

/* --- Color Story --- */
.product__color-story {
  position: relative;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.25rem;
  background: linear-gradient(135deg, rgba(201, 167, 160, 0.08), rgba(212, 197, 185, 0.12));
  border-left: 3px solid var(--primary);
  border-radius: 0 0.5rem 0.5rem 0;
}

.product__color-story-label {
  display: block;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--primary);
  margin-bottom: 0.5rem;
}

.product__color-story-text {
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--muted-foreground);
  font-style: italic;
  margin: 0;
}

/* --- Section label (reusable) --- */
.product__section-label {
  display: block;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--primary);
  margin-bottom: 0.75rem;
}

/* --- What's Included --- */
.product__whats-included {
  margin-bottom: 1.25rem;
  padding: 1.25rem;
  background: var(--muted);
  border-radius: 0.75rem;
}

.product__included-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.product__included-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.8125rem;
  color: var(--foreground);
}

.product__included-item svg {
  color: var(--primary);
  flex-shrink: 0;
}

/* --- Product Specs List --- */
.product__specs-grid {
  display: flex;
  flex-direction: column;
}

.product__spec-item,
.product__spec-item--full {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--border);
}

.product__spec-item:last-child,
.product__spec-item--full:last-child {
  border-bottom: none;
}

.product__spec-key {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--muted-foreground);
  white-space: nowrap;
  flex-shrink: 0;
}

.product__spec-value {
  font-size: 0.8125rem;
  color: var(--foreground);
  line-height: 1.5;
  text-align: right;
}

/* --- Trust / Eco badges row --- */
.product__trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.product__trust-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--border);
  border-radius: 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--foreground);
}

.product__trust-badge svg {
  color: var(--primary);
  flex-shrink: 0;
}

.product__trust-badge--note {
  flex-basis: 100%;
  font-weight: 400;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  background: rgba(201, 167, 160, 0.05);
}

/* --- Guarantee box --- */
.product__guarantee-box {
  display: flex;
  gap: 0.75rem;
  padding: 1rem;
  background: var(--muted);
  border-radius: 0.75rem;
  margin-bottom: 1.25rem;
}

.product__guarantee-box svg {
  flex-shrink: 0;
  color: var(--primary);
  margin-top: 0.125rem;
}

.product__guarantee-box strong {
  display: block;
  font-size: 0.875rem;
  color: var(--foreground);
  margin-bottom: 0.25rem;
}

.product__guarantee-box p {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--muted-foreground);
  margin: 0;
}

/* --- Gallery badges --- */
.product__gallery-badges {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  z-index: 2;
}

.product__badge--bestseller { background: #C0392B; color: #fff; }
.product__badge--nou { background: #4A5043; color: #fff; }
.product__badge--favorit { background: #C97B63; color: #fff; }
.product__badge--editie-limitata { background: #C0392B; color: #fff; }
.product__badge--premium { background: #C28B2D; color: #fff; }

/* --- Viewers --- */
.product__viewers {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  margin: 0 0 1.25rem;
}

.product__viewers svg { flex-shrink: 0; }

/* --- Short description --- */
.product__short-description {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--foreground);
  margin: 0 0 1.5rem;
}

/* --- Stock pill (small inline badge) --- */
.product__stock-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: #b45309;
  background: #fef3c7;
  border: 1px solid #fde68a;
  padding: 0.25rem 0.625rem;
  border-radius: 9999px;
  margin: 0 0 0.5rem;
}

.product__stock-pill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f59e0b;
  animation: stockPulse 2s ease-in-out infinite;
}

@keyframes stockPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* --- Collection Banner --- */
.collection__banner {
  width: 100%;
}

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

.collection__banner-img--mobile {
  display: none;
}

@media (max-width: 767px) {
  .collection__banner-img--desktop {
    display: none;
  }
  .collection__banner-img--mobile {
    display: block;
  }
}

/* --- ANPC badges in footer --- */
.footer__anpc {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

.footer__anpc-link {
  display: block;
  transition: opacity 0.2s;
}

.footer__anpc-link:hover {
  opacity: 0.8;
}

.footer__anpc-link img {
  display: block;
  border-radius: 0.25rem;
}

/* --- Discount applied message --- */
.cart-drawer__discount-applied,
.cart__promo-applied {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.25rem 0.5rem 0.25rem 0.5rem;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 9999px;
  font-size: 0.6875rem;
  font-weight: 500;
  line-height: 1.2;
  color: #15803d;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cart-drawer__discount-applied strong,
.cart__promo-applied strong,
.product__promo-applied strong {
  font-weight: 700;
  letter-spacing: 0.02em;
}

.cart-drawer__discount-applied svg,
.cart__promo-applied svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.product__promo-applied {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.875rem;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 0.5rem;
  font-size: 0.8125rem;
  color: #15803d;
}

.cart-drawer__discount-remove,
.cart__promo-remove,
.product__promo-remove {
  margin-left: 0.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  color: var(--muted-foreground);
  transition: all 0.15s;
  flex-shrink: 0;
}

.cart-drawer__discount-remove svg,
.cart__promo-remove svg,
.product__promo-remove svg {
  width: 11px;
  height: 11px;
}

.cart-drawer__discount-remove:hover,
.cart__promo-remove:hover,
.product__promo-remove:hover {
  background: rgba(0, 0, 0, 0.05);
  color: #ef4444;
}

/* --- Google Drive video poster --- */
.product__gallery-slide-gdrive-poster {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: linear-gradient(135deg, #1a1a1a, #2d2d2d);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.product__gallery-thumb-gdrive {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #1a1a1a, #2d2d2d);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
}

/* --- Badges row (stock + eco + reusable) --- */
.product__badges-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.product__badge-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 0.3rem 0.75rem;
  border-radius: 9999px;
}

.product__badge-pill--stock {
  color: #b45309;
  background: #fef3c7;
  border: 1px solid #fde68a;
}

.product__badge-pill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f59e0b;
  animation: stockPulse 2s ease-in-out infinite;
}

.product__badge-pill--eco {
  color: #15803d;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
}

.product__badge-pill--eco svg {
  color: #16a34a;
}

.product__badge-pill--reuse {
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}

.product__badge-pill--reuse svg {
  color: #2563eb;
}

/* --- Product features --- */
.product__features {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  padding: 1.5rem 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  margin-bottom: 1.5rem;
}

.product__feature-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  text-align: center;
}

.product__feature-item svg {
  color: var(--muted-foreground);
}

.product__feature-item span {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--foreground);
}

/* --- Wishlist button --- */
.product__wishlist-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1.5px solid var(--border);
  border-radius: 0.5rem;
  background: transparent;
  color: var(--foreground);
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 1.5rem;
}

.product__wishlist-btn:hover {
  border-color: var(--primary);
  color: var(--primary);
}

/* --- Eco badge --- */
.product__eco-badge {
  display: flex;
  gap: 0.75rem;
  padding: 1.25rem;
  background: var(--muted);
  border-radius: 0.75rem;
  margin-bottom: 1.5rem;
}

.product__eco-badge svg {
  flex-shrink: 0;
  color: var(--foreground);
}

.product__eco-badge strong {
  display: block;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--foreground);
  margin-bottom: 0.25rem;
}

.product__eco-badge p {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  line-height: 1.5;
  margin: 0;
}

/* --- Payment labels --- */
.product__payment-labels {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  padding: 1rem 0;
}

.product__payment-labels span {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--muted-foreground);
  opacity: 0.5;
}

/* --- Ordered count --- */
.product__ordered-count {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-foreground);
  margin: 1rem 0 0;
}

.product__ordered-count svg { flex-shrink: 0; }

/* --- Popular badge on variant --- */
.product__option-popular-wrap {
  position: relative;
}

.product__option-popular-badge {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #C0392B;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.2rem 0.5rem;
  border-radius: 3px;
  white-space: nowrap;
  z-index: 2;
}

/* --- Value tip --- */
.product__value-tip {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  margin: 0.5rem 0 0;
}

/* --- Promo code --- */
.product__promo-code {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 1.25rem;
  margin-top: 1.5rem;
}

.product__promo-code-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 0.75rem;
}

.product__promo-code-form {
  display: flex;
  gap: 0.5rem;
}

.product__promo-code-input {
  flex: 1;
  border: 1px solid var(--border);
  padding: 0.75rem 1rem;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: var(--radius-sm);
  outline: none;
}

.product__promo-code-input:focus {
  border-color: var(--primary);
}

.product__promo-code-btn {
  padding: 0.75rem 1.5rem;
  background: var(--foreground);
  color: var(--background);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
}

.product__promo-code-hint {
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  margin: 0.5rem 0 0;
}

.product__promo-code-hint strong {
  color: var(--primary);
}

/* --- Shipping progress bar --- */
.product__shipping-bar {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 1rem 1.25rem;
  margin-top: 1rem;
}

.product__shipping-bar-header {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  text-align: center;
}

.product__shipping-bar-title {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.product__shipping-bar-amount {
  font-size: 0.75rem;
  font-weight: 600;
}

.product__shipping-bar-track {
  height: 6px;
  background: var(--muted);
  border-radius: 3px;
  overflow: hidden;
}

.product__shipping-bar-fill {
  height: 100%;
  background: var(--primary);
  border-radius: 3px;
  transition: width 0.5s ease;
}

.product__shipping-bar-remaining {
  font-size: 0.75rem;
  color: var(--primary);
  margin: 0.5rem 0 0;
}

.product__shipping-bar-remaining--free {
  color: #16A34A;
}

/* --- Stock bar header --- */
/* stock-bar-header/count removed — simplified layout */

/* --- Sanctuary card --- */
.product__sanctuary-card {
  background: var(--muted);
  border-radius: var(--radius-sm);
  padding: 1.5rem;
  margin-top: 1.5rem;
}

.product__sanctuary-title {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-style: italic;
  margin: 0 0 1.25rem;
}

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

.product__sanctuary-item {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
}

.product__sanctuary-item svg {
  color: var(--primary);
  opacity: 0.6;
  margin-bottom: 0.25rem;
}

.product__sanctuary-item strong {
  font-size: 0.8125rem;
}

.product__sanctuary-item span {
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  line-height: 1.4;
}

/* --- Ordered count divider --- */
.product__ordered-divider {
  color: var(--border);
  margin: 0 0.5rem;
}

.product__ordered-top {
  font-weight: 400;
}

/* --- Rating score --- */
.product__rating-score {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
}

/* --- Reviews section --- */
.product__reviews-section {
  background: var(--muted);
  padding: 4rem 0;
  margin-top: 2rem;
}

.product__reviews-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 2rem;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.product__reviews-title {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 500;
  font-style: italic;
  color: var(--foreground);
  margin: 0 0 0.5rem;
}

.product__reviews-score {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
}

/* --- Reviews breakdown --- */
.product__reviews-breakdown {
  background: var(--background);
  border-radius: 0.75rem;
  padding: 1.25rem;
  min-width: 280px;
}

.product__reviews-breakdown-inner {
  display: flex;
  gap: 1.5rem;
  align-items: center;
}

.product__reviews-breakdown-score {
  text-align: center;
  flex-shrink: 0;
}

.product__reviews-breakdown-number {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: var(--foreground);
  line-height: 1;
}

.product__reviews-breakdown-label {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.product__reviews-breakdown-bars {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.product__reviews-bar-row {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  color: var(--muted-foreground);
}

.product__reviews-bar-track {
  flex: 1;
  height: 6px;
  background: var(--border);
  border-radius: 9999px;
  overflow: hidden;
}

.product__reviews-bar-fill {
  height: 100%;
  background: #C0392B;
  border-radius: 9999px;
}

/* --- Review card date --- */
.product__review-card-date {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

/* --- Review card avatar --- */
.product__review-card-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6875rem;
  font-weight: 700;
  flex-shrink: 0;
}

.product__review-card-footer {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.product__review-card-author {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--foreground);
  margin: 0;
}

.product__review-card-location {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  margin: 0;
}

.product__review-card-verified {
  margin-left: auto;
}

/* --- Related grid (3 cols) --- */
.product__related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

/* --- Responsive product layout --- */
@media (max-width: 768px) {

  /* ---- Container & general spacing ---- */
  .product__container {
    padding: 0 16px;
  }

  /* ---- Breadcrumbs: horizontal scroll, no wrap ---- */
  .product__breadcrumbs {
    display: none;
  }

  /* ---- Main layout: single column ---- */
  .product__layout {
    grid-template-columns: 1fr;
    gap: 1.25rem;
    padding: 1rem 0 1.5rem;
  }

  /* ---- Gallery: full-width, proper aspect ratio ---- */
  .product__gallery-sticky {
    position: relative;
    top: auto;
  }

  .product__gallery-main {
    margin-bottom: 0.5rem;
  }

  .product__gallery-main-image {
    border-radius: 0.75rem;
    overflow: hidden;
  }

  .product__gallery-image {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 0.75rem;
  }

  /* ---- Thumbnails: horizontal scroll row ---- */
  .product__gallery-thumbs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 0 8px;
  }

  .product__gallery-thumbs::-webkit-scrollbar {
    display: none;
  }

  .product__gallery-thumb {
    flex-shrink: 0;
    width: 60px;
    height: 75px;
    border-radius: 6px;
    min-width: 60px;
  }

  /* ---- Badges on image ---- */
  .product__gallery-badges {
    top: 0.5rem;
    left: 0.5rem;
  }

  .product__badge {
    position: relative;
    top: auto;
    left: auto;
    font-size: 0.6875rem;
    padding: 0.2rem 0.625rem;
  }

  /* ---- Product title: 24-28px on mobile ---- */
  .product__title {
    font-size: 1.5rem;
    line-height: 1.25;
    margin: 0 0 0.5rem;
  }

  /* ---- Details meta (type + stock) ---- */
  .product__details-meta {
    margin-bottom: 0.5rem;
  }

  /* ---- Rating stars ---- */
  .product__rating {
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
  }

  .product__rating-stars svg {
    width: 16px;
    height: 16px;
  }

  /* ---- Price block: clearly visible ---- */
  .product__price-wrapper {
    margin-bottom: 0.75rem;
    gap: 0.5rem;
  }

  .product__price {
    font-size: 1.375rem;
  }

  .product__price--sale {
    font-size: 1.375rem;
  }

  .product__price--compare {
    font-size: 0.9375rem;
  }

  /* ---- Viewers line ---- */
  .product__viewers {
    margin-bottom: 1rem;
    font-size: 0.8125rem;
  }

  /* ---- Short description ---- */
  .product__short-description {
    font-size: 0.875rem;
    line-height: 1.65;
    margin-bottom: 1.25rem;
  }

  /* ---- Stock pill (mobile) ---- */
  .product__stock-pill {
    font-size: 0.625rem;
  }

  /* ---- Features: 2x2 grid with proper spacing ---- */
  .product__features {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    padding: 1rem 0;
    margin-bottom: 1.25rem;
  }

  .product__feature-item svg {
    width: 20px;
    height: 20px;
  }

  .product__feature-item span {
    font-size: 0.625rem;
  }

  /* ---- Variant selectors: proper tap targets (44px min) ---- */
  .product__option {
    margin-bottom: 1rem;
  }

  .product__option-label {
    font-size: 0.8125rem;
    margin-bottom: 0.5rem;
  }

  .product__option-values {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .product__option-btn {
    min-height: 44px;
    min-width: 44px;
    padding: 0.625rem 1rem;
    font-size: 0.8125rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
  }

  .product__option-popular-wrap {
    width: 100%;
  }

  .product__option-popular-wrap .product__option-btn {
    width: 100%;
  }

  .product__value-tip {
    font-size: 0.6875rem;
    margin: 0.375rem 0 0;
  }

  /* ---- Promo code ---- */
  .product__promo-code {
    padding: 1rem;
    margin-top: 1rem;
  }

  .product__promo-code-form {
    flex-direction: column;
    gap: 0.5rem;
  }

  .product__promo-code-input {
    width: 100%;
    min-height: 44px;
    font-size: 0.875rem;
  }

  .product__promo-code-btn {
    width: 100%;
    min-height: 44px;
    font-size: 0.8125rem;
  }

  /* ---- Quantity + Add to Cart: full-width ATC ---- */
  .product__add-to-cart-row {
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1rem;
  }

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

  .product__quantity-btn {
    width: 48px;
    height: 48px;
    min-width: 48px;
    min-height: 48px;
  }

  .product__quantity-input {
    width: 60px;
    height: 48px;
    font-size: 1rem;
  }

  .product__add-to-cart-btn {
    width: 100%;
    height: 52px;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    letter-spacing: 0.02em;
  }

  /* ---- Wishlist button ---- */
  .product__wishlist-btn {
    min-height: 44px;
    margin-bottom: 1.25rem;
  }

  /* ---- Shipping bar ---- */
  .product__shipping-bar {
    padding: 0.875rem 1rem;
    margin-top: 0.75rem;
  }

  .product__shipping-bar-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.125rem;
    margin-bottom: 0.5rem;
  }

  .product__shipping-bar-title {
    font-size: 0.6875rem;
  }

  .product__shipping-bar-amount {
    font-size: 0.6875rem;
  }

  .product__shipping-bar-remaining {
    font-size: 0.6875rem;
  }

  /* ---- Micro trust row: wrap properly ---- */
  .product__micro-trust {
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    justify-content: flex-start;
    padding: 0.75rem 0;
    margin-bottom: 1rem;
  }

  .product__micro-trust-item {
    font-size: 0.6875rem;
    white-space: nowrap;
  }

  /* ---- Accordions: proper touch targets ---- */
  .product__accordions {
    margin-bottom: 1rem;
  }

  .product__accordion-header {
    padding: 0.875rem 0;
    font-size: 0.875rem;
    min-height: 44px;
  }

  .product__accordion-body {
    padding: 0 0 1rem;
    font-size: 0.8125rem;
  }

  /* ---- Eco badge ---- */
  .product__eco-badge {
    padding: 1rem;
    margin-bottom: 1.25rem;
    gap: 0.625rem;
  }

  .product__eco-badge svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
  }

  .product__eco-badge strong {
    font-size: 0.75rem;
  }

  .product__eco-badge p {
    font-size: 0.75rem;
  }

  /* ---- Payment labels ---- */
  .product__payment-labels {
    gap: 0.75rem;
    padding: 0.75rem 0;
  }

  .product__payment-labels span {
    font-size: 0.625rem;
  }

  /* ---- Ordered count (social proof below gallery) ---- */
  .product__ordered-count {
    flex-wrap: wrap;
    font-size: 0.6875rem;
    gap: 0.375rem;
    margin: 0.75rem 0 0;
  }

  .product__ordered-divider {
    display: none;
  }

  .product__ordered-top {
    display: block;
    width: 100%;
  }

  /* ---- Sanctuary card ---- */
  .product__sanctuary-card {
    padding: 1.25rem;
    margin-top: 1rem;
  }

  .product__sanctuary-title {
    font-size: 1rem;
    margin-bottom: 1rem;
  }

  .product__sanctuary-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .product__sanctuary-item {
    flex-direction: row;
    text-align: left;
    gap: 0.75rem;
  }

  .product__sanctuary-item svg {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-bottom: 0;
  }

  .product__sanctuary-item strong {
    font-size: 0.8125rem;
  }

  .product__sanctuary-item span {
    font-size: 0.6875rem;
  }

  /* ---- Reviews section ---- */
  .product__reviews-section {
    padding: 2.5rem 0;
    margin-top: 1.5rem;
  }

  .product__reviews-header {
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.5rem;
  }

  .product__reviews-title {
    font-size: 1.375rem;
    margin-bottom: 0.25rem;
  }

  .product__reviews-summary {
    justify-content: flex-start;
  }

  .product__reviews-breakdown {
    min-width: auto;
    width: 100%;
    padding: 1rem;
  }

  .product__reviews-breakdown-inner {
    gap: 1rem;
  }

  .product__reviews-breakdown-number {
    font-size: 1.5rem;
  }

  .product__reviews-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .product__review-card {
    padding: 1.25rem;
  }

  .product__review-card-text {
    font-size: 0.8125rem;
    margin-bottom: 0.625rem;
  }

  .product__review-card-footer {
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  /* ---- Related products ---- */
  .product__related {
    padding: 2.5rem 0;
  }

  .product__related-title {
    font-size: 1.375rem;
    margin-bottom: 1.5rem;
  }

  .product__related-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }

  /* ---- Sticky add-to-cart bar ---- */
  .product__sticky-bar {
    padding: 0;
    padding-bottom: env(safe-area-inset-bottom, 0);
  }

  .product__sticky-bar > .product__container {
    padding: 0.5rem 0.75rem;
  }

  .product__sticky-bar-inner {
    gap: 0.625rem;
    justify-content: space-between;
    align-items: center;
  }

  .product__sticky-bar-info {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    flex: 1;
    overflow: hidden;
  }

  .product__sticky-bar-image {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
  }

  .product__sticky-bar-info > div {
    min-width: 0;
    flex: 1;
    overflow: hidden;
  }

  .product__sticky-bar-title {
    font-size: 0.75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
    line-height: 1.2;
  }

  .product__sticky-bar-prices {
    margin: 0.125rem 0 0;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.375rem;
  }

  .product__sticky-bar-price {
    font-size: 0.8125rem;
    margin: 0;
  }

  .product__sticky-bar-compare {
    font-size: 0.6875rem;
  }

  .product__sticky-bar-saved {
    display: none;
  }

  .product__sticky-bar-btn {
    width: auto;
    flex-shrink: 0;
    padding: 0.625rem 1rem;
    font-size: 0.8125rem;
    min-height: 40px;
    white-space: nowrap;
  }
}

/* Pe ecrane foarte mici, scoate titlul ca sa lasi loc pretului + butonului */
@media (max-width: 380px) {
  .product__sticky-bar-title { display: none; }
  .product__sticky-bar-image { display: none; }
}

/* ---- Extra small screens (max-width: 380px) ---- */
@media (max-width: 380px) {
  .product__title {
    font-size: 1.375rem;
  }

  .product__price,
  .product__price--sale {
    font-size: 1.25rem;
  }

  .product__add-to-cart-btn {
    font-size: 0.9375rem;
    padding: 0 1rem;
  }

  .product__micro-trust {
    flex-direction: column;
    gap: 0.5rem;
  }

  .product__option-btn {
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
    min-height: 44px;
  }

  .product__sticky-bar-title {
    display: none;
  }

  .product__payment-labels {
    gap: 0.5rem;
  }
}

/* ---- Prevent all horizontal overflow on product page ---- */
.product {
  overflow-x: hidden;
}

.product__reviews-summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

.product__reviews-stars {
  display: flex;
  gap: 0.125rem;
}

.product__reviews-average {
  font-size: 0.9375rem;
  color: var(--muted-foreground);
}

/* Rating breakdown */
.product__reviews-breakdown {
  max-width: 480px;
  margin: 0 auto 2.5rem;
}

.product__reviews-bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.375rem;
}

.product__reviews-bar-label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  min-width: 2.5rem;
}

.product__reviews-bar-label svg {
  color: var(--star);
}

.product__reviews-bar-track {
  flex: 1;
  height: 8px;
  background: rgba(61, 56, 52, 0.08);
  border-radius: 9999px;
  overflow: hidden;
}

.product__reviews-bar-fill {
  height: 100%;
  background: var(--star);
  border-radius: 9999px;
  transition: width 0.8s ease;
}

.product__reviews-bar-percent {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  min-width: 2.5rem;
  text-align: right;
}

/* Review cards */
.product__reviews-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
}

.product__review-card {
  background: var(--background);
  border-radius: 0.75rem;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.product__review-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

.product__review-card-stars {
  display: flex;
  gap: 0.125rem;
}

.product__review-card-verified {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6875rem;
  color: #16a34a;
  font-weight: 500;
}

.product__review-card-text {
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--foreground);
  margin: 0 0 0.75rem;
}

.product__review-card-author {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  font-weight: 500;
  margin: 0;
}

/* --- Related products --- */
.product__related {
  padding: 4rem 0;
}

.product__related-title {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--foreground);
  text-align: center;
  margin: 0 0 2rem;
}

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

.product__related-card {
  text-decoration: none;
  color: inherit;
  display: block;
  transition: transform 0.3s;
}

.product__related-card:hover {
  transform: translateY(-4px);
}

.product__related-card-image {
  border-radius: 0.75rem;
  overflow: hidden;
  margin-bottom: 0.75rem;
  background: var(--muted);
  aspect-ratio: 1 / 1;
}

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

.product__related-card-title {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  color: var(--foreground);
  margin: 0 0 0.25rem;
}

.product__related-card-price {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--primary);
  margin: 0;
}

/* --- Bottom banner --- */
.product__bottom-banner {
  background: var(--muted);
  padding: 0.75rem 0;
  text-align: center;
}

.product__bottom-banner-text {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--foreground);
  margin: 0;
}

/* --- Sticky add to cart bar --- */
.product__sticky-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 80;
  background: var(--background);
  border-top: 1px solid var(--border);
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
  padding: 0.75rem 0;
  transition: transform 0.3s ease;
}

.product__sticky-bar[hidden] {
  display: none;
}

.product__sticky-bar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.product__sticky-bar-info {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.product__sticky-bar-image {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 0.375rem;
}

.product__sticky-bar-title {
  font-family: var(--font-heading);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
  margin: 0;
  line-height: 1.3;
}

.product__sticky-bar-price {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--primary);
  margin: 0.125rem 0 0;
}

.product__sticky-bar-btn {
  padding: 0.625rem 1.75rem;
  border: none;
  border-radius: 0.5rem;
  background: var(--primary);
  color: #fff;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(201, 167, 160, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
  white-space: nowrap;
}

.product__sticky-bar-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(201, 167, 160, 0.45);
}

.product__sticky-bar-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}


/* ============================================================
   COLLECTION PAGE
   ============================================================ */

.collection__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* --- Hero --- */
/* ── Collection Hero (new) ── */

.collection-hero {
  position: relative;
  min-height: 45vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-top: 140px;
}

.collection-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

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

.collection-hero__image--mobile {
  display: none;
}

@media (max-width: 767px) {
  .collection-hero__image--desktop {
    display: none;
  }
  .collection-hero__image--mobile {
    display: block;
  }
}

.collection-hero__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
}

.collection-hero__gradient {
  width: 100%;
  height: 100%;
  background: var(--ch-bg, #8B8683);
}

.collection-hero__content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 5rem 2rem;
  max-width: 40rem;
}

.collection-hero__title {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  color: var(--ch-text, #FAF9F7);
  margin: 0 0 1rem;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.collection-hero__description {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.6;
  margin: 0;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5), 0 2px 16px rgba(0, 0, 0, 0.35);
  letter-spacing: 0.01em;
}

@media (max-width: 749px) {
  .collection-hero {
    min-height: 35vh;
    margin-top: 85px;
  }

  .collection-hero__content {
    padding: 3rem 24px;
    max-width: 100%;
  }

  .collection-hero__title {
    font-size: clamp(1.75rem, 8vw, 2.5rem);
  }

  .collection-hero__description {
    font-size: 0.9375rem;
    line-height: 1.55;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .collection-hero {
    min-height: 40vh;
  }

  .collection-hero__content {
    padding: 5rem 2rem;
  }
}

@media (min-width: 990px) {
  .collection-hero {
    min-height: 50vh;
  }

  .collection-hero__content {
    padding: 7rem 2rem;
  }
}

/* ── Collection Hero (legacy) ── */

.collection__hero {
  position: relative;
  min-height: 50vh;
  max-height: 65vh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: var(--header-height);
}

.collection__hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.collection__hero-overlay {
  position: relative;
  z-index: 2;
  width: 100%;
  text-align: center;
  padding: 3rem 0;
  background: linear-gradient(to top, rgba(61, 56, 52, 0.55), rgba(61, 56, 52, 0.3));
  min-height: 40vh;
  max-height: 50vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.collection__hero-title {
  font-family: var(--font-heading);
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.75rem;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.collection__hero-description {
  font-size: 1.0625rem;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 0.5rem;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

.collection__hero-count {
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0;
}

/* --- Promo bar (deasupra trust bar) --- */
.collection__promo-bar {
  padding: 0.625rem 0;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.3;
}
.collection__promo-bar .collection__container {
  padding: 0 1rem;
}
.collection__promo-link {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: opacity var(--transition-fast);
}
.collection__promo-link:hover {
  opacity: 0.85;
}

/* --- Trust bar --- */
.collection__trust-bar {
  background: var(--muted);
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--border);
}

.collection__trust-bar-items {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2.75rem;
}

.collection__trust-bar-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.9375rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--foreground);
  white-space: nowrap;
}

.collection__trust-bar-item svg {
  color: var(--primary);
  flex-shrink: 0;
  width: 26px;
  height: 26px;
}

/* --- Controls (filters & sort) --- */
/* ── Tag Filters — bara cu fundal lipita de hero/trust-bar ── */

.collection__filters {
  background: #F5F0EA;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--border);
}

.collection__filters-inner {
  overflow: hidden;
}

.collection__filter-tabs {
  display: flex;
  gap: 0.5rem;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
  padding: 0.125rem 0;
}

.collection__filter-tabs::-webkit-scrollbar {
  display: none;
}

.collection__filter-tab {
  scroll-snap-align: start;
  flex-shrink: 0;
}

.collection__filter-tab {
  padding: 0.5rem 1rem;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border: 1px solid transparent;
  border-radius: var(--radius-full);
  background: rgba(255, 255, 255, 0.6);
  color: var(--foreground);
  text-decoration: none;
  transition: all var(--transition-base);
  scroll-snap-align: start;
  flex-shrink: 0;
}

.collection__filter-tab:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.collection__filter-tab--active {
  background: var(--primary-dark);
  color: #fff;
  border-color: var(--primary-dark);
}

/* ── Controls ── */

.collection__controls {
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
}

.collection__controls-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 1rem;
}

.collection__results-count {
  flex-shrink: 0;
}

.collection__sort-wrapper {
  width: 50%;
  max-width: 360px;
  justify-content: flex-end;
  margin-left: auto;
}

.collection__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.collection__filter-btn {
  padding: 0.5rem 1.125rem;
  border: 1.5px solid var(--border);
  border-radius: 9999px;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-decoration: none;
  transition: all 0.2s;
  white-space: nowrap;
}

.collection__filter-btn:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.collection__filter-btn--active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.collection__sort {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.collection__sort-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0;
  border: none;
  background: transparent;
  cursor: default;
}

.collection__sort-icon {
  flex-shrink: 0;
  color: var(--muted-foreground, #888);
  opacity: 0.7;
}

.collection__sort-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-foreground, #888);
  white-space: nowrap;
}

.collection__sort-select {
  padding: 0.4375rem 1.75rem 0.4375rem 0.875rem;
  border: none;
  background: var(--muted, #F5F0EA) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'><path d='M1 1l4 4 4-4' stroke='%23333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 0.75rem center;
  background-size: 10px 6px;
  border-radius: var(--radius-full, 9999px);
  color: var(--foreground);
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  transition: background 0.2s ease;
}

.collection__sort-select:hover,
.collection__sort-select:focus {
  background-color: var(--accent, #E8E0D5);
}

/* --- Product grid --- */
.collection__grid-wrapper {
  padding: 2rem 0;
}

.collection__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 2.5rem;
  row-gap: 3.5rem;
  margin-bottom: 2.5rem;
}

.collection__product-card {
  position: relative;
}

.collection__product-card-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.collection__product-card-image-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
  aspect-ratio: 1 / 1;
  background: var(--muted);
  margin-bottom: 0.75rem;
}

.collection__product-card-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}

.collection__product-card-image--hover {
  position: absolute;
  inset: 0;
  opacity: 0;
}

.collection__product-card-link:hover .collection__product-card-image--hover {
  opacity: 1;
}

.collection__product-card-link:hover .collection__product-card-image--primary {
  opacity: 0;
}

.collection__product-card-placeholder {
  display: block;
  width: 100%;
  height: 100%;
}

.collection__product-card-badges {
  position: absolute;
  top: 0.625rem;
  left: 0.625rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  z-index: 2;
}

.collection__product-card-badge {
  padding: 0.1875rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.collection__product-card-badge--sale {
  background: #ef4444;
  color: #fff;
}

.collection__product-card-badge--soldout {
  background: var(--foreground);
  color: #fff;
}

.collection__product-card-badge--new {
  background: var(--primary);
  color: #fff;
}

.collection__product-card-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(61, 56, 52, 0.25);
  opacity: 0;
  transition: opacity 0.3s;
  border-radius: 0.75rem;
  z-index: 1;
}

.collection__product-card-link:hover .collection__product-card-overlay {
  opacity: 1;
}

.collection__product-card-overlay-text {
  padding: 0.5rem 1.25rem;
  background: #fff;
  color: var(--foreground);
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.collection__product-card-info {
  padding: 0 0.125rem;
}

.collection__product-card-colors {
  display: flex;
  gap: 0.375rem;
  margin-bottom: 0.375rem;
}

.collection__product-card-color-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1.5px solid var(--border);
  flex-shrink: 0;
}

.collection__product-card-title {
  font-family: var(--font-heading);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--foreground);
  margin: 0 0 0.25rem;
  line-height: 1.3;
}

.collection__product-card-price {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--foreground);
  margin-bottom: 0.25rem;
}

.collection__product-card-price--sale {
  color: #ef4444;
  font-weight: 700;
}

.collection__product-card-price--compare {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  font-weight: 400;
}

.collection__product-card-rating {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  margin-bottom: 0.25rem;
}

.collection__product-card-star {
  color: var(--star);
}

.collection__product-card-rating-count {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.collection__product-card-viewers {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  margin: 0 0 0.125rem;
}

.collection__product-card-viewers-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #16a34a;
  animation: stockPulse 1.5s ease-in-out infinite;
}

.collection__product-card-variants {
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  margin: 0;
}

/* --- Pagination --- */
.collection__pagination {
  padding: 1rem 0 0;
}

.collection__pagination-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
}

.collection__pagination-btn {
  padding: 0.5rem 1rem;
  border: 1.5px solid var(--border);
  border-radius: 0.375rem;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
}

.collection__pagination-btn:hover {
  border-color: var(--primary);
  background: var(--muted);
}

.collection__pagination-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1.5px solid var(--border);
  border-radius: 0.375rem;
  background: var(--background);
  color: var(--foreground);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s;
}

.collection__pagination-link:hover {
  border-color: var(--primary);
}

.collection__pagination-link--current {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

/* --- Testimonials --- */
.collection__testimonials {
  padding: 4rem 0;
  background: var(--background);
  border-top: 1px solid var(--border);
}

.collection__testimonials-title {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 500;
  color: var(--foreground);
  text-align: center;
  margin: 0 0 2.5rem;
}

.collection__testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.collection__testimonial-card {
  text-align: center;
  padding: 1rem 0;
}

.collection__testimonial-stars {
  display: flex;
  justify-content: center;
  gap: 0.125rem;
  margin-bottom: 1rem;
  color: var(--star);
}

.collection__testimonial-text {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--foreground);
  font-style: italic;
  margin: 0 0 1rem;
}

.collection__testimonial-author {
  font-size: 0.875rem;
  color: var(--foreground);
  font-weight: 700;
  margin: 0 0 0.125rem;
}

.collection__testimonial-location {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  font-weight: 400;
  margin: 0;
}

/* --- Social proof banner --- */
.collection__social-proof-banner {
  background: var(--muted);
  padding: 1rem 0;
  text-align: center;
  border-top: 1px solid var(--border);
}

.collection__social-proof-content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  font-size: 0.875rem;
  color: var(--foreground);
}

.collection__social-proof-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 400;
}

.collection__social-proof-left strong {
  font-weight: 700;
}

.collection__social-proof-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #C9A7A0;
  flex-shrink: 0;
}

.collection__social-proof-divider {
  color: var(--border);
  font-weight: 300;
}

.collection__social-proof-right {
  color: var(--muted-foreground);
  font-size: 0.875rem;
}

/* --- Collection responsive --- */
@media (max-width: 1024px) {
  .collection__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 749px) {
  .collection__container {
    padding: 0 24px;
  }

  .collection__grid {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 1rem;
    row-gap: 2rem;
  }

  .collection__testimonials-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .collection__testimonials-title {
    font-size: 1.375rem;
  }

  .collection__trust-bar-items {
    gap: 0.875rem 1.5rem;
  }

  .collection__controls-inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
  }

  .collection__sort-wrapper {
    width: 50%;
    max-width: none;
  }

  .collection__social-proof-content {
    flex-direction: column;
    gap: 0.25rem;
    text-align: center;
  }

  .collection__social-proof-divider {
    display: none;
  }

  .collection__social-proof-left {
    justify-content: center;
  }

  .collection__social-proof-right {
    font-size: 0.8125rem;
  }

  .collection__filter-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.25rem;
  }

  .collection__pagination-btn {
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
  }

  .collection__product-card-title {
    font-size: 0.8125rem;
  }

  .collection__product-card-price {
    font-size: 0.8125rem;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .collection__grid {
    grid-template-columns: repeat(3, 1fr);
    column-gap: 1.75rem;
    row-gap: 2.5rem;
  }

  .collection__testimonials-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
}


/* ============================================================
   CART PAGE
   ============================================================ */

.cart {
  padding: 2rem 0 4rem;
}

.cart__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* --- Header --- */
.cart__header {
  margin-bottom: 1.5rem;
}

.cart__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  color: var(--foreground);
  margin: 0;
}

.cart__count {
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 400;
  color: var(--muted-foreground);
}

/* --- Shipping progress bar --- */
.cart__shipping-bar {
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
  background: var(--muted);
  border-radius: 0.75rem;
}

.cart__shipping-bar-text {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: var(--foreground);
  margin: 0 0 0.625rem;
}

.cart__shipping-bar-text svg {
  flex-shrink: 0;
  color: var(--primary);
}

.cart__shipping-bar-text--free {
  color: #16a34a;
}

.cart__shipping-bar-text--free svg {
  color: #16a34a;
}

.cart__shipping-bar-track {
  width: 100%;
  height: 8px;
  background: rgba(61, 56, 52, 0.08);
  border-radius: 9999px;
  overflow: hidden;
}

.cart__shipping-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  border-radius: 9999px;
  transition: width 0.6s ease;
  animation: shippingBarShimmer 2s ease-in-out infinite;
}

.cart__shipping-bar-fill--complete {
  background: linear-gradient(90deg, #16a34a, #22c55e);
}

@keyframes shippingBarShimmer {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.8; }
}

/* --- Timer warning --- */
.cart__timer-warning {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: #fffbeb;
  border: 1px solid #fbbf24;
  border-radius: 0.5rem;
  margin-bottom: 1.5rem;
  font-size: 0.8125rem;
  color: #92400e;
}

.cart__timer-warning svg {
  flex-shrink: 0;
  color: #d97706;
}

.cart__timer-warning p {
  margin: 0;
}

/* --- Cart 2-col layout --- */
.cart__layout {
  display: grid;
  grid-template-columns: 7fr 5fr;
  gap: 2.5rem;
  align-items: start;
}

/* --- Cart items --- */
.cart__items {
  min-width: 0;
}

.cart__table-header {
  display: grid;
  grid-template-columns: 80px 1fr 120px 100px 100px 40px;
  gap: 1rem;
  padding: 0.75rem 0;
  border-bottom: 2px solid var(--border);
  margin-bottom: 0;
}

.cart__table-header-cell {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-foreground);
}

.cart__table-header-cell--product {
  grid-column: 1 / 3;
}

.cart__item {
  display: grid;
  grid-template-columns: 80px 1fr 120px 100px 100px 40px;
  gap: 1rem;
  align-items: center;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
}

.cart__item-image {
  width: 80px;
  flex-shrink: 0;
}

.cart__item-image img {
  display: block;
  width: 80px;
  height: 100px;
  object-fit: cover;
  border-radius: 0.5rem;
}

.cart__item-placeholder {
  width: 80px;
  height: 100px;
  background: var(--muted);
  border-radius: 0.5rem;
}

.cart__item-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.cart__item-title {
  font-family: var(--font-heading);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--foreground);
  text-decoration: none;
  line-height: 1.3;
  transition: color 0.2s;
}

.cart__item-title:hover {
  color: var(--primary);
}

.cart__item-variant {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  margin: 0;
}

.cart__item-rating {
  display: flex;
  gap: 0.0625rem;
  color: var(--star);
}

/* Quantity controls */
.cart__item-quantity {
  display: flex;
  align-items: center;
}

.cart__item-quantity-controls {
  display: inline-flex;
  align-items: center;
  border: 1.5px solid var(--border);
  border-radius: 0.375rem;
  overflow: hidden;
}

.cart__item-quantity-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  color: var(--foreground);
  cursor: pointer;
  transition: background 0.15s;
  padding: 0;
}

.cart__item-quantity-btn:hover {
  background: var(--muted);
}

.cart__item-quantity-input {
  width: 36px;
  height: 32px;
  border: none;
  background: transparent;
  text-align: center;
  font-size: 0.8125rem;
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--foreground);
  -moz-appearance: textfield;
}

.cart__item-quantity-input::-webkit-outer-spin-button,
.cart__item-quantity-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Price & Total */
.cart__item-price {
  font-size: 0.875rem;
  color: var(--foreground);
}

.cart__item-price--sale {
  color: #ef4444;
  font-weight: 600;
}

.cart__item-price--compare {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.cart__item-total {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--foreground);
}

.cart__item-remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  color: var(--muted-foreground);
  cursor: pointer;
  border-radius: 0.25rem;
  transition: color 0.2s, background 0.15s;
  padding: 0;
}

.cart__item-remove:hover {
  color: #ef4444;
  background: rgba(239, 68, 68, 0.08);
}

/* Continue shopping */
.cart__continue {
  padding: 1rem 0;
}

.cart__continue-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
  color: var(--muted-foreground);
  text-decoration: none;
  transition: color 0.2s;
}

.cart__continue-link:hover {
  color: var(--primary);
}

/* --- Order Summary --- */
.cart__summary {
  position: sticky;
  top: calc(var(--header-height) + 1.5rem);
}

.cart__summary-inner {
  background: var(--muted);
  border-radius: 0.75rem;
  padding: 1.75rem;
}

.cart__summary-title {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--foreground);
  margin: 0 0 1.25rem;
}

/* Promo code */
.cart__promo {
  margin-bottom: 1.25rem;
}

.cart__promo-input-wrapper {
  display: flex;
  gap: 0.5rem;
}

.cart__promo-input {
  flex: 1;
  padding: 0.5rem 0.75rem;
  border: 1.5px solid var(--border);
  border-radius: 0.375rem;
  background: var(--background);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  color: var(--foreground);
}

.cart__promo-input::placeholder {
  color: var(--muted-foreground);
}

.cart__promo-input:focus {
  outline: none;
  border-color: var(--primary);
}

.cart__promo-btn {
  padding: 0.5rem 1rem;
  border: 1.5px solid var(--primary);
  border-radius: 0.375rem;
  background: transparent;
  color: var(--primary);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  white-space: nowrap;
}

.cart__promo-btn:hover {
  background: var(--primary);
  color: #fff;
}

.cart__promo-message {
  font-size: 0.75rem;
  margin: 0.5rem 0 0;
}

.cart__promo-message--success {
  color: #16a34a;
}

.cart__promo-message--error {
  color: #ef4444;
}

/* Totals */
.cart__summary-totals {
  margin-bottom: 1.25rem;
}

.cart__summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0;
  font-size: 0.875rem;
  color: var(--foreground);
}

.cart__summary-row--total {
  font-size: 1.125rem;
  font-weight: 700;
}

.cart__summary-discount {
  color: #16a34a;
  font-weight: 500;
}

.cart__summary-free {
  color: #16a34a;
  font-weight: 600;
}

.cart__summary-divider {
  height: 1px;
  background: var(--border);
  margin: 0.5rem 0;
}

/* Delivery estimate */
.cart__delivery-estimate {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  margin-bottom: 1rem;
}

.cart__delivery-estimate svg {
  flex-shrink: 0;
  color: var(--primary);
}

/* Checkout button */
.cart__checkout-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.875rem 1.5rem;
  border: none;
  border-radius: 0.5rem;
  background: var(--primary);
  color: #fff;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(201, 167, 160, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
  margin-bottom: 1rem;
}

.cart__checkout-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(201, 167, 160, 0.45);
  color: #fff;
}

/* Trust badges */
.cart__trust-badges {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.cart__trust-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.cart__trust-badge svg {
  flex-shrink: 0;
  color: var(--primary);
}

/* Payment logos */
.cart__payment-logos {
  text-align: center;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
}

.cart__payment-label {
  display: block;
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  margin-bottom: 0.5rem;
}

.cart__payment-icons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.cart__payment-icon {
  height: 20px;
  width: auto;
  opacity: 0.5;
}

/* --- Social proof --- */
.cart__social-proof {
  text-align: center;
  padding: 1rem 0;
  margin-top: 1.5rem;
}

.cart__social-proof-text {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  margin: 0;
}

/* --- Upsell section --- */
.cart__upsell {
  margin-top: 3rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--border);
}

.cart__upsell-title {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--foreground);
  text-align: center;
  margin: 0 0 1.5rem;
}

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

.cart__upsell-card {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  background: var(--muted);
  border-radius: 0.75rem;
}

.cart__upsell-card-image {
  flex-shrink: 0;
}

.cart__upsell-card-image img {
  display: block;
  width: 80px;
  height: 100px;
  object-fit: cover;
  border-radius: 0.5rem;
}

.cart__upsell-card-info {
  min-width: 0;
}

.cart__upsell-card-title {
  display: block;
  font-family: var(--font-heading);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
  text-decoration: none;
  margin-bottom: 0.25rem;
  line-height: 1.3;
}

.cart__upsell-card-title:hover {
  color: var(--primary);
}

.cart__upsell-card-price {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--primary);
  margin: 0 0 0.5rem;
}

.cart__upsell-card-btn {
  padding: 0.375rem 1rem;
  border: 1.5px solid var(--primary);
  border-radius: 0.375rem;
  background: transparent;
  color: var(--primary);
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.cart__upsell-card-btn:hover {
  background: var(--primary);
  color: #fff;
}

/* --- Empty cart --- */
.cart__empty {
  text-align: center;
  padding: 5rem 1rem;
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.cart__empty-icon {
  color: var(--muted-foreground);
  opacity: 0.4;
  margin-bottom: 1.5rem;
}

.cart__empty-title {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 700;
  color: var(--foreground);
  margin: 0 0 0.75rem;
}

.cart__empty-text {
  font-size: 1rem;
  color: var(--muted-foreground);
  max-width: 420px;
  margin: 0 auto 1.5rem;
  line-height: 1.6;
}

.cart__empty-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  border: none;
  border-radius: 0.5rem;
  background: var(--primary);
  color: #fff;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(201, 167, 160, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
}

.cart__empty-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(201, 167, 160, 0.45);
  color: #fff;
}


/* ============================================================
   404 PAGE (error-page__)
   ============================================================ */

.error-page {
  padding-top: 2rem;
}

/* Hero */
.error-page__hero {
  text-align: center;
  padding: var(--section-py) var(--section-px) 3rem;
}

.error-page__hero-inner {
  max-width: 640px;
  margin: 0 auto;
}

.error-page__code {
  display: block;
  font-family: var(--font-heading);
  font-size: clamp(5rem, 15vw, 9rem);
  font-weight: 300;
  color: var(--primary);
  line-height: 1;
  margin: 0 0 0.75rem;
  opacity: 0.35;
  letter-spacing: 0.1em;
}

.error-page__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0 0 1rem;
  line-height: 1.3;
}

.error-page__description {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  color: var(--muted-foreground);
  line-height: 1.7;
  margin: 0 0 2rem;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

/* Search */
.error-page__search {
  margin: 0 0 2rem;
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
}

.error-page__search-form {
  display: flex;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-full);
  overflow: hidden;
  background: var(--card);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--transition-base), border-color var(--transition-base);
}

.error-page__search-form:focus-within {
  border-color: var(--primary);
  box-shadow: var(--shadow-md), 0 0 0 3px rgba(196, 160, 130, 0.12);
}

.error-page__search-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0.875rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--foreground);
  outline: none;
}

.error-page__search-input::placeholder {
  color: var(--muted-foreground);
  opacity: 0.7;
}

.error-page__search-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  border: none;
  background: transparent;
  color: var(--primary);
  cursor: pointer;
  transition: color var(--transition-fast);
}

.error-page__search-btn:hover {
  color: var(--primary-dark);
}

/* CTA */
.error-page__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 2.25rem;
  border: none;
  border-radius: var(--radius-full);
  background: var(--primary);
  color: var(--primary-foreground);
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: 0.02em;
  box-shadow: 0 4px 14px rgba(196, 160, 130, 0.3);
  transition: transform var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}

.error-page__cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(196, 160, 130, 0.4);
  background: var(--primary-dark);
  color: var(--primary-foreground);
}

/* Suggestions */
.error-page__suggestions {
  background: var(--muted);
  padding: var(--section-py) var(--section-px);
}

.error-page__suggestions-inner {
  max-width: var(--max-width);
  margin: 0 auto;
  text-align: center;
}

.error-page__suggestions-title {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0 0 0.5rem;
}

.error-page__suggestions-subtitle {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--muted-foreground);
  margin: 0 0 2.5rem;
}

.error-page__suggestions-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  max-width: 960px;
  margin: 0 auto 2rem;
}

.error-page__suggestions-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--primary);
  text-decoration: none;
  transition: color var(--transition-fast), gap var(--transition-fast);
}

.error-page__suggestions-link:hover {
  color: var(--primary-dark);
  gap: 0.625rem;
}

/* Quick links */
.error-page__links {
  padding: var(--section-py) var(--section-px);
}

.error-page__links-inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.error-page__links-title {
  font-family: var(--font-heading);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0 0 2rem;
}

.error-page__links-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.error-page__link-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 1.5rem 1rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  text-decoration: none;
  transition: border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-fast);
}

.error-page__link-card:hover {
  border-color: var(--primary-light);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.error-page__link-icon {
  color: var(--primary);
  flex-shrink: 0;
}

.error-page__link-label {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
  letter-spacing: 0.01em;
}

/* Newsletter (404) */
.error-page__newsletter {
  background: var(--muted);
  padding: var(--section-py) var(--section-px);
  text-align: center;
}

.error-page__newsletter-inner {
  max-width: 520px;
  margin: 0 auto;
}

.error-page__newsletter-title {
  font-family: var(--font-heading);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0 0 0.5rem;
}

.error-page__newsletter-text {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--muted-foreground);
  line-height: 1.6;
  margin: 0 0 1.5rem;
}

.error-page__newsletter-form {
  display: flex;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-full);
  overflow: hidden;
  background: var(--card);
}

.error-page__newsletter-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0.875rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--foreground);
  outline: none;
}

.error-page__newsletter-input::placeholder {
  color: var(--muted-foreground);
  opacity: 0.7;
}

.error-page__newsletter-btn {
  padding: 0.875rem 1.75rem;
  border: none;
  background: var(--primary);
  color: var(--primary-foreground);
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background var(--transition-fast);
}

.error-page__newsletter-btn:hover {
  background: var(--primary-dark);
}

.error-page__newsletter-error {
  background: rgba(196, 77, 86, 0.08);
  color: var(--destructive);
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  margin: 0 0 1rem;
  font-size: 0.875rem;
}

.error-page__newsletter-success {
  color: var(--success);
  font-weight: 500;
  margin: 0 0 1rem;
  font-size: 0.9375rem;
}


/* ============================================================
   GENERIC PAGE (page-section__)
   ============================================================ */

.page-section {
  padding-top: 2rem;
}

/* Breadcrumbs */
.page-section__breadcrumbs {
  padding: 1rem var(--section-px);
  background: transparent;
}

.page-section__breadcrumbs-inner {
  max-width: var(--max-width);
  margin: 0 auto;
}

.page-section__breadcrumbs-list {
  display: flex;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  letter-spacing: 0.02em;
}

.page-section__breadcrumbs-item {
  display: flex;
  align-items: center;
}

.page-section__breadcrumbs-item:not(:last-child)::after {
  content: '/';
  margin: 0 0.5rem;
  color: var(--border-strong);
  font-size: 0.75rem;
}

.page-section__breadcrumbs-link {
  color: var(--muted-foreground);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.page-section__breadcrumbs-link:hover {
  color: var(--primary);
}

.page-section__breadcrumbs-item--active {
  color: var(--foreground);
  font-weight: 500;
}

/* Page header */
.page-section__header {
  text-align: center;
  padding: 3rem var(--section-px) 0;
}

.page-section__header-inner {
  max-width: 720px;
  margin: 0 auto;
}

.page-section__subtitle {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--primary);
  margin: 0 0 0.75rem;
}

.page-section__title {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0;
  line-height: 1.2;
}

.page-section__header-desc {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  color: var(--muted-foreground);
  line-height: 1.7;
  margin: 1rem 0 0;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

.page-section__header-line {
  width: 48px;
  height: 2px;
  background: var(--primary);
  margin: 2rem auto 0;
  border-radius: 1px;
  opacity: 0.6;
}

/* Content area */
.page-section__content-wrap {
  padding: 3rem var(--section-px) var(--section-py);
}

.page-section__content-inner {
  max-width: 800px;
  margin: 0 auto;
}

.page-section__content.rte {
  font-size: 1.0625rem;
  line-height: 1.85;
  color: var(--foreground);
}

/* CTA section */
.page-section__cta {
  background: var(--muted);
  padding: var(--section-py) var(--section-px);
  text-align: center;
}

.page-section__cta-inner {
  max-width: 600px;
  margin: 0 auto;
}

.page-section__cta-title {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0 0 0.75rem;
}

.page-section__cta-description {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.7;
  margin: 0 0 2rem;
}

.page-section__cta-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.page-section__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 2rem;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: 0.02em;
  transition: transform var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}

.page-section__cta-btn--primary {
  background: var(--primary);
  color: var(--primary-foreground);
  box-shadow: 0 4px 14px rgba(196, 160, 130, 0.3);
}

.page-section__cta-btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(196, 160, 130, 0.4);
  background: var(--primary-dark);
  color: var(--primary-foreground);
}

.page-section__cta-btn--secondary {
  background: transparent;
  color: var(--foreground);
  border: 1.5px solid var(--border-strong);
}

.page-section__cta-btn--secondary:hover {
  border-color: var(--primary);
  color: var(--primary);
  transform: translateY(-2px);
}

/* Newsletter (page) */
.page-section__newsletter {
  padding: var(--section-py) var(--section-px);
  text-align: center;
}

.page-section__newsletter-inner {
  max-width: 520px;
  margin: 0 auto;
}

.page-section__newsletter-title {
  font-family: var(--font-heading);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  font-weight: 500;
  color: var(--foreground);
  margin: 0 0 0.5rem;
}

.page-section__newsletter-text {
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--muted-foreground);
  line-height: 1.6;
  margin: 0 0 1.5rem;
}

.page-section__newsletter-form {
  display: flex;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-full);
  overflow: hidden;
  background: var(--card);
}

.page-section__newsletter-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0.875rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--foreground);
  outline: none;
}

.page-section__newsletter-input::placeholder {
  color: var(--muted-foreground);
  opacity: 0.7;
}

.page-section__newsletter-btn {
  padding: 0.875rem 1.75rem;
  border: none;
  background: var(--primary);
  color: var(--primary-foreground);
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background var(--transition-fast);
}

.page-section__newsletter-btn:hover {
  background: var(--primary-dark);
}

.page-section__newsletter-error {
  background: rgba(196, 77, 86, 0.08);
  color: var(--destructive);
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  margin: 0 0 1rem;
  font-size: 0.875rem;
}

.page-section__newsletter-success {
  color: var(--success);
  font-weight: 500;
  margin: 0 0 1rem;
  font-size: 0.9375rem;
}

/* Rich text content (.rte) */
.page-section__content.rte,
.rte {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--foreground);
}

.rte h1,
.rte h2,
.rte h3,
.rte h4,
.rte h5,
.rte h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  color: var(--foreground);
  margin: 2rem 0 0.75rem;
  line-height: 1.3;
}

.rte h2 { font-size: 1.5rem; }
.rte h3 { font-size: 1.25rem; }
.rte h4 { font-size: 1.125rem; }

.rte p {
  margin: 0 0 1.25rem;
}

.rte a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s;
}

.rte a:hover {
  color: var(--foreground);
}

.rte ul,
.rte ol {
  margin: 0 0 1.25rem;
  padding-left: 1.5rem;
}

.rte li {
  margin-bottom: 0.375rem;
}

.rte blockquote {
  border-left: 3px solid var(--primary);
  margin: 1.5rem 0;
  padding: 1rem 1.5rem;
  font-style: italic;
  color: var(--muted-foreground);
  background: var(--muted);
  border-radius: 0 0.5rem 0.5rem 0;
}

.rte img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
  margin: 1.5rem 0;
}

.rte table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
}

.rte th,
.rte td {
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  text-align: left;
}

.rte th {
  background: var(--muted);
  font-weight: 600;
}

.rte hr {
  border: none;
  border-top: 1px solid var(--border);
  margin: 2rem 0;
}


/* ============================================================
   BLOG
   ============================================================ */

.blog {
  padding: 3rem 0 5rem;
}

.blog__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.blog__title {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: var(--foreground);
  margin: 0 0 2rem;
  text-align: center;
}

.blog__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 2.5rem;
}

.blog__card {
  border-radius: 0.75rem;
  overflow: hidden;
  background: var(--background);
  border: 1px solid var(--border);
  transition: transform 0.3s, box-shadow 0.3s;
}

.blog__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.blog__card-image-wrapper {
  display: block;
  overflow: hidden;
  aspect-ratio: 3 / 2;
}

.blog__card-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s;
}

.blog__card:hover .blog__card-image {
  transform: scale(1.05);
}

.blog__card-content {
  padding: 1.25rem;
}

.blog__card-date {
  display: block;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.5rem;
}

.blog__card-title {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 0.5rem;
}

.blog__card-title a {
  color: var(--foreground);
  text-decoration: none;
  transition: color 0.2s;
}

.blog__card-title a:hover {
  color: var(--primary);
}

.blog__card-excerpt {
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--muted-foreground);
  margin: 0 0 0.75rem;
}

.blog__card-link {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--primary);
  text-decoration: none;
  transition: color 0.2s;
}

.blog__card-link:hover {
  color: var(--foreground);
}

/* Blog pagination */
.blog__pagination {
  padding: 1rem 0 0;
}

.blog__pagination-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
}

.blog__pagination-btn {
  padding: 0.5rem 1rem;
  border: 1.5px solid var(--border);
  border-radius: 0.375rem;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
}

.blog__pagination-btn:hover {
  border-color: var(--primary);
  background: var(--muted);
}

.blog__pagination-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1.5px solid var(--border);
  border-radius: 0.375rem;
  background: var(--background);
  color: var(--foreground);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s;
}

.blog__pagination-link:hover {
  border-color: var(--primary);
}

.blog__pagination-link--current {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}


/* ============================================================
   ARTICLE
   ============================================================ */

.article {
  padding: 0 0 5rem;
}

.article__container {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* Breadcrumbs */
.article__breadcrumbs {
  padding: 1rem 0;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--border);
}

.article__breadcrumbs-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 0.375rem;
}

.article__breadcrumbs-item {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  font-family: var(--font-body);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-foreground);
}

.article__breadcrumbs-link {
  color: var(--muted-foreground);
  text-decoration: none;
  transition: color 0.2s;
}

.article__breadcrumbs-link:hover {
  color: var(--primary);
}

/* Content */
.article__content {
  margin: 0;
}

/* Hero image */
.article__hero-image {
  margin-bottom: 2rem;
  border-radius: 0.75rem;
  overflow: hidden;
}

.article__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* Header */
.article__header {
  margin-bottom: 2rem;
  text-align: center;
}

.article__date {
  display: block;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.75rem;
}

.article__title {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 700;
  color: var(--foreground);
  margin: 0 0 0.5rem;
  line-height: 1.2;
}

.article__author {
  font-size: 0.9375rem;
  color: var(--muted-foreground);
  margin: 0;
}

/* Body */
.article__body {
  margin-bottom: 2.5rem;
}

/* Tags */
.article__tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 1.5rem 0;
  border-top: 1px solid var(--border);
  margin-bottom: 2rem;
}

.article__tags-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--foreground);
}

.article__tag {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  border: 1.5px solid var(--border);
  border-radius: 9999px;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-decoration: none;
  transition: all 0.2s;
}

.article__tag:hover {
  border-color: var(--primary);
  color: var(--primary);
}

/* Comments */
.article__comments {
  border-top: 1px solid var(--border);
  padding-top: 2rem;
}

.article__comments-title {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--foreground);
  margin: 0 0 1.5rem;
}

.article__comment {
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
}

.article__comment-author {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--foreground);
  margin: 0 0 0.25rem;
}

.article__comment-date {
  display: block;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  margin-bottom: 0.5rem;
}

.article__comment-body {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--foreground);
}

/* Comment form */
.article__comment-form-title {
  font-family: var(--font-heading);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--foreground);
  margin: 2rem 0 1rem;
}

.article__comment-form-field {
  margin-bottom: 1rem;
}

.article__comment-form-field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--foreground);
  margin-bottom: 0.375rem;
}

.article__comment-form-field input,
.article__comment-form-field textarea {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1.5px solid var(--border);
  border-radius: 0.5rem;
  background: var(--background);
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--foreground);
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.article__comment-form-field input:focus,
.article__comment-form-field textarea:focus {
  outline: none;
  border-color: var(--primary);
}

.article__comment-form-field textarea {
  resize: vertical;
  min-height: 120px;
}

.article__comment-submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  border: none;
  border-radius: 0.5rem;
  background: var(--primary);
  color: #fff;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(201, 167, 160, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
}

.article__comment-submit-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(201, 167, 160, 0.45);
}


/* ============================================================
   RESPONSIVE: TABLET (max-width: 1024px)
   ============================================================ */

@media (max-width: 1024px) {

  /* Product */
  .product__layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .product__details {
    position: static;
  }

  .product__trust-badges {
    grid-template-columns: repeat(4, 1fr);
  }

  .product__reviews-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .product__related-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Collection */
  .collection__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .collection__testimonials-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Cart */
  .cart__layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .cart__summary {
    position: static;
  }

  .cart__upsell-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* ============================================================
   RESPONSIVE: TABLET SMALL (max-width: 768px)
   ============================================================ */

@media (max-width: 768px) {

  /* Product */
  .product__title {
    font-size: 1.5rem;
  }

  .product__trust-badges {
    grid-template-columns: repeat(2, 1fr);
  }

  .product__reviews-grid {
    grid-template-columns: 1fr;
  }

  .product__related-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .product__micro-trust {
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-start;
  }

  /* Collection */
  .collection__hero {
    min-height: 30vh;
  }

  .collection__hero-overlay {
    min-height: 30vh;
  }

  .collection__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }

  .collection__trust-bar-items {
    gap: 1rem;
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 0.25rem;
  }

  .collection__controls-inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .collection__testimonials-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  /* Cart */
  .cart__table-header {
    display: none;
  }

  .cart__item {
    grid-template-columns: 80px 1fr auto;
    gap: 0.75rem;
  }

  .cart__item-image {
    grid-row: span 2;
  }

  .cart__item-info {
    display: flex !important;
    grid-column: auto;
    grid-template-columns: none;
  }

  .cart__item-quantity {
    grid-column: 2;
  }

  .cart__item-price {
    display: none;
  }

  .cart__item-total {
    grid-column: 3;
    grid-row: 1;
  }

  .cart__item-remove {
    grid-column: 3;
    grid-row: 2;
    justify-self: end;
  }

  .cart__upsell-grid {
    grid-template-columns: 1fr;
  }

  /* Blog */
  .blog__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Article */
  .article__container {
    max-width: 100%;
  }
}


/* ============================================================
   RESPONSIVE: MOBILE (max-width: 480px)
   ============================================================ */

@media (max-width: 480px) {

  /* Product */
  .product__container {
    padding: 0 1rem;
  }

  .product__add-to-cart-row {
    flex-direction: column;
  }

  .product__quantity {
    justify-content: center;
  }

  .product__gallery-thumb {
    width: 56px;
    height: 70px;
  }

  .product__trust-badges {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    padding: 0.75rem;
  }

  .product__related-grid {
    grid-template-columns: 1fr;
  }

  /* Collection */
  .collection__container {
    padding: 0 24px;
  }

  .collection__grid {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 1rem;
    row-gap: 2rem;
  }

  .collection__filters {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 0.25rem;
    -webkit-overflow-scrolling: touch;
  }

  .collection__hero-title {
    font-size: 1.75rem;
  }

  /* Cart */
  .cart__container {
    padding: 0 1rem;
  }

  .cart__item {
    grid-template-columns: 64px 1fr auto;
  }

  .cart__item-image {
    width: 64px;
  }

  .cart__item-image img {
    width: 64px;
    height: 80px;
  }

  .cart__summary-inner {
    padding: 1.25rem;
  }

  /* Blog */
  .blog__container {
    padding: 0 1rem;
  }

  .blog__grid {
    grid-template-columns: 1fr;
  }

  /* Article */
  .article__container {
    padding: 0 1rem;
  }

  /* 404 */
  .error-page__code {
    font-size: 5rem;
  }

  .error-page__suggestions-grid {
    grid-template-columns: 1fr;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }

  .error-page__links-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .error-page__newsletter-form,
  .error-page__search-form {
    flex-direction: column;
    border-radius: var(--radius-lg);
  }

  .error-page__newsletter-btn,
  .error-page__search-btn {
    border-radius: 0;
  }

  .error-page__newsletter-btn {
    padding: 0.75rem;
  }

  .error-page__search-btn {
    width: 100%;
    padding: 0.75rem;
  }

  /* Page */
  .page-section__content-inner {
    padding: 0 1rem;
  }

  .page-section__newsletter-form {
    flex-direction: column;
    border-radius: var(--radius-lg);
  }

  .page-section__newsletter-btn {
    border-radius: 0;
    padding: 0.75rem;
  }

  .page-section__cta-buttons {
    flex-direction: column;
  }

  .page-section__cta-btn {
    width: 100%;
  }
}

/* ============================================================
   SEARCH MODAL
   ============================================================ */
.search-modal {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

.search-modal--open {
  opacity: 1;
  visibility: visible;
}

.search-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(61, 56, 52, 0.4);
  backdrop-filter: blur(4px);
}

.search-modal__content {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 640px;
  margin-top: 10vh;
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow-xl);
  overflow: hidden;
  transform: translateY(-20px);
  transition: transform 0.3s;
}

.search-modal--open .search-modal__content {
  transform: translateY(0);
}

.search-modal__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border);
}

.search-modal__form {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.search-modal__icon {
  flex-shrink: 0;
  color: var(--muted-foreground);
}

.search-modal__input {
  flex: 1;
  border: none;
  background: none;
  font-size: 16px;
  font-family: var(--font-body);
  color: var(--foreground);
  outline: none;
}

.search-modal__input::placeholder {
  color: var(--muted-foreground);
}

.search-modal__close {
  flex-shrink: 0;
  padding: 0.5rem;
  border-radius: 50%;
  color: var(--muted-foreground);
  transition: background 0.2s;
  cursor: pointer;
}

.search-modal__close:hover {
  background: var(--muted);
}

.search-modal__results {
  max-height: 60vh;
  overflow-y: auto;
  padding: 1rem 1.5rem;
}

.search-modal__hint {
  text-align: center;
  color: var(--muted-foreground);
  font-size: 14px;
  padding: 2rem 0;
}

.search-modal__products {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.search-modal__product {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem;
  border-radius: var(--radius-sm);
  transition: background 0.2s;
  text-decoration: none;
  color: inherit;
}

.search-modal__product:hover {
  background: var(--muted);
}

.search-modal__product-image {
  width: 60px;
  height: 60px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  background: var(--muted);
  flex-shrink: 0;
}

.search-modal__product-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.search-modal__product-title {
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.search-modal__product-price {
  font-size: 13px;
  color: var(--muted-foreground);
}

.search-modal__view-all {
  display: block;
  text-align: center;
  padding: 1rem;
  margin-top: 0.5rem;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--primary);
  border-top: 1px solid var(--border);
  text-decoration: none;
  transition: opacity 0.2s;
}

.search-modal__view-all:hover {
  opacity: 0.7;
}

/* ============================================================
   MISSING CLASS PATCHES
   ============================================================ */

/* Cart drawer patches */
.cart-drawer__discount-btn { padding: 0.375rem 0.75rem; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; background: var(--accent); color: var(--foreground); border-radius: var(--radius-sm); cursor: pointer; flex-shrink: 0; }
.cart-drawer__empty-link { display: inline-block; background: var(--foreground); color: var(--background); padding: 0.875rem 2rem; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; border-radius: var(--radius-sm); text-decoration: none; }
.cart-drawer__timer-text { font-size: 11px; color: var(--muted-foreground); }
.cart-drawer__upsell-add { padding: 0.5rem 0.875rem; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; border: 1.5px solid var(--primary); color: var(--primary); border-radius: 6px; cursor: pointer; transition: all var(--transition-base); background: #fff; white-space: nowrap; flex-shrink: 0; }
.cart-drawer__upsell-add:hover { background: var(--primary); color: white; }

/* Cart table header cells */
.cart__table-header-cell--price,
.cart__table-header-cell--quantity,
.cart__table-header-cell--total { text-align: center; }

/* Collection base */
.collection { min-height: 100vh; }

/* Featured products patches */
.featured-products__image-wrap { position: relative; aspect-ratio: 3/4; overflow: hidden; background: var(--muted); border-radius: var(--radius-sm); margin-bottom: 1rem; }
.featured-products__image-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--muted); color: var(--muted-foreground); }
.featured-products__info { padding: 0 0.25rem; }
.featured-products__product-title { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.25rem; }
.featured-products__product-title a { color: inherit; text-decoration: none; }
.featured-products__price { font-size: 13px; color: var(--muted-foreground); margin-bottom: 0.375rem; }
.featured-products__rating { display: flex; gap: 1px; }
.featured-products__rating svg { width: 12px; height: 12px; }

/* Footer patches */
.footer__column { min-width: 0; }
.footer__copyright { font-size: 10px; }
.footer__newsletter-discount { font-size: 12px; color: rgba(250, 249, 247, 0.5); margin-top: 0.75rem; }

/* Guarantee text wrapper */

/* Hero patches */
.hero__btn { display: inline-flex; align-items: center; gap: 0.5rem; text-decoration: none; transition: all var(--transition-base); }
.hero__countdown-label { display: block; font-size: 7px; text-transform: uppercase; letter-spacing: 0.15em; color: var(--muted-foreground); margin-top: 2px; }

/* Stats bar text wrapper */
.stats-bar__text { display: flex; flex-direction: column; align-items: center; }

/* Product popular badge */
.product__popular-badge { display: inline-flex; align-items: center; gap: 0.375rem; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: var(--primary); background: rgba(196, 160, 130, 0.1); padding: 0.375rem 0.75rem; border-radius: var(--radius-full); }
.product__popular-badge svg { width: 12px; height: 12px; }

/* Product quantity button variants */
.product__quantity-btn--minus,
.product__quantity-btn--plus { display: flex; align-items: center; justify-content: center; }

/* ---------------------------------------------------------------
   PRODUCT COMPARISON (Product Page)
   --------------------------------------------------------------- */

.product-comparison {
  padding: 5rem 1.5rem;
  background: var(--background);
}

.product-comparison__wrapper {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.product-comparison__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 1rem;
}

.product-comparison__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-bottom: 1rem;
  color: var(--foreground);
}

.product-comparison__subtitle {
  color: var(--text-muted);
  line-height: 1.6;
  margin-bottom: 3rem;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.product-comparison__table-wrap {
  overflow-x: auto;
  margin-bottom: 2.5rem;
}

.product-comparison__table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 0.9375rem;
}

.product-comparison__table thead th {
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
  font-weight: 600;
  color: var(--text-muted);
  background: var(--muted);
}

.product-comparison__col-ours {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--primary) !important;
}

.product-comparison__col-other {
  text-align: center;
}

.product-comparison__table tbody td {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

.product-comparison__feature {
  font-weight: 600;
  color: var(--foreground);
  white-space: nowrap;
}

.product-comparison__ours {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--foreground);
}

.product-comparison__other {
  text-align: center;
  color: var(--text-muted);
}

.product-comparison__other {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.product-comparison__icon-check {
  flex-shrink: 0;
}

.product-comparison__icon-x {
  flex-shrink: 0;
}

.product-comparison__cta {
  display: inline-block;
  background: var(--primary);
  color: #fff;
  padding: 1rem 3rem;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background var(--transition-base);
}

.product-comparison__cta:hover {
  background: rgba(201, 167, 160, 0.9);
}

@media (min-width: 768px) {
  .product-comparison {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   PRODUCT BUNDLE (Frequently Bought Together)
   --------------------------------------------------------------- */

.product-bundle {
  padding: 5rem 1.5rem;
  background: var(--foreground);
  color: var(--background);
}

.product-bundle__wrapper {
  max-width: var(--max-width);
  margin: 0 auto;
  text-align: center;
}

.product-bundle__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(250, 249, 247, 0.4);
  display: block;
  margin-bottom: 1rem;
}

.product-bundle__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-style: italic;
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-bottom: 0.75rem;
  color: var(--background);
}

.product-bundle__subtitle {
  color: rgba(250, 249, 247, 0.6);
  line-height: 1.6;
  margin-bottom: 3rem;
}

.product-bundle__grid {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 0.5rem;
  text-align: left;
}

.product-bundle__grid::-webkit-scrollbar {
  display: none;
}

.product-bundle__grid .product-card {
  flex: 0 0 280px;
  scroll-snap-align: start;
}

@media (min-width: 1024px) {
  .product-bundle__grid .product-card {
    flex: 0 0 calc(25% - 1.125rem);
  }
}

.product-bundle .product-card__title a {
  color: var(--background);
}

.product-bundle .product-card__price {
  color: var(--background);
}

.product-bundle .product-card__rating-count {
  color: rgba(250, 249, 247, 0.5);
}

.product-bundle .product-card__viewers {
  color: rgba(250, 249, 247, 0.5);
}

.product-bundle .product-card__viewers svg {
  color: rgba(250, 249, 247, 0.5);
}

.product-bundle .product-card__variants {
  color: rgba(250, 249, 247, 0.5);
}

@media (min-width: 768px) {
  .product-bundle {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   ABOUT HERO
   --------------------------------------------------------------- */

.about-hero {
  padding: 7rem 1.5rem 5rem;
  background: var(--background);
  text-align: center;
}

.about-hero__wrapper {
  max-width: 40rem;
  margin: 0 auto;
}

.about-hero__label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 2rem;
}

.about-hero__label-line {
  display: block;
  width: 2.5rem;
  height: 1px;
  background: var(--primary);
  opacity: 0.4;
}

.about-hero__title {
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 6vw, 4rem);
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--foreground);
  margin: 0 0 1.5rem;
}

.about-hero__text {
  font-size: 1rem;
  color: var(--muted-foreground);
  line-height: 1.7;
  max-width: 32rem;
  margin: 0 auto;
}

@media (min-width: 768px) {
  .about-hero {
    padding: 10rem 2rem 7rem;
  }
}


/* ---------------------------------------------------------------
   PRODUCT URGENCY
   --------------------------------------------------------------- */

.product-urgency {
  padding: 5rem 1.5rem;
  background: var(--muted);
  text-align: center;
}

.product-urgency__wrapper {
  max-width: 42rem;
  margin: 0 auto;
}

.product-urgency__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  font-style: italic;
  letter-spacing: -0.01em;
  margin-bottom: 1rem;
  color: var(--foreground);
}

.product-urgency__text {
  color: var(--muted-foreground);
  line-height: 1.6;
  margin-bottom: 2.5rem;
}

.product-urgency__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.product-urgency__countdown {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.product-urgency__unit {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: var(--background);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 0.5rem 0.75rem;
  min-width: 48px;
}

.product-urgency__number {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--foreground);
  line-height: 1;
}

.product-urgency__unit-label {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--muted-foreground);
  margin-top: 0.125rem;
}

.product-urgency__sep {
  font-size: 1.25rem;
  color: var(--muted-foreground);
  font-weight: 700;
}

.product-urgency__cta {
  display: inline-block;
  background: var(--foreground);
  color: var(--background);
  padding: 1rem 2.5rem;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: opacity var(--transition-base);
}

.product-urgency__cta:hover {
  opacity: 0.9;
}

.product-urgency__trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem 2rem;
  margin-bottom: 2rem;
}

.product-urgency__trust-item {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

.product-urgency__trust-item svg {
  color: var(--muted-foreground);
  flex-shrink: 0;
}

.product-urgency__trust-item span {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 600;
  color: var(--foreground);
}

.product-urgency__social-proof {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  text-align: center;
  line-height: 1.5;
  padding: 0 1rem;
}

.product-urgency__social-proof svg {
  color: var(--primary);
  flex-shrink: 0;
}

.product-urgency__social-proof strong {
  color: var(--foreground);
}

@media (max-width: 767px) {
  .product-urgency__social-proof {
    font-size: 0.6875rem;
    white-space: nowrap;
  }

  .product-urgency__trust {
    gap: 0.625rem 1rem;
  }

  .product-urgency__trust-item span {
    font-size: 0.5rem;
    letter-spacing: 0.08em;
  }
}

@media (min-width: 768px) {
  .product-urgency {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   PRODUCT RELATED
   --------------------------------------------------------------- */

.product-related {
  padding: 5rem 1.5rem;
  background: var(--background);
}

.product-related__wrapper {
  max-width: var(--max-width);
  margin: 0 auto;
}

.product-related__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 2.5rem;
}

.product-related__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3vw, 2rem);
  letter-spacing: -0.01em;
  color: var(--foreground);
  margin: 0;
  font-style: italic;
}

.product-related__link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--primary);
  text-decoration: none;
}

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

@media (max-width: 768px) {
  .product-related__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}

@media (max-width: 480px) {
  .product-related__grid {
    grid-template-columns: 1fr;
    max-width: 320px;
    margin: 0 auto;
  }

  .product-related__header {
    flex-direction: column;
    gap: 0.75rem;
  }
}

@media (min-width: 768px) {
  .product-related {
    padding: 7rem 2rem;
  }
}


/* ---------------------------------------------------------------
   PRODUCT RITUAL (Split Wellness)
   --------------------------------------------------------------- */

.product-ritual {}

.product-ritual__container {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 80vh;
}

.product-ritual__image-col {
  position: relative;
  overflow: hidden;
  min-height: 400px;
}

.product-ritual__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-ritual__image-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #4a4540 0%, #2c2825 100%);
}

.product-ritual__content-col {
  background: var(--background);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem;
}

.product-ritual__content {
  max-width: 32rem;
}

.product-ritual__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  display: block;
  margin-bottom: 1.5rem;
}

.product-ritual__title {
  font-family: var(--font-heading);
  font-size: clamp(1.875rem, 4vw, 2.75rem);
  letter-spacing: -0.01em;
  margin-bottom: 1.5rem;
  line-height: 1.15;
  color: var(--foreground);
}

.product-ritual__text {
  color: var(--muted-foreground);
  line-height: 1.7;
  margin-bottom: 2rem;
}

.product-ritual__list {
  list-style: none;
  padding: 0;
  margin: 0 0 2.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.product-ritual__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--foreground);
  font-size: 0.9375rem;
  line-height: 1.5;
}

.product-ritual__check {
  flex-shrink: 0;
  color: var(--muted-foreground);
}

.product-ritual__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  background: var(--foreground);
  color: var(--background);
  padding: 1rem 2rem;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: opacity var(--transition-base);
}

.product-ritual__cta:hover {
  opacity: 0.9;
}

@media (min-width: 768px) {
  .product-ritual__container {
    grid-template-columns: 1fr 1fr;
  }

  .product-ritual__content-col {
    padding: 6rem;
  }
}


/* ---------------------------------------------------------------
   TRIPLE GUARANTEE
   --------------------------------------------------------------- */

.triple-guarantee {
  padding: 5rem 1.5rem;
  background: var(--foreground);
  color: var(--background);
}

.triple-guarantee__wrapper {
  max-width: var(--max-width);
  margin: 0 auto;
  text-align: center;
}

.triple-guarantee__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(250, 249, 247, 0.4);
  display: block;
  margin-bottom: 1rem;
}

.triple-guarantee__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-bottom: 3.5rem;
  color: var(--background);
}

.triple-guarantee__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.triple-guarantee__item {
  text-align: center;
}

.triple-guarantee__icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(250, 249, 247, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
  color: rgba(250, 249, 247, 0.6);
}

.triple-guarantee__item-title {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--background);
  margin: 0 0 0.375rem;
}

.triple-guarantee__item-subtitle {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(250, 249, 247, 0.35);
  margin-bottom: 1rem;
}

.triple-guarantee__item-text {
  font-size: 0.875rem;
  color: rgba(250, 249, 247, 0.5);
  line-height: 1.7;
  max-width: 22rem;
  margin: 0 auto 1rem;
}

.triple-guarantee__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  color: #4ADE80;
  background: rgba(74, 222, 128, 0.1);
  padding: 0.375rem 0.875rem;
  border-radius: 100px;
}

.triple-guarantee__badge svg {
  color: #4ADE80;
}

@media (min-width: 768px) {
  .triple-guarantee {
    padding: 7rem 2rem;
  }

  .triple-guarantee__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* ---------------------------------------------------------------
   PRODUCT FAQ
   --------------------------------------------------------------- */

.product-faq {
  padding: 5rem 1.5rem;
  background: var(--background);
}

.product-faq__wrapper {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
}

.product-faq__label {
  font-size: 10px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--primary);
  display: block;
  margin-bottom: 1rem;
}

.product-faq__title {
  font-family: var(--font-heading);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  letter-spacing: -0.01em;
  line-height: 1.2;
  margin-bottom: 0.75rem;
  color: var(--foreground);
}

.product-faq__subtitle {
  color: var(--text-muted);
  line-height: 1.6;
  margin-bottom: 3rem;
}

.product-faq__accordion {
  text-align: left;
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  overflow: hidden;
}

.product-faq__item {
  border-bottom: 1px solid var(--border);
}

.product-faq__item:last-child {
  border-bottom: none;
}

.product-faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  cursor: pointer;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--foreground);
  list-style: none;
  -webkit-user-select: none;
  user-select: none;
}

.product-faq__question::-webkit-details-marker { display: none; }
.product-faq__question::marker { display: none; content: ''; }

.product-faq__chevron {
  flex-shrink: 0;
  color: var(--text-muted);
  transition: transform 0.25s ease;
}

.product-faq__item[open] .product-faq__chevron {
  transform: rotate(180deg);
}

.product-faq__answer {
  padding: 0 1.5rem 1.25rem;
  color: var(--text-muted);
  line-height: 1.7;
  font-size: 0.9375rem;
}

.product-faq__answer p { margin: 0; }

@media (min-width: 768px) {
  .product-faq { padding: 7rem 2rem; }
}


/* ---------------------------------------------------------------
   PRODUCT TESTIMONIAL
   --------------------------------------------------------------- */

.product-testimonial {
  padding: 5rem 1.5rem;
  background: var(--foreground);
  color: var(--background);
  text-align: center;
}

.product-testimonial__wrapper {
  max-width: 48rem;
  margin: 0 auto;
}

.product-testimonial__quote-icon {
  font-family: var(--font-heading);
  font-size: 4rem;
  line-height: 1;
  color: rgba(250, 249, 247, 0.2);
  margin-bottom: 1rem;
}

.product-testimonial__text {
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-style: italic;
  line-height: 1.6;
  color: var(--background);
  margin: 0 0 2.5rem;
  overflow-wrap: break-word;
  word-break: break-word;
}

.product-testimonial__author {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
}

.product-testimonial__avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(250, 249, 247, 0.1);
  color: rgba(250, 249, 247, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  margin-bottom: 0.5rem;
}

.product-testimonial__name {
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--background);
}

.product-testimonial__role {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: rgba(250, 249, 247, 0.4);
}

.product-testimonial__stars {
  display: flex;
  gap: 0.125rem;
  margin-top: 0.5rem;
}

@media (max-width: 749px) {
  .product-testimonial {
    padding: 3rem 24px;
  }

  .product-testimonial__wrapper {
    max-width: 100%;
  }

  .product-testimonial__quote-icon {
    font-size: 3rem;
    margin-bottom: 0.5rem;
  }

  .product-testimonial__text {
    font-size: 1.125rem;
    line-height: 1.55;
    margin: 0 0 2rem;
  }

  .product-testimonial__avatar {
    width: 44px;
    height: 44px;
    font-size: 0.75rem;
  }

  .product-testimonial__name {
    font-size: 0.75rem;
  }

  .product-testimonial__role {
    font-size: 0.625rem;
  }

  .product-testimonial__stars svg {
    width: 14px;
    height: 14px;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .product-testimonial {
    padding: 5rem 2rem;
  }
}

@media (min-width: 990px) {
  .product-testimonial {
    padding: 7rem 2rem;
  }
}


/* ============================================================
   PRODUCT CARD — Premium Redesign with Quick ATC
   ============================================================ */
.product-card { position: relative; }
.product-card__image-wrap {
  position: relative;
  aspect-ratio: 3/4;
  overflow: hidden;
  background: var(--muted);
  border-radius: var(--radius-md);
  margin-bottom: 0.875rem;
}
.product-card__image-link { display: block; width: 100%; height: 100%; }
.product-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s;
}
.product-card__image--hover {
  position: absolute;
  inset: 0;
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  .product-card__image-wrap:hover .product-card__image:not(.product-card__image--hover) {
    transform: scale(1.05);
  }
  .product-card__image-wrap:hover .product-card__image--hover {
    opacity: 1;
  }
}
.product-card__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-foreground);
}
.product-card__badges {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.375rem;
  z-index: 2;
  max-width: calc(100% - 1.5rem);
}
.product-card__badge {
  display: inline-block;
  padding: 0.25rem 0.625rem;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: var(--radius-sm);
  line-height: 1.4;
}
.product-card__badge--sale {
  background: var(--foreground);
  color: var(--background);
}
.product-card__badge--new {
  background: var(--primary);
  color: white;
}
.product-card__badge--best {
  background: var(--primary);
  color: white;
}
.product-card__badge--soldout {
  background: var(--muted);
  color: var(--muted-foreground);
}

/* Quick Add to Cart button */
.product-card__atc {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: rgba(44, 40, 37, 0.92);
  backdrop-filter: blur(8px);
  color: white;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  border: none;
  cursor: pointer;
  opacity: 0;
  transform: translateY(100%);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 3;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
}
.product-card__image-wrap:hover .product-card__atc {
  opacity: 1;
  transform: translateY(0);
}
.product-card__atc:hover {
  background: var(--primary);
}
.product-card__atc:active {
  transform: translateY(0) scale(0.98);
}
.product-card__atc svg { flex-shrink: 0; }
.product-card__atc--loading span { opacity: 0; }
.product-card__atc--loading::after {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top-color: white;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
}
.product-card__atc--success {
  background: var(--success) !important;
}

/* Product card info */
.product-card__info { padding: 0 0.125rem; }
.product-card__title-link { text-decoration: none; color: inherit; }
.product-card__title {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 0.25rem;
  transition: color var(--transition-base);
}
.product-card__title-link:hover .product-card__title {
  color: var(--primary);
}
.product-card__subtitle {
  font-size: 12px;
  color: var(--muted-foreground);
  margin-bottom: 0.375rem;
  line-height: 1.4;
}
.product-card__price-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.product-card__price {
  font-size: 14px;
  font-weight: 600;
  color: var(--foreground);
}
.product-card__price--sale {
  color: var(--destructive);
}
.product-card__price--compare {
  font-size: 12px;
  color: var(--muted-foreground);
  font-weight: 400;
}

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

/* Mobile: show ATC button always (no hover on touch) */
@media (max-width: 768px) {
  .product-card__atc {
    opacity: 1;
    transform: translateY(0);
    position: relative;
    border-radius: var(--radius-sm);
    margin-top: 0.5rem;
    background: var(--foreground);
  }
  .product-card__image-wrap { margin-bottom: 0.625rem; }
}

/* Collection Hero — Promo Subtitle & CTA */
.collection__hero-subtitle {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--primary-light, #D4B896);
  background: rgba(255,255,255,0.15);
  backdrop-filter: blur(4px);
  padding: 0.375rem 1rem;
  border-radius: var(--radius-full);
  margin-bottom: 1rem;
}
.collection__hero-cta {
  display: inline-block;
  margin-top: 1.5rem;
  padding: 0.875rem 2.5rem;
  background: white;
  color: var(--foreground);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  text-decoration: none;
  border-radius: var(--radius-sm);
  transition: all var(--transition-base);
}
.collection__hero-cta:hover {
  background: var(--primary);
  color: white;
  transform: translateY(-1px);
}

/* ============================================
   CAMPAIGN BANNER — Product Page Hero
   Premium campaign-style banner system
   ============================================ */

/* ── Base ── */
.campaign-banner {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin-bottom: 0;
}

/* ── Background Layer ── */
.campaign-banner__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.campaign-banner__bg-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.campaign-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(44, 40, 37, var(--cb-overlay-opacity, 0.35)) 0%,
    rgba(44, 40, 37, calc(var(--cb-overlay-opacity, 0.35) * 0.5)) 100%
  );
  z-index: 1;
}

/* ── Gradient Fallback (no-image state) ── */
.campaign-banner__gradient-fallback {
  position: absolute;
  inset: 0;
  background: var(--cb-bg, #F5F0EC);
  background-image:
    radial-gradient(ellipse at 20% 80%, rgba(196, 160, 130, 0.15) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(212, 197, 185, 0.2) 0%, transparent 50%),
    linear-gradient(135deg, var(--cb-bg, #F5F0EC) 0%, #EDE8E3 100%);
}

/* Decorative elements for fallback */
.campaign-banner__deco {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.campaign-banner__deco--circle-1 {
  width: 400px;
  height: 400px;
  right: -100px;
  top: -100px;
  border: 1px solid rgba(196, 160, 130, 0.12);
}
.campaign-banner__deco--circle-2 {
  width: 280px;
  height: 280px;
  left: -60px;
  bottom: -60px;
  border: 1px solid rgba(196, 160, 130, 0.08);
}
.campaign-banner__deco--line {
  position: absolute;
  width: 1px;
  height: 120px;
  right: 15%;
  top: 50%;
  transform: translateY(-50%);
  background: linear-gradient(to bottom, transparent, rgba(196, 160, 130, 0.15), transparent);
  border-radius: 0;
}

/* ── Container ── */
.campaign-banner__container {
  position: relative;
  z-index: 2;
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--section-px);
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 100%;
}

/* ── OVERLAY Layout ── */
.campaign-banner--overlay {
  min-height: var(--cb-height, 540px);
}
/* On collection pages, banner needs header clearance */
.template--collection .campaign-banner--overlay {
  padding-top: var(--header-height);
}
.campaign-banner--overlay .campaign-banner__container {
  min-height: var(--cb-height, 540px);
}
.campaign-banner--overlay .campaign-banner__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 3.5rem 0;
  max-width: 640px;
}
.campaign-banner--overlay .campaign-banner__headline,
.campaign-banner--overlay .campaign-banner__label,
.campaign-banner--overlay .campaign-banner__description,
.campaign-banner--overlay .campaign-banner__secondary,
.campaign-banner--overlay .campaign-banner__countdown-label {
  color: var(--cb-text, #2C2825);
}
/* When there IS an image in overlay mode, force light text */
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__headline,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__label,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__description,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__secondary,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__countdown-label,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__countdown-number,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__countdown-unit-label,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__countdown-sep,
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__label-dash {
  color: #FFFFFF;
}
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__feature-pill {
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #FFFFFF;
  border-color: rgba(255, 255, 255, 0.2);
}
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__cta {
  background: #FFFFFF;
  color: var(--foreground);
}
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__cta:hover {
  background: rgba(255, 255, 255, 0.9);
}

/* ── Content alignment modifiers ── */
.campaign-banner__content--align-left { align-items: flex-start; text-align: left; }
.campaign-banner__content--align-center { align-items: center; text-align: center; margin: 0 auto; }
.campaign-banner__content--align-right { align-items: flex-end; text-align: right; margin-left: auto; }
.campaign-banner__content--valign-top { justify-content: flex-start; }
.campaign-banner__content--valign-center { justify-content: center; }
.campaign-banner__content--valign-bottom { justify-content: flex-end; }

/* ── SPLIT Layout ── */
.campaign-banner--split {
  background: var(--cb-bg, #F5F0EC);
}
.campaign-banner--split .campaign-banner__bg {
  display: none;
}
.campaign-banner--split .campaign-banner__container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  min-height: var(--cb-height, 540px);
}
.campaign-banner--split .campaign-banner__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 3.5rem 4rem 3.5rem 0;
}
.campaign-banner--split .campaign-banner__visual {
  position: relative;
  overflow: hidden;
}
.campaign-banner__visual-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.campaign-banner__visual-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--cb-bg, #F5F0EC) 0%, rgba(196, 160, 130, 0.1) 100%);
}

/* ── Badge ── */
.campaign-banner__badge {
  display: inline-block;
  padding: 6px 16px;
  background: var(--cb-accent, var(--primary));
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-radius: var(--radius-full);
  margin-bottom: 1.25rem;
}

/* ── Label ── */
.campaign-banner__label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--cb-accent, var(--primary));
  margin-bottom: 1rem;
}
.campaign-banner__label-dash {
  display: inline-block;
  width: 24px;
  height: 1px;
  background: var(--cb-accent, var(--primary));
}

/* ── Headline ── */
.campaign-banner__headline {
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  font-weight: 400;
  line-height: 1.15;
  margin-bottom: 1.25rem;
  color: var(--cb-text, var(--foreground));
}
.campaign-banner__headline-main {
  display: block;
}
.campaign-banner__headline-italic {
  display: block;
  font-style: italic;
  opacity: 0.85;
}

/* ── Description ── */
.campaign-banner__description {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.7;
  color: var(--cb-text, var(--muted-foreground));
  max-width: 480px;
  margin-bottom: 1.5rem;
  opacity: 0.9;
}

/* ── Feature Pills ── */
.campaign-banner__features {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 1.75rem;
}
.campaign-banner__feature-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  background: rgba(196, 160, 130, 0.08);
  border: 1px solid rgba(196, 160, 130, 0.15);
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--cb-text, var(--foreground));
  white-space: nowrap;
  transition: all var(--transition-fast);
}
.campaign-banner__feature-pill:hover {
  background: rgba(196, 160, 130, 0.14);
  border-color: rgba(196, 160, 130, 0.25);
}

/* ── CTA ── */
.campaign-banner__cta-row {
  margin-bottom: 1rem;
}
.campaign-banner__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  background: var(--cb-accent, var(--primary));
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-decoration: none;
  border-radius: var(--radius-sm);
  transition: all var(--transition-base);
  border: none;
  cursor: pointer;
}
.campaign-banner__cta:hover {
  background: var(--primary-dark, #A8855F);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}
.campaign-banner__cta svg {
  transition: transform var(--transition-fast);
}
.campaign-banner__cta:hover svg {
  transform: translateX(3px);
}

/* ── Secondary Text ── */
.campaign-banner__secondary {
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--cb-text, var(--muted-foreground));
  opacity: 0.7;
}

/* ── Countdown ── */
.campaign-banner__countdown {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 1.5rem;
}
.campaign-banner__countdown-label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--cb-accent, var(--primary));
}
.campaign-banner__countdown-timer {
  display: flex;
  align-items: center;
  gap: 4px;
}
.campaign-banner__countdown-unit {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 48px;
  padding: 8px 10px;
  background: rgba(196, 160, 130, 0.08);
  border: 1px solid rgba(196, 160, 130, 0.12);
  border-radius: var(--radius-sm);
}
.campaign-banner__countdown-number {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 500;
  color: var(--cb-text, var(--foreground));
  line-height: 1;
}
.campaign-banner__countdown-unit-label {
  font-family: var(--font-body);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--cb-text, var(--muted-foreground));
  opacity: 0.6;
  margin-top: 2px;
}
.campaign-banner__countdown-sep {
  font-family: var(--font-heading);
  font-size: 20px;
  color: var(--cb-accent, var(--primary));
  opacity: 0.5;
  margin: 0 2px;
  align-self: flex-start;
  padding-top: 6px;
}

/* Countdown in overlay+image: glass style */
.campaign-banner--overlay:not(.campaign-banner--no-image) .campaign-banner__countdown-unit {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-color: rgba(255, 255, 255, 0.15);
}

/* ── Mobile Responsive ── */
@media (max-width: 749px) {
  .campaign-banner--overlay {
    min-height: 380px;
  }
  .campaign-banner--overlay .campaign-banner__container {
    min-height: 380px;
    padding: 0 24px;
  }
  .campaign-banner--overlay .campaign-banner__content {
    padding: 2rem 0;
    max-width: 100%;
  }

  .campaign-banner--split .campaign-banner__container {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .campaign-banner--split .campaign-banner__content {
    padding: 2rem 24px;
    order: 2;
    text-align: center;
    align-items: center;
  }
  .campaign-banner--split .campaign-banner__visual {
    order: 1;
    min-height: 220px;
    max-height: 280px;
  }

  .campaign-banner__badge {
    font-size: 10px;
    padding: 5px 12px;
    margin-bottom: 1rem;
  }
  .campaign-banner__label {
    font-size: 11px;
    margin-bottom: 0.75rem;
  }
  .campaign-banner__headline {
    font-size: clamp(1.375rem, 6vw, 1.875rem);
    margin-bottom: 1rem;
  }
  .campaign-banner__description {
    font-size: 14px;
    line-height: 1.6;
    max-width: 100%;
    margin-bottom: 1.25rem;
  }
  .campaign-banner__features {
    gap: 6px;
    justify-content: center;
  }
  .campaign-banner__feature-pill {
    font-size: 11px;
    padding: 5px 10px;
  }
  .campaign-banner__cta {
    padding: 12px 24px;
    font-size: 13px;
    width: 100%;
    justify-content: center;
  }
  .campaign-banner__secondary {
    font-size: 12px;
    text-align: center;
  }
  .campaign-banner__countdown {
    align-items: center;
  }
  .campaign-banner__countdown-unit {
    min-width: 40px;
    padding: 6px 8px;
  }
  .campaign-banner__countdown-number {
    font-size: 18px;
  }
  .campaign-banner__countdown-label {
    font-size: 11px;
  }
  .campaign-banner__deco--circle-1 {
    width: 200px;
    height: 200px;
    right: -60px;
    top: -60px;
  }
  .campaign-banner__deco--circle-2 {
    width: 140px;
    height: 140px;
    left: -40px;
    bottom: -40px;
  }
}

@media (min-width: 750px) and (max-width: 989px) {
  .campaign-banner--overlay {
    min-height: 450px;
  }
  .campaign-banner--overlay .campaign-banner__container {
    min-height: 450px;
    padding: 0 2.5rem;
  }
  .campaign-banner--split .campaign-banner__content {
    padding: 2.5rem 2rem 2.5rem 0;
  }
  .campaign-banner__headline {
    font-size: clamp(1.5rem, 3.5vw, 2.5rem);
  }
}

@media (min-width: 990px) {
  .campaign-banner__container {
    padding: 0 var(--section-px-lg);
  }
}

/* ============================================
   PREMIUM ENHANCEMENTS — Phase 2
   Focus states, micro-interactions,
   mobile social links, collection empty state,
   filter clear, misc improvements
   ============================================ */

/* ── Global Focus States ── */
*:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── Button Press Effect ── */
.btn:active,
.hero__btn:active,
.product__add-to-cart-btn:active,
.campaign-banner__cta:active,
.collection__hero-cta:active {
  transform: scale(0.97);
}

/* ── Mobile Social Links Fix ── */
.navbar__mobile-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--muted, #F5F0EA);
  color: var(--foreground, #3D3834);
  text-decoration: none;
  transition: all var(--transition-fast);
}
.navbar__mobile-social a:hover {
  background: var(--primary, #B08D57);
  color: #fff;
}

/* ── Payment Logo Hover ── */
.product__payment-icon {
  opacity: 0.35;
  transition: opacity var(--transition-fast);
}
.product__payment-icon:hover {
  opacity: 0.7;
}

/* ── Trust Item Hover ── */
.footer__trust-item,
.guarantee__item {
  transition: transform var(--transition-fast);
}
.footer__trust-item:hover,
.guarantee__item:hover {
  transform: translateY(-2px);
}

/* ── Collection: Empty State ── */
.collection__empty {
  text-align: center;
  padding: 4rem 1rem;
  grid-column: 1 / -1;
}
.collection__empty-title {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 400;
  margin: 1.5rem 0 0.5rem;
  color: var(--foreground);
}
.collection__empty-text {
  font-size: 14px;
  color: var(--muted-foreground);
  margin-bottom: 1.5rem;
  line-height: 1.6;
}
.collection__empty-btn {
  display: inline-flex;
  padding: 12px 28px;
  background: var(--primary);
  color: white;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--radius-sm);
  transition: all var(--transition-base);
}
.collection__empty-btn:hover {
  background: var(--primary-dark);
  transform: translateY(-1px);
}

/* ── Collection: Results Count ── */
.collection__results-count {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  white-space: nowrap;
}

/* ── Collection: Clear Filter ── */
.collection__filter-clear {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--destructive);
  text-decoration: none;
  border: 1px solid rgba(196, 77, 86, 0.2);
  border-radius: var(--radius-full);
  transition: all var(--transition-fast);
}
.collection__filter-clear:hover {
  background: rgba(196, 77, 86, 0.06);
  border-color: rgba(196, 77, 86, 0.35);
}

/* ── Product Card Enhancements ── */
.product-card__rating {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 4px;
}
.product-card__rating-stars {
  display: flex;
  gap: 1px;
}
.product-card__rating-count {
  font-size: 11px;
  color: var(--muted-foreground);
  font-family: var(--font-body);
}
.product-card__swatches {
  display: flex;
  gap: 4px;
  margin-top: 6px;
}
.product-card__swatch--more {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
  font-weight: 600;
  color: var(--muted-foreground);
  background: var(--muted);
  width: 14px;
  height: 14px;
  border-radius: 50%;
}
.product-card__stock-low {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #d97706;
  font-weight: 500;
  margin-top: 4px;
}
.product-card__stock-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d97706;
  animation: stockPulse 2s ease-in-out infinite;
}
.product-card__shipping-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  color: var(--success);
  font-weight: 500;
  margin-top: 3px;
}
.product-card__wishlist {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 50%;
  border: none;
  cursor: pointer;
  opacity: 0;
  transform: scale(0.8);
  transition: all var(--transition-fast);
  color: var(--muted-foreground);
}
.product-card:hover .product-card__wishlist {
  opacity: 1;
  transform: scale(1);
}
.product-card__wishlist:hover {
  color: #ef4444;
  background: rgba(255,255,255,0.95);
}

/* ── Product Card: Extended Enhancements ── */
.product-card__wishlist-icon {
  color: var(--foreground);
  transition: color 0.2s ease, fill 0.2s ease;
}
.product-card__wishlist:hover .product-card__wishlist-icon,
.product-card__wishlist.is-active .product-card__wishlist-icon {
  color: #c0392b;
}
.product-card__wishlist.is-active .product-card__wishlist-icon {
  fill: #c0392b;
}
.product-card__low-stock {
  position: absolute;
  bottom: 56px;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 5px 10px;
  background: rgba(255,255,255,0.94);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #b7410e;
  z-index: 2;
}
.product-card__low-stock-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #b7410e;
  animation: product-card-pulse 1.6s ease-in-out infinite;
}
@keyframes product-card-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}
.product-card__badge--shipping {
  background: var(--success);
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.product-card__badge-icon {
  flex-shrink: 0;
}
.product-card__swatch-more {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--muted-foreground);
  letter-spacing: 0.01em;
  cursor: default;
}
.product-card__stars {
  display: flex;
  align-items: center;
  gap: 1px;
}
.product-card__star {
  color: var(--star);
}
.product-card__star--empty {
  color: #d1cdc7;
}
.product-card__price-save {
  display: block;
  width: 100%;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--destructive);
  letter-spacing: 0.02em;
  margin-top: 1px;
}
.product-card__atc {
  position: relative;
  overflow: hidden;
}
.product-card__atc-success,
.product-card__atc-spinner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.product-card__atc-spinner::after {
  content: '';
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: product-card-spin 0.6s linear infinite;
}
@keyframes product-card-spin {
  to { transform: rotate(360deg); }
}
.product-card__atc.is-loading .product-card__atc-label,
.product-card__atc.is-loading .product-card__atc-icon {
  opacity: 0;
}
.product-card__atc.is-loading .product-card__atc-spinner {
  opacity: 1;
}
.product-card__atc.is-success {
  background: var(--success) !important;
}
.product-card__atc.is-success .product-card__atc-label,
.product-card__atc.is-success .product-card__atc-icon {
  opacity: 0;
}
.product-card__atc.is-success .product-card__atc-success {
  opacity: 1;
  color: #fff;
}
.product-card__atc-icon,
.product-card__atc-label {
  transition: opacity 0.2s ease;
}

/* ============================================
   SOCIAL PROOF TOAST — Recent Order Notifications
   ============================================ */
.sp-toast {
  position: fixed;
  bottom: 1.5rem;
  left: 1.5rem;
  z-index: 70;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}
.sp-toast--visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.sp-toast__inner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  max-width: 340px;
  min-width: 280px;
}
.sp-toast__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(196, 160, 130, 0.08);
  border-radius: 50%;
}
.sp-toast__content {
  flex: 1;
  min-width: 0;
}
.sp-toast__name {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--foreground);
  margin: 0 0 2px;
  line-height: 1.3;
}
.sp-toast__action {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--muted-foreground);
  margin: 0 0 2px;
  line-height: 1.4;
}
.sp-toast__time {
  font-family: var(--font-body);
  font-size: 11px;
  color: var(--muted-foreground);
  opacity: 0.6;
  margin: 0;
}
.sp-toast__close {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
  color: var(--muted-foreground);
  cursor: pointer;
  opacity: 0.5;
  transition: opacity var(--transition-fast);
  padding: 0;
}
.sp-toast__close:hover {
  opacity: 1;
}
@media (max-width: 480px) {
  .sp-toast {
    left: 0.75rem;
    right: 0.75rem;
    bottom: 1rem;
  }
  .sp-toast__inner {
    max-width: 100%;
  }
}


/* ============================================================
   HEADER — MOBILE RESPONSIVE FIXES
   ============================================================ */

/* ------------------------------------------
   Tablet breakpoint (max-width: 989px)
   ------------------------------------------ */
@media (max-width: 989px) {
  :root {
    --navbar-height: 64px;
    --announcement-height: 36px;
  }

  .navbar {
    padding: 0.75rem 0;
  }

  .navbar--scrolled {
    padding: 0.5rem 0;
  }

  .navbar__container {
    padding: 0;
  }

  .navbar__left {
    gap: 1rem;
  }

  .navbar__right {
    gap: 1rem;
  }

  .navbar__logo {
    max-height: 44px;
  }

  .navbar__brand-name {
    font-size: 16px;
  }

  /* Ensure nav links hidden on tablet too (shown via hamburger) */
  .navbar__nav {
    display: none;
  }

  .navbar__hamburger {
    display: flex;
  }

  /* Search modal adjusts for tablet */
  .search-modal__content {
    max-width: 90vw;
    margin-top: 8vh;
  }
}

/* ------------------------------------------
   Mobile breakpoint (max-width: 749px)
   ------------------------------------------ */
@media (max-width: 749px) {
  :root {
    --navbar-height: 56px;
    --announcement-height: 32px;
  }

  /* -- Announcement Bar -- */
  .announcement-bar {
    height: var(--announcement-height);
  }

  .announcement-bar__container {
    padding: 0 2.75rem 0 1rem;
  }

  .announcement-bar__message {
    font-size: 8px;
    letter-spacing: 0.12em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100vw - 4rem);
  }

  .announcement-bar__close {
    right: 0.5rem;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* -- Navbar -- */
  .navbar {
    padding: 0;
    display: flex;
    align-items: center;
    height: var(--navbar-height);
  }

  .navbar--scrolled {
    padding: 0;
  }

  .navbar__container {
    padding: 0;
    height: 100%;
    grid-template-columns: auto 1fr auto;
    gap: 0.5rem;
  }

  /* -- Left section: hamburger only -- */
  .navbar__left {
    gap: 0;
  }

  /* Nav links always hidden on mobile */
  .navbar__nav {
    display: none !important;
  }

  /* Hamburger: proper 44x44 tap target */
  .navbar__hamburger {
    display: flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin-left: -12px;
  }

  .navbar__hamburger span {
    width: 18px;
    height: 1.5px;
  }

  /* -- Center: logo -- */
  .navbar__center {
    justify-self: center;
    overflow: hidden;
  }

  .navbar__brand {
    gap: 0.375rem;
  }

  .navbar__logo {
    max-height: 36px;
    max-width: 120px;
    height: auto !important;
    width: auto;
  }

  .navbar__brand-name {
    display: none;
  }

  /* -- Right section: action icons -- */
  .navbar__right {
    gap: 0.25rem;
  }

  /* All action buttons: 44x44px minimum tap target */
  .navbar__action {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
  }

  .navbar__action svg {
    width: 20px;
    height: 20px;
  }

  /* Cart count badge: reposition for 44x44 button */
  .navbar__cart-count {
    top: 6px;
    right: 4px;
  }

  /* -- Mobile Menu -- */
  .navbar__mobile-menu {
    width: 280px;
    max-width: 80vw;
    padding: 1.5rem;
  }

  .navbar__mobile-close {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    margin-right: -0.75rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--foreground);
    -webkit-tap-highlight-color: transparent;
  }

  .navbar__mobile-nav {
    gap: 0;
  }

  .navbar__mobile-nav a {
    display: block;
    padding: 0.875rem 0;
    font-size: 13px;
    border-bottom: 1px solid var(--border);
    color: var(--foreground);
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }

  .navbar__mobile-nav a:first-child {
    border-top: 1px solid var(--border);
  }

  .navbar__mobile-social {
    padding-top: 1.5rem;
    gap: 0.75rem;
  }

  .navbar__mobile-social a {
    width: 44px;
    height: 44px;
  }

  /* -- Search Modal: full width on mobile -- */
  .search-modal__content {
    max-width: 100%;
    margin: 0;
    border-radius: 0;
    min-height: 100vh;
    min-height: 100dvh;
  }

  .search-modal__header {
    padding: 0.75rem 1rem;
  }

  .search-modal__close {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .search-modal__results {
    padding: 0.75rem 1rem;
  }

  .search-modal__product {
    padding: 0.625rem 0.5rem;
  }

  .search-modal__product-image {
    width: 50px;
    height: 50px;
  }

  .search-modal__product-title {
    font-size: 13px;
  }

  .search-modal__product-price {
    font-size: 12px;
  }

  /* -- Prevent horizontal overflow -- */
  .navbar,
  .announcement-bar {
    overflow-x: hidden;
  }
}

/* ------------------------------------------
   Small mobile breakpoint (max-width: 374px)
   ------------------------------------------ */
@media (max-width: 374px) {
  .navbar__container {
    padding: 0;
  }

  .navbar__logo {
    max-width: 100px;
    max-height: 32px;
  }

  .navbar__right {
    gap: 0;
  }

  .announcement-bar__message {
    font-size: 7px;
    letter-spacing: 0.08em;
  }

  .navbar__mobile-menu {
    width: 260px;
    padding: 1.25rem;
  }
}


/* ============================================================
   COMPREHENSIVE MOBILE RESPONSIVE FIXES
   All sections & snippets — max-width: 749px
   ============================================================ */

@media (max-width: 749px) {

  /* ---------------------------------------------------------------
     CART — Mobile stacking & usability
     --------------------------------------------------------------- */

  .cart {
    padding: 1.25rem 0 2.5rem;
  }

  .cart__container {
    padding: 0 1rem;
  }

  .cart__title {
    font-size: 1.375rem;
  }

  .cart__shipping-bar {
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
    border-radius: 0.5rem;
  }

  .cart__shipping-bar-text {
    font-size: 0.6875rem;
    line-height: 1.3;
    flex-wrap: nowrap;
    gap: 0.375rem;
    margin-bottom: 0.375rem;
  }

  .cart__shipping-bar-text svg {
    width: 13px;
    height: 13px;
  }

  .cart__shipping-bar-track {
    height: 4px;
  }

  .cart__timer-warning {
    font-size: 0.6875rem;
    padding: 0.5rem 0.75rem;
    gap: 0.375rem;
    margin-bottom: 0.875rem;
    flex-wrap: nowrap;
    line-height: 1.3;
  }

  .cart__timer-warning svg {
    width: 13px;
    height: 13px;
  }

  /* Hide table header on mobile */
  .cart__table-header {
    display: none;
  }

  /* Stack cart items for mobile */
  .cart__layout {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .cart__item {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.5rem 0.75rem;
    padding: 1rem 0;
    position: relative;
  }

  .cart__item-image {
    grid-row: 1 / 3;
    grid-column: 1;
    width: 72px;
  }

  .cart__item-image img {
    width: 72px;
    height: 90px;
    border-radius: 0.375rem;
  }

  .cart__item-info {
    display: flex !important;
    flex-direction: column;
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: none !important;
    gap: 0.125rem;
  }

  .cart__item-title {
    font-size: 0.875rem;
    line-height: 1.25;
  }

  .cart__item-variant {
    font-size: 0.6875rem;
  }

  /* Quantity controls — bigger tap targets on mobile */
  .cart__item-quantity {
    grid-column: 2;
    grid-row: 2;
  }

  .cart__item-quantity-btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
  }

  .cart__item-quantity-input {
    width: 40px;
    height: 36px;
    font-size: 0.875rem;
  }

  .cart__item-quantity-controls {
    border-width: 1.5px;
  }

  /* Hide individual price on mobile, show total */
  .cart__item-price {
    display: none;
  }

  .cart__item-total {
    grid-column: 3;
    grid-row: 1;
    text-align: right;
    font-size: 0.875rem;
  }

  .cart__item-remove {
    grid-column: 3;
    grid-row: 2;
    justify-self: end;
    width: 36px;
    height: 36px;
  }

  /* Summary sidebar — full width on mobile */
  .cart__summary {
    position: static;
  }

  .cart__summary-inner {
    padding: 1.25rem;
  }

  .cart__summary-title {
    font-size: 1.125rem;
  }

  .cart__promo-input-wrapper {
    flex-direction: column;
    gap: 0.5rem;
  }

  .cart__promo-btn {
    width: 100%;
    padding: 0.625rem 1rem;
  }

  .cart__summary-row {
    font-size: 0.8125rem;
  }

  .cart__summary-row--total {
    font-size: 1rem;
  }

  .cart__checkout-btn {
    font-size: 0.9375rem;
    padding: 0.875rem 1rem;
  }

  /* Cart trust badges — stack nicely */
  .cart__trust-badges {
    gap: 0.375rem;
  }

  .cart__trust-badge {
    font-size: 0.6875rem;
  }

  .cart__payment-icons {
    gap: 0.25rem;
  }

  .cart__payment-icon {
    height: 18px;
  }

  /* Continue shopping link */
  .cart__continue-link {
    font-size: 0.8125rem;
  }

  /* Social proof bar */
  .cart__social-proof-text {
    font-size: 0.75rem;
    flex-wrap: wrap;
    justify-content: center;
  }

  /* Upsell grid — single column */
  .cart__upsell-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .cart__upsell-title {
    font-size: 1.25rem;
  }

  .cart__upsell-card {
    padding: 0.875rem;
  }

  .cart__upsell-card-image img {
    width: 64px;
    height: 80px;
  }

  .cart__upsell-card-btn {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    min-height: 36px;
  }

  /* Empty cart */
  .cart__empty {
    padding: 3rem 1rem;
    min-height: 50vh;
  }

  .cart__empty-icon {
    width: 48px;
    height: 48px;
  }

  .cart__empty-title {
    font-size: 1.5rem;
  }

  .cart__empty-text {
    font-size: 0.9375rem;
    max-width: 100%;
  }


  /* ---------------------------------------------------------------
     404 PAGE — Centered, proper mobile padding
     --------------------------------------------------------------- */

  .error-page {
    padding-top: 1rem;
  }

  .error-page__hero {
    padding: 2rem 1rem 2rem;
  }

  .error-page__code {
    font-size: 4.5rem;
    margin-bottom: 0.5rem;
  }

  .error-page__title {
    font-size: 1.375rem;
  }

  .error-page__description {
    font-size: 0.9375rem;
    margin-bottom: 1.5rem;
  }

  .error-page__search {
    margin-bottom: 1.5rem;
    max-width: 100%;
  }

  .error-page__search-form {
    flex-direction: column;
    border-radius: 0.75rem;
  }

  .error-page__search-input {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--border);
  }

  .error-page__search-btn {
    width: 100%;
    height: 44px;
  }

  .error-page__cta {
    padding: 0.75rem 1.75rem;
    font-size: 0.875rem;
    width: 100%;
    justify-content: center;
  }

  .error-page__suggestions {
    padding: 2.5rem 1rem;
  }

  .error-page__suggestions-title {
    font-size: 1.25rem;
  }

  .error-page__suggestions-subtitle {
    font-size: 0.875rem;
    margin-bottom: 1.5rem;
  }

  .error-page__suggestions-grid {
    grid-template-columns: 1fr;
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
    gap: 1rem;
  }

  .error-page__links {
    padding: 2.5rem 1rem;
  }

  .error-page__links-title {
    font-size: 1.125rem;
    margin-bottom: 1.5rem;
  }

  .error-page__links-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }

  .error-page__link-card {
    padding: 1.25rem 0.75rem;
    gap: 0.5rem;
  }

  .error-page__link-label {
    font-size: 0.8125rem;
    text-align: center;
  }

  .error-page__newsletter {
    padding: 2.5rem 1rem;
  }

  .error-page__newsletter-title {
    font-size: 1.125rem;
  }

  .error-page__newsletter-text {
    font-size: 0.875rem;
  }

  .error-page__newsletter-form {
    flex-direction: column;
    border-radius: 0.75rem;
  }

  .error-page__newsletter-input {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--border);
    text-align: center;
  }

  .error-page__newsletter-btn {
    border-radius: 0 0 0.75rem 0.75rem;
    padding: 0.875rem;
  }


  /* ---------------------------------------------------------------
     GENERIC PAGE — Mobile padding & typography
     --------------------------------------------------------------- */

  .page-section__header {
    padding: 2rem 1rem 0;
  }

  .page-section__header-desc {
    font-size: 0.9375rem;
  }

  .page-section__header-line {
    margin-top: 1.5rem;
  }

  .page-section__content-wrap {
    padding: 2rem 1rem;
  }

  .page-section__content-inner {
    max-width: 100%;
    padding: 0;
  }

  .page-section__content.rte {
    font-size: 1rem;
    line-height: 1.75;
  }

  .page-section__cta {
    padding: 2.5rem 1rem;
  }

  .page-section__cta-title {
    font-size: 1.25rem;
  }

  .page-section__cta-description {
    font-size: 0.9375rem;
  }

  .page-section__cta-buttons {
    flex-direction: column;
  }

  .page-section__cta-btn {
    width: 100%;
    text-align: center;
    justify-content: center;
  }

  .page-section__newsletter {
    padding: 2.5rem 1rem;
  }

  .page-section__newsletter-title {
    font-size: 1.125rem;
  }

  .page-section__newsletter-text {
    font-size: 0.875rem;
  }

  .page-section__newsletter-form {
    flex-direction: column;
    border-radius: 0.75rem;
  }

  .page-section__newsletter-input {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--border);
    text-align: center;
  }

  .page-section__newsletter-btn {
    border-radius: 0 0 0.75rem 0.75rem;
    padding: 0.875rem;
  }


  /* ---------------------------------------------------------------
     BLOG — Mobile responsive grid & typography
     --------------------------------------------------------------- */

  .blog {
    padding: 2rem 0 3rem;
  }

  .blog__container {
    padding: 0 1rem;
  }

  .blog__title {
    font-size: 1.5rem;
    margin-bottom: 1.25rem;
  }

  .blog__grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .blog__card-content {
    padding: 1rem;
  }

  .blog__card-title {
    font-size: 1rem;
  }

  .blog__card-excerpt {
    font-size: 0.8125rem;
    margin-bottom: 0.5rem;
  }

  .blog__pagination-inner {
    gap: 0.25rem;
    flex-wrap: wrap;
    justify-content: center;
  }

  .blog__pagination-btn {
    font-size: 0.75rem;
    padding: 0.375rem 0.75rem;
  }

  .blog__pagination-link {
    width: 32px;
    height: 32px;
    font-size: 0.75rem;
  }


  /* ---------------------------------------------------------------
     ARTICLE — Mobile readable typography & image scaling
     --------------------------------------------------------------- */

  .article {
    padding: 0 0 3rem;
  }

  .article__container {
    padding: 0 1rem;
  }

  .article__breadcrumbs {
    padding: 0.75rem 0;
    margin-bottom: 1rem;
  }

  .article__breadcrumbs-item {
    font-size: 0.6875rem;
  }

  .article__hero-image {
    margin-bottom: 1.25rem;
    border-radius: 0.5rem;
  }

  .article__image {
    aspect-ratio: 16 / 10;
  }

  .article__header {
    margin-bottom: 1.5rem;
  }

  .article__title {
    font-size: 1.5rem;
    margin-bottom: 0.375rem;
  }

  .article__date {
    font-size: 0.6875rem;
    margin-bottom: 0.5rem;
  }

  .article__body {
    font-size: 0.9375rem;
    line-height: 1.75;
  }

  .article__tags {
    gap: 0.375rem;
    padding: 1rem 0;
    margin-bottom: 1.25rem;
  }

  .article__tag {
    padding: 0.25rem 0.625rem;
    font-size: 0.6875rem;
  }

  .article__comments {
    padding-top: 1.5rem;
  }

  .article__comments-title {
    font-size: 1.25rem;
    margin-bottom: 1rem;
  }

  .article__comment {
    padding: 1rem 0;
  }

  .article__comment-author {
    font-size: 0.875rem;
  }

  .article__comment-body {
    font-size: 0.875rem;
  }

  .article__comment-form-title {
    font-size: 1rem;
  }

  .article__comment-form-field input,
  .article__comment-form-field textarea {
    font-size: 16px; /* Prevents iOS zoom */
  }

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


  /* ---------------------------------------------------------------
     PRODUCT CARD — Mobile proportions, readable text, tap targets
     --------------------------------------------------------------- */

  .product-card__image-wrap {
    margin-bottom: 0.75rem;
    border-radius: 0.375rem;
  }

  .product-card__badges {
    top: 0.375rem;
    left: 0.375rem;
    gap: 0.25rem;
    max-width: calc(100% - 0.75rem);
  }

  .product-card__badge {
    padding: 0.1875rem 0.4375rem;
    font-size: 8px;
    letter-spacing: 0.04em;
    line-height: 1.1;
  }

  .product-card__swatch {
    top: 0.5rem;
    right: 0.5rem;
  }

  .product-card__swatch-dot {
    width: 16px;
    height: 16px;
  }

  .product-card__info {
    padding: 0;
  }

  .product-card__title-row {
    flex-direction: column;
    gap: 0.25rem;
    align-items: flex-start;
  }

  .product-card__title {
    font-size: 0.75rem;
    letter-spacing: 0.03em;
    line-height: 1.3;
  }

  .product-card__price {
    font-size: 0.75rem;
  }

  .product-card__price--compare {
    font-size: 0.6875rem;
  }

  .product-card__meta-row {
    flex-wrap: wrap;
    gap: 0.25rem 0.5rem;
  }

  .product-card__rating {
    gap: 0.25rem;
  }

  .product-card__star {
    width: 12px;
    height: 12px;
  }

  .product-card__rating-count {
    font-size: 0.6875rem;
  }

  .product-card__viewers {
    font-size: 0.625rem;
  }

  .product-card__viewers svg {
    width: 12px;
    height: 12px;
  }

  .product-card__variants {
    font-size: 0.625rem;
  }

  /* Ensure product-card ATC button has good tap target */
  .product-card__atc {
    min-height: 44px;
  }


  /* ---------------------------------------------------------------
     TRUST BADGES — Wrap nicely, no overflow
     --------------------------------------------------------------- */

  .trust-badges {
    gap: 0.75rem 1.25rem;
    justify-content: center;
  }

  .trust-badges__item {
    gap: 0.375rem;
    min-width: 0;
  }

  .trust-badges__icon svg {
    width: 12px;
    height: 12px;
  }

  .trust-badges__label {
    font-size: 9px;
    letter-spacing: 0.1em;
  }


  /* ---------------------------------------------------------------
     PAYMENT LOGOS — Wrap properly on mobile
     --------------------------------------------------------------- */

  .payment-logos {
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    justify-content: center;
  }

  .payment-logos__item {
    font-size: 8px;
    letter-spacing: 0.08em;
  }


  /* ---------------------------------------------------------------
     SOCIAL PROOF TOAST — Positioned well, not covering CTAs
     --------------------------------------------------------------- */

  .sp-toast {
    bottom: 0.75rem;
    left: 0.75rem;
    right: 0.75rem;
    z-index: 90;
  }

  .sp-toast__inner {
    max-width: 100%;
    min-width: 0;
    padding: 12px;
    gap: 10px;
    border-radius: 10px;
  }

  .sp-toast__icon {
    width: 32px;
    height: 32px;
  }

  .sp-toast__icon svg {
    width: 16px;
    height: 16px;
  }

  .sp-toast__name {
    font-size: 12px;
  }

  .sp-toast__action {
    font-size: 11px;
  }

  .sp-toast__time {
    font-size: 10px;
  }

  .sp-toast__close {
    width: 28px;
    height: 28px;
  }


  /* ---------------------------------------------------------------
     REVIEW CARD — Mobile readable
     --------------------------------------------------------------- */

  .reviews-grid__card-author {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.375rem;
  }

  .reviews-grid__card-badge {
    margin-top: 0.5rem;
  }


  /* ---------------------------------------------------------------
     GUARANTEE — Mobile padding & wrapping
     --------------------------------------------------------------- */

  .guarantee {
    padding: 3rem 1rem;
  }

  .guarantee__header {
    margin-bottom: 2rem;
  }

  .guarantee__heading {
    font-size: 1.375rem;
  }

  .guarantee__container {
    gap: 2rem;
  }

  .guarantee__icon {
    width: 48px;
    height: 48px;
    margin-bottom: 1rem;
  }

  .guarantee__title {
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
  }

  .guarantee__desc {
    font-size: 0.8125rem;
    max-width: 100%;
  }

  .guarantee__payments {
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 1.5rem;
    flex-wrap: wrap;
    justify-content: center;
  }

  .guarantee__payments span {
    font-size: 9px;
  }


  /* ---------------------------------------------------------------
     NEWSLETTER — Full-width form on mobile
     --------------------------------------------------------------- */

  .newsletter__container {
    padding: 3rem 1rem;
  }

  .newsletter__content {
    max-width: 100%;
  }

  .newsletter__title {
    font-size: 1.375rem;
  }

  .newsletter__text {
    font-size: 0.875rem;
    max-width: 100%;
    margin-bottom: 1.75rem;
  }

  .newsletter__form {
    max-width: 100%;
    gap: 0.625rem;
  }

  .newsletter__input {
    padding: 0.875rem 1rem;
    font-size: 16px; /* Prevents iOS zoom */
    width: 100%;
  }

  .newsletter__btn {
    width: 100%;
    padding: 0.875rem 2rem;
  }

  .newsletter__privacy {
    font-size: 10px;
    margin-top: 0.75rem;
  }

  .newsletter__trust-bar {
    gap: 0.75rem 1.25rem;
    padding: 1.25rem 1rem;
  }

  .newsletter__trust-item {
    gap: 0.375rem;
  }

  .newsletter__trust-item svg {
    width: 14px;
    height: 14px;
  }

  .newsletter__trust-item span {
    font-size: 9px;
    letter-spacing: 0.1em;
  }


  /* ---------------------------------------------------------------
     RTE content — Mobile typography
     --------------------------------------------------------------- */

  .rte {
    font-size: 0.9375rem;
    line-height: 1.75;
  }

  .rte h2 { font-size: 1.25rem; }
  .rte h3 { font-size: 1.125rem; }
  .rte h4 { font-size: 1rem; }

  .rte blockquote {
    margin: 1rem 0;
    padding: 0.75rem 1rem;
  }

  .rte table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .rte th,
  .rte td {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    white-space: nowrap;
  }

  .rte img {
    margin: 1rem 0;
    border-radius: 0.5rem;
  }

}


/* ============================================================
   ADDITIONAL — Tablet-only fixes (749px-1024px)
   ============================================================ */

@media (min-width: 750px) and (max-width: 1024px) {

  .error-page__suggestions-grid {
    grid-template-columns: repeat(2, 1fr);
    max-width: 640px;
  }

  .error-page__links-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .cart__upsell-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .product-card__title-row {
    gap: 0.5rem;
  }
}

/* ============================================================
   GLOBAL MOBILE SAFETY NET
   ============================================================ */

/* Prevent horizontal overflow globally */
html {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Body scroll lock for drawers/modals */
.no-scroll {
  overflow: hidden;
  position: fixed;
  width: 100%;
  height: 100%;
}

/* Mobile CSS variable overrides */
@media screen and (max-width: 749px) {
  :root {
    --section-py: 3rem;
    --section-py-lg: 4rem;
    --section-px: 1rem;
    --navbar-height: 56px;
    --announcement-height: 32px;
  }

  /* Ensure all sections don't overflow */
  section,
  [class*="__container"],
  [class*="__wrapper"] {
    max-width: 100vw;
    overflow-x: hidden;
  }

  /* iOS zoom prevention on all form inputs */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="search"],
  input[type="password"],
  input[type="url"],
  select,
  textarea {
    font-size: 16px !important;
  }

  /* Global minimum tap targets */
  button,
  [role="button"],
  a.btn,
  summary {
    min-height: 44px;
  }

  /* Excludem dot-urile de carusel (sunt button-uri mici) */
  button.reviews__dot,
  button.lf-benefits__dot,
  button.reasons__dot,
  .reviews__dot,
  .lf-benefits__dot,
  .reasons__dot {
    min-height: 0 !important;
    height: 6px !important;
  }
  button.reviews__dot--active,
  button.lf-benefits__dot--active,
  button.reasons__dot--active,
  .reviews__dot--active,
  .lf-benefits__dot--active,
  .reasons__dot--active {
    height: 6px !important;
  }

  /* Cart drawer — qty +/- și buton "Adaugă" upsell: tap target redus la 35px */
  .cart-drawer__quantity-btn,
  .cart-drawer__upsell-add {
    min-height: 35px !important;
  }

  /* Cart drawer 90% on mobile */
  .cart-drawer {
    max-width: 90%;
    width: 90%;
  }

  /* Cart drawer mobile — compact spacing */
  .cart-drawer__header {
    padding: 0.625rem 1rem;
  }
  .cart-drawer__title {
    font-size: 13px;
    letter-spacing: 0.08em;
  }
  .cart-drawer__close {
    padding: 0.25rem;
  }
  .cart-drawer__close svg {
    width: 18px;
    height: 18px;
  }

  .cart-drawer__timer {
    padding: 0.3125rem 0.75rem;
    gap: 0.375rem;
    font-size: 9px;
  }
  .cart-drawer__timer svg {
    width: 12px;
    height: 12px;
  }

  .cart-drawer__shipping {
    padding: 0.5rem 1rem;
  }
  .cart-drawer__shipping-text {
    font-size: 10px;
    margin-bottom: 0.3125rem;
    line-height: 1.3;
  }
  .cart-drawer__shipping-bar {
    height: 3px;
  }

  .cart-drawer__items {
    padding: 0.75rem 1rem;
    gap: 1rem;
  }

  .cart-drawer__item {
    padding: 0;
  }
  .cart-drawer__item-row {
    gap: 0.75rem;
  }
  .cart-drawer__item-image {
    width: 64px;
    height: 64px;
  }
  .cart-drawer__item-title {
    font-size: 11.5px;
    letter-spacing: 0.03em;
    line-height: 1.3;
  }
  .cart-drawer__item-variant {
    font-size: 10px;
    display: block;
  }
  .cart-drawer__item-grid {
    gap: 0.5rem;
  }
  .cart-drawer__quantity-btn {
    padding: 0.1875rem 0.3125rem;
  }
  .cart-drawer__quantity-btn svg {
    width: 10px;
    height: 10px;
  }
  .cart-drawer__quantity-value {
    padding: 0 0.3125rem;
    font-size: 10px;
    min-width: 18px;
    text-align: center;
  }
  .cart-drawer__item-remove {
    padding: 0.125rem;
  }
  .cart-drawer__item-remove svg {
    width: 14px;
    height: 14px;
  }

  /* Coupon row mobile */
  .cart-drawer__item-coupon {
    margin-top: 8px;
    padding: 6px 9px;
    font-size: 10.5px;
    gap: 6px;
  }
  .cart-drawer__item-coupon svg {
    width: 12px;
    height: 12px;
  }
  .cart-drawer__item-coupon-text {
    font-size: 10px;
  }
  .cart-drawer__item-coupon-amount {
    font-size: 11px;
  }

  .cart-drawer__upsell {
    padding: 1rem 0 0;
    margin-top: 1.25rem;
  }
  .cart-drawer__upsell-label {
    font-size: 10px;
    letter-spacing: 0.12em;
    margin-bottom: 0.625rem;
  }
  .cart-drawer__upsell-list {
    gap: 0.5rem;
  }
  .cart-drawer__upsell-product {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    padding: 0.5rem 0.625rem;
    gap: 0.625rem;
  }
  .cart-drawer__upsell-image-link,
  .cart-drawer__upsell-image {
    width: 44px;
    height: 44px;
  }
  .cart-drawer__upsell-title {
    font-size: 11px;
    letter-spacing: 0;
    line-height: 1.25;
  }
  .cart-drawer__upsell-price {
    font-size: 11px;
  }
  .cart-drawer__upsell-add {
    padding: 0.375rem 0.625rem !important;
    font-size: 9px !important;
    letter-spacing: 0.06em !important;
    flex-shrink: 0;
    width: auto;
  }

  /* Header mobile: hide search, keep hamburger left + logo center + cart right */
  .navbar__action--search-desktop {
    display: none !important;
  }
}

/* ---------------------------------------------------------------
   CART DRAWER BODY/FOOTER LAYOUT
   --------------------------------------------------------------- */
/* Cart drawer: entire content scrollable */

/* ---------------------------------------------------------------
   MOBILE MENU UPSELL PRODUCTS
   --------------------------------------------------------------- */
.navbar__mobile-upsell {
  padding: 1rem 0;
  margin-top: 1rem;
}

.navbar__mobile-upsell-card[hidden] {
  display: none !important;
}

.navbar__mobile-upsell-cta {
  display: block !important;
  margin-top: 0.875rem;
  padding: 0.75rem 1rem;
  background: var(--foreground, #3D3834);
  color: var(--background, #fff) !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  border-radius: var(--radius-sm, 4px);
  transition: background 0.2s ease;
  width: 100%;
  box-sizing: border-box;
}

.navbar__mobile-upsell-cta:hover {
  background: var(--primary, #B08D57);
}

.navbar__mobile-upsell-title {
  font-size: 0.5625rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--foreground, #3D3834);
  margin: 0 0 0.625rem;
}

.navbar__mobile-upsell-grid {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.25rem;
  margin: 0 -0.25rem;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.navbar__mobile-upsell-grid::-webkit-scrollbar {
  display: none;
}

.navbar__mobile-upsell-card {
  flex: 0 0 auto;
  width: 110px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.375rem;
  padding: 0.5rem;
  background: var(--muted, #F5F0EA);
  border-radius: 6px;
  text-decoration: none;
  color: var(--foreground);
  scroll-snap-align: start;
}

.navbar__mobile-upsell-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
  border-radius: 4px;
}

.navbar__mobile-upsell-card-title {
  font-size: 8.5px;
  font-weight: 700;
  line-height: 1.25;
  text-transform: none;
  letter-spacing: 0.01em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: 0.125rem;
}

.navbar__mobile-upsell-price {
  font-size: 9.5px;
  font-weight: 700;
  color: var(--primary, #b08d57);
  white-space: nowrap;
}

/* ---------------------------------------------------------------
   COLLECTION PAGE MOBILE FIXES
   --------------------------------------------------------------- */
@media (max-width: 749px) {
  /* Hero: account for topbar + header */
  .collection-hero {
    min-height: 35vh;
    padding-top: calc(var(--announcement-height, 36px) + 60px);
  }

  /* Trust bar mobile: 1 coloană, una sub alta */
  .collection__trust-bar {
    padding: 0.875rem 0;
  }
  .collection__trust-bar-items {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    justify-content: stretch;
    align-items: flex-start;
    overflow: visible;
  }

  .collection__trust-bar-item {
    font-size: 0.8125rem;
    gap: 0.625rem;
    letter-spacing: 0.04em;
    line-height: 1.3;
    white-space: normal;
    justify-content: flex-start;
    font-weight: 700;
    padding-left: 0.75rem;
    width: 100%;
  }

  .collection__trust-bar-item svg {
    width: 20px;
    height: 20px;
  }

  /* Promo bar mobile */
  .collection__promo-bar {
    font-size: 0.75rem !important;
    padding: 0.5rem 0 !important;
    letter-spacing: 0.03em !important;
  }

  /* Filter tabs mobile: usor mai compacte */
  .collection__filter-tabs {
    gap: 0.375rem;
  }

  .collection__filter-tab {
    padding: 0.4375rem 0.875rem;
    font-size: 0.625rem;
    letter-spacing: 0.06em;
  }

  /* Sort: small, right-aligned */
  .collection__controls {
    padding: 0.875rem 0;
  }

  .collection__controls-inner {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    padding-right: 0.5rem;
  }

  .collection__sort-wrapper {
    gap: 0.375rem;
    margin-right: 0.25rem;
  }

  .collection__sort-label {
    font-size: 0.5rem;
    letter-spacing: 0.06em;
  }

  .collection__sort-select {
    font-size: 0.5625rem;
    letter-spacing: 0.04em;
    padding: 0.3125rem 1.125rem 0.3125rem 0.5rem;
    background-size: 8px 5px;
    background-position: right 0.5rem center;
  }

  .collection__sort-icon {
    display: none;
  }

  .collection__results-count {
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--muted-foreground, #555);
    padding-left: 0.5rem;
  }
}

/* ---------------------------------------------------------------
   PRODUCT GALLERY MOBILE SLIDER
   --------------------------------------------------------------- */
.product__gallery-slider {
  display: none;
}

.product__gallery-dots {
  display: none;
}

@media (max-width: 749px) {
  .product__gallery-slider {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 0.75rem;
    margin: 0;
    padding: 0 1rem;
  }

  .product__gallery-slider::-webkit-scrollbar {
    display: none;
  }

  .product__gallery-slide {
    flex: 0 0 92%;
    scroll-snap-align: center;
    position: relative;
    border-radius: 0.75rem;
    overflow: hidden;
  }

  .product__gallery-slide-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
  }

  .product__gallery-slide-video-placeholder {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    background: #fff;
  }

  .product__gallery-slide-video-placeholder img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .product__gallery-slide video,
  .product__gallery-slide iframe {
    object-fit: contain;
    background: #fff;
  }

  .product__gallery-slide-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .product__gallery-slide-play svg {
    margin-left: 3px;
  }

  .product__gallery-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 0.75rem 0;
  }

  .product__gallery-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--border, #d1cdc7);
    transition: all 0.2s;
  }

  .product__gallery-dot--active {
    background: var(--foreground, #333);
    width: 18px;
    border-radius: 3px;
  }

  /* Hide desktop gallery elements on mobile */
  .product__gallery-main,
  .product__gallery-thumbs {
    display: none !important;
  }
}

/* ============================================================
   PRODUCT PAGE — Resilia-inspired refresh (Sprint 1+2 cleanup)
   Gallery (only photos) + cleaned details + bundle picker
   Accordions placed UNDER gallery on desktop (grid-template-areas)
   ============================================================ */

/* --- Layout: 2 columns cu slot-uri reordonate desktop / mobile --- */
.product__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  grid-template-areas:
    "hero    right"
    "extras  right";
  column-gap: 1.75rem;
  row-gap: 0.75rem;
  padding: 2.75rem 0 2.5rem;
  align-items: start;
}

.product__hero          { grid-area: hero; }
.product__extras        { grid-area: extras; }
.product__right         {
  grid-area: right;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.product__details       { display: flex; flex-direction: column; gap: 0.75rem; }
.product__trust-slot,
.product__upsell-slot,
.product__payment-slot  { display: block; }

/* ---------- HERO (left side) — only photos ---------- */
.product__hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.product__hero-media {
  position: relative;
}

.product__hero-image-wrap {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  background: var(--muted);
  aspect-ratio: 3 / 4;
}

.product__hero-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product__hero-video-wrap {
  position: absolute;
  inset: 0;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product__hero-video,
.product__hero-video-wrap iframe {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
  border: none;
}

.product__hero-fullscreen-btn {
  position: absolute;
  bottom: 14px;
  right: 14px;
  width: 38px;
  height: 38px;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: none;
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.product__hero-badges {
  position: absolute;
  top: 14px;
  left: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  z-index: 5;
}

/* ---------- THUMBNAILS (under hero on desktop) ---------- */
.product__thumbs {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.75rem;
  overflow-x: auto;
  scrollbar-width: none;
}

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

.product__thumb {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  border: 2px solid transparent;
  border-radius: 0.5rem;
  background: var(--muted);
  cursor: pointer;
  overflow: hidden;
  padding: 0;
  transition: border-color var(--transition-base);
}

.product__thumb--active {
  border-color: var(--foreground);
}

.product__thumb-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.product__thumb-video {
  position: relative;
  width: 100%;
  height: 100%;
}

.product__thumb-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  background: rgba(0,0,0,0.55);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ---------- MOBILE GALLERY SLIDER ---------- */
.product__mobile-slider {
  display: none;
}

.product__mobile-dots {
  display: none;
}

/* ---------- DETAILS PANEL (right) ---------- */
.product__details {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

/* 1. Rating line */
.product__rating-line {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  margin-bottom: -0.5rem;
}

.product__rating-score {
  font-weight: 600;
  color: var(--foreground);
  letter-spacing: -0.005em;
}

.product__rating-link {
  color: var(--muted-foreground);
  text-decoration: underline;
  text-decoration-color: rgba(44, 40, 37, 0.25);
  text-underline-offset: 2px;
  transition: color var(--transition-base);
}

.product__rating-link:hover {
  color: var(--foreground);
}

/* 2. Title (Playfair, big) */
.product__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.875rem, 3.5vw, 2.5rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--foreground);
  margin: 0;
}

/* 3. Headline benefit */
.product__headline {
  font-family: var(--font-heading);
  font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
  line-height: 1.3;
  font-weight: 400;
  color: var(--foreground);
  margin: -0.25rem 0 0;
}

/* 4. Benefit pills — fara fundal, doar icon + text */
.product__pills-section {
  background: transparent;
  border-radius: 0;
  padding: 0;
  margin: 0.25rem 0 0;
}

.product__pills {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.product__pill {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--foreground);
  letter-spacing: -0.005em;
  line-height: 1.3;
}

.product__pill-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--primary-dark);
  flex-shrink: 0;
}

.product__pill-icon svg {
  width: 16px;
  height: 16px;
}

.product__pill-text {
  min-width: 0;
}

@media (max-width: 768px) {
  .product__pills-section {
    padding: 0;
    background: transparent;
  }
  .product__pills {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem 1rem;
  }
  .product__pill {
    font-size: 0.8125rem;
    gap: 0.4375rem;
    line-height: 1.3;
  }
  .product__pill-icon,
  .product__pill-icon svg {
    width: 15px;
    height: 15px;
  }
}

/* Short description (înainte de bundle) */
.product__short-desc {
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--muted-foreground);
  margin: 0;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--border);
}

/* 5. Price line */
.product__price-line {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.125rem;
}

.product__price {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.625rem;
  color: var(--foreground);
  letter-spacing: -0.01em;
}

.product__price--sale {
  color: var(--foreground);
}

.product__price--compare {
  font-size: 1.125rem;
  color: var(--muted-foreground);
  font-weight: 400;
}

.product__price--compare s {
  text-decoration: line-through;
}

.product__save-badge {
  display: inline-flex;
  align-items: center;
  background: var(--primary);
  color: #fff;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  padding: 0.3125rem 0.625rem;
  border-radius: var(--radius-sm);
}

/* ---------- BUNDLE PICKER ---------- */
.product__bundle {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0.25rem 0 0;
}

/* Premium variant picker — vizibil doar pe tier-ul selectat */
.product__bundle-pickers {
  display: none;
  flex-direction: column;
  gap: 0.5rem;
  grid-column: 1 / -1;
  margin: 0.75rem -0.25rem -0.25rem;
  padding: 0.875rem 0.875rem 0.625rem;
  background: linear-gradient(180deg, rgba(168, 133, 95, 0.05) 0%, rgba(168, 133, 95, 0.09) 100%);
  border-radius: 0.5rem;
  position: relative;
}

.product__bundle-tier--selected .product__bundle-pickers {
  display: flex;
  animation: bundlePickerSlideIn 0.22s ease;
}

@keyframes bundlePickerSlideIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.product__bundle-pickers::before {
  content: '';
  position: absolute;
  top: 0; left: 1rem; right: 1rem;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(168, 133, 95, 0.3) 0 6px, transparent 6px 12px);
}

.product__bundle-picker {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.625rem;
  position: relative;
}

.product__bundle-picker-label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  flex-shrink: 0;
  padding: 0.1875rem 0.5rem;
  background: rgba(168, 133, 95, 0.14);
  color: var(--primary-dark);
  border-radius: 999px;
  white-space: nowrap;
}

/* Trigger button (looks like a refined select) */
.product__bundle-picker-trigger {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  min-width: 0;
  background: #fff;
  border: 1px solid var(--border-strong);
  border-radius: 0.5rem;
  padding: 0.4375rem 0.625rem 0.4375rem 0.4375rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--foreground);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
  box-shadow: 0 1px 2px rgba(44, 40, 37, 0.04);
}

.product__bundle-picker-trigger:hover {
  border-color: var(--primary);
  box-shadow: 0 2px 8px rgba(168, 133, 95, 0.18);
}

.product__bundle-picker-trigger:focus-visible,
.product__bundle-picker--open .product__bundle-picker-trigger {
  outline: none;
  border-color: var(--primary-dark);
  box-shadow: 0 0 0 3px rgba(168, 133, 95, 0.18);
}

.product__bundle-picker-trigger-thumb {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 0.4375rem;
  background-color: #F1EAE0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(44, 40, 37, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  position: relative;
}

.product__bundle-picker-trigger-thumb--empty::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 47%, rgba(168, 133, 95, 0.4) 47% 53%, transparent 53%);
}

.product__bundle-picker-trigger-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product__bundle-picker-trigger-chevron {
  color: var(--muted-foreground);
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.product__bundle-picker--open .product__bundle-picker-trigger-chevron {
  transform: rotate(180deg);
  color: var(--primary-dark);
}

/* Floating panel with options */
.product__bundle-picker-panel {
  position: absolute;
  top: calc(100% + 0.375rem);
  left: 0;
  right: 0;
  z-index: 30;
  max-height: 320px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--border-strong);
  border-radius: 0.625rem;
  box-shadow: 0 12px 32px -8px rgba(44, 40, 37, 0.18), 0 4px 10px rgba(44, 40, 37, 0.06);
  padding: 0.375rem;
  animation: bundlePickerFade 0.15s ease;
}

@keyframes bundlePickerFade {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.product__bundle-picker-group {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  padding: 0.625rem 0.625rem 0.375rem;
}

.product__bundle-picker-option {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  background: transparent;
  border: none;
  border-radius: 0.5rem;
  padding: 0.5rem 0.625rem;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-body);
  color: var(--foreground);
  transition: background 0.12s ease;
}

.product__bundle-picker-option + .product__bundle-picker-option {
  margin-top: 0.125rem;
}

.product__bundle-picker-option:hover,
.product__bundle-picker-option:focus-visible {
  background: rgba(168, 133, 95, 0.08);
  outline: none;
}

.product__bundle-picker-option--selected {
  background: rgba(168, 133, 95, 0.14);
}

.product__bundle-picker-option-thumb {
  width: 48px;
  height: 48px;
  border-radius: 0.5rem;
  background-color: #F1EAE0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(44, 40, 37, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  position: relative;
}

.product__bundle-picker-option-thumb--empty::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 47%, rgba(168, 133, 95, 0.4) 47% 53%, transparent 53%);
  border-radius: inherit;
}

.product__bundle-picker-option-info {
  display: flex;
  flex-direction: column;
  gap: 0.0625rem;
  min-width: 0;
}

.product__bundle-picker-option-name {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--foreground);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: -0.005em;
}

.product__bundle-picker-option-price {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  font-variant-numeric: tabular-nums;
}

.product__bundle-picker-option-product {
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product__bundle-picker-option-check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: transparent;
  color: var(--primary-dark);
  opacity: 0;
  transition: opacity 0.12s ease, background 0.12s ease;
}

.product__bundle-picker-option--selected .product__bundle-picker-option-check {
  opacity: 1;
  background: var(--primary-dark);
  color: #fff;
}

@media (max-width: 480px) {
  .product__bundle-pickers {
    padding: 0.75rem 0.625rem 0.5rem;
    gap: 0.4375rem;
  }
  .product__bundle-picker {
    grid-template-columns: 1fr;
    gap: 0.3125rem;
  }
  .product__bundle-picker-label {
    justify-self: start;
  }
  .product__bundle-picker-trigger {
    padding: 0.5rem 0.625rem 0.5rem 0.5rem;
  }
  .product__bundle-picker-trigger-thumb {
    width: 28px;
    height: 28px;
  }
  .product__bundle-picker-option {
    grid-template-columns: 36px 1fr auto;
    padding: 0.4375rem;
  }
  .product__bundle-picker-option-thumb {
    width: 36px;
    height: 36px;
  }
}

.product__bundle-tier {
  position: relative;
  display: grid;
  grid-template-columns: 22px 1fr auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0.875rem;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: 0.625rem;
  cursor: pointer;
  transition: all var(--transition-base);
}

/* When tier has pickers, give label some breathing room (pickers go on row 2 spanning full width) */
.product__bundle-tier--has-pickers {
  padding-bottom: 0.5rem;
}

.product__bundle-tier:hover {
  border-color: var(--primary);
}

.product__bundle-tier--selected {
  border-color: var(--primary-dark);
  background: #FBF5EE;
  box-shadow: 0 0 0 3px rgba(168, 133, 95, 0.1);
}

.product__bundle-tier--has-badge {
  margin-top: 0.75rem;
  padding-top: 1.25rem !important;
}

.product__bundle-radio {
  display: none;
}

.product__bundle-radio-circle {
  width: 20px;
  height: 20px;
  border: 1.5px solid var(--border-strong);
  border-radius: 50%;
  background: #fff;
  position: relative;
  transition: all var(--transition-base);
}

.product__bundle-tier--selected .product__bundle-radio-circle {
  border-color: var(--primary-dark);
  background: var(--primary-dark);
}

.product__bundle-tier--selected .product__bundle-radio-circle::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fff;
}

.product__bundle-tier-info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.product__bundle-tier-label {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--foreground);
  letter-spacing: -0.005em;
}

.product__bundle-tier-sub {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.product__bundle-tier-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.125rem;
}

.product__bundle-tier-total {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 500;
  color: var(--foreground);
}

.product__bundle-tier-compare {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.product__bundle-tier-compare s {
  text-decoration: line-through;
}

.product__bundle-badge {
  position: absolute;
  top: -10px;
  left: 1rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-full);
  z-index: 2;
}

.product__bundle-badge--popular {
  background: var(--primary);
  color: #fff;
}

.product__bundle-badge--free {
  background: var(--primary-dark);
  color: #fff;
}

.product__bundle-badge--neutral {
  background: var(--foreground);
  color: #fff;
}

/* 7. Variant selector — refresh */
.product__option {
  margin: 0.5rem 0 0;
}

.product__option-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  margin-bottom: 0.5rem;
}

.product__option-values {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.product__option-btn {
  padding: 0.625rem 1.125rem;
  border: 1.5px solid var(--border-strong);
  background: #fff;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 0.875rem;
  cursor: pointer;
  transition: all var(--transition-base);
  color: var(--foreground);
}

.product__option-btn:hover {
  border-color: var(--foreground);
}

.product__option-btn--selected {
  background: var(--foreground);
  color: #fff;
  border-color: var(--foreground);
}

.product__option-btn--disabled {
  opacity: 0.4;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* 8. ETA delivery — 2 coloane card */
.product__eta {
  background: #FAF7F2;
  border: 1px solid rgba(168, 50, 58, 0.15);
  border-radius: 8px;
  margin: 0.75rem 0 1rem;
  color: var(--foreground);
}

.product__eta--grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  padding: 0.75rem 0;
}

.product__eta-cell {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0 0.875rem;
  min-width: 0;
}

.product__eta-cell + .product__eta-cell {
  border-left: 1px solid rgba(168, 50, 58, 0.18);
}

.product__eta-cell svg {
  color: var(--atc, #A8323A);
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

.product__eta-cell-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.product__eta-label {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product__eta-value {
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--atc, #A8323A);
  line-height: 1.2;
  white-space: nowrap;
}

.product__eta-free {
  color: var(--savings-bg, #4A6B57) !important;
}

.product__eta strong {
  font-weight: 800;
  color: var(--atc, #A8323A);
}

/* 9. ATC button — Resilia replica (linie 1: text + preț + compare; linie 2: garanție) */
.product__add-to-cart-btn {
  display: flex;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  padding: 0.875rem 1rem;
  background: var(--foreground);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-family: var(--font-body);
  cursor: pointer;
  transition: all var(--transition-base);
  box-shadow: 0 4px 14px rgba(44, 40, 37, 0.15);
  min-height: 64px;
  line-height: 1.25;
}

/* Container intern: forțat column ca cele 2 linii să fie pe rânduri */
.product__add-to-cart-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 0.1875rem;
}

.product__atc-line {
  display: block;
  text-align: center;
  white-space: nowrap;
}

/* Linie 1: "Adaugă în Coș | 132,75 Lei  ~~285,00 lei~~" — UN SINGUR RÂND */
.product__atc-line--top {
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.005em;
  color: #fff;
  display: inline-block;
}

.product__atc-line--top > * {
  vertical-align: baseline;
  display: inline-block;
}

/* Linie 2: "30 zile garanție" — RÂND SEPARAT */
.product__atc-line--bottom {
  font-size: 0.8125rem;
  font-weight: 400;
  letter-spacing: 0.005em;
  text-transform: none;
  color: rgba(255,255,255,0.82);
}

.product__atc-sep {
  display: inline-block;
  opacity: 0.5;
  font-weight: 300;
  margin: 0 0.4375rem;
}

.product__atc-compare {
  font-size: 0.875rem;
  font-weight: 400;
  color: rgba(255,255,255,0.5);
  margin-left: 0.375rem;
}

.product__atc-compare s {
  text-decoration: line-through;
}

/* Pe mobile: dacă top line nu încape, reduce font înainte de wrap */
@media (max-width: 480px) {
  .product__atc-line--top {
    font-size: 0.9375rem;
  }
  .product__atc-sep {
    margin: 0 0.3125rem;
  }
  .product__atc-compare {
    font-size: 0.8125rem;
  }
}

/* ATC subtext sub buton, doar pe mobile, centrat */
.product__atc-subtext-mobile {
  display: none;
  width: 100%;
  margin: 0.625rem auto 0 !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  letter-spacing: 0.005em;
}

@media (max-width: 749px) {
  .product__atc-subtext-mobile {
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .product__atc-line--bottom { display: none; }
}

.product__add-to-cart-btn:hover:not(:disabled) {
  background: #1a1714;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(44, 40, 37, 0.22);
}

.product__add-to-cart-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.product__add-to-cart-btn--success {
  background: var(--success) !important;
}

.product__add-to-cart-text {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.product__add-to-cart-text--success {
  color: #fff;
}

/* 10. Trust micro-row */
.product__trust-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0.25rem 0 0;
}

.product__trust-row li {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  font-size: 0.75rem;
  color: var(--muted-foreground);
  letter-spacing: 0.01em;
}

.product__trust-row svg {
  color: var(--muted-foreground);
  flex-shrink: 0;
}

/* 11. Accordions — refresh cu animație smooth */
.product__accordions {
  margin-top: 0;
  border-top: 1px solid var(--border);
}

.product__accordion {
  border-bottom: 1px solid var(--border);
}

.product__accordion-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.125rem 0;
  cursor: pointer;
  list-style: none;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--foreground);
  transition: color var(--transition-base);
  user-select: none;
}

.product__accordion-header::-webkit-details-marker { display: none; }
.product__accordion-header::marker { display: none; content: ''; }

.product__accordion-header:hover {
  color: var(--primary);
}

.product__accordion-icon {
  transition: transform 350ms cubic-bezier(0.4, 0, 0.2, 1);
  color: var(--muted-foreground);
  flex-shrink: 0;
}

.product__accordion[open] .product__accordion-icon {
  transform: rotate(180deg);
}

/* Smooth open/close — JS sets max-height dynamic */
.product__accordion-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 400ms cubic-bezier(0.4, 0, 0.2, 1), opacity 250ms ease;
  opacity: 0;
  color: var(--muted-foreground);
  font-size: 0.875rem;
  line-height: 1.7;
}

.product__accordion[open] .product__accordion-body {
  max-height: var(--accordion-h, 1200px);
  opacity: 1;
  padding-bottom: 1.25rem;
}

.product__accordion-body p {
  margin: 0 0 0.75rem;
}

.product__accordion-body ul,
.product__accordion-body ol {
  padding-left: 1.25rem;
  margin: 0 0 0.75rem;
}

.product__accordion-body li {
  margin-bottom: 0.375rem;
}

.product__specs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

.product__spec-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.product__spec-item--full {
  grid-column: 1 / -1;
}

.product__spec-key {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.product__spec-value {
  font-size: 0.875rem;
  color: var(--foreground);
}

/* Mini-upsell — listă produse din metafield, sub trust image */
.product__mini-upsell {
  margin-top: 0;
}

.product__mini-upsell-title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.0625rem;
  letter-spacing: -0.005em;
  color: var(--foreground);
  margin: 0 0 0.875rem;
  text-transform: none;
}

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

.product__mini-upsell-item {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 0.875rem;
  background: var(--muted);
  border-radius: 0.75rem;
  transition: background var(--transition-base);
}

.product__mini-upsell-item:hover {
  background: var(--accent);
}

.product__mini-upsell-item--soldout {
  opacity: 0.55;
}

.product__mini-upsell-thumb {
  display: block;
  width: 80px;
  height: 80px;
  border-radius: 0.5rem;
  overflow: hidden;
  background: #fff;
  flex-shrink: 0;
}

.product__mini-upsell-thumb img,
.product__mini-upsell-thumb-svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.product__mini-upsell-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.product__mini-upsell-name {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: -0.005em;
  color: var(--foreground);
  text-decoration: none;
  line-height: 1.25;
}

.product__mini-upsell-name:hover {
  color: var(--primary-dark);
}

.product__mini-upsell-price {
  display: flex;
  align-items: baseline;
  gap: 0.4375rem;
}

.product__mini-upsell-price-now {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  color: var(--foreground);
}

.product__mini-upsell-price-old {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.product__mini-upsell-price-old s {
  text-decoration: line-through;
}

.product__mini-upsell-variant {
  margin-top: 0.25rem;
  padding: 0.3125rem 0.5rem;
  border: 1px solid var(--border-strong);
  border-radius: 0.375rem;
  background: #fff;
  font-family: var(--font-body);
  font-size: 0.75rem;
  color: var(--foreground);
  cursor: pointer;
  max-width: 100%;
}

.product__mini-upsell-add {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.625rem 1rem;
  background: var(--foreground);
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.8125rem;
  letter-spacing: 0.005em;
  cursor: pointer;
  transition: all var(--transition-base);
  flex-shrink: 0;
}

.product__mini-upsell-add:hover:not(:disabled) {
  background: #1a1714;
  transform: translateY(-1px);
}

.product__mini-upsell-add--disabled,
.product__mini-upsell-add:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 480px) {
  .product__mini-upsell-item {
    grid-template-columns: 64px 1fr auto;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
  }
  .product__mini-upsell-thumb {
    width: 64px;
    height: 64px;
  }
  .product__mini-upsell-name {
    font-size: 0.875rem;
  }
  .product__mini-upsell-add {
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
  }
}

/* Trust image — block mare (replica "Why Trust Resilia") */
.product__trust-image {
  margin-top: 0;
  border-radius: 1rem;
  overflow: hidden;
  line-height: 0;
}

.product__trust-image a {
  display: block;
  line-height: 0;
}

.product__trust-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 1rem;
}

/* Payment image (mic, în slot propriu) */
.product__payment-image {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  display: flex;
  justify-content: center;
}

.product__payment-image img {
  max-width: 100%;
  height: auto;
  max-height: 38px;
  width: auto;
  object-fit: contain;
  opacity: 0.85;
}

/* Sticky bar refresh */
.product__sticky-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid var(--border);
  padding: 0.75rem 0;
  z-index: 90;
  box-shadow: 0 -4px 20px rgba(44, 40, 37, 0.06);
}

.product__sticky-bar[hidden] { display: none; }

.product__sticky-bar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.product__sticky-bar-info {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  min-width: 0;
}

.product__sticky-bar-image {
  width: 50px;
  height: 50px;
  border-radius: var(--radius-sm);
  object-fit: cover;
  flex-shrink: 0;
}

.product__sticky-bar-title {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--foreground);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}

.product__sticky-bar-prices {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.4375rem;
  margin: 0.125rem 0 0;
}

.product__sticky-bar-price {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  color: var(--foreground);
}

.product__sticky-bar-compare {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.product__sticky-bar-compare s {
  text-decoration: line-through;
}

.product__sticky-bar-saved {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  background: var(--primary);
  color: #fff;
  padding: 0.1875rem 0.4375rem;
  border-radius: 4px;
}

@media (max-width: 480px) {
  .product__sticky-bar-saved { display: none; }
}

.product__sticky-bar-btn {
  padding: 0.75rem 1.5rem;
  background: var(--foreground);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all var(--transition-base);
}

.product__sticky-bar-btn:hover:not(:disabled) {
  background: #1a1714;
}

/* ---------- RESPONSIVE — tablet + mobile ---------- */
@media (max-width: 1024px) {
  .product__layout {
    grid-template-columns: 1fr;
    grid-template-areas:
      "hero"
      "details"
      "upsell"
      "extras"
      "trust"
      "payment";
    column-gap: 0;
    row-gap: 1.5rem;
  }

  /* Dizolva wrapperul drept ca pe mobile sloturile sa-si reia grid-area-ul individual */
  .product__right {
    display: contents;
  }
  .product__details      { grid-area: details; }
  .product__trust-slot   { grid-area: trust; }
  .product__upsell-slot  { grid-area: upsell; }
  .product__payment-slot { grid-area: payment; }

  /* Pe mobile, slot-urile separate primesc spacing top */
  .product__upsell-slot,
  .product__trust-slot,
  .product__payment-slot {
    margin-top: 0;
  }
}

@media (max-width: 768px) {
  .product__container {
    padding: 0 1rem;
  }

  .product__layout {
    row-gap: 1rem;
    padding: 0.5rem 0 2.5rem;
  }

  /* Mobile layout v3.0: image 80% (LEFT) + vertical thumbs 20% (RIGHT)
     + counter row centered below (full width) */
  .product__hero {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: stretch;
  }

  .product__hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    flex: 4 1 0;
    min-width: 0;
    gap: 0;
  }

  .product__hero-image-wrap {
    aspect-ratio: 3 / 4;
  }

  /* Hide the old swipe slider + dots (replaced by side gallery + counter below) */
  .product__mobile-slider,
  .product__mobile-dots,
  #product-gallery-dots {
    display: none !important;
  }

  /* Vertical thumbs on the right — 20% width, max 5 visible, scroll for rest */
  .product__thumbs {
    display: flex !important;
    flex-direction: column;
    flex: 1 1 0;
    gap: 0.3rem;
    margin-top: 0;
    overflow-y: auto;
    scrollbar-width: none;
    align-self: stretch;
  }
  .product__thumbs::-webkit-scrollbar { display: none; }

  .product__thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    flex-shrink: 0;
  }

  /* Mobile: limit benefit pills under title to first 4 */
  .product__pill:nth-child(n+5) { display: none; }

  /* Counter + arrows — full-width row BELOW image/thumbs, centered */
  .product__hero-counter {
    flex-basis: 100%;
    order: 99;
    display: flex;
    align-items: center;
    justify-content: center; /* centered: arrow — 1/5 — arrow */
    gap: 1.25rem;
    margin: 0.6rem 0 0;
    padding: 0.4rem 0.6rem;
    background: rgba(15, 20, 26, 0.04);
    border-radius: 0.5rem;
  }
  .product__hero-counter-btn {
    background: transparent;
    border: 1px solid rgba(15, 20, 26, 0.12);
    border-radius: 999px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--foreground);
    transition: background 120ms;
    padding: 0;
  }
  .product__hero-counter-btn:hover { background: rgba(15, 20, 26, 0.06); }
  .product__hero-counter-btn:active { transform: scale(0.95); }
  .product__hero-counter-text {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--foreground);
    font-variant-numeric: tabular-nums;
    min-width: 40px;
    text-align: center;
  }
}

/* Hide counter on desktop */
@media (min-width: 769px) {
  .product__hero-counter { display: none; }
}

/* ============================================================
   Cart drawer — Fitiluri extras upsell (v3.0)
   Match width/spacing al cart-drawer__upsell-product, titluri centrate.
   ============================================================ */
.cart-drawer__extras {
  padding: 0.875rem 0 0;
  margin-top: 1rem;
  border-top: 1px solid var(--border);
}
.cart-drawer__extras-title {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--foreground);
  margin: 0 0 0.875rem;
  text-align: center;
}
.cart-drawer__extras-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.75rem;
  background: #FAF7F2;
  border: 1px solid rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  transition: border-color var(--transition-fast), background var(--transition-fast);
  margin-bottom: 0.5rem;
  position: relative;
}
.cart-drawer__extras-item:last-child { margin-bottom: 0; }
.cart-drawer__extras-item:hover { border-color: rgba(168, 50, 58, 0.2); }
.cart-drawer__extras-item--featured {
  border-color: rgba(74, 107, 87, 0.35);
  background: rgba(74, 107, 87, 0.06);
}
.cart-drawer__extras-item--featured::before {
  content: 'Cel mai popular';
  position: absolute;
  top: -8px;
  left: 0.75rem;
  background: #4A6B57;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
}
.cart-drawer__extras-img {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}
.cart-drawer__extras-info { min-width: 0; }
.cart-drawer__extras-label {
  margin: 0 0 2px;
  font-size: 13px;
  line-height: 1.3;
  color: var(--foreground);
}
.cart-drawer__extras-label strong { font-weight: 700; }
.cart-drawer__extras-prices {
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.cart-drawer__extras-price { font-size: 14px; font-weight: 800; color: #4A6B57; }
.cart-drawer__extras-strike { font-size: 12px; color: var(--muted-foreground); text-decoration: line-through; }
.cart-drawer__extras-savings {
  margin: 2px 0 0;
  font-size: 11px;
  font-weight: 700;
  color: #4A6B57;
  letter-spacing: 0.02em;
}
.cart-drawer__extras-btn {
  padding: 0.5rem 0.875rem;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border: 1.5px solid #4A6B57;
  color: #4A6B57;
  border-radius: 6px;
  cursor: pointer;
  transition: all var(--transition-base);
  background: #fff;
  white-space: nowrap;
  flex-shrink: 0;
}
.cart-drawer__extras-btn:hover { background: #4A6B57; color: #fff; }
.cart-drawer__extras-btn[disabled] { opacity: 0.5; cursor: not-allowed; }

/* Center main upsell title too (Completează-ți experiența) */
.cart-drawer__upsell-label { text-align: center; }

/* ============================================================
   Closing brace replacement happens after — but media query body already closed above */

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

  .product__mobile-slide-video {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }

  .product__mobile-slide-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 64px;
    height: 64px;
    background: rgba(0,0,0,0.5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px);
  }

  .product__mobile-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 0.75rem 0 0;
  }

  .product__mobile-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--border-strong);
    transition: all var(--transition-base);
  }

  .product__mobile-dot--active {
    background: var(--foreground);
    width: 18px;
    border-radius: 3px;
  }

  /* Title smaller on mobile — 1 line cat mai dens */
  .product__title {
    font-size: 1.375rem;
    line-height: 1.2;
    letter-spacing: -0.015em;
  }

  .product__headline {
    font-size: 0.9375rem;
    line-height: 1.4;
  }

  .product__rating-line {
    font-size: 0.75rem;
    margin-bottom: -0.25rem;
  }

  .product__details {
    gap: 0.5rem;
  }

  /* Short description: ramane sub pret si inainte de bundle pe mobile (v3.0) */
  .product__short-desc {
    font-size: 0.875rem;
    line-height: 1.55;
    padding: 0.5rem 0 0.625rem;
  }

  /* Bundle tier — adjust spacing */
  .product__bundle-tier {
    padding: 0.75rem 0.875rem;
    grid-template-columns: 22px 1fr auto;
    gap: 0.625rem;
  }

  .product__bundle-tier-label {
    font-size: 0.875rem;
  }

  .product__bundle-tier-sub {
    font-size: 0.7rem;
  }

  .product__bundle-tier-total {
    font-size: 0.9375rem;
  }

  /* ETA mobile: 2 coloane compacte */
  .product__eta {
    margin: 0.625rem 0 0.875rem;
    background: #FAF7F2;
    border: 1px solid rgba(168, 50, 58, 0.15);
    border-radius: 8px;
  }

  .product__eta--grid {
    padding: 0.5rem 0;
  }

  .product__eta-cell {
    padding: 0 0.625rem;
    gap: 0.5rem;
  }

  .product__eta-cell svg {
    width: 18px;
    height: 18px;
  }

  .product__eta-label {
    font-size: 0.625rem;
    letter-spacing: 0.04em;
  }

  .product__eta-value {
    font-size: 0.9375rem;
  }

  /* Trust row cu separatoare subtile intre item-uri, compact */
  .product__trust-row {
    gap: 0;
    justify-content: space-between;
    padding: 0.625rem 0 0;
    border-top: 1px solid var(--border);
    margin-top: 0.625rem;
  }

  .product__trust-row li {
    flex: 1;
    justify-content: center;
    font-size: 0.6875rem;
    letter-spacing: 0.02em;
    text-align: center;
    gap: 0.3125rem;
  }

  .product__trust-row li + li {
    border-left: 1px solid var(--border);
  }

  .product__trust-row svg {
    width: 13px;
    height: 13px;
  }

  /* Sticky bar on mobile */
  .product__sticky-bar-inner {
    gap: 0.5rem;
  }

  .product__sticky-bar-title {
    font-size: 0.8125rem;
    max-width: 130px;
  }

  .product__sticky-bar-price {
    font-size: 0.875rem;
  }

  .product__sticky-bar-btn {
    padding: 0.625rem 1rem;
    font-size: 0.8125rem;
  }

  .product__sticky-bar-image {
    width: 42px;
    height: 42px;
  }

  /* Specs grid single column */
  .product__specs-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .product__add-to-cart-btn {
    font-size: 0.9375rem;
    padding: 1rem 1.25rem;
    min-height: 52px;
  }
}

/* ============================================================
   REVIEWS — Resilia "Real Stories, Real Results" replica
   ============================================================ */
.reviews {
  background: var(--background);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.reviews__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.reviews__avatars-strip {
  position: relative;
  display: flex;
  gap: 0.5rem;
  margin-bottom: 2rem;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}

.reviews__avatars-track {
  display: flex;
  gap: 0.5rem;
  flex-shrink: 0;
  animation: reviews-marquee 28s linear infinite;
}

@keyframes reviews-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}

.reviews__avatar-item {
  flex-shrink: 0;
  width: 96px;
  height: 96px;
  border-radius: 0.75rem;
  overflow: hidden;
  background: var(--muted);
}

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

.reviews__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.reviews__stars-row {
  display: inline-flex;
  gap: 0.1875rem;
  margin-bottom: 0.75rem;
}

.reviews__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.875rem, 3.6vw, 2.875rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--foreground);
  margin: 0 0 0.5rem;
}

.reviews__title em {
  font-style: italic;
  color: var(--primary-dark);
  font-weight: 400;
}

.reviews__subtitle {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--muted-foreground);
  max-width: 520px;
  margin: 0 auto;
}

/* Carousel container cu nav arrows + dots */
.reviews__carousel {
  position: relative;
  padding: 0 1rem;
}

.reviews__grid {
  list-style: none;
  margin: 0;
  padding: 0.25rem 0 0.5rem;
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scroll-padding: 0;
}

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

.reviews__card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  padding: 0.75rem 0.875rem;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0.75rem;
  transition: box-shadow var(--transition-base), transform var(--transition-base);
  flex: 0 0 calc((100% - 5rem) / 3);
  min-width: 320px;
  scroll-snap-align: start;
}
.reviews__card-body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.reviews__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--border);
  color: var(--foreground);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 5;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  transition: all var(--transition-base);
}

.reviews__nav:hover {
  background: var(--foreground);
  color: #fff;
  border-color: var(--foreground);
}

.reviews__nav--prev { left: -8px; }
.reviews__nav--next { right: -8px; }

.reviews__dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.375rem;
  margin-top: 1.25rem;
  flex-wrap: nowrap;
}

.reviews__dot {
  width: 6px;
  height: 6px;
  border-radius: 50% !important;
  background: var(--border-strong);
  border: 0;
  padding: 0;
  cursor: pointer;
  transition: all var(--transition-base);
  flex-shrink: 0;
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  font: inherit;
  outline: none;
}

.reviews__dot--active {
  background: var(--foreground);
  width: 18px;
  height: 6px;
  border-radius: 999px !important;
}

@media (max-width: 1024px) {
  .reviews__card {
    flex-basis: calc((100% - 1.25rem) / 2);
  }
}

@media (max-width: 640px) {
  .reviews__carousel {
    padding: 0;
  }
  .reviews__card {
    flex-basis: 88%;
    min-width: 0;
    padding: 0.625rem 0.75rem;
    gap: 0.625rem;
  }
  .reviews__card-text { font-size: 0.825rem; line-height: 1.4; }
  .reviews__card-body { gap: 0.3rem; }
  .reviews__nav {
    display: none;
  }
  .reviews__dots {
    margin: 1rem auto 0;
    padding: 0 1rem;
    flex-wrap: nowrap;
  }
}

.reviews__card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.reviews__card-stars {
  display: inline-flex;
  align-items: center;
  gap: 0.1875rem;
}

.reviews__card-rating {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 0.875rem;
  margin-right: 0.3125rem;
  color: var(--foreground);
}

.reviews__card-quote {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.0625rem;
  line-height: 1.4;
  letter-spacing: -0.005em;
  color: var(--foreground);
  margin: 0;
}

.reviews__card-text {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--muted-foreground);
  margin: 0;
}

.reviews__card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
  margin-top: auto;
  font-size: 0.7rem;
}

.reviews__card-author {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.reviews__card-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-weight: 500;
  color: var(--foreground);
  font-size: 0.6875rem;
  object-fit: cover;
  overflow: hidden;
  flex-shrink: 0;
}

.reviews__card-name {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--foreground);
}

.reviews__card-verified {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  font-size: 0.6875rem;
  color: var(--primary-dark);
  font-weight: 500;
  letter-spacing: 0.01em;
}

.reviews__card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.reviews__card-tag {
  display: inline-flex;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--muted);
  color: var(--foreground);
  padding: 0.3125rem 0.625rem;
  border-radius: var(--radius-full);
  border: 1px solid var(--border);
}

@media (max-width: 900px) {
  .reviews__grid {
    grid-template-columns: 1fr;
    gap: 1rem;
    max-width: 480px;
    margin: 0 auto;
  }
}

@media (max-width: 480px) {
  .reviews__container { padding: 0 1rem; }
  .reviews__avatar-item {
    width: 72px;
    height: 72px;
  }
}

/* ============================================================
   REASONS WHY — Resilia "5 Reasons" carusel replica
   ============================================================ */
.reasons {
  background: var(--background);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.reasons__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.reasons__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.reasons__label {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  background: var(--accent);
  color: var(--foreground);
  padding: 0.4375rem 0.875rem;
  border-radius: var(--radius-full);
  margin-bottom: 1rem;
}

.reasons__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.75rem, 3.4vw, 2.625rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--foreground);
  margin: 0;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.reasons__title em {
  font-style: italic;
  color: var(--primary-dark);
  font-weight: 400;
}

.reasons__viewport {
  overflow: hidden;
  margin: 0 -0.5rem;
}

.reasons__track {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0 0.5rem;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

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

.reasons__card {
  flex: 0 0 calc((100% - 2rem) / 3);
  scroll-snap-align: start;
  background: #fff;
  border-radius: 1rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.reasons__card-media {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--accent);
  position: relative;
}

.reasons__card-img,
.reasons__card-placeholder svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

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

.reasons__card-placeholder-svg {
  opacity: 0.3;
  width: 100%;
  height: 100%;
}

.reasons__card-body {
  padding: 1.25rem 1.25rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.reasons__card-badge {
  align-self: flex-start;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--primary);
  color: #fff;
  padding: 0.3125rem 0.625rem;
  border-radius: var(--radius-sm);
}

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

.reasons__card-text {
  font-size: 0.8125rem;
  line-height: 1.6;
  color: var(--muted-foreground);
  margin: 0;
}

.reasons__controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.25rem;
  gap: 1rem;
}

.reasons__dots {
  display: flex;
  gap: 0.375rem;
  flex: 1;
  justify-content: center;
}

.reasons__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--border-strong);
  transition: all var(--transition-base);
}

.reasons__dot--active {
  background: var(--foreground);
  width: 18px;
  border-radius: 3px;
}

.reasons__arrows {
  display: flex;
  gap: 0.5rem;
}

.reasons__arrow {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--border-strong);
  background: #fff;
  color: var(--foreground);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-base);
}

.reasons__arrow:hover {
  background: var(--foreground);
  color: #fff;
  border-color: var(--foreground);
}

@media (max-width: 1024px) {
  .reasons__card {
    flex: 0 0 calc((100% - 1rem) / 2);
  }
}

@media (max-width: 640px) {
  .reasons__card {
    flex: 0 0 100%;
  }
  .reasons__container { padding: 0 1rem; }
}

/* ============================================================
   SHARE — Bundle CTA repeat (Resilia "Stock up. Save more." replica)
   ============================================================ */
.share {
  background: var(--background);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.share__container {
  max-width: 580px;
  margin: 0 auto;
  padding: 0 2rem;
}

.share__header {
  text-align: center;
  margin-bottom: 2rem;
}

.share__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.875rem, 3.4vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--foreground);
  margin: 0 0 0.625rem;
}

.share__title em {
  font-style: italic;
  color: var(--primary-dark);
  font-weight: 400;
}

.share__subtitle {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--muted-foreground);
  margin: 0 auto;
  max-width: 480px;
}

.share__form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.share__bundle {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.share__tier {
  position: relative;
  display: grid;
  grid-template-columns: 56px 1fr auto;
  align-items: center;
  gap: 0.875rem;
  padding: 0.875rem 1rem;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: 0.75rem;
  cursor: pointer;
  transition: all var(--transition-base);
}

.share__tier:hover { border-color: var(--primary); }

.share__tier--selected {
  border-color: var(--primary-dark);
  background: #FBF5EE;
  box-shadow: 0 0 0 3px rgba(168, 133, 95, 0.1);
}

.share__tier--has-badge { margin-top: 0.875rem; }

.share__radio { display: none; }

.share__badge {
  position: absolute;
  top: -10px;
  left: 1rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-full);
  z-index: 2;
  white-space: nowrap;
}

.share__badge--popular { background: var(--primary); color: #fff; }
.share__badge--free    { background: var(--primary-dark); color: #fff; }
.share__badge--neutral { background: var(--foreground); color: #fff; }

.share__tier-thumb {
  width: 56px;
  height: 56px;
  border-radius: 0.5rem;
  overflow: hidden;
  background: var(--muted);
}

.share__tier-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.share__tier-info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.share__tier-label {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--foreground);
}

.share__tier-sub {
  font-size: 0.75rem;
  color: var(--muted-foreground);
}

.share__tier-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.125rem;
}

.share__tier-total {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1rem;
  color: var(--foreground);
}

.share__tier-compare s {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  text-decoration: line-through;
}

/* Premium share variant picker — vizibil doar pe tier-ul selectat */
.share__tier--has-pickers { padding-bottom: 0.625rem; }

.share__pickers {
  display: none;
  flex-direction: column;
  gap: 0.5rem;
  grid-column: 1 / -1;
  margin: 0.875rem -0.25rem -0.375rem;
  padding: 0.875rem 0.875rem 0.625rem;
  background: linear-gradient(180deg, rgba(168, 133, 95, 0.05) 0%, rgba(168, 133, 95, 0.09) 100%);
  border-radius: 0.5rem;
  position: relative;
}

.share__tier--selected .share__pickers {
  display: flex;
  animation: bundlePickerSlideIn 0.22s ease;
}
.share__pickers::before {
  content: '';
  position: absolute;
  top: 0; left: 1rem; right: 1rem;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(168, 133, 95, 0.3) 0 6px, transparent 6px 12px);
}

.share__picker {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.625rem;
  position: relative;
}

.share__picker-label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 0.1875rem 0.5rem;
  background: rgba(168, 133, 95, 0.14);
  color: var(--primary-dark);
  border-radius: 999px;
  white-space: nowrap;
}

.share__picker-trigger {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  min-width: 0;
  background: #fff;
  border: 1px solid var(--border-strong);
  border-radius: 0.5rem;
  padding: 0.4375rem 0.625rem 0.4375rem 0.4375rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--foreground);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
  box-shadow: 0 1px 2px rgba(44, 40, 37, 0.04);
}

.share__picker-trigger:hover {
  border-color: var(--primary);
  box-shadow: 0 2px 8px rgba(168, 133, 95, 0.18);
}

.share__picker-trigger:focus-visible,
.share__picker--open .share__picker-trigger {
  outline: none;
  border-color: var(--primary-dark);
  box-shadow: 0 0 0 3px rgba(168, 133, 95, 0.18);
}

.share__picker-trigger-thumb {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 0.4375rem;
  background-color: #F1EAE0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(44, 40, 37, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  position: relative;
}

.share__picker-trigger-thumb--empty::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 47%, rgba(168, 133, 95, 0.4) 47% 53%, transparent 53%);
}

.share__picker-trigger-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.share__picker-trigger-chevron {
  color: var(--muted-foreground);
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.share__picker--open .share__picker-trigger-chevron {
  transform: rotate(180deg);
  color: var(--primary-dark);
}

.share__picker-panel {
  position: absolute;
  top: calc(100% + 0.375rem);
  left: 0;
  right: 0;
  z-index: 30;
  max-height: 320px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--border-strong);
  border-radius: 0.625rem;
  box-shadow: 0 12px 32px -8px rgba(44, 40, 37, 0.18), 0 4px 10px rgba(44, 40, 37, 0.06);
  padding: 0.375rem;
  animation: bundlePickerFade 0.15s ease;
}

.share__picker-group {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted-foreground);
  padding: 0.625rem 0.625rem 0.375rem;
}

.share__picker-option {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  background: transparent;
  border: none;
  border-radius: 0.5rem;
  padding: 0.5rem 0.625rem;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-body);
  color: var(--foreground);
  transition: background 0.12s ease;
}

.share__picker-option + .share__picker-option { margin-top: 0.125rem; }

.share__picker-option:hover,
.share__picker-option:focus-visible {
  background: rgba(168, 133, 95, 0.08);
  outline: none;
}

.share__picker-option--selected { background: rgba(168, 133, 95, 0.14); }

.share__picker-option-thumb {
  width: 48px;
  height: 48px;
  border-radius: 0.5rem;
  background-color: #F1EAE0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(44, 40, 37, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  position: relative;
}

.share__picker-option-thumb--empty::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 47%, rgba(168, 133, 95, 0.4) 47% 53%, transparent 53%);
  border-radius: inherit;
}

.share__picker-option-info {
  display: flex;
  flex-direction: column;
  gap: 0.0625rem;
  min-width: 0;
}

.share__picker-option-name {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--foreground);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: -0.005em;
}

.share__picker-option-price {
  font-size: 0.75rem;
  color: var(--muted-foreground);
  font-variant-numeric: tabular-nums;
}

.share__picker-option-product {
  font-size: 0.6875rem;
  color: var(--muted-foreground);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.share__picker-option-check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  color: var(--primary-dark);
  opacity: 0;
  transition: opacity 0.12s ease, background 0.12s ease;
}

.share__picker-option--selected .share__picker-option-check {
  opacity: 1;
  background: var(--primary-dark);
  color: #fff;
}

@media (max-width: 480px) {
  .share__pickers { padding: 0.75rem 0.625rem 0.5rem; gap: 0.4375rem; }
  .share__picker { grid-template-columns: 1fr; gap: 0.3125rem; }
  .share__picker-label { justify-self: start; }
  .share__picker-trigger { padding: 0.5rem 0.625rem 0.5rem 0.5rem; }
  .share__picker-trigger-thumb { width: 28px; height: 28px; }
  .share__picker-option { grid-template-columns: 36px 1fr auto; padding: 0.4375rem; }
  .share__picker-option-thumb { width: 36px; height: 36px; }
}

.share__eta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--muted);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  padding: 0.75rem 1rem;
  font-size: 0.8125rem;
  color: var(--foreground);
  margin: 0.25rem 0;
}

.share__eta svg { color: var(--primary-dark); flex-shrink: 0; }
.share__eta strong {
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--primary-dark);
  text-underline-offset: 2px;
}

.share__atc {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1.125rem 1.5rem;
  background: var(--foreground);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--transition-base);
  box-shadow: 0 4px 14px rgba(44, 40, 37, 0.15);
  min-height: 56px;
}

.share__atc:hover:not(:disabled) {
  background: #1a1714;
  transform: translateY(-1px);
}

.share__atc:disabled { opacity: 0.6; cursor: not-allowed; }

.share__guarantee-list {
  list-style: none;
  margin: 0.75rem auto 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.375rem 1rem;
  width: 100%;
}

.share__guarantee-line {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4375rem;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  text-align: center;
}

.share__guarantee-line svg {
  color: var(--primary-dark);
  flex-shrink: 0;
}

@media (max-width: 749px) {
  .share__guarantee-list {
    flex-direction: column;
    gap: 0.375rem;
  }
}

.share__guarantee {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4375rem;
  margin: 0 auto;
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.share__guarantee svg {
  color: var(--primary-dark);
  flex-shrink: 0;
}

@media (max-width: 480px) {
  .share__container { padding: 0 1rem; }
}

/* ============================================================
   SHARED SECTION TYPOGRAPHY (Sprint 2 sections)
   ============================================================ */
.prod-stats__container,
.prod-anat__container,
.lf-benefits__container,
.ritual-tl__container,
.upsell__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.prod-stats__label,
.prod-anat__label,
.lf-benefits__label,
.ritual-tl__label,
.upsell__label {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--primary-dark);
  margin-bottom: 0.875rem;
}

.prod-stats__title,
.prod-anat__title,
.lf-benefits__title,
.ritual-tl__title,
.upsell__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.875rem, 3.6vw, 2.875rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--foreground);
  margin: 0 0 0.5rem;
}

.prod-anat__title em,
.lf-benefits__title em,
.ritual-tl__title em,
.upsell__title em {
  font-style: italic;
  color: var(--primary-dark);
  font-weight: 400;
}

.prod-stats__subtitle,
.prod-anat__subtitle,
.lf-benefits__subtitle,
.ritual-tl__subtitle,
.upsell__subtitle {
  max-width: 640px;
  margin: 0 auto;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--muted-foreground);
}

@media (max-width: 768px) {
  .prod-stats__container,
  .prod-anat__container,
  .lf-benefits__container,
  .ritual-tl__container,
  .upsell__container {
    padding: 0 1rem;
  }
}

/* ============================================================
   1. STATS BAR — Resilia "Clinically Proven" replica (dark + CTA)
   ============================================================ */
.prod-stats {
  position: relative;
  background: var(--foreground);
  color: #FAF9F7;
  padding: clamp(3.5rem, 6vw, 5.5rem) 0;
  overflow: hidden;
}

.prod-stats--has-bg {
  background-color: var(--foreground);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.prod-stats__overlay {
  position: absolute;
  inset: 0;
  background: var(--foreground);
  z-index: 0;
  pointer-events: none;
}

.prod-stats__container {
  position: relative;
  z-index: 1;
}

.prod-stats__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 4rem;
  align-items: center;
}

.prod-stats__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.prod-stats__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

.prod-stats__number {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: clamp(2.5rem, 4.5vw, 3.5rem);
  line-height: 1;
  letter-spacing: -0.02em;
  color: #FAF9F7;
  margin-bottom: 0.75rem;
}

.prod-stats__number em {
  font-style: normal;
  font-size: 0.7em;
  vertical-align: super;
  margin: 0 0.05em;
  color: var(--primary-light);
}

.prod-stats__caption {
  font-size: 0.875rem;
  font-weight: 500;
  color: #FAF9F7;
  letter-spacing: -0.005em;
  line-height: 1.45;
  margin-bottom: 0.25rem;
}

.prod-stats__sub {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.02em;
  font-style: italic;
}

.prod-stats__content {
  text-align: left;
}

.prod-stats__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(2rem, 3.8vw, 2.875rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: #FAF9F7;
  margin: 0 0 1rem;
}

.prod-stats__title em {
  font-style: italic;
  color: var(--primary-light);
  font-weight: 400;
  display: block;
}

.prod-stats__subtitle {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: rgba(255,255,255,0.75);
  margin: 0 0 1.75rem;
}

.prod-stats__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2.5rem;
  background: var(--accent);
  color: var(--foreground);
  text-decoration: none;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: 0.01em;
  transition: all var(--transition-base);
}

.prod-stats__cta:hover {
  background: #fff;
  transform: translateY(-1px);
}

.prod-stats__cta-sub {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.4375rem;
  margin: 1rem 0 0;
  font-size: 0.8125rem;
  color: rgba(255,255,255,0.65);
}

.prod-stats__cta-sub svg {
  color: var(--primary-light);
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .prod-stats__layout {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .prod-stats__content {
    text-align: center;
  }
  .prod-stats__cta-sub {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .prod-stats__grid {
    gap: 1.5rem 1rem;
  }
  .prod-stats__number {
    font-size: 2.25rem;
  }
}

/* ============================================================
   2. PRODUCT ANATOMY (4 ingredient cards)
   ============================================================ */
.prod-anat {
  background: var(--background);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.prod-anat__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.prod-anat__grid {
  display: grid;
  gap: 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: stretch;
}

.prod-anat__grid--cols-1 { grid-template-columns: 1fr; }
.prod-anat__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.prod-anat__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.prod-anat__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }
.prod-anat__grid--cols-5,
.prod-anat__grid--cols-6 { grid-template-columns: repeat(4, 1fr); }

.prod-anat__card {
  display: flex;
  flex-direction: column;
  background: var(--muted);
  border-radius: 1rem;
  overflow: hidden;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
  height: 100%;
}

.prod-anat__card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}

.prod-anat__media {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--accent);
  position: relative;
}

.prod-anat__image,
.prod-anat__media svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--transition-slow);
}

.prod-anat__media svg {
  opacity: 0.25;
  padding: 30%;
  object-fit: contain;
}

.prod-anat__card:hover .prod-anat__image {
  transform: scale(1.04);
}

.prod-anat__body {
  padding: 1.5rem 1.25rem 1.75rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 0.5rem;
  background: #fff;
  flex: 1 1 auto;
}

.prod-anat__tag {
  align-self: flex-start;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--muted);
  color: var(--foreground);
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-full);
}

.prod-anat__card-title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.125rem;
  letter-spacing: -0.005em;
  color: var(--foreground);
  margin: 0;
}

.prod-anat__desc {
  font-size: 0.8125rem;
  line-height: 1.65;
  color: var(--muted-foreground);
  margin: 0;
}

@media (max-width: 768px) {
  .prod-anat__grid--cols-3,
  .prod-anat__grid--cols-4,
  .prod-anat__grid--cols-5,
  .prod-anat__grid--cols-6 {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Mobile slider: 1 card visibil + scroll-snap orizontal */
@media (max-width: 640px) {
  .prod-anat__grid {
    display: flex !important;
    grid-template-columns: none !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.875rem !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding: 0.25rem 1rem 1rem;
    margin: 0 -1rem;
    scrollbar-width: none;
  }
  .prod-anat__grid::-webkit-scrollbar { display: none; }
  .prod-anat__card {
    flex: 0 0 calc(100% - 2rem) !important;
    max-width: calc(100% - 2rem) !important;
    scroll-snap-align: center;
  }
}

/* ============================================================
   3. LIFESTYLE BENEFITS — Resilia "Feel Better Every Day" replica
   Bloc dark cu titlu sus + 4 icoane (2 stânga + 2 dreapta) + imagine produs centru
   ============================================================ */
.lf-benefits {
  background: var(--foreground);
  color: #FAF9F7;
  padding: clamp(3.5rem, 6vw, 6rem) 0;
}

.lf-benefits__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.lf-benefits__header {
  text-align: center;
  margin-bottom: 3rem;
}

.lf-benefits__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(2rem, 3.8vw, 2.875rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: #FAF9F7;
  margin: 0 0 0.75rem;
}

.lf-benefits__title em {
  font-style: italic;
  color: var(--primary-light);
  font-weight: 400;
}

.lf-benefits__subtitle {
  max-width: 540px;
  margin: 0 auto;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: rgba(255,255,255,0.7);
}

.lf-benefits__layout {
  display: grid;
  grid-template-columns: 1fr minmax(0, 0.8fr) 1fr;
  gap: 1.5rem;
  align-items: center;
}

.lf-benefits__col {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.lf-benefits__col--left { text-align: right; align-items: flex-end; }
.lf-benefits__col--right { text-align: left; align-items: flex-start; }

.lf-benefits__item {
  max-width: 220px;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.lf-benefits__col--left .lf-benefits__item { align-items: flex-end; }

.lf-benefits__item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: transparent;
  color: rgba(255,255,255,0.92);
  margin-bottom: 0.25rem;
}

.lf-benefits__item-icon svg {
  width: 44px;
  height: 44px;
  stroke-width: 1.2;
}

.lf-benefits__item-title {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.9375rem;
  line-height: 1.3;
  letter-spacing: 0.005em;
  color: #FAF9F7;
}

.lf-benefits__item-sub {
  display: none;
}

.lf-benefits__center {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 4 / 5;
}

.lf-benefits__halo {
  position: absolute;
  inset: 4%;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,0.22);
  pointer-events: none;
  z-index: 0;
}

.lf-benefits__halo::before {
  content: '';
  position: absolute;
  inset: 10%;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,0.14);
}

.lf-benefits__product,
.lf-benefits__placeholder svg {
  position: relative;
  z-index: 1;
  max-width: 80%;
  max-height: 90%;
  object-fit: contain;
  display: block;
}

.lf-benefits__placeholder {
  width: 80%;
  height: 90%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.lf-benefits__placeholder-svg {
  opacity: 0.3;
  width: 100%;
  height: 100%;
}

@media (max-width: 900px) {
  .lf-benefits__layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .lf-benefits__col {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.5rem;
    text-align: center;
    align-items: stretch;
  }
  .lf-benefits__col--left,
  .lf-benefits__col--right {
    text-align: center;
    align-items: stretch;
  }
  .lf-benefits__col--left .lf-benefits__item,
  .lf-benefits__col--right .lf-benefits__item {
    align-items: center;
  }
  .lf-benefits__item {
    flex: 1 1 140px;
    max-width: 200px;
  }
  .lf-benefits__center {
    order: -1;
    aspect-ratio: 1 / 1;
    max-width: 320px;
    margin: 0 auto;
  }
}

@media (max-width: 480px) {
  .lf-benefits__container { padding: 0 1rem; }
  .lf-benefits__col {
    gap: 1rem;
  }
  .lf-benefits__item-icon {
    width: 48px;
    height: 48px;
  }
}

/* Mobile carousel cu dots+arrows — afișat doar pe mobile */
.lf-benefits__mobile { display: none; }

@media (max-width: 749px) {
  .lf-benefits__layout { display: none !important; }
  .lf-benefits__mobile {
    display: block;
    margin-top: 1rem;
  }
  .lf-benefits__mobile-viewport {
    overflow: hidden;
    margin: 0 -1rem;
  }
  .lf-benefits__mobile-track {
    list-style: none;
    margin: 0;
    padding: 0.25rem 1rem 1rem;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0.875rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .lf-benefits__mobile-track::-webkit-scrollbar { display: none; }
  .lf-benefits__mobile-card {
    flex: 0 0 calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    scroll-snap-align: center;
    background: rgba(255,255,255,0.04);
    padding: 1.25rem 1rem;
    border-radius: 0.75rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    color: #FAF9F7;
  }
  .lf-benefits__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1rem 1rem 0;
  }
  .lf-benefits__dots {
    display: flex;
    gap: 0.375rem;
    flex: 1;
    justify-content: center;
  }
  .lf-benefits__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,0.3);
    transition: all 0.18s ease;
  }
  .lf-benefits__dot--active {
    background: #fff;
    width: 18px;
    border-radius: 3px;
  }
  .lf-benefits__arrows { display: flex; gap: 0.5rem; }
  .lf-benefits__arrow {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.3);
    background: transparent;
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.18s ease;
  }
  .lf-benefits__arrow:hover {
    background: #fff;
    color: var(--foreground);
  }
}

/* ============================================================
   4. RITUAL TIMELINE (Wellness Journey style)
   ============================================================ */
.ritual-tl {
  background: var(--background);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.ritual-tl__layout {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 3.5rem;
  align-items: start;
}

.ritual-tl__intro {
  position: sticky;
  top: calc(var(--header-height, 80px) + 1.5rem);
}

.ritual-tl__image-wrap {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  margin-bottom: 1.75rem;
  aspect-ratio: 4 / 5;
  background: var(--muted);
}

.ritual-tl__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ritual-tl__image-caption {
  position: absolute;
  inset: auto 0 1.25rem 0;
  text-align: center;
  font-family: var(--font-heading);
  font-size: 1.5rem;
  letter-spacing: 0.1em;
  color: #fff;
  text-shadow: 0 2px 12px rgba(0,0,0,0.4);
}

.ritual-tl__text {
  text-align: left;
}

.ritual-tl__text .ritual-tl__title {
  text-align: left;
}

.ritual-tl__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
  padding: 0.875rem 1.75rem;
  background: var(--foreground);
  color: #fff;
  text-decoration: none;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.9375rem;
  transition: all var(--transition-base);
  box-shadow: 0 4px 14px rgba(44, 40, 37, 0.15);
}

.ritual-tl__cta:hover {
  background: #1a1714;
  transform: translateY(-1px);
}

.ritual-tl__steps {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0 0 0 2rem;
  --scroll-fill: 0%;
}

/* Linie verticală — începe la centrul primului node, termină la centrul ultimului */
.ritual-tl__steps::before {
  content: '';
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 7px;
  width: 2px;
  background: linear-gradient(
    to bottom,
    var(--foreground) 0%,
    var(--foreground) var(--scroll-fill, 0%),
    rgba(44, 40, 37, 0.12) var(--scroll-fill, 0%),
    rgba(44, 40, 37, 0.12) 100%
  );
  border-radius: 2px;
  transition: background 100ms linear;
}

.ritual-tl__step {
  position: relative;
  margin-bottom: 1.25rem;
}

.ritual-tl__step:last-child { margin-bottom: 0; }

/* Cerc centrat pe linie — top: 0 (la nivelul step-ului), centrul cercului coincide cu linia */
.ritual-tl__node {
  position: absolute;
  top: 0;
  left: -2rem;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--foreground);
  z-index: 2;
  transition: background var(--transition-base), border-color var(--transition-base);
}

/* Cerc activ când linia se umple peste el */
.ritual-tl__node--active {
  background: var(--foreground);
}

.ritual-tl__step--dark .ritual-tl__node {
  border-color: var(--foreground);
}

.ritual-tl__step--muted .ritual-tl__node {
  border-color: var(--foreground);
}

.ritual-tl__step-inner {
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
}

.ritual-tl__step-header {
  padding: 0;
  margin-bottom: 0.5rem;
}

.ritual-tl__step-badge {
  display: block;
  padding: 0.875rem 1.25rem;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: 0.005em;
  background: var(--primary);
  color: #fff;
  border-radius: 0.5rem;
}

.ritual-tl__step--muted .ritual-tl__step-badge {
  background: var(--primary-light);
  color: var(--foreground);
}

.ritual-tl__step--dark .ritual-tl__step-badge {
  background: var(--foreground);
  color: #fff;
}

.ritual-tl__step-content {
  padding: 0.5rem 0 0;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--muted-foreground);
}

.ritual-tl__step-content ul,
.ritual-tl__step-content ol {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ritual-tl__step-content li {
  position: relative;
  padding-left: 1.5rem;
  margin-bottom: 0.5rem;
  color: var(--foreground);
}

.ritual-tl__step-content li:last-child { margin-bottom: 0; }

.ritual-tl__step-content li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55rem;
  width: 14px;
  height: 8px;
  border: 2px solid var(--primary);
  border-top: 0;
  border-right: 0;
  transform: rotate(-45deg);
  background: transparent;
}

.ritual-tl__step--dark .ritual-tl__step-content li::before {
  border-color: var(--foreground);
}

.ritual-tl__step-content p {
  margin: 0 0 0.75rem;
}

.ritual-tl__step-content p:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
  .ritual-tl__layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .ritual-tl__intro {
    position: static;
  }
  .ritual-tl__text {
    text-align: center;
  }
  .ritual-tl__text .ritual-tl__title {
    text-align: center;
  }
}

@media (max-width: 600px) {
  .ritual-tl__steps {
    padding-left: 1.5rem;
  }
  .ritual-tl__node {
    left: -1.5rem;
    width: 14px;
    height: 14px;
    border-width: 2px;
  }
  .ritual-tl__steps::before {
    left: 0.4375rem;
  }
  .ritual-tl__step-badge {
    font-size: 0.9375rem;
    padding: 0.75rem 1rem;
  }
  .ritual-tl__step-content {
    padding: 1rem 1.125rem 1.25rem;
    font-size: 0.875rem;
  }
}

/* ============================================================
   5. PRODUCT UPSELL
   ============================================================ */
.upsell {
  background: var(--background);
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.upsell__header {
  text-align: center;
  margin-bottom: 2.5rem;
}

.upsell__grid {
  display: grid;
  gap: 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.upsell__grid--cols-1 { grid-template-columns: 1fr; max-width: 380px; margin: 0 auto; }
.upsell__grid--cols-2 { grid-template-columns: repeat(2, 1fr); max-width: 760px; margin: 0 auto; }
.upsell__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.upsell__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }

.upsell__card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 1rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}

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

.upsell__card--soldout { opacity: 0.6; }

.upsell__card-media {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--muted);
  text-decoration: none;
}

.upsell__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--transition-slow);
}

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

.upsell__card-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--destructive);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-sm);
}

.upsell__card-gift {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: auto;
  max-width: 100%;
  gap: 6px;
  background: var(--savings-bg, #4A6B57);
  color: #ffffff;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 5px 10px;
  border-radius: 4px;
  margin: 8px 0 10px;
  line-height: 1.3;
  white-space: normal;
}

.upsell__card-bonus {
  position: absolute;
  top: 12px;
  right: 12px;
  background: var(--primary);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.25rem 0.625rem;
  border-radius: var(--radius-full);
}

.upsell__card-body {
  padding: 1rem 1.125rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}

.upsell__card-title-link {
  text-decoration: none;
  color: inherit;
}

.upsell__card-title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: -0.005em;
  color: var(--foreground);
  margin: 0;
  line-height: 1.3;
}

.upsell__card-desc {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
  line-height: 1.55;
  margin: 0;
}

.upsell__card-price {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin-top: auto;
  padding-top: 0.25rem;
}

.upsell__price {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.0625rem;
  color: var(--foreground);
}

.upsell__price--sale { color: var(--success); }

.upsell__price--compare {
  font-size: 0.8125rem;
  color: var(--muted-foreground);
}

.upsell__price--compare s { text-decoration: line-through; }

.upsell__form { margin: 0; }

.upsell__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4375rem;
  width: 100%;
  padding: 0.75rem 1rem;
  background: var(--foreground);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all var(--transition-base);
  margin-top: 0.5rem;
}

.upsell__btn:hover:not(:disabled) {
  background: #1a1714;
}

.upsell__btn--disabled,
.upsell__btn:disabled {
  background: var(--muted);
  color: var(--muted-foreground);
  cursor: not-allowed;
}

@media (max-width: 900px) {
  .upsell__grid--cols-3,
  .upsell__grid--cols-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .upsell__grid--cols-2,
  .upsell__grid--cols-3,
  .upsell__grid--cols-4 {
    grid-template-columns: 1fr;
    max-width: 380px;
    margin: 0 auto;
  }
}

/* ============================================================
   COMPARISON TABLE — Resilia "vs Other Brands" replica
   Layout: stânga TABEL (2 sub-coloane), dreapta CONTENT (titlu + bullets + CTA)
   Fundal dark
   ============================================================ */
.vs {
  background: var(--foreground);
  color: #FAF9F7;
  padding: clamp(3rem, 6vw, 5rem) 0;
}

.vs__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.vs__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
  gap: 3.5rem;
  align-items: center;
}

/* Stânga: tabel cu 2 sub-coloane */
.vs__table {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
  background: rgba(255,255,255,0.04);
  border-radius: 1rem;
  padding: 0.875rem;
}

.vs__col {
  display: flex;
  flex-direction: column;
  border-radius: 0.75rem;
  padding: 1rem 0.75rem 1.25rem;
  text-align: center;
}

.vs__col--ours {
  background: #F5F0EA;
  box-shadow: 0 4px 18px rgba(0,0,0,0.18);
  position: relative;
  z-index: 1;
}

.vs__col--other {
  background: var(--foreground);
}

.vs__col-media {
  width: 100%;
  height: 100px;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
}

.vs__col--other .vs__col-media {
  background: transparent;
}

.vs__col-img {
  max-width: 80%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.vs__col-placeholder,
.vs__col-placeholder-svg {
  max-width: 60%;
  max-height: 80%;
  opacity: 0.4;
}

.vs__col-title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
  color: #FAF9F7;
  text-align: center;
}

.vs__col--ours .vs__col-title {
  color: var(--foreground);
}

.vs__col--other .vs__col-title {
  color: rgba(250, 249, 247, 0.85);
}

.vs__rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  text-align: left;
}

.vs__row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.625rem;
  padding: 0.75rem 0;
  border-top: 1px solid rgba(255,255,255,0.1);
  font-size: 0.8125rem;
  line-height: 1.3;
  color: #FAF9F7;
}

.vs__col--ours .vs__row {
  border-top-color: rgba(0,0,0,0.08);
  color: var(--foreground);
}

.vs__col--other .vs__row {
  border-top-color: rgba(255,255,255,0.10);
  color: rgba(250, 249, 247, 0.7);
}

.vs__row:first-child {
  border-top: 0;
}

.vs__row-icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.vs__row-icon svg {
  width: 16px;
  height: 16px;
}

.vs__row-icon--ours {
  color: var(--primary-dark);
}

.vs__row-icon--cross {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.55);
}

.vs__row-icon--cross svg {
  width: 10px;
  height: 10px;
}

.vs__row-text {
  display: inline;
  font-weight: 500;
  color: inherit;
}

.vs__col--other .vs__row-text {
  font-weight: 400;
  text-decoration: line-through;
  text-decoration-color: rgba(255,255,255,0.25);
  text-decoration-thickness: 1px;
}

/* Dreapta: content */
.vs__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.vs__label {
  display: inline-block;
  align-self: flex-start;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--primary-light);
  margin-bottom: 0;
}

.vs__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.875rem, 3.6vw, 2.875rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: #FAF9F7;
  margin: 0 0 0.25rem;
  text-align: left;
}

.vs__title em {
  font-style: italic;
  color: var(--primary-light);
  font-weight: 400;
}

/* Texte intro sub titlu (rand 1 + rand 2) */
.vs__intro {
  margin: 0;
  color: rgba(250, 249, 247, 0.92);
  line-height: 1.6;
}

.vs__intro--1 {
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  margin-top: 0.75rem;
}

.vs__intro--2 {
  font-size: 0.9375rem;
  font-weight: 400;
  color: rgba(250, 249, 247, 0.7);
  margin-top: 0.5rem;
}

.vs__bullets {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.vs__bullet {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: #FAF9F7;
}

.vs__bullet-icon {
  flex-shrink: 0;
  color: var(--primary-light);
  margin-top: 0.1875rem;
}

.vs__bullet strong {
  font-weight: 600;
  color: #FAF9F7;
}

.vs__bullet span {
  color: rgba(255,255,255,0.65);
  font-weight: 400;
}

.vs__cta {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  justify-content: center;
  margin-top: 1rem;
  padding: 1rem 2.5rem;
  background: var(--accent);
  color: var(--foreground);
  text-decoration: none;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: 0.01em;
  transition: all var(--transition-base);
}

.vs__cta:hover {
  background: #fff;
  transform: translateY(-1px);
}

.vs__cta-sub {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  margin-top: 0.5rem;
  font-size: 0.8125rem;
  color: rgba(255,255,255,0.65);
}

.vs__cta-sub svg {
  color: var(--primary-light);
}

@media (max-width: 900px) {
  .vs__layout {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .vs__content {
    text-align: center;
    order: 1;
  }
  .vs__table {
    order: 2;
  }
  .vs__label {
    align-self: center;
  }
  .vs__title {
    text-align: center;
  }
  .vs__bullets {
    text-align: left;
  }
  .vs__cta {
    align-self: center;
  }
}

@media (max-width: 640px) {
  .vs__container { padding: 0 1rem; }
  .vs__col {
    padding: 0.875rem 0.5rem 1rem;
  }
  .vs__col-title {
    font-size: 0.75rem;
  }
}

/* ============================================================
   RISK-FREE / Garanție — Resilia "30-Day Risk-Free Trial" replica
   ============================================================ */
.risk-free {
  padding: clamp(2rem, 4vw, 3.5rem) 0;
}

.risk-free--cream { background: var(--muted); }
.risk-free--muted { background: #EAE2D6; }
.risk-free--white { background: #fff; }

.risk-free__container {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 2rem;
}

.risk-free__layout {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 2.25rem;
  align-items: center;
}

.risk-free__media {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  background: var(--accent);
  max-width: 380px;
}

.risk-free__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.risk-free__media-placeholder,
.risk-free__placeholder-svg {
  width: 100%;
  height: 100%;
  opacity: 0.3;
}

.risk-free__seal {
  position: absolute;
  top: 0.875rem;
  left: 0.875rem;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: 2;
  box-shadow: 0 4px 14px rgba(168, 133, 95, 0.30);
  border: 3px solid #fff;
}

.risk-free__seal-number {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1;
  letter-spacing: -0.02em;
}

.risk-free__seal-text {
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  margin-top: 0.1875rem;
  text-transform: uppercase;
}

.risk-free__content {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.risk-free__label {
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--primary-dark);
  margin-bottom: 0.25rem;
}

.risk-free__title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.625rem, 3vw, 2.375rem);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--foreground);
  margin: 0;
}

.risk-free__title em {
  font-style: italic;
  color: var(--primary-dark);
  font-weight: 400;
}

.risk-free__text {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--muted-foreground);
  margin: 0;
  max-width: 480px;
}

.risk-free__items {
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.risk-free__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.875rem;
  line-height: 1.4;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(44, 40, 37, 0.06);
}

.risk-free__item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.risk-free__item-icon {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--primary-dark);
  line-height: 0;
  padding: 0;
  box-sizing: border-box;
}

.risk-free__item-icon svg {
  width: 15px;
  height: 15px;
  display: block;
  margin: 0;
}

.risk-free__item-text {
  flex: 1;
  min-width: 0;
}

.risk-free__item strong {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 0.9375rem;
  letter-spacing: -0.005em;
  color: var(--foreground);
  display: block;
  margin-bottom: 0;
}

.risk-free__item span {
  color: var(--muted-foreground);
  display: block;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.risk-free__cta {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  justify-content: center;
  margin-top: 0.5rem;
  padding: 1rem 2.25rem;
  background: var(--foreground);
  color: #fff;
  text-decoration: none;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: 0.01em;
  transition: all var(--transition-base);
  box-shadow: 0 4px 14px rgba(44, 40, 37, 0.15);
}

.risk-free__cta:hover {
  background: #1a1714;
  transform: translateY(-1px);
}

@media (max-width: 900px) {
  .risk-free__layout {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }
  .risk-free__media {
    max-width: 100%;
    margin: 0 auto;
    width: 100%;
    aspect-ratio: 4 / 5;
    border-radius: 0.875rem;
  }
  .risk-free__seal {
    width: 72px;
    height: 72px;
    top: 0.625rem;
    left: 0.625rem;
    border-width: 2px;
  }
  .risk-free__seal-number {
    font-size: 1.375rem;
  }
  .risk-free__seal-text {
    font-size: 0.5rem;
  }
  .risk-free__content {
    text-align: center;
    align-items: center;
    gap: 0.625rem;
  }
  .risk-free__text {
    font-size: 0.875rem;
    line-height: 1.6;
  }
  .risk-free__items {
    width: 100%;
    max-width: 360px;
  }
  .risk-free__item-text,
  .risk-free__item-text strong,
  .risk-free__item-text span {
    text-align: left;
  }
  .risk-free__item {
    text-align: left;
  }
}

@media (max-width: 640px) {
  .risk-free { padding: 1.5rem 0; }
  .risk-free__container { padding: 0 1rem; }
  .risk-free__media {
    max-width: 100%;
  }
  .risk-free__seal {
    width: 64px;
    height: 64px;
  }
  .risk-free__seal-number {
    font-size: 1.25rem;
  }
}

/* ============================================================================
   READABILITY & UX OVERRIDES — 2026-05-06
   - Bump small fonts for 25+ audience (min ~12px legibility floor)
   - Replace hero text-shadow with tinted gradient overlay
   - Vibrant terracotta ATC color site-wide
   Appended at end of file so cascade wins. No structural changes above.
   ============================================================================ */

/* --- ATC accent token: wine-coral (premium, more red than burgundy, distinct from sale red) --- */
:root {
  --atc: #A8323A;
  --atc-hover: #8E2530;
  --atc-shadow: rgba(168, 50, 58, 0.32);
  --atc-shadow-hover: rgba(168, 50, 58, 0.48);
  /* Savings badge color — sage green, used ONLY for "Economisești X" badges */
  --savings-bg: #4A6B57;
}

/* ============================================================================
   1. TYPOGRAPHY — readability floor for 25+ audience
   ============================================================================ */

/* Tier A: ultra-small (7-9px) → 12px. Uppercase tracked labels stay visually tight via letter-spacing. */
.navbar__cart-count,
.cart-drawer__trust-item span,
.hero__avatar,
.hero__countdown-number span:last-child,
.hero__badge p:last-of-type,
.product__option-popular-badge,
.product-urgency__unit-label,
.reviews-grid__card-badge,
.payment-logos__item {
  font-size: 12px !important;
  line-height: 1.4;
}

/* Tier B: 10-11px → 14px. Most tracked labels, small CTAs, footer text. */
.btn,
.btn--sm,
.announcement-bar__message,
.trust-bar__item,
.footer__heading,
.footer__newsletter-btn,
.footer__payment-label,
.footer__bottom,
.footer__social-link,
.footer__disclaimer,
.cart-drawer__timer,
.cart-drawer__item-remove,
.cart-drawer__upsell-label,
.cart-drawer__discount-toggle,
.cart-drawer__discount-input,
.cart-drawer__shipping-note,
.cart-drawer__view-cart,
.cart-drawer__upsell-add,
.hero__btn--primary,
.hero__btn--secondary,
.hero__btn--play,
.hero__proof-text span,
.hero__label,
.hero__badge p:first-of-type,
.marquee__item,
.press__label,
.value-props__label,
.split-lifestyle__label,
.ritual-benefits__label,
.comparison-table__label,
.faq__label,
.reviews-grid__label,
.reviews-grid__card-location,
.testimonial-parallax__role,
.how-it-works__label,
.ugc-grid__label,
.guarantee__label,
.guarantee__payments span,
.newsletter__privacy,
.newsletter__trust-item span,
.product-card__badge,
.product-card__atc,
.star-rating__count,
.trust-badges__label,
.product__popular-badge,
.product-comparison__label,
.product-comparison__table thead th,
.product-bundle__label,
.about-hero__label,
.product-urgency__trust-item span,
.product-ritual__label,
.triple-guarantee__label,
.product-faq__label,
.collection__hero-subtitle,
.collection__hero-cta,
.navbar__link {
  font-size: 14px !important;
  line-height: 1.5;
}

/* Tier C: 12-13px → 15-16px. Body content, prices, descriptions, links. */
.skip-link,
.navbar__mobile-social span,
.footer__rating-text,
.footer__link,
.footer__newsletter-input,
.cart-drawer__shipping-text,
.cart-drawer__item-variant,
.cart-drawer__quantity-value,
.cart-drawer__upsell-title,
.cart-drawer__upsell-price,
.cart-drawer__subtotal-label,
.featured-products__label,
.testimonial-parallax__role,
.testimonial-parallax__name,
.ugc-grid__handle,
.newsletter__btn,
.search-modal__product-price,
.search-modal__view-all,
.featured-products__product-title,
.featured-products__price,
.footer__newsletter-discount,
.product-card__subtitle,
.product-card__title,
.product-card__price--compare,
.campaign-banner__secondary,
.campaign-banner__countdown-label {
  font-size: 15px !important;
  line-height: 1.55;
}

/* Reading text — descriptions, body copy, paragraphs. */
.hero__description,
.reviews-grid__overall-text,
.reviews-grid__card-text {
  font-size: 16px !important;
  line-height: 1.65;
}

/* Global paragraph readability */
p {
  line-height: 1.65;
}

/* ============================================================================
   2. HERO V2 — overlay + remove text-shadow
   ============================================================================ */

/* Tinted gradient — light at top, darker at bottom where content sits */
.hero-v2__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(20, 14, 10, 0.10) 0%,
    rgba(20, 14, 10, 0.30) 45%,
    rgba(20, 14, 10, 0.60) 100%
  );
  pointer-events: none;
  z-index: 1;
}

/* Make sure content sits above the overlay */
.hero-v2__overlay {
  z-index: 3;
}

/* Strip all text-shadows on hero text (overlay handles legibility now) */
.hero-v2__label,
.hero-v2__title-line,
.hero-v2__description {
  text-shadow: none !important;
}

/* Crisp white on the new overlay; description slightly softer */
.hero-v2__label {
  color: #ffffff;
  font-size: 13px;
  letter-spacing: 0.28em;
}
.hero-v2__title-line {
  color: #ffffff;
  line-height: 1.15;
}
.hero-v2__description {
  color: rgba(255, 255, 255, 0.96);
  font-size: 16px;
  line-height: 1.65;
}
.hero-v2__cta {
  font-size: 14px;
  letter-spacing: 0.18em;
}

/* Mobile hero typography */
@media (max-width: 767px) {
  .hero-v2__label {
    font-size: 12px;
  }
  .hero-v2__description {
    font-size: 15px;
    line-height: 1.6;
  }
  .hero-v2__cta {
    font-size: 13px;
    padding: 0.875rem 2rem;
  }
}

/* Desktop hero typography */
@media (min-width: 768px) {
  .hero-v2__description {
    font-size: 17px;
  }
}

/* ============================================================================
   3. ADD-TO-CART BUTTONS — vibrant terracotta site-wide
   ============================================================================ */

/* Filled ATC + Checkout + Upsell "+ ADAUGA" variants — burgundy site-wide */
.product__add-to-cart-btn,
.product__sticky-bar-btn,
.product__mini-upsell-add,
.cart__upsell-card-btn,
.upsell__btn,
.cart-drawer__checkout,
.cart__checkout-btn {
  background: var(--atc) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px var(--atc-shadow);
}

.product__add-to-cart-btn:hover:not(:disabled),
.product__sticky-bar-btn:hover:not(:disabled),
.product__mini-upsell-add:hover:not(:disabled),
.cart__upsell-card-btn:hover:not(:disabled),
.upsell__btn:hover:not(:disabled),
.cart-drawer__checkout:hover,
.cart__checkout-btn:hover {
  background: var(--atc-hover) !important;
  color: #ffffff !important;
  box-shadow: 0 6px 20px var(--atc-shadow-hover) !important;
}

/* Collection card quick-add (overlay on hover) — wine-coral with slight transparency for image bleed */
.product-card__atc {
  background: rgba(168, 50, 58, 0.92) !important;
  color: #ffffff !important;
}
.product-card__image-wrap:hover .product-card__atc {
  background: var(--atc) !important;
}
.product-card__atc:hover {
  background: var(--atc-hover) !important;
}

/* Outline-style ATC (cart drawer upsell) — burgundy border + text, fills on hover */
.cart-drawer__upsell-add {
  border-color: var(--atc) !important;
  color: var(--atc) !important;
}
.cart-drawer__upsell-add:hover {
  background: var(--atc) !important;
  color: #ffffff !important;
  border-color: var(--atc) !important;
}

/* Cart drawer "Finalizează comanda" — fit on one line on mobile */
@media (max-width: 480px) {
  .cart-drawer__checkout {
    font-size: 12px !important;
    letter-spacing: 0.04em !important;
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
    white-space: nowrap;
  }
}

/* ============================================================================
   4. ANNOUNCEMENT BAR — smaller font + allow wrap for long messages
   ============================================================================ */
.announcement-bar {
  height: auto !important;
  min-height: var(--announcement-height);
  padding: 4px 0;
}
.announcement-bar__messages {
  height: auto !important;
  min-height: 32px;
}
.announcement-bar__message {
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  text-align: center;
  padding: 0 2.5rem;
}
@media (max-width: 480px) {
  .announcement-bar__message {
    font-size: 10px !important;
    letter-spacing: 0.04em !important;
    padding: 0 2rem;
  }
}

/* ============================================================================
   5. STICKY ADD-TO-CART BAR — show full product title (no ellipsis)
   ============================================================================ */
.product__sticky-bar-title {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.25 !important;
}
@media (max-width: 749px) {
  .product__sticky-bar-title {
    font-size: 12px !important;
  }
  .product__sticky-bar-info > div {
    overflow: visible !important;
  }
}

/* ============================================================================
   6. PRODUCT PAGE PRICE — wine-coral sale, big gray compare, accent save badge
   ============================================================================ */
.product__price--sale {
  color: var(--atc) !important;
  font-weight: 700 !important;
  font-size: 1.875rem !important;
}
.product__price--compare {
  font-size: 1.25rem !important;
  color: #8a8480 !important;
  font-weight: 400 !important;
}
.product__price--compare s {
  text-decoration: line-through;
}
.product__save-badge {
  background: var(--savings-bg) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  padding: 0.4rem 0.75rem !important;
  font-size: 12px !important;
  letter-spacing: 0.04em;
}

/* ============================================================================
   7. SHIPPING info inline cu Livrare estimată + free shipping celebration
   ============================================================================ */
.product__eta-sep {
  margin: 0 0.375rem;
  color: var(--muted-foreground);
  opacity: 0.5;
}
.product__eta-free {
  color: var(--savings-bg);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 13px;
}

/* ============================================================================
   8. CART DRAWER ITEM PRICING — old, new, savings badge per item
   ============================================================================ */
.cart-drawer__item-prices {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  flex-wrap: nowrap;
  justify-content: flex-end;
}
.cart-drawer__item-compare {
  font-size: 12px;
  color: var(--muted-foreground);
  text-decoration: line-through;
  font-weight: 400;
}
.cart-drawer__item-final {
  font-size: 16px;
  font-weight: 800;
  color: var(--atc);
  line-height: 1.1;
}
.cart-drawer__item-savings {
  display: inline-flex;
  align-items: center;
  background: var(--savings-bg);
  color: #ffffff !important;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.cart-drawer__item-coupon {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 6px;
  width: 100%;
  padding: 6px 10px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--savings-bg, #4A6B57);
  background: rgba(74, 107, 87, 0.08);
  border: 1px solid rgba(74, 107, 87, 0.18);
  border-radius: 6px;
  line-height: 1.3;
}
.cart-drawer__item-coupon svg {
  flex-shrink: 0;
  color: var(--savings-bg, #4A6B57);
}
.cart-drawer__item-coupon-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 11px;
}
.cart-drawer__item-coupon-text strong {
  font-weight: 800;
}
.cart-drawer__item-coupon-amount {
  flex-shrink: 0;
  font-weight: 800;
  color: var(--savings-bg, #4A6B57);
  font-size: 12px;
  white-space: nowrap;
}
/* Legacy alias — old .cart-drawer__item-discount → silenced */
.cart-drawer__item-discount {
  display: none;
}

/* ============================================================================
   8a. CART PAGE PRICING (cart.json template) — mirror bundle UI struck/savings
   ============================================================================ */
.cart__item-price--sale {
  color: var(--atc) !important;
  font-weight: 700 !important;
}
.cart__item-price--compare {
  color: var(--muted-foreground) !important;
  margin-left: 0.375rem;
}
.cart__item-price--compare s {
  text-decoration: line-through;
}
.cart__item-total {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
.cart__item-total-final {
  color: var(--atc);
  font-weight: 700;
  font-size: 16px;
}
.cart__item-total-compare {
  color: var(--muted-foreground);
  font-size: 13px;
}
.cart__item-total-compare s {
  text-decoration: line-through;
}
.cart__item-total-savings {
  display: inline-flex;
  align-items: center;
  background: var(--savings-bg);
  color: #ffffff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* ============================================================================
   8b. CART DRAWER UPSELL PRICING — same pattern as items
   ============================================================================ */
.cart-drawer__upsell-prices {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
  flex-wrap: wrap;
  margin-top: 1px;
}
.cart-drawer__upsell-price {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: var(--atc) !important;
}
.cart-drawer__upsell-compare {
  font-size: 11px !important;
  color: var(--muted-foreground) !important;
  font-weight: 400 !important;
}
.cart-drawer__upsell-compare s {
  text-decoration: line-through;
}
.cart-drawer__upsell-gift {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--savings-bg, #4A6B57);
  color: #ffffff !important;
  font-size: 10px;
  font-weight: 700;
  padding: 3px 7px;
  border-radius: 4px;
  letter-spacing: 0.04em;
  margin-top: 4px;
  white-space: normal;
  line-height: 1.3;
  text-transform: uppercase;
}
.cart-drawer__upsell-gift s {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: line-through;
  font-weight: 600;
}
.product__mini-upsell-gift {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: auto;
  max-width: 100%;
  gap: 6px;
  background: var(--savings-bg, #4A6B57);
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  padding: 4px 9px;
  border-radius: 4px;
  letter-spacing: 0.04em;
  margin-top: 4px;
  white-space: normal;
  line-height: 1.3;
  text-transform: uppercase;
}
.product__mini-upsell-gift s {
  color: rgba(255, 255, 255, 0.75);
  text-decoration: line-through;
  font-weight: 600;
  flex-shrink: 0;
}
.upsell__card-gift s {
  color: rgba(255, 255, 255, 0.75);
  text-decoration: line-through;
  font-weight: 600;
  flex-shrink: 0;
}
/* Gift tag înlocuiește quantity controls pe cadouri (cart drawer + cart page) */
.cart-drawer__item-gift-tag,
.cart__item-gift-tag {
  display: inline-flex;
  align-items: center;
  background: var(--savings-bg, #4A6B57);
  color: #ffffff;
  font-size: 11px;
  font-weight: 800;
  padding: 5px 10px;
  border-radius: 4px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1.2;
}

.cart-drawer__upsell-savings {
  display: none !important;
}

/* ============================================================================
   8c. STICKY ADD-TO-CART BAR PRICING — wine-coral price + savings badge
   ============================================================================ */
.product__sticky-bar-title {
  font-size: 15px !important;
  font-weight: 600 !important;
}
.product__sticky-bar-prices {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 3px;
}
.product__sticky-bar-price {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--atc) !important;
}
.product__sticky-bar-compare {
  font-size: 13px !important;
  color: var(--muted-foreground) !important;
  font-weight: 400 !important;
}
.product__sticky-bar-compare s {
  text-decoration: line-through;
}
.product__sticky-bar-saved {
  display: inline-flex;
  align-items: center;
  background: var(--savings-bg);
  color: #ffffff !important;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* ============================================================================
   8d. BUNDLE TIER PRICING — wine-coral total + bigger compare + savings badge
   Aplicat și pentru share-benefits (bundle de jos)
   ============================================================================ */
.product__bundle-tier-total,
.share__tier-total {
  color: var(--atc) !important;
  font-weight: 700 !important;
  font-size: 1.125rem !important;
}
.product__bundle-tier-compare,
.share__tier-compare {
  font-size: 0.9375rem !important;
  color: var(--muted-foreground) !important;
}
.product__bundle-tier-compare s,
.share__tier-compare s {
  text-decoration: line-through;
  font-size: 0.9375rem !important;
  color: var(--muted-foreground) !important;
}
/* ============================================================================
   8e. BUNDLE TIER FREE GIFTS — rândurile cu "+ GRATUIT [Produs]"
   ============================================================================ */
.product__bundle-tier-gifts {
  display: flex;
  flex-direction: column;
  gap: 6px;
  grid-column: 1 / -1;
  margin: 10px -0.25rem -0.25rem;
  padding: 10px 12px;
  background: rgba(74, 107, 87, 0.06);
  border-radius: 6px;
  border: 1px dashed rgba(74, 107, 87, 0.25);
}
.product__bundle-tier-gift-heading {
  margin: 4px 0 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: var(--savings-bg, #4A6B57);
  text-transform: uppercase;
  text-align: center;
  line-height: 1.3;
}

/* Trigger pe picker gift — afișează: nume + struck price + ECONOMISEȘTI */
.product__bundle-gift-trigger-name {
  font-weight: 700;
  color: var(--savings-bg, #4A6B57);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 11px;
}
.product__bundle-gift-trigger-strike {
  display: inline-block;
  color: var(--muted-foreground);
  text-decoration: line-through;
  font-size: 11px;
  margin-left: 4px;
  font-weight: 500;
}
.product__bundle-gift-trigger-saved {
  display: inline-block;
  background: var(--savings-bg, #4A6B57);
  color: #ffffff;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: 6px;
  text-transform: uppercase;
  vertical-align: middle;
}
.product__bundle-tier-gift {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  line-height: 1.3;
}
.product__bundle-tier-gift-img {
  width: 28px;
  height: 28px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
}
.product__bundle-tier-gift-label {
  flex: 1;
  font-weight: 600;
  color: var(--savings-bg);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 11px;
}
.product__bundle-tier-gift-price {
  color: var(--muted-foreground);
  font-size: 12px;
  white-space: nowrap;
}
.product__bundle-tier-gift-price s {
  text-decoration: line-through;
}

/* Share-benefits (bottom bundle) — același styling */
.share__tier-gifts {
  margin-top: 8px;
  width: 100%;
}

/* Gift picker — customer alege gifts gratuite */
.product__bundle-tier-gift--pickable {
  position: relative;
  cursor: pointer;
  padding: 6px 10px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(74, 107, 87, 0.2);
}
.product__bundle-tier-gift--pickable:hover {
  background: rgba(255, 255, 255, 0.9);
  border-color: var(--savings-bg);
}
.product__bundle-gift-picker-trigger {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 8px;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 12px;
  text-align: left;
  color: var(--foreground);
}
.product__bundle-gift-picker-trigger-thumb {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  background: var(--muted);
  border-radius: 4px;
  overflow: hidden;
}
.product__bundle-gift-picker-trigger-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.product__bundle-gift-picker-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 50;
  margin-top: 4px;
  max-height: 260px;
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(44, 40, 37, 0.12);
  padding: 4px;
}
.product__bundle-gift-picker-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  cursor: pointer;
  border-radius: 4px;
  transition: background 0.15s ease;
}
.product__bundle-gift-picker-option:hover {
  background: var(--muted);
}
.product__bundle-gift-picker-option-img {
  width: 32px;
  height: 32px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
}
.product__bundle-gift-picker-option-text {
  flex: 1;
  font-size: 12px;
  font-weight: 500;
  color: var(--foreground);
  line-height: 1.3;
}
.product__bundle-gift-picker-option-price {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--muted-foreground);
  white-space: nowrap;
}
.product__bundle-gift-picker-option-price s {
  text-decoration: line-through;
}
.product__bundle-gift-picker-option-gratuit {
  display: inline-block;
  background: var(--savings-bg);
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 3px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Bundle savings sub-label — sage green background badge */
[data-tier-sub-saved] {
  display: inline-flex;
  align-items: center;
  background: var(--savings-bg);
  color: #ffffff !important;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* ============================================================================
   8g. PRODUCT CARD (collection page) PRICING — same wine-coral pattern
   ============================================================================ */
.product-card__price {
  font-size: 15px !important;
  align-items: baseline !important;
}
.product-card__price-from {
  color: var(--atc) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}
.product-card__price-compare {
  font-size: 15px !important;
  color: var(--muted-foreground) !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
.product-card__price-compare s {
  text-decoration: line-through;
}
/* Legacy collection card classes (.product-card__price--sale / --compare) */
.product-card__price--sale {
  color: var(--atc) !important;
  font-weight: 700 !important;
}
.product-card__price--compare {
  font-size: 15px !important;
  color: var(--muted-foreground) !important;
}

/* ============================================================================
   8e. PRODUCT MINI-UPSELL PRICING — same pattern (Adaugă și acestea)
   ============================================================================ */
.product__mini-upsell-price-now {
  color: var(--atc) !important;
  font-weight: 700 !important;
}
.product__mini-upsell-price-old {
  color: var(--muted-foreground) !important;
}

/* ============================================================================
   8f. UPSELL SECTION PRICING (product-upsell.liquid)
   ============================================================================ */
.upsell__price--sale {
  color: var(--atc) !important;
  font-weight: 700 !important;
}
.upsell__price--compare {
  color: var(--muted-foreground) !important;
}

/* ============================================================================
   8g. CART DRAWER ITEM — desktop compact overrides (new 2-col layout)
   ============================================================================ */
.cart-drawer__item {
  padding: 0;
}
.cart-drawer__item-image {
  width: 68px !important;
  height: 68px !important;
}
.cart-drawer__item-title {
  font-size: 12.5px !important;
  letter-spacing: 0.03em !important;
  line-height: 1.3 !important;
}
.cart-drawer__item-variant {
  font-size: 11px !important;
}
.cart-drawer__item-quantity {
  border: 1px solid var(--border) !important;
  border-radius: 6px;
}
.cart-drawer__quantity-btn {
  padding: 4px 8px !important;
}
.cart-drawer__quantity-btn svg {
  width: 12px !important;
  height: 12px !important;
}
.cart-drawer__quantity-value {
  padding: 0 8px !important;
  font-size: 13px !important;
  min-width: 22px;
  text-align: center;
}
.cart-drawer__item-prices {
  gap: 0.375rem !important;
}
.cart-drawer__item-final {
  font-size: 15px !important;
}
.cart-drawer__item-compare {
  font-size: 12px !important;
}
.cart-drawer__item-savings {
  display: inline-flex !important;
  margin: 0 !important;
  font-size: 10.5px !important;
  padding: 2px 7px !important;
  letter-spacing: 0 !important;
}

/* Bold + accent shipping label on bundle tiers */
.product__bundle-tier-label-shipping {
  display: inline-block;
  font-weight: 800 !important;
  text-transform: uppercase;
  color: var(--savings-bg);
  letter-spacing: 0.04em;
  white-space: nowrap;
  margin-left: 4px;
}
.cart-drawer__item-remove {
  padding: 4px !important;
}
.cart-drawer__item-remove svg {
  width: 16px;
  height: 16px;
}

/* Apply also for [data-tier-sub-saved] in share-benefits if structure differs */
.share__tier [data-tier-sub-saved] {
  margin-top: 4px;
}

/* ============================================================================
   8h. CART DRAWER MOBILE COMPACT — overrides for new 2-col structure
   ============================================================================ */
@media (max-width: 749px) {
  .cart-drawer__item-prices {
    gap: 0.375rem !important;
    align-items: baseline !important;
  }
  .cart-drawer__item-final {
    font-size: 14px !important;
  }
  .cart-drawer__item-compare {
    font-size: 11px !important;
  }
  .cart-drawer__item-savings {
    font-size: 10px !important;
    padding: 2px 6px !important;
    letter-spacing: 0 !important;
  }
}
@media (max-width: 480px) {
  .cart-drawer__item-savings {
    font-size: 9px !important;
    padding: 2px 5px !important;
  }
  .cart-drawer__item-final {
    font-size: 13px !important;
  }
}

/* ============================================================================
   9. CART DRAWER REVIEWS WIDGET (replaces 3 trust badges)
   ============================================================================ */
.cart-drawer__reviews {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 0 0.25rem;
  font-size: 12px;
  color: var(--muted-foreground);
}
.cart-drawer__reviews-stars {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  color: var(--star);
}
.cart-drawer__reviews-stars svg {
  fill: var(--star);
  flex-shrink: 0;
}
.cart-drawer__reviews-text strong {
  color: var(--foreground);
  font-weight: 700;
}

/* Fitil/accesoriu — quantity selector (în loc de bundle) */
.product__fitil-qty {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 1rem 0 1.25rem;
}
.product__fitil-qty-label {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--foreground);
}
.product__fitil-qty-controls {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  width: fit-content;
  overflow: hidden;
}
.product__fitil-qty-btn {
  background: none;
  border: none;
  padding: 12px 16px;
  cursor: pointer;
  color: var(--foreground);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background var(--transition-fast);
}
.product__fitil-qty-btn:hover {
  background: var(--muted);
}
.product__fitil-qty-controls input[type="number"] {
  width: 56px;
  border: none;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  padding: 12px 0;
  text-align: center;
  font-size: 1rem;
  font-weight: 700;
  color: var(--foreground);
  background: transparent;
  -moz-appearance: textfield;
}
.product__fitil-qty-controls input[type="number"]::-webkit-outer-spin-button,
.product__fitil-qty-controls input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ============================================================================
   HOMEPAGE — navbar text + icons WHITE peste hero (transparent), revin la NEGRU la scroll
   ============================================================================ */
body.template--index .navbar:not(.navbar--scrolled) .navbar__link,
body.template--index .navbar:not(.navbar--scrolled) .navbar__brand-name,
body.template--index .navbar:not(.navbar--scrolled) .navbar__action,
body.template--index .navbar:not(.navbar--scrolled) .navbar__cart-btn {
  color: #ffffff !important;
}
body.template--index .navbar:not(.navbar--scrolled) .navbar__action svg,
body.template--index .navbar:not(.navbar--scrolled) .navbar__cart-btn svg {
  stroke: #ffffff !important;
  color: #ffffff !important;
}
body.template--index .navbar:not(.navbar--scrolled) .navbar__hamburger span {
  background: #ffffff !important;
}
body.template--index .navbar:not(.navbar--scrolled) .navbar__link:hover {
  color: rgba(255, 255, 255, 0.78) !important;
}

/* ============================================================================
   Collection card — buton "Adaugă în Coș" INLINE (între imagine și conținut)
   Suprascrie regulile legacy .product-card__atc (overlay absolut pe imagine).
   Plasat ca frate între .product-card__image-wrap și .product-card__info, deci
   selectorii de hover pe image-wrap nu îl mai ating. Refolosește stările
   loading/success din .product-card__atc--loading/--success (JS [data-quick-add]).
   ============================================================================ */
.product-card__atc--inline {
  position: relative !important;
  z-index: 2;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin: 0 0 0.875rem;
  padding: 0.7rem 1rem;
  opacity: 1 !important;
  transform: none !important;
  border: none;
  border-radius: 0 !important;
  background: var(--atc, #A8323A) !important;
  color: #ffffff !important;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: background 0.25s ease, transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.25s ease;
}
/* Lipit de imaginea de deasupra: fără spațiu, colțuri pătrate ambele părți */
.product-card__image-wrap:has(+ .product-card__atc--inline) {
  margin-bottom: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
/* Hover: butonul urcă puțin peste imagine */
.product-card__atc--inline:hover {
  background: var(--atc-hover, #8a2930) !important;
  transform: translateY(-5px) !important;
  box-shadow: 0 -4px 14px -2px rgba(44, 40, 37, 0.28);
}
.product-card__atc--inline:active {
  transform: translateY(-2px) scale(0.99) !important;
}
.product-card__atc--inline svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
/* Spinner centrat pe butonul inline în timpul încărcării */
.product-card__atc--inline.product-card__atc--loading::after {
  top: 50%;
  left: 50%;
  margin: -9px 0 0 -9px;
}
/* Variantă "Alege opțiunea" — același buton, doar navighează la produs */
.product-card__atc--choose {
  background: var(--atc, #A8323A) !important;
}
/* Stoc epuizat — aspect dezactivat */
.product-card__atc--inline.product-card__atc--soldout,
.product-card__atc--inline.product-card__atc--soldout:hover {
  background: var(--muted, #E8E2DA) !important;
  color: var(--muted-foreground, #8a8076) !important;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* Mobil — buton mai îngrijit, lipit de imagine, fără radius, tap target confortabil */
@media (max-width: 768px) {
  .product-card__atc--inline {
    margin: 0 0 0.625rem;
    min-height: 44px;
    padding: 0.6rem 0.75rem;
    font-size: 11px;
    letter-spacing: 0.06em;
    gap: 0.4rem;
  }
  .product-card__atc--inline svg {
    width: 15px;
    height: 15px;
  }
  /* Pe touch nu există hover — păstrăm butonul așezat (fără lift) */
  .product-card__atc--inline:hover {
    transform: none !important;
    box-shadow: none;
  }
}

/* ============================================================
   Bundle tier — UX polish v3.0 (2026-06-02)
   1. Cadourile (lista + picker) se ascund pe tier-urile NEselectate,
      la fel ca pickerele de culori. Drastic reduce aglomerarea când
      utilizatorul scanează cele 3 tier-uri.
   2. Soften: caps → Title Case, letterspacing redus pe labels/heading.
   3. Heading „Alege uleiul cadou" mai discret + aliniat la stânga.
   ============================================================ */
.product__bundle-tier-gifts {
  display: none;
}
.product__bundle-tier--selected .product__bundle-tier-gifts,
.share__tier--selected .product__bundle-tier-gifts {
  display: flex;
  animation: bundlePickerSlideIn 0.22s ease;
}

.product__bundle-tier-gift-heading {
  text-transform: none;
  letter-spacing: 0.01em;
  font-weight: 700;
  font-size: 13px;
  text-align: left;
  margin: 2px 0 8px;
}

.product__bundle-tier-gift-label {
  text-transform: none;
  letter-spacing: 0;
  font-size: 13px;
  font-weight: 600;
}

.product__bundle-gift-trigger-name {
  text-transform: none;
  letter-spacing: 0;
  font-size: 12px;
}
.product__bundle-gift-trigger-saved {
  text-transform: none;
  letter-spacing: 0.01em;
  font-size: 10px;
  font-weight: 700;
}

/* Badge softening — caps → Title Case via typography */
.product__bundle-badge {
  text-transform: none;
  letter-spacing: 0.02em;
}

/* ============================================================
   Reviews card — lifestyle image support (v3.0)
   Imagine 3:4 portrait edge-to-edge sus, doar pe cardurile cu imagine.
   ============================================================ */
.reviews__card-image-wrap {
  flex: 0 0 80px;
  width: 80px;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 0.5rem;
  background: #f3f0eb;
  position: relative;
  align-self: flex-start;
}
.reviews__card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 350ms ease;
}
.reviews__card--with-image:hover .reviews__card-image {
  transform: scale(1.04);
}
@media (max-width: 768px) {
  .reviews__card-image-wrap {
    flex: 0 0 72px;
    width: 72px;
  }
}