/* BOGA Fragancias v44 — capa visual premium estable, sin destellos. */

:root {
  --premium-ease: cubic-bezier(.22, 1, .36, 1);
  --premium-gold: #b7965c;
  --premium-gold-soft: rgba(183, 150, 92, .22);
  --premium-shadow: 0 28px 70px rgba(31, 26, 18, .14);
  --premium-shadow-hover: 0 34px 90px rgba(31, 26, 18, .2);
}

html.lenis,
html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }
.lenis.lenis-smooth iframe { pointer-events: none; }

body {
  background:
    radial-gradient(circle at 9% 12%, rgba(183, 150, 92, .08), transparent 24rem),
    radial-gradient(circle at 92% 31%, rgba(223, 207, 182, .16), transparent 28rem),
    var(--paper, #f8f5ef);
}

/* Loader máximo 1 segundo */
.boga-loader {
  position: fixed;
  z-index: 99999;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #12120f;
  color: #fff;
  pointer-events: none;
}
.boga-loader__inner {
  display: grid;
  justify-items: center;
  gap: 18px;
}
.boga-loader__brand {
  margin: 0;
  font-family: var(--sans, "Sora", Arial, sans-serif);
  font-size: clamp(20px, 3vw, 34px);
  font-weight: 500;
  letter-spacing: .32em;
  text-indent: .32em;
}
.boga-loader__line {
  width: 108px;
  height: 1px;
  overflow: hidden;
  background: rgba(255,255,255,.18);
}
.boga-loader__line i {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #d8bd8b, transparent);
  transform: translateX(-100%);
}
.boga-loader.is-complete { visibility: hidden; }

/* Cortina para cambios reales de ruta */
.boga-route-curtain {
  position: fixed;
  z-index: 99990;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  visibility: hidden;
  pointer-events: none;
}
.boga-route-curtain span {
  background: #151511;
  transform: scaleX(0);
}
.boga-route-curtain span:first-child { transform-origin: left center; }
.boga-route-curtain span:last-child { transform-origin: right center; }
.boga-route-curtain.is-active { visibility: visible; }

/* Profundidad editorial */
.collection-hero,
.featured-carousel-viewport,
.product-detail-grid,
.catalog-section,
.newsletter,
.seo-copy {
  isolation: isolate;
}
.collection-hero::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: min(62vw, 850px);
  aspect-ratio: 1;
  right: -18%;
  top: -38%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.62), rgba(213,190,153,.2) 34%, transparent 69%);
  filter: blur(18px);
  pointer-events: none;
}
.hero-copy,
.hero-editorial { position: relative; z-index: 2; }

/* Título por letras sin alterar contenido accesible */
.premium-word {
  display: inline-block;
  white-space: nowrap;
}
.premium-char {
  display: inline-block;
  will-change: auto;
}
.premium-space { display: inline-block; width: .25em; }

/* Imagen hero, reflejo y partículas */
.hero-image-frame,
.detail-visual,
.featured-image-link,
.product-visual { overflow: hidden; }
.hero-image-frame img,
.detail-visual img,
.featured-image-link img,
.product-image {
  transform-origin: 50% 55%;
  will-change: transform;
}
.premium-reflection {
  position: absolute;
  z-index: 4;
  inset: -35% auto -35% -45%;
  width: 28%;
  transform: translateX(-160%) rotate(16deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.46), transparent);
  filter: blur(8px);
  mix-blend-mode: screen;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  will-change: transform, opacity;
}
.premium-particles {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.premium-particle {
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: rgba(255,255,255,.68);
  box-shadow: 0 0 9px rgba(230,207,165,.72);
  will-change: transform, opacity;
}

/* v44 — estabilidad de renderizado durante el scroll.
   Los textos permanecen en su capa normal para evitar cambios de rasterizado. */
.product-image,
.hero-image-frame img,
.detail-visual img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.product-card,
.catalog-category,
.trust-ribbon article,
.benefits article,
.seo-copy > *,
.newsletter > *,
.detail-copy > * {
  opacity: 1;
  visibility: visible;
}

/* Tarjetas: GSAP toma el control de la animación */
.product-card {
  animation: none !important;
  transform-origin: center bottom;
  content-visibility: visible;
  contain-intrinsic-size: none;
}
.product-card,
.catalog-category,
.trust-ribbon article,
.benefits article { will-change: auto; }
.product-card .product-visual { position: relative; }
.premium-card-shine {
  position: absolute;
  z-index: 3;
  inset: -30% auto -30% -55%;
  width: 32%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
  filter: blur(7px);
  transform: translateX(-180%) rotate(12deg);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  will-change: transform, opacity;
}
.product-card.premium-hovered {
  border-color: rgba(183, 150, 92, .38);
  box-shadow: var(--premium-shadow-hover);
}

/* Botones y ripple */
.hero-primary,
.hero-secondary,
.featured-cta,
.primary-button,
.secondary-button,
.filter-trigger,
.apply-filters,
.newsletter-whatsapp,
.search-submit,
.catalog-category,
.pagination-page,
.pagination-arrow,
.featured-arrow,
.icon-button,
.cart-button,
.favorites-button,
.account-button,
.whatsapp-float {
  position: relative;
  overflow: hidden;
  transform-origin: center;
  will-change: transform;
}

/* El botón de las tarjetas debe conservar su posición absoluta.
   En v40 heredaba position: relative del bloque de microinteracciones y
   Safari lo centraba dentro del contenedor grid de la imagen. */
.quick-add {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.25;
  overflow: hidden;
  transform-origin: center;
}

.premium-ripple {
  position: absolute;
  z-index: 8;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,.35);
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0);
}
.hero-secondary .premium-ripple,
.filter-trigger .premium-ripple,
.catalog-category .premium-ripple,
.pagination-page .premium-ripple,
.pagination-arrow .premium-ripple {
  background: rgba(30,26,20,.15);
}

/* Búsqueda */
.search-inner { transform-origin: top center; }
.search-row {
  transition: none !important;
  will-change: transform, box-shadow, border-color;
}
.search-suggestion { will-change: transform, opacity; }

/* Drawers y filtros: animados por GSAP */
.filters,
.mobile-menu,
.cart-drawer,
.order-drawer,
.account-drawer,
.overlay { transition: none !important; }
.filters,
.mobile-menu,
.cart-drawer,
.order-drawer,
.account-drawer { will-change: transform; }
.filter-group input[type="checkbox"] { transform-origin: center; }
.filter-count,
.cart-count,
.favorites-count,
#resultCount,
.catalog-category strong { font-variant-numeric: tabular-nums; }

/* Carrusel */
.featured-slide { transition: none !important; }
.featured-slide-copy,
.featured-image-link { will-change: transform, opacity; }
.featured-carousel-viewport::after {
  content: "";
  position: absolute;
  z-index: 5;
  inset: 0;
  border: 1px solid rgba(255,255,255,.28);
  pointer-events: none;
}

/* Ficha premium */
.product-detail-shell { perspective: 1400px; }
.detail-visual::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 8% 12%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.72), transparent 68%);
  filter: blur(16px);
  pointer-events: none;
}
.detail-visual img { z-index: 2; }
.detail-copy > * { will-change: auto; }
.detail-copy h1 { text-wrap: balance; }

/* Luz ambiental en secciones */
.catalog-section::before,
.seo-copy::before,
.newsletter::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 420px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(183,150,92,.11), transparent 70%);
  filter: blur(20px);
  pointer-events: none;
}
.catalog-section::before { top: 5%; right: -180px; }
.seo-copy::before { bottom: -190px; left: -160px; }
.newsletter::before { top: -220px; right: 8%; }

/* Soporte para contenido informativo */
.info-shell,
.info-card,
.error-page > * { will-change: auto; }


/* Alineación definitiva del CTA de tarjeta en pantallas táctiles */
@media (max-width: 700px) {
  .product-visual > .quick-add {
    position: absolute;
    z-index: 5;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: 52px;
    margin: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 0;
    opacity: 1;
    transform: none;
  }
}

@media (hover: hover) and (pointer: fine) {
  .product-card:hover { transform: none; box-shadow: none; }
  .product-card:hover .product-image { transform: none; }
  .hero-primary:hover,
  .hero-secondary:hover,
  .featured-cta:hover,
  .detail-add:hover,
  .whatsapp-float:hover { transform: none; }
}

@media (max-width: 700px) {
  .collection-hero::after { width: 118vw; right: -56%; top: 18%; filter: blur(24px); }
  .premium-particle:nth-child(n+8) { display: none; }
  .product-card { will-change: auto; }
  .product-card.premium-hovered { box-shadow: none; }
  .detail-copy > * { will-change: auto; }
  .premium-reflection { width: 22%; opacity: .55; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .boga-loader { display: none !important; }
  .boga-route-curtain,
  .premium-particles,
  .premium-reflection,
  .premium-card-shine { display: none !important; }
  [style*="will-change"] { will-change: auto !important; }
}


/* BOGA v41 — estabilidad al abrir fichas de producto */
html.product-view-active,
html.product-view-active body {
  overflow-anchor: none;
}

html.product-view-active #productDetail,
html.product-view-active .product-detail-shell,
html.product-view-active .product-detail-grid {
  overflow-anchor: none;
}




/* v45 — la ficha pinta el JPG de catálogo como fondo estable mientras el WebP HD
   carga directamente encima. No hay cambio de src ni transición de opacidad. */
.detail-visual img {
  opacity: 1 !important;
  visibility: visible !important;
  transition: none !important;
}

/* El JPG de respaldo y el WebP deben verse idénticos durante la carga.
   Se eliminan las luces estáticas antiguas que solo afectaban al fondo JPG
   y provocaban un cambio de luminosidad cuando aparecía la imagen HD. */
.detail-visual::before,
.detail-visual::after {
  display: none !important;
}