/* =====================================================
   BLACK MOON MELTS — theme.css
===================================================== */

/* ---- Design Tokens (defaults; overridden by inline CSS vars from PHP) ---- */
:root {
  --color-background:   #0D0D12;
  --color-foreground:   #E8E0D5;
  --color-primary:      #7C3AED;
  --color-accent:       #D4A847;
  --color-card:         #111118;
  --color-muted:        #5a5270;
  /* Texto secundario legible sobre fondo oscuro (Lovable: text-muted-foreground) */
  --color-muted-foreground: color-mix(in srgb, var(--color-foreground) 54%, var(--color-muted) 46%);
  --color-border:       #2a2638;
  --color-secondary-bg: #13121a;
  --color-button-text:  #ffffff;

  --font-display: 'Cinzel', serif;
  --font-body:    'Raleway', sans-serif;

  --logo-height: 78px;

  --radius:       0.5rem;
  --radius-lg:    0.75rem;
  --radius-xl:    1rem;
  --radius-full:  9999px;

  --shadow-soft:    0 4px 20px -4px rgba(124,58,237,0.08);
  --shadow-elevated:0 8px 40px -8px rgba(124,58,237,0.18);

  --transition: cubic-bezier(0.4,0,0.2,1);

  --container-max: 80rem;
  --header-height: 80px;

  --btn-radius:       var(--radius);
  --btn-height:       2.75rem;
  --btn-padding:      0.625rem 2rem;
  --btn-font-size:    0.875rem;
  --btn-font-weight:  500;
  --btn-letter-spacing:0.05em;
  --btn-text-transform:lowercase;
  --btn-icon-padding: 0.5rem;
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { overflow-x: hidden; }
body {
  background-color: var(--color-background);
  color: var(--color-foreground);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Film grain overlay */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 128px 128px;
}

/* Hide default cursor on fine pointers */
@media (pointer: fine) {
  * { cursor: none !important; }
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  letter-spacing: 0.06em;
  line-height: 1.15;
}
h1 { letter-spacing: 0.08em; }
h2 { letter-spacing: 0.05em; }

a { color: inherit; text-decoration: none; }
img, video { display: block; max-width: 100%; height: auto; }
ul, ol { list-style: none; }
button { background: none; border: none; font: inherit; color: inherit; cursor: pointer; }

/* ---- Utilities ---- */
.container-wide {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 1.5rem;
}
@media (min-width: 1024px) { .container-wide { padding: 0 2rem; } }

.text-center { text-align: center; }
.bg-secondary { background-color: var(--color-secondary-bg); }
.scroll-mt-24 { scroll-margin-top: 6rem; }
/* Alias útil en HTML / bloques: text-sm text-muted-foreground leading-relaxed */
.text-muted-foreground {
  color: var(--color-muted-foreground);
  font-family: var(--font-body);
  font-size: 0.875rem;
  line-height: 1.625;
}
.animate-fade-in { animation: fadeIn 0.6s var(--transition) forwards; }
.animate-slide-up { animation: slideUp 0.6s var(--transition) forwards; }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

.section-eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: 0.625rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--color-muted-foreground);
  margin-bottom: 0.5rem;
}
.section-title {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 4vw, 3rem);
  font-weight: 700;
  text-transform: lowercase;
  color: var(--color-foreground);
  margin-bottom: 1rem;
}
.section-header { margin-bottom: 3rem; }
.section-header--center { text-align: center; }

/* ---- Buttons ---- */
.bmm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--font-body);
  font-size: var(--btn-font-size);
  font-weight: var(--btn-font-weight);
  letter-spacing: var(--btn-letter-spacing);
  text-transform: var(--btn-text-transform);
  padding: var(--btn-padding);
  min-height: var(--btn-height);
  border-radius: var(--btn-radius);
  transition: opacity 0.2s ease, background-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
  white-space: nowrap;
}
.bmm-btn:hover { opacity: 0.85; transform: scale(1.02); }
.bmm-btn:active { transform: scale(0.97); }
.bmm-btn--primary {
  background-color: var(--color-primary);
  color: var(--color-button-text);
}
.bmm-btn--outline {
  background: transparent;
  border: 1px solid var(--color-border);
  color: var(--color-foreground);
}
.bmm-btn--outline:hover { border-color: var(--color-foreground); }
.bmm-btn--outline-hero {
  background: rgba(232,224,213,0.1);
  border: 1px solid rgba(232,224,213,0.6);
  color: var(--color-foreground);
  backdrop-filter: blur(4px);
}
.bmm-btn--outline-hero:hover { background: rgba(232,224,213,0.2); opacity: 1; }
.bmm-btn--outline-light {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.6);
  color: #fff;
}
.bmm-btn--outline-light:hover { background: rgba(255,255,255,0.2); opacity: 1; }
.bmm-btn--dark {
  background-color: var(--color-background);
  color: var(--color-foreground);
}
.bmm-btn--dark:hover { background-color: rgba(13,13,18,0.9); opacity: 1; }
.bmm-btn--full { width: 100%; }
.bmm-btn--loading { opacity: 0.6 !important; pointer-events: none !important; cursor: wait !important; }

/* ---- Forms ---- */
.bmm-form-input {
  width: 100%;
  padding: 0.75rem 1rem;
  background-color: var(--color-background);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  color: var(--color-foreground);
  font-family: var(--font-body);
  font-size: 0.875rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  min-width: 0;
  box-sizing: border-box;
}
.bmm-form-input::placeholder { color: var(--color-muted-foreground); }
.bmm-form-input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 2px rgba(124,58,237,0.2); }
.bmm-form-textarea { resize: none; }
.bmm-form-label { display: block; font-family: var(--font-body); font-size: 0.875rem; font-weight: 500; margin-bottom: 0.375rem; }
.bmm-form-group { display: flex; flex-direction: column; }

/* Link underline effect */
.link-underline { position: relative; display: inline-block; }
.link-underline::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 100%; height: 1px;
  background: currentColor;
  transform-origin: left;
  transform: scaleX(0);
  transition: transform 0.3s var(--transition);
}
.link-underline:hover::after { transform: scaleX(1); }

/* =====================================================
   ANNOUNCEMENT BAR
===================================================== */
.bmm-announcement-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 60;
  background-color: var(--color-primary);
  color: #fff;
}
.bmm-announcement-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0.375rem 2rem;
  position: relative;
}
.bmm-announcement-text {
  font-family: var(--font-body);
  font-size: 0.6875rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 500;
  text-align: center;
}
.bmm-announcement-close {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  padding: 0.25rem;
  color: #fff;
  transition: opacity 0.2s;
}
.bmm-announcement-close:hover { opacity: 0.6; }
.bmm-announcement-bar.is-hidden { display: none; }

/* =====================================================
   HEADER
===================================================== */
.site-header {
  position: fixed;
  left: 0; right: 0;
  top: 36px; /* adjusted by JS when announcement closes */
  z-index: 50;
  transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, top 0.3s ease;
  border-bottom: 1px solid transparent;
  color: var(--color-foreground);
}
.site-header.is-solid,
.site-header.scrolled {
  background-color: rgba(13,13,18,0.95);
  backdrop-filter: blur(8px);
  border-bottom-color: var(--color-border);
  box-shadow: var(--shadow-soft);
}
.site-header .container-wide { position: relative; }

.site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 4rem;
  position: relative;
}
/* Tablet + desktop: misma barra que desktop (sin hamburguesa desde md) */
@media (min-width: 768px) { .site-nav { height: 5rem; } }

.site-nav__left {
  position: absolute;
  left: 0;
  display: none;
}
@media (min-width: 768px) { .site-nav__left { display: flex; align-items: center; } }

.site-nav__right {
  position: absolute;
  right: 0;
  display: flex;
  align-items: center;
}

/* Nav list */
.theme-nav-list {
  display: flex;
  align-items: center;
  gap: 2rem;
  list-style: none;
}
.theme-nav-list li a,
.theme-nav-list li button,
.bmm-nav-contact-trigger {
  font-family: var(--font-body);
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  text-transform: lowercase;
  transition: opacity 0.2s;
  position: relative;
}
.theme-nav-list li a:hover,
.theme-nav-list li button:hover { opacity: 0.6; }

/* Logo (sizes aligned with Lovable header: ~78px / 94px lg when visible) */
.site-logo-link { display: flex; align-items: center; }
.site-logo-img  {
  height: var(--logo-height) !important;
  width: auto !important;
  display: block;
  object-fit: contain;
  transition: all 0.3s ease;
}
@media (min-width: 768px) {
  /* ~94px when default 78px — scales with Customizer logo height */
  .site-logo-img { height: calc(var(--logo-height) * 1.205) !important; }
}
.site-logo-text { font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; letter-spacing: 0.05em; text-transform: lowercase; }

/* Hide logo on hero when transparent on front page */
.site-header:not(.is-solid) .site-logo-img,
.site-header:not(.is-solid) .site-logo-text { opacity: 0; pointer-events: none; }

/* Cart button */
.bmm-cart-btn {
  position: relative;
  padding: 0.5rem;
  transition: opacity 0.2s;
}
.bmm-cart-btn:hover { opacity: 0.6; }
.theme-cart-count {
  position: absolute;
  top: -0.125rem; right: -0.125rem;
  min-width: 1.25rem; height: 1.25rem;
  background: var(--color-primary);
  color: #fff;
  font-size: 0.625rem;
  font-weight: 500;
  border-radius: var(--radius-full);
  display: flex; align-items: center; justify-content: center;
}
.theme-cart-count:empty { display: none; }

/* Mobile toggle — alineado al borde izquierdo en < md; logo sigue centrado */
.bmm-mobile-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  z-index: 51;
}
@media (max-width: 767px) {
  .bmm-mobile-toggle {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }
}
@media (min-width: 768px) { .bmm-mobile-toggle { display: none; } }
.bmm-mobile-toggle .icon-close { display: none; }
.bmm-mobile-toggle.is-open .icon-menu  { display: none; }
.bmm-mobile-toggle.is-open .icon-close { display: block; }

/* Mobile menu — solo < md; tablet/desktop usan .site-nav__left */
.bmm-mobile-menu {
  display: none;
  border-top: 1px solid var(--color-border);
  padding: 1rem 0;
  animation: fadeIn 0.2s ease;
}
.bmm-mobile-menu.is-open { display: block; }
@media (min-width: 768px) {
  .bmm-mobile-menu,
  .bmm-mobile-menu.is-open {
    display: none !important;
  }
}
.bmm-mobile-menu__links {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.bmm-mobile-link {
  text-align: left;
  font-family: var(--font-body);
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  text-transform: lowercase;
  padding: 0.5rem 0;
  transition: color 0.2s;
}
.bmm-mobile-link:hover { color: var(--color-muted-foreground); }

/* =====================================================
   HERO SECTION
===================================================== */
.hero-section {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.hero-video {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(13, 13, 18, 0.6);
}
@supports (background: color-mix(in srgb, white 50%, black)) {
  .hero-overlay {
    background: color-mix(in srgb, var(--color-background) 60%, transparent);
  }
}
.hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 5rem 2rem;
  max-width: 36rem;
}
.hero-eyebrow {
  font-family: var(--font-body);
  font-size: 0.6875rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(232,224,213,0.7);
  font-weight: 500;
  margin-bottom: 1.5rem;
}
.hero-logo {
  width: clamp(280px, 40vw, 440px);
  object-fit: contain;
  margin-bottom: 1.5rem;
  filter: drop-shadow(0 6px 20px rgba(128,0,255,0.7)) drop-shadow(0 0 40px rgba(128,0,255,0.4)) drop-shadow(0 0 80px rgba(160,50,255,0.25));
}
.hero-logo-text {
  font-family: var(--font-display);
  font-size: clamp(2rem, 6vw, 4rem);
  color: var(--color-foreground);
  margin-bottom: 1.5rem;
}
.hero-subtitle {
  color: rgba(232,224,213,0.75);
  max-width: 24rem;
  font-size: 1rem;
  font-family: var(--font-body);
  line-height: 1.6;
  margin-bottom: 2.5rem;
}
.hero-cta-group {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media (min-width: 480px) { .hero-cta-group { flex-direction: row; } }

/* =====================================================
   FEATURED MOSAIC
===================================================== */
.featured-section {
  scroll-margin-top: 6rem;
}
.featured-header {
  padding: 1.5rem 1.5rem;
  text-align: center;
}
@media (min-width: 768px) {
  .featured-header { padding: 1.5rem 2.5rem; }
}
.section-title--featured { font-size: clamp(1.5rem, 3vw, 2.5rem); }

.featured-mosaic {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 200px 200px;
  gap: 0;
}
@media (min-width: 768px) {
  .featured-mosaic {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 300px 300px;
  }
}
.featured-mosaic__item--0 {
  grid-column: span 2;
  grid-row: span 2;
}
/* 4th product: full width on mobile, single cell on md+ (matches Lovable Index mosaic) */
.featured-mosaic__item--3 {
  grid-column: span 2;
}
@media (min-width: 768px) {
  .featured-mosaic__item--3 { grid-column: span 1; }
}
.featured-mosaic__item { position: relative; overflow: hidden; }
.featured-mosaic__link {
  display: block;
  width: 100%; height: 100%;
  overflow: hidden;
  position: relative;
}
.featured-mosaic__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.featured-mosaic__link:hover .featured-mosaic__img { transform: scale(1.04); }
.featured-mosaic__overlay {
  position: absolute;
  inset: 0;
  background: rgba(232,224,213,0);
  transition: background 0.5s ease;
  pointer-events: none;
}
.featured-mosaic__link:hover .featured-mosaic__overlay { background: rgba(232,224,213,0.15); }
.featured-mosaic__info {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 0.75rem 1rem;
  background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
  pointer-events: none;
}
.featured-mosaic__name {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  text-transform: lowercase;
}
.featured-mosaic__price {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(255,255,255,0.8);
}
.featured-mosaic__quick-add {
  position: absolute;
  bottom: 0.75rem;
  right: 0.75rem;
  width: 2.25rem;
  height: 2.25rem;
  background: var(--color-primary);
  color: #fff;
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
  z-index: 4;
  pointer-events: auto;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}
@media (min-width: 768px) {
  .featured-mosaic__quick-add {
    bottom: 1rem;
    right: 1rem;
  }
}
@media (max-width: 767px) {
  .featured-mosaic__quick-add { opacity: 1; }
}
.featured-mosaic__item:hover .featured-mosaic__quick-add { opacity: 1; }
.featured-mosaic__quick-add:hover {
  transform: scale(1.1);
  opacity: 1 !important;
}
.featured-mosaic__quick-add--options {
  background: var(--color-primary);
}
.featured-mosaic__cta {
  background-color: var(--color-primary);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  text-align: center;
  grid-column: span 2;
}
@media (min-width: 768px) { .featured-mosaic__cta { grid-column: span 1; } }
.featured-mosaic__cta-eye {
  font-family: var(--font-body);
  font-size: 0.625rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  display: block;
  margin-bottom: 0.5rem;
}
.featured-mosaic__cta-title {
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.5vw, 1.5rem);
  color: #fff;
  text-transform: lowercase;
  margin-bottom: 1rem;
}

/* =====================================================
   PROCESS SECTION
===================================================== */
.process-section { padding: 4rem 0 6rem; }
@media (min-width: 768px) { .process-section { padding: 6rem 0; } }
.process-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 768px) { .process-grid { grid-template-columns: repeat(3, 1fr); } }
.process-card { text-align: center; padding: 2rem; }
.process-card__icon { color: var(--color-primary); margin: 0 auto 1rem; }
.process-card__title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 600;
  text-transform: lowercase;
  margin-bottom: 0.75rem;
}
.process-card__desc {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  line-height: 1.625;
}

/* =====================================================
   ABOUT SECTION
===================================================== */
.about-section { scroll-margin-top: 6rem; }
.about-layout {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 60vh;
}
@media (min-width: 1024px) { .about-layout { grid-template-columns: 1fr 1fr; } }
.about-image-col {
  position: relative;
  min-height: 40vh;
  overflow: hidden;
}
@media (min-width: 1024px) { .about-image-col { min-height: 100%; } }
.about-image {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.about-copy-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4rem 2rem;
}
@media (min-width: 768px) { .about-copy-col { padding: 4rem 3rem; } }
@media (min-width: 1024px) { .about-copy-col { padding: 6rem 4rem; } }
.about-title {
  font-size: clamp(2rem, 4vw, 3.25rem);
  margin-bottom: 2rem;
}
.about-body {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--color-muted-foreground);
  line-height: 1.7;
  margin-bottom: 2.5rem;
}
.about-links-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem 2rem;
}
.about-link-item { text-align: left; }
.about-link-item__label {
  font-family: var(--font-display);
  font-size: 1.125rem;
  text-transform: lowercase;
  display: block;
  margin-bottom: 0.25rem;
  transition: color 0.3s;
}
.about-link-item:hover .about-link-item__label { color: var(--color-primary); }
.about-link-item__desc {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
}

/* =====================================================
   SHOP SECTION
===================================================== */
.shop-section { padding: 4rem 0 5rem; }
@media (min-width: 768px) { .shop-section { padding: 5rem 0; } }
.shop-subtitle {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  margin-bottom: 2rem;
}
.shop-section .section-title {
  font-weight: 700;
}

/* Search */
.shop-search-wrap {
  max-width: 28rem;
  margin: 0 auto 1.5rem;
}
.shop-search-inner { position: relative; }
.shop-search-icon {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-muted-foreground);
  pointer-events: none;
}
.shop-search-input {
  padding-left: 2.25rem;
  border-radius: var(--radius-full);
  background: var(--color-secondary-bg);
  border-color: var(--color-border);
}

/* Category tabs */
.shop-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.25rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--color-border);
  padding-bottom: 0.75rem;
}
.shop-tab {
  position: relative;
  padding: 0.5rem 1.25rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  text-transform: lowercase;
  color: var(--color-muted-foreground);
  transition: color 0.3s;
}
.shop-tab:hover { color: var(--color-foreground); }
.shop-tab.is-active { color: var(--color-foreground); }
.shop-tab-underline {
  display: none;
  position: absolute;
  bottom: -0.8125rem;
  left: 0; right: 0;
  height: 1px;
  background: var(--color-foreground);
}
.shop-tab.is-active .shop-tab-underline { display: block; }

/* Price filter — stack tipo Lovable (flex-col items-center gap-3) */
.shop-filter {
  margin-bottom: 2rem;
}
.shop-filter-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  max-width: 24rem;
  margin-left: auto;
  margin-right: auto;
}
.shop-filter-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  text-transform: lowercase;
  transition: color 0.3s;
}
.shop-filter-toggle:hover { color: var(--color-foreground); }
.shop-filter-current {
  font-size: 0.875rem;
  opacity: 0.7;
  white-space: nowrap;
}
.shop-filter-chevron { transition: transform 0.3s ease; }
.shop-filter-toggle.is-open .shop-filter-chevron { transform: rotate(180deg); }
.shop-price-panel {
  width: 100%;
  max-width: 24rem;
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: height 0.3s ease, opacity 0.3s ease;
}
.shop-price-panel.is-open {
  opacity: 1;
  padding-top: 0.125rem;
}
/* Lovable: py-2 + fila de precios + track (~56px total en bloque compacto) */
.price-range-inner {
  width: 100%;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  box-sizing: border-box;
}
.price-range-labels {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: var(--font-body);
  font-size: 0.875rem;
  line-height: 1.25;
  font-weight: 500;
  color: var(--color-foreground);
  margin: 0 0 0.5rem;
  letter-spacing: 0.01em;
}
/* Doble range a ancho completo (inputs superpuestos; antes 50%+50% limitaba cada pulgar a media barra) */
.price-range-wrapper {
  position: relative;
  width: 100%;
  height: 1.75rem;
  margin: 0;
  padding: 0;
  flex-shrink: 0;
}
.shop-price-panel .price-range-inner {
  margin-bottom: 0;
}
.price-range-track-bg {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 4px;
  border-radius: 9999px;
  background: color-mix(in srgb, var(--color-muted) 35%, var(--color-border));
  pointer-events: none;
  z-index: 0;
}
.range-track-fill {
  position: absolute;
  height: 4px;
  border-radius: 9999px;
  background: var(--color-primary);
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 1;
}
.price-range-input {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1.75rem;
  top: 0;
  margin: 0;
  padding: 0;
  background: none;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  pointer-events: none;
  z-index: 2;
}
.price-range-input--max {
  z-index: 3;
}
.price-range-input::-webkit-slider-runnable-track {
  width: 100%;
  height: 4px;
  background: transparent;
  border: none;
}
.price-range-input::-moz-range-track {
  width: 100%;
  height: 4px;
  background: transparent;
  border: none;
}
.price-range-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  pointer-events: auto;
  width: 16px;
  height: 16px;
  margin-top: -6px;
  border-radius: 50%;
  background: var(--color-primary);
  cursor: grab;
  border: 2px solid var(--color-background);
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.12);
}
.price-range-input:active::-webkit-slider-thumb {
  cursor: grabbing;
}
.price-range-input::-moz-range-thumb {
  pointer-events: auto;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--color-primary);
  cursor: grab;
  border: 2px solid var(--color-background);
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.12);
}
/* Product Grid */
.theme-product-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  align-items: stretch;
}
@media (min-width: 768px)  { .theme-product-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .theme-product-grid { grid-template-columns: repeat(4, 1fr); gap: 2rem; } }

/* Placeholders “coming soon” (grid Lovable) — solo desktop */
.bmm-shop-placeholder {
  display: none;
}
@media (min-width: 1024px) {
  .bmm-shop-placeholder {
    display: block;
  }
}
#bmm-product-grid.is-filtered .bmm-shop-placeholder {
  display: none !important;
}
.bmm-coming-soon-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.bmm-coming-soon-visual {
  position: relative;
  aspect-ratio: 1 / 1;
  margin-bottom: 1rem;
  border-radius: var(--radius-xl);
  background: color-mix(in srgb, var(--color-secondary-bg) 40%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 30%, transparent);
  display: flex;
  align-items: center;
  justify-content: center;
}
.bmm-coming-soon-moon {
  color: var(--color-muted-foreground);
  opacity: 0.5;
}
.bmm-coming-soon-label {
  position: absolute;
  bottom: 1rem;
  left: 0;
  right: 0;
  text-align: center;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  text-transform: lowercase;
  letter-spacing: 0.08em;
  opacity: 0.55;
}
.bmm-coming-soon-skel {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.bmm-coming-soon-skel span:first-child {
  height: 1rem;
  width: 6rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--color-muted) 25%, transparent);
}
.bmm-coming-soon-skel span:last-child {
  height: 1rem;
  width: 4rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--color-muted) 18%, transparent);
}

.theme-product-card-wrap { display: flex; flex-direction: column; }

/* Show more */
.shop-show-more-wrap { text-align: center; margin-top: 2.5rem; }
.shop-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 5rem 1rem;
  font-family: var(--font-body);
  color: var(--color-muted-foreground);
}

/* =====================================================
   PRODUCT CARD
===================================================== */
.theme-product-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.theme-product-card__image-wrapper {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  margin-bottom: 1rem;
  border-radius: var(--radius-xl);
  background: var(--color-secondary-bg);
  transition: transform 0.35s cubic-bezier(0.25, 0.4, 0.25, 1),
    box-shadow 0.35s cubic-bezier(0.25, 0.4, 0.25, 1);
}
.theme-product-card:hover .theme-product-card__image-wrapper {
  transform: translateY(-6px);
  box-shadow: 0 16px 32px -8px hsl(30 25% 12% / 0.1);
}
.theme-product-card__image-link {
  display: block;
  width: 100%; height: 100%;
}
.theme-product-card__image-wrapper img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}
.theme-product-card:hover .theme-product-card__image-wrapper img { transform: scale(1.06); }
.theme-product-card__overlay {
  position: absolute;
  inset: 0;
  background: rgba(232,224,213,0);
  transition: background 0.5s ease;
  pointer-events: none;
}
.theme-product-card:hover .theme-product-card__overlay { background: rgba(232,224,213,0.05); }

.bmm-sold-out-badge {
  position: absolute;
  top: 0.5rem; left: 0.5rem;
  padding: 0.375rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: var(--color-foreground);
  color: var(--color-background);
  border-radius: var(--radius);
  z-index: 1;
}
@media (min-width: 768px) { .bmm-sold-out-badge { top: 0.75rem; left: 0.75rem; } }

.theme-product-card__info { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; }
.theme-product-card__name {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  transition: color 0.3s;
  min-width: 0;
  overflow-wrap: break-word;
}
.theme-product-card:hover .theme-product-card__name { color: var(--color-primary); }
.theme-product-card__price {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-muted-foreground);
}
.theme-product-card__price .woocommerce-Price-amount { color: var(--color-muted-foreground); }

/* Quick-add on grid card — Lovable: bottom-2 right-2 md:bottom-3 md:right-3 + shadow-md */
.theme-product-card__quick-add {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
  width: 2.25rem;
  height: 2.25rem;
  background: var(--color-primary);
  color: #fff;
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.2s ease;
  z-index: 2;
  pointer-events: auto;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}
@media (min-width: 768px) {
  .theme-product-card__quick-add {
    bottom: 0.75rem;
    right: 0.75rem;
  }
}
@media (max-width: 767px) { .theme-product-card__quick-add { opacity: 1; } }
.theme-product-card:hover .theme-product-card__quick-add { opacity: 1; }
.theme-product-card__quick-add:hover { transform: scale(1.1); opacity: 1 !important; }

/* Add to cart button overrides (required by §11.4.1) */
.single_add_to_cart_button.button,
.add_to_cart_button.button,
a.single_add_to_cart_button,
a.add_to_cart_button {
  background-color: var(--color-primary) !important;
  color: var(--color-button-text) !important;
  border: none !important;
  border-radius: var(--btn-radius) !important;
  min-height: var(--btn-height) !important;
  padding: var(--btn-padding) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--font-body) !important;
  font-size: var(--btn-font-size) !important;
  font-weight: var(--btn-font-weight) !important;
  letter-spacing: var(--btn-letter-spacing) !important;
  text-transform: var(--btn-text-transform) !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
}
.single_add_to_cart_button.button:hover,
.add_to_cart_button.button:hover {
  opacity: 0.85 !important;
  background-color: var(--color-primary) !important;
  color: var(--color-button-text) !important;
}
.single_add_to_cart_button.button:disabled,
.single_add_to_cart_button.button.disabled,
.add_to_cart_button.button:disabled,
.add_to_cart_button.button.disabled {
  cursor: not-allowed !important;
  opacity: 0.4 !important;
  pointer-events: none !important;
}
.single_add_to_cart_button.button:disabled:hover,
.single_add_to_cart_button.button.disabled:hover,
.add_to_cart_button.button:disabled:hover,
.add_to_cart_button.button.disabled:hover {
  opacity: 0.4 !important;
  background-color: var(--color-primary) !important;
}

/* Card compact button scoped override */
.theme-product-card .add_to_cart_button.ajax_add_to_cart,
.theme-product-card .theme-product-card__quick-add {
  min-height: unset !important;
  padding: 0 !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  border-radius: 50% !important;
}

/* Featured mosaic + — overrides WC a.add_to_cart_button (min-height/padding) → Lovable w-9 h-9 circle */
.featured-mosaic a.featured-mosaic__quick-add.add_to_cart_button,
.featured-mosaic a.featured-mosaic__quick-add.featured-mosaic__quick-add--options {
  min-height: unset !important;
  min-width: 2.25rem !important;
  padding: 0 !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  border-radius: var(--radius-full) !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1 !important;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}
.featured-mosaic a.featured-mosaic__quick-add.theme-btn-loading {
  opacity: 1 !important;
  pointer-events: none !important;
}
.featured-mosaic a.featured-mosaic__quick-add.theme-btn-loading svg {
  opacity: 0.45;
}

/* Hide "View cart" link */
.woocommerce-page a.added_to_cart.wc-forward,
.single-product a.added_to_cart.wc-forward,
body a.added_to_cart.wc-forward { display: none !important; }

/* Coming-soon placeholders */
.theme-product-placeholder .placeholder-image {
  aspect-ratio: 1/1;
  background: rgba(42,38,56,0.4);
  border-radius: var(--radius-xl);
  border: 1px solid rgba(42,38,56,0.3);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
  opacity: 0.4;
  color: var(--color-muted-foreground);
}
.placeholder-image p {
  font-family: var(--font-body);
  font-size: 0.875rem;
  text-transform: lowercase;
  letter-spacing: 0.1em;
}
.theme-product-placeholder .placeholder-title,
.theme-product-placeholder .placeholder-price {
  height: 1rem;
  background: rgba(90,82,112,0.3);
  border-radius: 4px;
  margin-bottom: 0.25rem;
}
.theme-product-placeholder .placeholder-title { width: 6rem; }
.theme-product-placeholder .placeholder-price { width: 4rem; }

/* =====================================================
   EXPERIENCE CTA
===================================================== */
.experience-section { position: relative; overflow: hidden; }
.experience-layout {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 50vh;
}
@media (min-width: 1024px) { .experience-layout { grid-template-columns: 1fr 1fr; } }
.experience-video-col {
  position: relative;
  min-height: 40vh;
  overflow: hidden;
}
@media (min-width: 1024px) { .experience-video-col { min-height: 100%; } }
.experience-video {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.experience-copy-col {
  background-color: var(--color-primary);
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4rem 2rem;
}
@media (min-width: 768px) { .experience-copy-col { padding: 4rem 3rem; } }
@media (min-width: 1024px) { .experience-copy-col { padding: 6rem 4rem; } }
.experience-copy-col .section-eyebrow { color: rgba(255,255,255,0.7); margin-bottom: 1rem; }
.experience-title {
  font-size: clamp(1.5rem, 3vw, 3.25rem);
  color: #fff;
  margin-bottom: 1.5rem;
  line-height: 1.1;
}
.experience-body {
  font-family: var(--font-body);
  opacity: 0.85;
  margin-bottom: 1rem;
  max-width: 28rem;
  line-height: 1.7;
}
.experience-body-2 {
  font-family: var(--font-body);
  font-size: 0.875rem;
  opacity: 0.65;
  margin-bottom: 2rem;
}
.experience-cta-group { display: flex; flex-wrap: wrap; gap: 0.75rem; }

/* =====================================================
   CART DRAWER
===================================================== */
#theme-cart-overlay {
  position: fixed;
  inset: 0;
  background: rgba(232,224,213,0.2);
  z-index: 58;
  display: none;
  animation: fadeIn 0.2s ease;
}
body.cart-open #theme-cart-overlay { display: block; }

#theme-cart-drawer {
  position: fixed;
  right: 0; top: 0;
  height: 100%;
  width: 100%; max-width: 28rem;
  background: var(--color-background);
  z-index: 59;
  box-shadow: var(--shadow-elevated);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.35s ease;
}
body.cart-open #theme-cart-drawer { transform: translateX(0); }
#theme-cart-drawer.is-updating { opacity: 0.6; pointer-events: none; }

.cart-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}
.cart-drawer-title { font-family: var(--font-display); font-size: 1.125rem; font-weight: 700; }
.cart-drawer-close {
  padding: 0.25rem;
  transition: opacity 0.2s;
}
.cart-drawer-close:hover { opacity: 0.6; }

.cart-drawer-body { flex: 1; overflow-y: auto; padding: 1.5rem; }
.cart-items-list { display: flex; flex-direction: column; gap: 1.5rem; }
.cart-item { display: flex; gap: 1rem; }
.cart-item__img-link {
  display: block;
  width: 5rem; height: 6rem;
  flex-shrink: 0;
  background: var(--color-secondary-bg);
  overflow: hidden;
}
.cart-item__img-link img { width: 100%; height: 100%; object-fit: cover; }
.cart-item__info { flex: 1; min-width: 0; }
.cart-item__name {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 500;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: opacity 0.2s;
}
.cart-item__name:hover { opacity: 0.7; }
.cart-item__price {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  margin-top: 0.125rem;
}
.cart-item__variation {
  font-family: var(--font-body);
  font-size: 0.75rem;
  color: var(--color-muted-foreground);
  margin-top: 0.125rem;
}
.cart-item__controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.cart-item__qty-btn {
  padding: 0.25rem;
  border-radius: var(--radius);
  transition: background 0.2s;
}
.cart-item__qty-btn:hover { background: var(--color-secondary-bg); }
.cart-item__qty { font-family: var(--font-body); font-size: 0.875rem; width: 1.5rem; text-align: center; }
.cart-item__remove {
  margin-left: auto;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  transition: color 0.2s;
}
.cart-item__remove:hover { color: var(--color-foreground); }

.cart-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  text-align: center;
  padding: 1.5rem;
}
.cart-empty-state svg { color: var(--color-muted-foreground); margin-bottom: 1rem; }
.cart-empty-msg { font-family: var(--font-body); color: var(--color-muted-foreground); margin-bottom: 1.5rem; }

.cart-drawer-footer {
  padding: 1.5rem;
  border-top: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.cart-subtotal-row {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-body);
  font-size: 0.875rem;
}
.cart-subtotal-label { color: var(--color-muted-foreground); }
.cart-free-shipping-note { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); }
.cart-drawer-checkout-btn { width: 100%; }
/* Lovable: outline full width h-9 text-sm */
.cart-drawer-empty-btn {
  width: 100%;
  min-height: 2.25rem;
  padding: 0.5rem 0.75rem !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

/* =====================================================
   SINGLE PRODUCT PAGE
===================================================== */
.single-product .site-main { padding-top: calc(var(--header-height) + 36px); }
.single-product .theme-inner-page { padding-top: 0; }
.single-product-page { padding: 1.5rem 0 5rem; }

.single-product-back {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  transition: color 0.2s;
  margin-bottom: 1.5rem;
}
.single-product-back:hover { color: var(--color-foreground); }

.theme-product-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  min-width: 0;
}
@media (min-width: 1024px) { .theme-product-layout { grid-template-columns: 1fr 1fr; gap: 4rem; } }

/* Gallery */
.theme-product-gallery { min-width: 0; max-width: 100%; }
#product-main-img {
  aspect-ratio: 3/4;
  background: var(--color-secondary-bg);
  overflow: hidden;
  margin-bottom: 1rem;
  border-radius: var(--radius-lg);
}
#product-main-img img { width: 100%; height: 100%; object-fit: cover; }
.theme-product-thumbnails {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  max-width: 100%;
}
.theme-thumb-btn {
  width: 4rem; height: 4rem;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: var(--radius);
  border: 2px solid transparent;
  transition: border-color 0.2s;
  opacity: 0.6;
}
.theme-thumb-btn.is-active { border-color: var(--color-primary); opacity: 1; }
.theme-thumb-btn:hover { opacity: 1; }
.theme-thumb-btn img { width: 100%; height: 100%; object-fit: cover; }

/* Product info */
.theme-product-info { min-width: 0; max-width: 100%; }
@media (min-width: 1024px) { .theme-product-info { padding-top: 2.5rem; } }
.product-category {
  font-family: var(--font-body);
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--color-muted-foreground);
  margin-bottom: 0.5rem;
}
.product-title {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 700;
  margin-bottom: 1rem;
}
.product-price {
  font-family: var(--font-body);
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 1.5rem;
}
/* Lovable: text-muted-foreground leading-relaxed mb-8 font-body whitespace-pre-line */
.product-description {
  font-family: var(--font-body);
  color: var(--color-muted-foreground);
  line-height: 1.625;
  margin-bottom: 2rem;
  overflow-wrap: break-word;
  word-break: break-word;
  white-space: pre-line;
}
.product-description p {
  margin: 0 0 1em;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  line-height: inherit;
}
.product-description p:last-child {
  margin-bottom: 0;
}

/* Quantity + add to cart */
.theme-add-to-cart-area {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}
.theme-quantity-wrapper {
  display: flex;
  align-items: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  overflow: hidden;
}
.theme-qty-minus, .theme-qty-plus {
  width: 2.75rem; height: 2.75rem;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  transition: background 0.2s;
  flex-shrink: 0;
}
.theme-qty-minus:hover, .theme-qty-plus:hover { background: var(--color-secondary-bg); }
.theme-qty-input {
  width: 3rem;
  text-align: center;
  background: transparent;
  border: none;
  border-left: 1px solid var(--color-border);
  border-right: 1px solid var(--color-border);
  color: var(--color-foreground);
  font-family: var(--font-body);
  font-size: 0.875rem;
  padding: 0;
  height: 2.75rem;
  -moz-appearance: textfield;
}
.theme-qty-input::-webkit-outer-spin-button,
.theme-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; }
.theme-qty-input:focus { outline: none; }
.single_add_to_cart_button.theme-btn-primary { flex: 1 1 auto; min-width: 160px; }

/* Product details — Lovable: border-t + pt-8 + ul.space-y-2 */
.product-details { border-top: 1px solid var(--color-border); padding-top: 2rem; }
.product-details__title {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 1rem;
}
.product-details__list { display: flex; flex-direction: column; gap: 0.5rem; }
.product-details__list--lovable {
  list-style: none;
  padding: 0;
  margin: 0;
}
/* Lovable: li + bullet (w-1.5 h-1.5 bg-primary) + text-sm text-muted-foreground */
.product-details__list--lovable .product-details__item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  font-size: 0.875rem;
  line-height: 1.5;
}
.product-details__list--lovable .product-details__text {
  flex: 1;
  min-width: 0;
  color: var(--color-muted-foreground);
}
.product-details__list--lovable .product-details__bullet {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: var(--color-primary);
  flex-shrink: 0;
  margin-top: 0.5rem;
}
.product-details__list:not(.product-details__list--lovable) .product-details__item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
}
.product-details__bullet {
  width: 0.375rem; height: 0.375rem;
  border-radius: 50%;
  background: var(--color-primary);
  flex-shrink: 0;
  margin-top: 0.4375rem;
}

/* Variations */
.single-product .variations.shop_attributes tbody,
.single-product .variations tbody tr,
.single-product .variations tbody td { display: block; width: 100%; }
.single-product .variations tbody td.label { padding-bottom: 0.25rem; }
.single-product .variations tbody td.value { padding-top: 0; }
.theme-attr-select-hidden { display: none !important; }
.theme-attr-buttons { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1rem; }
.theme-attr-btn {
  padding: 0.5rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 0.875rem;
  transition: all 0.2s;
}
.theme-attr-btn.is-selected { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.theme-attr-btn:hover:not(.is-selected) { border-color: var(--color-primary); }

/* Related products */
.related-products-section { border-top: 1px solid var(--color-border); padding: 5rem 0; }
.related-products-title { font-family: var(--font-display); font-size: clamp(1.25rem, 2vw, 1.5rem); font-weight: 700; margin-bottom: 2.5rem; }
.related-products-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
@media (min-width: 1024px) { .related-products-grid { grid-template-columns: repeat(4, 1fr); gap: 2rem; } }

/* WC notices on single product */
.single-product .woocommerce-message,
.single-product .woocommerce-info { display: none; }
.single-product .woocommerce-error { display: block !important; }

/* =====================================================
   WOOCOMMERCE ARCHIVE / SHOP
===================================================== */
.woocommerce-archive .site-main {
  padding-top: calc(var(--header-height) + 36px);
  padding-bottom: 4rem;
}
.woocommerce-archive .container-wide { padding-top: 2rem; }

/* =====================================================
   CHECKOUT
===================================================== */
body.woocommerce-checkout .site-main {
  padding-top: calc(var(--header-height) + 36px + 2rem);
  padding-bottom: 4rem;
}
body.woocommerce-checkout .entry-content { max-width: 100%; }
body.woocommerce-checkout .page-title {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  margin-bottom: 2rem;
  text-transform: lowercase;
}

/* Two-column checkout layout */
@media (min-width: 768px) {
  body.woocommerce-checkout .wc-block-checkout {
    display: block;
  }
  body.woocommerce-checkout .wc-block-components-sidebar-layout.wc-block-checkout.is-large {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 2rem;
    align-items: start;
  }
}
body.woocommerce-checkout .wc-block-checkout__main,
body.woocommerce-checkout .wc-block-checkout__sidebar {
  min-width: 0;
  width: 100%;
  max-width: none;
}
body.woocommerce-checkout .wc-block-checkout__sidebar {
  background-color: var(--color-secondary-bg);
  border-radius: var(--radius-lg);
  padding: 2rem;
  border: 1px solid var(--color-border);
}
body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-select select,
body.woocommerce-checkout .wc-block-components-textarea textarea {
  width: 100% !important;
  max-width: none !important;
  background-color: var(--color-background);
  border-color: var(--color-border);
  color: var(--color-foreground);
  font-family: var(--font-body);
  border-radius: var(--radius);
}
body.woocommerce-checkout .wc-block-components-text-input input:focus,
body.woocommerce-checkout .wc-block-components-select select:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 2px rgba(124,58,237,0.2);
  outline: none;
}
body.woocommerce-checkout .wc-block-components-checkout-place-order-button {
  background-color: var(--color-primary) !important;
  color: #fff !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  border: none !important;
  width: 100%;
}
body.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover { opacity: 0.85 !important; }
body.woocommerce-checkout .wc-block-components-notice-banner {
  background: var(--color-secondary-bg);
  border-color: var(--color-primary);
  border-radius: var(--radius);
  color: var(--color-foreground);
  font-family: var(--font-body);
}
body.woocommerce-checkout .wc-block-cart-items { font-family: var(--font-body); }

/* WC Blocks — texto secundario legible sobre fondo oscuro (resumen, cantidades, metadatos) */
body.woocommerce-page .wc-block-components-order-summary-item__quantity,
body.woocommerce-page .wc-block-components-checkout-order-summary-item__quantity,
body.woocommerce-page .wc-block-components-product-metadata,
body.woocommerce-page .wc-block-components-product-metadata .wc-block-components-product-metadata__description,
body.woocommerce-page .wc-block-components-product-metadata .wc-block-components-product-metadata__variation-data,
body.woocommerce-page .wc-block-components-form .wc-block-components-checkout-step__description {
  color: var(--color-muted-foreground);
}

/* =====================================================
   THANK YOU PAGE
===================================================== */
body.theme-thankyou-page .woocommerce-order { font-family: var(--font-body); }
body.theme-thankyou-page .woocommerce-order-overview {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  list-style: none;
  background: var(--color-secondary-bg);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  margin-bottom: 2rem;
  border: 1px solid var(--color-border);
}
body.theme-thankyou-page .woocommerce-order-overview li {
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
}
body.theme-thankyou-page .woocommerce-order-overview li strong { color: var(--color-foreground); }
body.theme-thankyou-page .woocommerce-order h2,
body.theme-thankyou-page .woocommerce-order-details__title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  padding: 0 0 1rem 0;
}
body.theme-thankyou-page .woocommerce-order-details table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-family: var(--font-body);
  font-size: 0.875rem;
}
body.theme-thankyou-page .woocommerce-order-details tfoot th { text-align: left; }
body.theme-thankyou-page .woocommerce-order-details tfoot td { text-align: right; }
body.theme-thankyou-page .woocommerce-customer-details {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
body.theme-thankyou-page .woocommerce-customer-details address {
  max-width: 480px;
  overflow-wrap: break-word;
  font-style: normal;
  font-family: var(--font-body);
}
body.theme-thankyou-page { overflow-x: hidden; }

/* =====================================================
   MODALS
===================================================== */
.bmm-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 70;
}
.bmm-modal.is-open { display: flex; align-items: center; justify-content: center; padding: 1rem; }
.bmm-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(232,224,213,0.3);
  backdrop-filter: blur(4px);
}
.bmm-modal__panel {
  position: relative;
  background: var(--color-background);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-elevated);
  width: 100%;
  max-width: 36rem;
  max-height: 90vh;
  overflow-y: auto;
  padding: 2rem;
  z-index: 1;
  animation: slideUp 0.3s ease;
}
.bmm-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.bmm-modal__title {
  font-family: var(--font-display);
  font-size: 1.5rem;
  margin-bottom: 0.25rem;
}
.bmm-modal__desc {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
}
.bmm-modal__close {
  padding: 0.25rem;
  flex-shrink: 0;
  transition: opacity 0.2s;
}
.bmm-modal__close:hover { opacity: 0.6; }
.bmm-modal__email-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  margin-bottom: 1.5rem;
}
.bmm-contact-email-link { transition: color 0.2s; }
.bmm-contact-email-link:hover { color: var(--color-foreground); }
.bmm-contact-form { display: flex; flex-direction: column; gap: 1rem; }
.bmm-contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 480px) { .bmm-contact-form__row { grid-template-columns: 1fr; } }
.bmm-contact-form__footer { display: flex; justify-content: flex-end; }
.bmm-contact-success { text-align: center; padding: 2rem 0; }
.bmm-contact-success__icon {
  width: 3.5rem; height: 3.5rem;
  background: var(--color-primary);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1rem;
  color: #fff;
}
.bmm-contact-success__title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  margin-bottom: 0.5rem;
}
.bmm-contact-success__msg { font-family: var(--font-body); color: var(--color-muted-foreground); font-size: 0.875rem; }

/* =====================================================
   EMAIL POPUP
===================================================== */
.bmm-email-popup {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 61;
}
.bmm-email-popup.is-open { display: flex; align-items: center; justify-content: center; padding: 1rem; }
.bmm-email-popup__overlay {
  position: absolute;
  inset: 0;
  background: rgba(232,224,213,0.3);
  backdrop-filter: blur(4px);
}
.bmm-email-popup__panel {
  position: relative;
  background: var(--color-background);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-elevated);
  width: 100%;
  max-width: 28rem;
  padding: 2rem;
  z-index: 1;
  animation: slideUp 0.3s ease;
}
.bmm-email-popup__close {
  position: absolute;
  top: 1rem; right: 1rem;
  padding: 0.25rem;
  color: var(--color-muted-foreground);
  transition: color 0.2s;
}
.bmm-email-popup__close:hover { color: var(--color-foreground); }
.bmm-email-popup__header { text-align: center; margin-bottom: 1.5rem; }
.bmm-email-popup__title {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 4vw, 1.875rem);
  margin-bottom: 0.5rem;
}
.bmm-email-popup__desc { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); }
.bmm-email-popup__form { display: flex; flex-direction: column; gap: 0.75rem; }
.bmm-email-popup__note { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); text-align: center; margin-top: 1rem; }
.bmm-email-popup__success { text-align: center; padding: 1rem 0; }

/* =====================================================
   FOOTER
===================================================== */
.site-footer { border-top: 1px solid var(--color-border); }
/* Lovable: py-12 lg:py-16 */
.site-footer .container-wide { padding-top: 3rem; padding-bottom: 3rem; }
@media (min-width: 1024px) { .site-footer .container-wide { padding-top: 4rem; padding-bottom: 4rem; } }

/* Newsletter — Lovable: flex-col md:flex-row md:items-center md:justify-between gap-5 mb-10 pb-8 border-b */
.footer-newsletter {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-bottom: 2.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--color-border);
}
@media (min-width: 768px) {
  .footer-newsletter {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
  }
}
.footer-newsletter__copy {
  flex: 1 1 auto;
  min-width: 0;
}
.footer-newsletter__title {
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 600;
  text-transform: lowercase;
  letter-spacing: 0.025em;
  margin-bottom: 0.25rem;
}
.footer-newsletter__desc { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); line-height: 1.5; }
.footer-newsletter__form-wrap {
  flex: 0 1 auto;
  min-width: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .footer-newsletter__form-wrap {
    width: auto;
    max-width: 26rem;
  }
}
/* Lovable: form flex flex-wrap gap-2 — input y botón en la misma fila (~40px;
   no usar flex-basis ancho en el input: en contenedores ~300px hacía wrap y doblaba el alto) */
.footer-newsletter__form {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.5rem;
}
.footer-newsletter__form .footer-newsletter__input {
  flex: 1 1 0;
  width: 1%;
  min-width: 0;
  max-width: none;
  min-height: 2.5rem;
  padding: 0.5rem 0.875rem;
  font-size: 0.875rem;
  border-radius: var(--radius);
}
.footer-newsletter .footer-newsletter__btn {
  flex: 0 0 auto;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  min-height: 2.5rem;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
}
@media (max-width: 359px) {
  .footer-newsletter__form {
    flex-wrap: wrap;
  }
  .footer-newsletter__form .footer-newsletter__input {
    flex: 1 1 100%;
    width: 100%;
  }
}
.footer-newsletter__success {
  font-family: var(--font-body);
  font-size: 0.8125rem;
  color: var(--color-primary);
  font-weight: 500;
  margin-bottom: 0.375rem;
  width: 100%;
  text-align: left;
}
@media (min-width: 768px) {
  .footer-newsletter__success { text-align: right; }
}

/* Main footer — Lovable: grid 1 col → md:grid-cols-[2fr_1fr_1fr] gap-8 lg:gap-16 */
.footer-main {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 768px) {
  .footer-main {
    grid-template-columns: 2fr 1fr 1fr;
    gap: 2rem;
  }
}
@media (min-width: 1024px) {
  .footer-main {
    gap: 4rem;
  }
}

/* Brand */
.footer-brand__logo-link { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.footer-brand__logo-img { width: 2.25rem; height: 2.25rem; object-fit: contain; }
.footer-brand__name { font-family: var(--font-display); font-size: 1.125rem; font-weight: 600; letter-spacing: 0.025em; text-transform: lowercase; }
.footer-brand__tagline { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); font-style: italic; margin-bottom: 0.75rem; }
.footer-brand__desc { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); line-height: 1.6; max-width: 24rem; }

/* Nav column */
.footer-col__heading { font-family: var(--font-body); font-size: 0.875rem; font-weight: 600; margin-bottom: 1rem; }
.footer-nav-list { display: flex; flex-direction: column; gap: 0.75rem; }
.footer-nav-list li a,
.footer-nav-list li button {
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--color-muted-foreground);
  transition: color 0.2s;
  text-align: left;
  text-transform: capitalize;
}
.footer-nav-list li a:hover,
.footer-nav-list li button:hover { color: var(--color-foreground); }

/* Contact column */
.footer-contact-list { display: flex; flex-direction: column; gap: 0.75rem; }
.footer-contact-item { display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; color: var(--color-muted-foreground); }
.footer-contact-item svg { flex-shrink: 0; }
.footer-contact-link { transition: color 0.2s; }
.footer-contact-link:hover { color: var(--color-foreground); }

/* Bottom */
.footer-bottom {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}
@media (min-width: 640px) { .footer-bottom { flex-direction: row; justify-content: space-between; } }
.footer-bottom__copy { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); }
.footer-bottom__credit { font-family: var(--font-body); font-size: 0.875rem; color: var(--color-muted-foreground); }
.footer-credit-link { transition: color 0.2s; text-decoration: underline; }
.footer-credit-link:hover { color: var(--color-foreground); }

/* =====================================================
   INNER PAGES
===================================================== */
.theme-inner-page {
  padding-top: calc(var(--header-height) + 36px);
  min-height: 60vh;
}
.theme-inner-page .container-wide { padding-top: 2rem; padding-bottom: 4rem; }
.page-title {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  margin-bottom: 2rem;
  text-transform: lowercase;
}
.entry-content { font-family: var(--font-body); line-height: 1.7; color: var(--color-muted-foreground); }

/* 404 */
.error-404 { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 5rem 1rem; }
.error-404__num { font-family: var(--font-display); font-size: clamp(4rem, 10vw, 8rem); font-weight: 700; color: var(--color-primary); line-height: 1; }
.error-404__title { font-family: var(--font-display); font-size: clamp(1.25rem, 3vw, 2rem); margin-bottom: 1rem; }

/* =====================================================
   MAGIC CURSOR
===================================================== */
.bmm-magic-canvas {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99998;
  display: none;
}
.bmm-magic-cursor {
  position: fixed;
  pointer-events: none;
  z-index: 99999;
  width: 20px; height: 20px;
  top: 0; left: 0;
  transform: translate(-100px, -100px);
  transition: scale 0.2s ease;
  display: none;
}
@media (pointer: fine) {
  .bmm-magic-canvas { display: block; }
  .bmm-magic-cursor { display: block; }
}
.bmm-magic-cursor svg {
  filter: drop-shadow(0 0 6px hsl(263,70%,58%)) drop-shadow(0 0 12px hsl(42,60%,55%));
  transition: filter 0.2s ease;
}
.bmm-magic-cursor.is-hovering svg {
  filter: drop-shadow(0 0 14px hsl(263,70%,65%))
          drop-shadow(0 0 28px hsl(42,60%,60%))
          drop-shadow(0 0 44px hsl(263,70%,75%))
          drop-shadow(0 0 60px hsl(280,50%,60%));
}

/* =====================================================
   SECTION ANIMATIONS
===================================================== */
.bmm-animate-section {
  opacity: 0;
  transform: translateX(-40px) translateY(20px);
  transition: opacity 0.9s cubic-bezier(0.25, 0.4, 0.25, 1), transform 0.9s cubic-bezier(0.25, 0.4, 0.25, 1);
}
.bmm-animate-section:nth-child(even) {
  transform: translateX(40px) translateY(20px);
}
.bmm-animate-section.in-view {
  opacity: 1;
  transform: translate(0, 0);
}

/* Card Pattern A — hit-area overlay (§31.3, §15.1) */
.theme-product-card { position: relative; }
.theme-card-link {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: auto;
}
.theme-product-card * { pointer-events: none; }
.theme-product-card .theme-card-link {
  pointer-events: auto;
}
.theme-product-card .theme-product-card__quick-add {
  position: absolute;
  z-index: 3;
  pointer-events: auto;
}
.theme-product-card .add_to_cart_button:not(.theme-product-card__quick-add) {
  position: relative;
  z-index: 2;
  pointer-events: auto;
}

/* =====================================================
   WOOCOMMERCE GENERIC OVERRIDES
===================================================== */
.woocommerce-store-notice { display: none !important; }
.woocommerce .woocommerce-info { background: var(--color-secondary-bg); border-color: var(--color-primary); color: var(--color-foreground); font-family: var(--font-body); border-radius: var(--radius); }
.woocommerce .woocommerce-error { background: var(--color-secondary-bg); border-color: #e53e3e; color: var(--color-foreground); font-family: var(--font-body); border-radius: var(--radius); }
.woocommerce .woocommerce-message { background: var(--color-secondary-bg); border-color: var(--color-primary); color: var(--color-foreground); font-family: var(--font-body); border-radius: var(--radius); }