/** Shopify CDN: Minification failed

Line 36:8 Expected ":"

**/
/* ========================================================================
   HERMES Lumbeard v1b — Barbershop Industrial Heritage
   Paleta: carbón humo + papel kraft + amber tabaco + óxido
   Fonts:  Anton (display impact) + DM Serif Display italic + Inter body
   Scope:  .hm-lum-*  (ultra-scoped — no choca con theme ni con yacht/medias)
   ======================================================================== */

.hm-lum {
  /* tokens */
  --carbon:        #0F0E0C;
  --carbon-2:      #1A1714;
  --kraft:         #EFE7D6;
  --kraft-warm:    #E3D7BB;
  --amber:         #C68A3D;
  --amber-2:       #A96E26;
  --rust:          #8B3A1F;
  --ash:           #4A4541;
  --ash-2:         #6B655F;
  --ivory:         #F8F3E8;
  --ember:         #D9963F;
  --line:          rgba(255,247,231, 0.10);
  --line-dark:     rgba(15,14,12, 0.08);

  --display:       'Anton', 'Arial Narrow', sans-serif;
  --editorial:     'DM Serif Display', 'Georgia', serif;
  --body:          'Inter', system-ui, -apple-system, sans-serif;
  --mono:          'JetBrains Mono', ui-monospace, monospace;

  --step-1:        clamp(0.78rem, 0.74rem + 0.18vw, 0.92rem);
  --step-0:        clamp(0.92rem, 0.88rem + 0.20vw, 1.05rem);
  --step+1:        clamp(1.05rem, 0.98rem + 0.40vw, 1.25rem);
  --step-2:        clamp(1.35rem, 1.20rem + 0.80vw, 1.85rem);
  --step-3:        clamp(2.00rem, 1.60rem + 2.00vw, 3.20rem);
  --step-4:        clamp(2.80rem, 2.00rem + 4.00vw, 5.40rem);
  --step-5:        clamp(3.80rem, 2.40rem + 7.20vw, 8.40rem);

  font-family: var(--body);
  color: var(--ivory);
  background: var(--carbon);
  overflow-x: hidden;
  position: relative;
  display: block;
}

.hm-lum *, .hm-lum *::before, .hm-lum *::after { box-sizing: border-box; margin: 0; padding: 0; }
.hm-lum img, .hm-lum video, .hm-lum svg { display: block; max-width: 100%; }
.hm-lum a { color: inherit; text-decoration: none; }
.hm-lum button { background: none; border: 0; color: inherit; font: inherit; cursor: pointer; }
.hm-lum ul, .hm-lum ol { list-style: none; }

/* ── Theme chrome hide (scoped to body:has) ───────────────────────── */
body:has(.hm-lum--hide-chrome) .shopify-section-header,
body:has(.hm-lum--hide-chrome) header.header,
body:has(.hm-lum--hide-chrome) #shopify-section-header,
body:has(.hm-lum--hide-chrome) .shopify-section-group-header-group,
body:has(.hm-lum--hide-chrome) .shopify-section-footer,
body:has(.hm-lum--hide-chrome) #shopify-section-footer,
body:has(.hm-lum--hide-chrome) .shopify-section-group-footer-group,
body:has(.hm-lum--hide-chrome) footer.footer { display: none !important; }
body:has(.hm-lum--hide-chrome) main#MainContent,
body:has(.hm-lum--hide-chrome) main { padding: 0 !important; margin: 0 !important; }

/* ── Anti-spy / Desktop-block overlay (shared chrome) ───────────── */
.hm-lum-caught {
  position: fixed; inset: 0; z-index: 999999;
  display: none;
  background: radial-gradient(110% 75% at 30% 20%, #1d1815 0%, #0b0a09 50%, #050403 100%);
  color: var(--ivory);
  align-items: center; justify-content: center;
  padding: 40px 22px;
  text-align: center;
  font-family: var(--body);
}
.hm-lum-caught.is-active { display: flex; }
.hm-lum-caught__inner { max-width: 480px; }
.hm-lum-caught__eye {
  width: 76px; height: 76px; margin: 0 auto 28px;
  color: var(--amber);
  animation: hm-lum-blink 4s ease-in-out infinite;
}
@keyframes hm-lum-blink {
  0%, 92%, 100% { transform: scaleY(1); }
  95%, 97%      { transform: scaleY(0.06); }
}
.hm-lum-caught__mode { display: none; }
.hm-lum-caught.is-mode-spy     .hm-lum-caught__mode--spy     { display: block; }
.hm-lum-caught.is-mode-desktop .hm-lum-caught__mode--desktop { display: block; }

.hm-lum-caught__eyebrow {
  font-family: var(--mono);
  font-size: 0.72rem; letter-spacing: 0.30em; text-transform: uppercase;
  color: var(--amber);
  display: inline-block; padding: 4px 12px;
  border: 1px solid var(--amber); border-radius: 999px;
  margin-bottom: 18px;
}
.hm-lum-caught__headline {
  font-family: var(--display);
  font-size: clamp(2.2rem, 4.4vw + 1rem, 3.6rem);
  line-height: 0.95; letter-spacing: 0.01em;
  text-transform: uppercase;
}
.hm-lum-caught__headline em {
  font-family: var(--editorial);
  font-style: italic; font-weight: 400; text-transform: none;
  color: var(--amber);
  text-shadow: 0 0 38px rgba(198,138,61,0.55);
}
.hm-lum-caught__sub { margin-top: 16px; font-size: 0.95rem; color: rgba(248,243,232,0.78); line-height: 1.55; }
.hm-lum-caught__line { margin-top: 18px; font-style: italic; color: rgba(248,243,232,0.6); font-size: 0.88rem; }
.hm-lum-caught__qrwrap { margin-top: 30px; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.hm-lum-caught__phone { width: 80px; height: 80px; color: var(--amber); animation: hm-lum-phone-pulse 1.8s ease-in-out infinite; }
@keyframes hm-lum-phone-pulse { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.hm-lum-caught__qrhint { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.18em; color: rgba(248,243,232,0.6); }
.hm-lum-caught__sig { display: block; margin-top: 38px; font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.30em; color: rgba(248,243,232,0.3); }

/* ── Preloader counter 000→020 ─────────────────────────────────────── */
.hm-lum-preloader {
  position: fixed; inset: 0; z-index: 99998;
  background: var(--carbon);
  display: flex; align-items: center; justify-content: center;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.hm-lum-preloader.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
.hm-lum-preloader__inner { text-align: center; max-width: 460px; padding: 0 22px; }
.hm-lum-preloader__mark {
  display: inline-block; font-family: var(--display);
  font-size: 1.4rem; letter-spacing: 0.20em;
  padding: 6px 14px;
  border: 1px solid var(--amber); color: var(--amber);
  margin-bottom: 24px;
}
.hm-lum-preloader__counter {
  font-family: var(--display);
  font-size: clamp(5rem, 16vw, 9rem); line-height: 1;
  color: var(--ivory);
  letter-spacing: -0.02em;
  display: inline-flex; align-items: flex-start; gap: 10px;
}
.hm-lum-preloader__counter #hm-lum-counter { font-variant-numeric: tabular-nums; }
.hm-lum-preloader__pct { font-size: 0.42em; color: var(--amber); margin-top: 0.55em; font-family: var(--editorial); font-style: italic; }
.hm-lum-preloader__words {
  height: 28px; margin-top: 18px; position: relative;
}
.hm-lum-pw {
  position: absolute; inset: 0;
  font-family: var(--mono);
  font-size: 0.76rem; letter-spacing: 0.32em;
  color: rgba(248,243,232,0.55);
  opacity: 0; transition: opacity 0.4s ease;
}
.hm-lum-pw.active { opacity: 1; }
.hm-lum-preloader__bar {
  margin-top: 26px; height: 1px;
  background: rgba(248,243,232,0.10);
  overflow: hidden; position: relative;
}
.hm-lum-preloader__bar-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--amber-2), var(--amber), var(--ember));
  transition: width 0.10s linear;
}

/* ============================================================
   1) HERO video bleed + BlurText + price + CTA
   ============================================================ */
.hm-lum-hero {
  position: relative;
  min-height: 92vh;
  width: 100%;
  overflow: hidden;
  isolation: isolate;
  background: var(--carbon);
}
.hm-lum-hero__media {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 1;
}
.hm-lum-hero__media--mobile { display: none; }
.hm-lum-hero__veil {
  position: absolute; inset: 0; z-index: 2;
  background:
    linear-gradient(180deg, rgba(15,14,12,0.50) 0%, rgba(15,14,12,0.20) 35%, rgba(15,14,12,0.78) 100%),
    radial-gradient(120% 80% at 22% 30%, rgba(198,138,61,0.22), transparent 60%),
    radial-gradient(60% 50% at 80% 80%, rgba(139,58,31,0.25), transparent 70%);
}
.hm-lum-hero__grain {
  position: absolute; inset: 0; z-index: 3;
  filter: url(#hm-lum-grain);
  opacity: 0.55;
  pointer-events: none;
}

.hm-lum-ember {
  position: absolute; z-index: 4;
  width: 14px; height: 14px; border-radius: 50%;
  background: radial-gradient(circle, rgba(217,150,63,0.85) 0%, rgba(217,150,63,0) 70%);
  pointer-events: none;
  filter: blur(2px);
}
.hm-lum-ember--a { top: 26%; left: 12%; animation: hm-lum-float 7s ease-in-out infinite; }
.hm-lum-ember--b { top: 65%; left: 84%; animation: hm-lum-float 9s ease-in-out infinite reverse; width: 8px; height: 8px; }
.hm-lum-ember--c { top: 42%; left: 70%; animation: hm-lum-float 11s ease-in-out infinite; width: 18px; height: 18px; opacity: 0.6; }
@keyframes hm-lum-float {
  0%, 100% { transform: translateY(0) translateX(0); opacity: 0.65; }
  33%      { transform: translateY(-30px) translateX(14px); opacity: 1; }
  66%      { transform: translateY(20px) translateX(-22px); opacity: 0.45; }
}

.hm-lum-hero__chrome {
  position: absolute; top: 28px; left: 36px; right: 36px; z-index: 6;
  display: flex; justify-content: space-between; align-items: flex-start; gap: 24px;
}
.hm-lum-hero__chapter {
  font-family: var(--mono);
  font-size: var(--step-1);
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--ivory);
  padding: 6px 12px;
  border: 1px solid rgba(248,243,232,0.16);
  border-radius: 999px;
  backdrop-filter: blur(6px);
  background: rgba(15,14,12,0.32);
}
.hm-lum-hero__badge {
  display: inline-flex; flex-direction: column; align-items: flex-end;
  text-align: right; line-height: 1;
}
.hm-lum-hero__badge-num {
  font-family: var(--display);
  font-size: clamp(1.6rem, 3vw + 0.5rem, 2.4rem);
  color: var(--amber);
  text-shadow: 0 0 28px rgba(198,138,61,0.55);
}
.hm-lum-hero__badge-lbl {
  font-family: var(--mono);
  font-size: 0.62rem;
  letter-spacing: 0.36em;
  margin-top: 4px;
  color: rgba(248,243,232,0.78);
}

.hm-lum-hero__content {
  position: absolute; left: 36px; right: 36px; bottom: 110px;
  z-index: 6;
  max-width: 760px;
}
.hm-lum-hero__headline {
  font-family: var(--display);
  font-size: var(--step-5);
  line-height: 0.92;
  letter-spacing: -0.005em;
  text-transform: uppercase;
  color: var(--ivory);
}
.hm-lum-hero__headline span { display: block; }
.hm-lum-hero__headline .hm-lum-italic {
  font-family: var(--editorial);
  font-style: italic; font-weight: 400;
  text-transform: none;
  color: var(--amber);
  text-shadow: 0 0 56px rgba(198,138,61,0.55);
  letter-spacing: -0.01em;
}
.hm-lum-blur-text__word {
  display: inline-block;
  margin-right: 0.20em;
  opacity: 0;
  filter: blur(14px);
  transform: translateY(18px);
  transition: opacity 0.7s ease, filter 0.7s ease, transform 0.7s ease;
  transition-delay: var(--d, 0s);
}
.hm-lum-blur-text__word.is-in {
  opacity: 1; filter: blur(0); transform: translateY(0);
}

.hm-lum-hero__sub {
  margin-top: 22px;
  font-size: var(--step+1);
  line-height: 1.5;
  color: rgba(248,243,232,0.82);
  max-width: 540px;
  opacity: 0; transform: translateY(10px);
  animation: hm-lum-up 0.9s 1.3s ease forwards;
}
@keyframes hm-lum-up { to { opacity: 1; transform: translateY(0); } }

/* Price card — MUCHO más llamativo (precio gigante + AHORRAS badge + glow amber) */
.hm-lum-hero__price-card {
  margin-top: 26px;
  display: inline-flex; flex-direction: column;
  padding: 22px 24px 22px 26px;
  background:
    radial-gradient(140% 100% at 0% 0%, rgba(198,138,61,0.28), transparent 55%),
    linear-gradient(135deg, rgba(15,14,12,0.78), rgba(15,14,12,0.62));
  border: 1px solid rgba(198,138,61,0.55);
  border-radius: 16px;
  backdrop-filter: blur(16px);
  position: relative;
  overflow: visible;
  box-shadow:
    0 0 0 1px rgba(198,138,61,0.18),
    0 24px 48px -16px rgba(15,14,12,0.55),
    0 0 60px rgba(198,138,61,0.22);
  opacity: 0; transform: translateY(10px);
  animation: hm-lum-up 0.9s 1.7s ease forwards;
}
.hm-lum-hero__price-card::before {
  content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%;
  background: linear-gradient(180deg, var(--amber-2), var(--ember), var(--rust));
  border-radius: 16px 0 0 16px;
  box-shadow: 0 0 18px rgba(198,138,61,0.65);
}
.hm-lum-hero__price-card::after {
  content: ''; position: absolute; inset: -28px;
  background: radial-gradient(circle at 30% 50%, rgba(217,150,63,0.22) 0%, transparent 60%);
  pointer-events: none;
  z-index: -1;
  filter: blur(8px);
  animation: hm-lum-pulse-glow 3.4s ease-in-out infinite;
}
@keyframes hm-lum-pulse-glow {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50%      { opacity: 1;    transform: scale(1.06); }
}
.hm-lum-hero__price-eyebrow {
  font-family: var(--mono);
  font-size: 0.66rem;
  letter-spacing: 0.30em;
  color: var(--amber);
  text-transform: uppercase;
}
.hm-lum-hero__price-row {
  display: flex; align-items: baseline; gap: 16px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.hm-lum-hero__price-now {
  font-family: var(--display);
  font-size: clamp(3.6rem, 8vw + 0.5rem, 5.4rem);
  color: var(--ember);
  line-height: 0.92;
  letter-spacing: -0.015em;
  text-shadow:
    0 0 36px rgba(217,150,63,0.62),
    0 0 80px rgba(217,150,63,0.32),
    0 2px 0 rgba(15,14,12,0.7);
  font-variant-numeric: tabular-nums;
  font-weight: 400;
}
.hm-lum-hero__price-was {
  font-family: var(--mono);
  font-size: clamp(1rem, 1.4vw + 0.5rem, 1.25rem);
  color: rgba(248,243,232,0.42);
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: rgba(198,138,61,0.7);
}
.hm-lum-hero__price-was s { text-decoration: inherit; }
.hm-lum-hero__price-save {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 10px;
  padding: 7px 14px;
  background: linear-gradient(135deg, var(--rust), var(--amber-2));
  color: var(--ivory);
  font-family: var(--mono);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border-radius: 999px;
  align-self: flex-start;
  box-shadow: 0 0 22px rgba(139,58,31,0.55);
  animation: hm-lum-save-bounce 2.4s ease-in-out infinite;
}
@keyframes hm-lum-save-bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-2px); }
}
.hm-lum-hero__price-meta {
  margin-top: 12px;
  font-family: var(--mono);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  color: var(--ivory);
  text-transform: uppercase;
}
.hm-lum-hero__price-meta strong {
  color: var(--ember);
  font-weight: 600;
}

/* Variant selector hero */
.hm-lum-hero__variants {
  margin-top: 22px;
  display: flex; flex-direction: column; gap: 12px;
  opacity: 0; transform: translateY(10px);
  animation: hm-lum-up 0.9s 1.95s ease forwards;
}
.hm-lum-hero__variant-label {
  font-family: var(--mono);
  font-size: 0.66rem; letter-spacing: 0.30em; color: rgba(248,243,232,0.7);
}
.hm-lum-hero__variant-options { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.hm-lum-variant-opt {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px;
  background: rgba(15,14,12,0.55);
  border: 1px solid rgba(248,243,232,0.18);
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 0.78rem;
  letter-spacing: 0.10em;
  color: var(--ivory);
  text-transform: uppercase;
  transition: all 0.25s ease;
  cursor: pointer;
}
.hm-lum-variant-opt:hover {
  border-color: var(--amber);
  color: var(--amber);
}
.hm-lum-variant-opt--active {
  background: rgba(198,138,61,0.18);
  border-color: var(--amber);
  color: var(--amber);
  box-shadow: 0 0 24px rgba(198,138,61,0.32);
}
.hm-lum-variant-opt--unavailable { opacity: 0.4; text-decoration: line-through; cursor: not-allowed; }

/* Hero CTA — amber glow (Orbit Web3 inspired) */
.hm-lum-hero__cta {
  position: absolute;
  right: 36px; bottom: 36px;
  z-index: 7;
  display: inline-flex; align-items: center; gap: 12px;
  padding: 18px 26px;
  font-family: var(--mono);
  font-size: 0.92rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--carbon);
  background: var(--amber);
  border: 1px solid var(--amber-2);
  border-radius: 999px;
  box-shadow:
    0 0 32px rgba(198,138,61,0.55),
    0 0 72px rgba(217,150,63,0.32),
    0 0 0 1px rgba(198,138,61,0.40);
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  opacity: 0; transform: translateY(10px);
  animation: hm-lum-up 0.9s 2.15s ease forwards;
}
.hm-lum-hero__cta:hover { transform: translateY(-2px); box-shadow: 0 0 44px rgba(198,138,61,0.72), 0 0 100px rgba(217,150,63,0.45), 0 0 0 1px var(--amber); }
.hm-lum-hero__cta-bg {
  position: absolute; inset: -50%;
  background: radial-gradient(circle at center, rgba(255,213,142,0.35) 0%, transparent 60%);
  animation: hm-lum-rotate 6s linear infinite;
  pointer-events: none;
}
@keyframes hm-lum-rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.hm-lum-arrow { width: 18px; height: 18px; stroke: currentColor; }

.hm-lum-hero__scrollhint {
  position: absolute; left: 50%; bottom: 18px;
  transform: translateX(-50%);
  z-index: 6;
  font-family: var(--mono);
  font-size: 0.62rem; letter-spacing: 0.36em;
  color: rgba(248,243,232,0.55);
  animation: hm-lum-bounce 2.2s ease-in-out infinite;
}
@keyframes hm-lum-bounce { 0%,100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 6px); } }

/* ============================================================
   2) Marquee uppercase tobacco
   ============================================================ */
.hm-lum-marquee {
  background: var(--carbon-2);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 22px 0;
  overflow: hidden;
  position: relative;
}
.hm-lum-marquee::before, .hm-lum-marquee::after {
  content: ''; position: absolute; top: 0; bottom: 0; width: 80px;
  z-index: 2; pointer-events: none;
}
.hm-lum-marquee::before { left: 0;  background: linear-gradient(90deg, var(--carbon-2), transparent); }
.hm-lum-marquee::after  { right: 0; background: linear-gradient(-90deg, var(--carbon-2), transparent); }
.hm-lum-marquee__track {
  display: inline-flex; gap: 36px;
  font-family: var(--display);
  font-size: clamp(1.1rem, 1.4vw + 0.6rem, 1.6rem);
  letter-spacing: 0.16em;
  white-space: nowrap;
  color: var(--ivory);
  animation: hm-lum-mq 38s linear infinite;
}
.hm-lum-marquee__track > span { display: inline-flex; }
.hm-lum-mqsep { color: var(--amber); }
@keyframes hm-lum-mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ============================================================
   3) Stats trio (count-up + glassy)
   ============================================================ */
.hm-lum-stats {
  background: var(--carbon);
  padding: 110px 36px;
  border-bottom: 1px solid var(--line);
}
.hm-lum-stats__head { text-align: center; max-width: 760px; margin: 0 auto 60px; }
.hm-lum-eyebrow {
  font-family: var(--mono);
  font-size: 0.74rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--amber);
  display: inline-block; padding: 6px 14px;
  border: 1px solid rgba(198,138,61,0.36); border-radius: 999px;
}
.hm-lum-eyebrow--kraft { color: var(--rust); border-color: rgba(139,58,31,0.36); }
.hm-lum-eyebrow--amber { color: var(--amber); border-color: var(--amber); }
.hm-lum-eyebrow--cream { color: var(--kraft); border-color: rgba(239,231,214,0.36); }

.hm-lum-display-md {
  font-family: var(--display);
  font-size: var(--step-3);
  line-height: 1.02;
  text-transform: uppercase;
  letter-spacing: 0;
  color: var(--ivory);
  margin-top: 18px;
}
.hm-lum-display-md em {
  font-family: var(--editorial);
  font-style: italic; font-weight: 400;
  text-transform: none;
  color: var(--amber);
}
.hm-lum-display-md--dark { color: var(--carbon); }
.hm-lum-display-md--dark em { color: var(--rust); }
.hm-lum-display-md--light { color: var(--ivory); }
.hm-lum-display-md--light em { color: var(--amber); }

.hm-lum-display-lg {
  font-family: var(--display);
  font-size: var(--step-4);
  line-height: 0.98;
  text-transform: uppercase;
  color: var(--ivory);
}
.hm-lum-display-lg em, .hm-lum-display-lg .hm-lum-italic {
  font-family: var(--editorial); font-style: italic; font-weight: 400;
  text-transform: none; color: var(--amber);
}
.hm-lum-display-lg .hm-lum-amber-glow {
  display: block; color: var(--ember);
  text-shadow: 0 0 64px rgba(217,150,63,0.55);
}
.hm-lum-display-lg--light { color: var(--ivory); }
.hm-lum-display-lg--light em { color: var(--amber); }

.hm-lum-stats__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 1100px; margin: 0 auto;
}
.hm-lum-stat {
  padding: 36px 22px;
  background: linear-gradient(180deg, rgba(239,231,214,0.04), rgba(239,231,214,0.01));
  border: 1px solid var(--line);
  border-radius: 12px;
  text-align: center;
  transition: transform 0.3s ease, border-color 0.3s ease;
  position: relative; overflow: hidden;
}
.hm-lum-stat::before {
  content: ''; position: absolute; top: 0; left: 50%; width: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--amber), transparent);
  transform: translateX(-50%);
  transition: width 0.5s ease;
}
.hm-lum-stat.is-in::before { width: 80%; }
.hm-lum-stat:hover { transform: translateY(-4px); border-color: rgba(198,138,61,0.35); }
.hm-lum-stat--accent {
  background: linear-gradient(180deg, rgba(198,138,61,0.10), rgba(139,58,31,0.04));
  border-color: rgba(198,138,61,0.30);
}
.hm-lum-stat__num {
  display: block;
  font-family: var(--display);
  font-size: clamp(2.8rem, 5vw + 0.5rem, 4.4rem);
  line-height: 1;
  color: var(--ivory);
  letter-spacing: -0.01em;
}
.hm-lum-stat--accent .hm-lum-stat__num { color: var(--amber); text-shadow: 0 0 32px rgba(198,138,61,0.42); }
.hm-lum-stat__lbl {
  display: block; margin-top: 12px;
  font-size: 0.92rem; line-height: 1.5;
  color: rgba(248,243,232,0.72);
  max-width: 250px; margin-left: auto; margin-right: auto;
}

/* ============================================================
   4) Pull-quote letter reveal
   ============================================================ */
.hm-lum-pullquote {
  background: var(--carbon);
  padding: 130px 36px;
  text-align: center;
  position: relative; overflow: hidden;
}
.hm-lum-pullquote::before, .hm-lum-pullquote::after {
  content: ''; position: absolute; top: 50%; transform: translateY(-50%);
  height: 1px; width: 18%; background: var(--line);
}
.hm-lum-pullquote::before { left: 0; }
.hm-lum-pullquote::after  { right: 0; }
.hm-lum-pullquote__sig {
  display: block;
  font-family: var(--editorial); font-style: italic;
  font-size: clamp(2.4rem, 5vw + 0.5rem, 4rem);
  color: var(--amber);
  margin-bottom: 18px;
  opacity: 0.7;
}
.hm-lum-pullquote__text {
  font-family: var(--editorial);
  font-style: italic; font-weight: 400;
  font-size: var(--step-3);
  line-height: 1.20;
  letter-spacing: -0.01em;
  color: var(--ivory);
  max-width: 1100px; margin: 0 auto;
}
.hm-lum-pullquote__text em {
  color: var(--amber);
  text-shadow: 0 0 48px rgba(198,138,61,0.45);
}
.hm-lum-letter {
  display: inline-block;
  opacity: 0;
  filter: blur(10px);
  transform: translateY(8px);
  transition: opacity 0.5s ease, filter 0.5s ease, transform 0.5s ease;
  transition-delay: var(--d, 0s);
}
.hm-lum-letter.is-in { opacity: 1; filter: blur(0); transform: translateY(0); }
.hm-lum-pullquote__attrib {
  display: block; margin-top: 38px;
  font-family: var(--mono);
  font-size: 0.78rem; letter-spacing: 0.18em;
  color: rgba(248,243,232,0.45);
  text-transform: uppercase;
}

/* ============================================================
   5) Tabla de barbero — flat-lay editorial (kraft chapter)
   ============================================================ */
.hm-lum-tabla {
  background: var(--kraft);
  color: var(--carbon);
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 0;
  position: relative;
}
.hm-lum-tabla__media {
  position: relative; overflow: hidden;
  min-height: 600px;
}
.hm-lum-tabla__media img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.5s ease;
}
.hm-lum-tabla:hover .hm-lum-tabla__media img { transform: scale(1.03); }
.hm-lum-tabla__tag {
  position: absolute;
  padding: 8px 14px;
  background: rgba(15,14,12,0.84);
  color: var(--amber);
  font-family: var(--mono);
  font-size: 0.66rem; letter-spacing: 0.28em;
  border-radius: 999px;
}
.hm-lum-tabla__tag--tl { top: 28px; left: 28px; }
.hm-lum-tabla__tag--br { bottom: 28px; right: 28px; }

.hm-lum-tabla__copy {
  padding: 100px 60px;
  display: flex; flex-direction: column; justify-content: center; gap: 22px;
  background: var(--kraft);
}
.hm-lum-body { font-size: var(--step+1); line-height: 1.65; color: rgba(248,243,232,0.78); }
.hm-lum-body--kraft { color: rgba(15,14,12,0.74); }
.hm-lum-body--cream { color: rgba(248,243,232,0.82); }
.hm-lum-body--small { font-size: var(--step-0); }

/* ============================================================
   6) Spotlight cursor reveal (Nike Premium style)
   ============================================================ */
.hm-lum-spotlight {
  position: relative; overflow: hidden;
  min-height: 90vh;
  background: var(--carbon);
  display: grid; grid-template-columns: 1fr 1fr;
}
.hm-lum-spotlight__layer {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  overflow: hidden;
}
.hm-lum-spotlight__layer img { width: 100%; height: 100%; object-fit: cover; }
.hm-lum-spotlight__layer--bg img { filter: grayscale(85%) brightness(0.42); }
.hm-lum-spotlight__layer--bg .hm-lum-spotlight__veil {
  position: absolute; inset: 0;
  background: linear-gradient(120deg, rgba(15,14,12,0.86), rgba(26,23,20,0.65));
}
.hm-lum-spotlight__layer--reveal {
  -webkit-mask-image: radial-gradient(circle 0px at var(--mx, 50%) var(--my, 50%), #000 0%, transparent 0%);
          mask-image: radial-gradient(circle 0px at var(--mx, 50%) var(--my, 50%), #000 0%, transparent 0%);
  transition: -webkit-mask-image 0.18s ease, mask-image 0.18s ease;
}
.hm-lum-spotlight.is-active .hm-lum-spotlight__layer--reveal {
  -webkit-mask-image: radial-gradient(circle 220px at var(--mx, 50%) var(--my, 50%), #000 0%, #000 60%, transparent 100%);
          mask-image: radial-gradient(circle 220px at var(--mx, 50%) var(--my, 50%), #000 0%, #000 60%, transparent 100%);
}
.hm-lum-spotlight__copy {
  position: relative;
  z-index: 5; grid-column: 1 / -1;
  align-self: center; justify-self: center;
  max-width: 760px;
  padding: 100px 36px;
  text-align: center;
  pointer-events: none;
}
.hm-lum-spotlight__copy > * { pointer-events: auto; }
.hm-lum-microhint {
  margin-top: 30px;
  font-family: var(--mono);
  font-size: 0.66rem; letter-spacing: 0.30em;
  color: rgba(198,138,61,0.7);
}
[data-hm-lum-hint-touch] { display: none; }
.is-touch [data-hm-lum-hint-touch] { display: block; }
.is-touch [data-hm-lum-hint-mouse] { display: none; }

/* ============================================================
   7) Horizontal scroll-scrub timeline 30/60/90 (Urban Jungle)
   ============================================================ */
.hm-lum-timeline {
  background: var(--carbon-2);
  padding: 110px 0 130px;
  position: relative;
  overflow: hidden;
}
.hm-lum-timeline__head {
  text-align: center; max-width: 780px; margin: 0 auto 70px;
  padding: 0 36px;
}
.hm-lum-timeline__head p { color: rgba(248,243,232,0.65); margin-top: 14px; }
.hm-lum-timeline__rail {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 0 36px 40px;
}
.hm-lum-timeline__rail::-webkit-scrollbar { display: none; }
.hm-lum-timeline__track {
  display: flex; gap: 22px;
  width: max-content;
  padding-bottom: 12px;
}
.hm-lum-timeline__node {
  scroll-snap-align: center;
  flex: 0 0 320px;
  background: linear-gradient(180deg, rgba(239,231,214,0.04), rgba(239,231,214,0.01));
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 32px 26px;
  transition: transform 0.35s ease, border-color 0.35s ease;
}
.hm-lum-timeline__node:hover, .hm-lum-timeline__node.is-active {
  transform: translateY(-6px);
  border-color: rgba(198,138,61,0.45);
}
.hm-lum-timeline__node--mid { background: linear-gradient(180deg, rgba(198,138,61,0.06), rgba(15,14,12,0.02)); }
.hm-lum-timeline__node--peak {
  background: linear-gradient(180deg, rgba(198,138,61,0.18), rgba(139,58,31,0.06));
  border-color: rgba(198,138,61,0.45);
}
.hm-lum-timeline__day {
  font-family: var(--mono);
  font-size: 0.72rem; letter-spacing: 0.32em;
  color: rgba(248,243,232,0.55);
  display: flex; align-items: baseline; gap: 4px;
}
.hm-lum-timeline__day em {
  font-family: var(--display); font-style: normal;
  font-size: 2rem;
  color: var(--amber);
  margin-left: 4px;
}
.hm-lum-timeline__node--peak .hm-lum-timeline__day em { color: var(--ember); }
.hm-lum-timeline__title {
  margin-top: 18px;
  font-family: var(--display);
  font-size: 1.6rem; text-transform: uppercase;
  color: var(--ivory);
  line-height: 1.05;
  letter-spacing: 0.01em;
}
.hm-lum-timeline__body {
  margin-top: 12px;
  font-size: 0.92rem; line-height: 1.55;
  color: rgba(248,243,232,0.72);
}
.hm-lum-timeline__progress {
  position: absolute; bottom: 38px; left: 36px; right: 36px;
  height: 2px;
  background: rgba(248,243,232,0.08);
  border-radius: 999px;
  overflow: hidden;
}
.hm-lum-timeline__progress::after {
  content: ''; display: block; height: 100%;
  width: var(--p, 10%);
  background: linear-gradient(90deg, var(--amber-2), var(--amber), var(--ember));
  transition: width 0.15s linear;
}
.hm-lum-timeline__hint {
  position: absolute; right: 36px; top: 110px;
  font-family: var(--mono);
  font-size: 0.66rem; letter-spacing: 0.28em;
  color: rgba(198,138,61,0.7);
  display: none;
}

/* ============================================================
   8) Craft texture + bullets
   ============================================================ */
.hm-lum-craft {
  background: var(--carbon);
  padding: 130px 36px;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 80px;
  align-items: center;
  max-width: 1400px; margin: 0 auto;
}
.hm-lum-craft__copy { display: flex; flex-direction: column; gap: 22px; }
.hm-lum-bullets {
  margin-top: 14px;
  display: flex; flex-direction: column; gap: 12px;
}
.hm-lum-bullets li {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  font-size: var(--step+1);
  line-height: 1.5;
  color: rgba(248,243,232,0.82);
}
.hm-lum-bullet {
  flex-shrink: 0;
  font-family: var(--mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  color: var(--amber);
  padding-top: 4px;
}
.hm-lum-craft__media {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  background: var(--carbon-2);
}
.hm-lum-craft__media img {
  width: 100%; aspect-ratio: 1; object-fit: cover;
  transition: transform 0.6s ease;
}
.hm-lum-craft__media:hover img { transform: scale(1.04); }
.hm-lum-craft__caption {
  position: absolute; bottom: 22px; left: 22px;
  font-family: var(--editorial); font-style: italic;
  font-size: 1rem; color: var(--ivory);
  background: rgba(15,14,12,0.62);
  padding: 8px 14px;
  border-radius: 6px;
  backdrop-filter: blur(8px);
}

/* ============================================================
   9) Antes/Después split
   ============================================================ */
.hm-lum-compare {
  background: var(--kraft);
  color: var(--carbon);
  padding: 110px 36px;
  text-align: center;
}
.hm-lum-compare__head { max-width: 760px; margin: 0 auto 50px; }
.hm-lum-compare__head .hm-lum-display-md--light { color: var(--carbon); }
.hm-lum-compare__head .hm-lum-display-md--light em { color: var(--rust); }
.hm-lum-compare__media {
  position: relative;
  max-width: 1200px; margin: 0 auto;
  border-radius: 12px; overflow: hidden;
  box-shadow: 0 28px 60px -20px rgba(15,14,12,0.32);
}
.hm-lum-compare__media img { width: 100%; height: auto; }
.hm-lum-compare__tag {
  position: absolute; bottom: 22px;
  font-family: var(--mono);
  font-size: 0.74rem; letter-spacing: 0.28em;
  padding: 8px 14px;
  background: rgba(15,14,12,0.84);
  color: var(--ivory);
  border-radius: 999px;
}
.hm-lum-compare__tag--left  { left: 22px; }
.hm-lum-compare__tag--right { right: 22px; background: var(--amber); color: var(--carbon); }
.hm-lum-compare__line {
  position: absolute; top: 0; bottom: 0; left: 50%;
  width: 2px;
  background: linear-gradient(180deg, transparent 0%, var(--ivory) 20%, var(--amber) 50%, var(--ivory) 80%, transparent 100%);
  transform: translateX(-50%);
  box-shadow: 0 0 18px rgba(255,255,255,0.5);
}
.hm-lum-compare__body {
  margin-top: 38px; max-width: 720px; margin-left: auto; margin-right: auto;
  font-size: var(--step+1); line-height: 1.65;
  color: rgba(15,14,12,0.74);
}

/* ============================================================
   10) Bento masculino — retrato + packaging + macro
   ============================================================ */
.hm-lum-bento {
  background: var(--carbon);
  padding: 110px 36px;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  grid-template-rows: auto auto;
  gap: 18px;
  max-width: 1400px; margin: 0 auto;
}
.hm-lum-bento__cell {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  min-height: 360px;
}
.hm-lum-bento__cell--portrait {
  grid-row: 1 / 3;
}
.hm-lum-bento__cell--portrait img {
  width: 100%; height: 100%; object-fit: cover;
}
.hm-lum-bento__cell--pack { min-height: 280px; }
.hm-lum-bento__cell--pack img { width: 100%; height: 100%; object-fit: cover; }
.hm-lum-bento__cell--macro { min-height: 280px; }
.hm-lum-bento__cell--macro img { width: 100%; height: 100%; object-fit: cover; }

.hm-lum-bento__cell--portrait .hm-lum-bento__caption {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 36px 32px;
  background: linear-gradient(180deg, transparent, rgba(15,14,12,0.92));
}
.hm-lum-bento__cell--portrait .hm-lum-display-md--light { font-size: clamp(1.8rem, 2.4vw + 0.5rem, 2.4rem); }
.hm-lum-bento__cell--portrait .hm-lum-body--cream { margin-top: 14px; font-size: var(--step-0); }

.hm-lum-bento__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(15,14,12,0.86));
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 24px;
}
.hm-lum-bento__mark {
  display: inline-block;
  font-family: var(--display);
  font-size: 1.1rem; letter-spacing: 0.20em;
  color: var(--amber);
  padding: 4px 10px;
  border: 1px solid var(--amber);
  border-radius: 999px;
  align-self: flex-start;
  margin-bottom: 10px;
}
.hm-lum-bento__caption-sm {
  font-family: var(--mono);
  font-size: 0.78rem; letter-spacing: 0.10em;
  color: var(--ivory);
}

/* ============================================================
   11) Final CTA + Releasit hook
   ============================================================ */
.hm-lum-final {
  background: var(--carbon);
  padding: 130px 36px 110px;
  position: relative;
  overflow: hidden;
  text-align: center;
}
.hm-lum-final__amber {
  position: absolute; top: -160px; left: -160px;
  width: 540px; height: 540px;
  background: radial-gradient(circle, rgba(198,138,61,0.34) 0%, transparent 70%);
  filter: blur(20px);
  pointer-events: none;
}
.hm-lum-final__amber--b {
  top: auto; bottom: -200px; left: auto; right: -180px;
  width: 460px; height: 460px;
  background: radial-gradient(circle, rgba(139,58,31,0.28) 0%, transparent 70%);
}
.hm-lum-final__inner { max-width: 760px; margin: 0 auto; position: relative; z-index: 2; }
.hm-lum-final__chapter {
  font-family: var(--mono);
  font-size: 0.74rem; letter-spacing: 0.32em;
  color: var(--amber);
  display: inline-block; padding: 6px 14px;
  border: 1px solid var(--amber); border-radius: 999px;
  margin-bottom: 26px;
}
.hm-lum-final__sub {
  margin-top: 22px;
  font-size: var(--step+1); line-height: 1.55;
  color: rgba(248,243,232,0.78);
}
.hm-lum-final__price {
  margin-top: 28px;
  display: flex; align-items: baseline; justify-content: center; gap: 14px;
}
.hm-lum-final__now {
  font-family: var(--editorial);
  font-size: clamp(2.4rem, 4vw + 0.5rem, 3.4rem);
  color: var(--ivory);
}
.hm-lum-final__was { font-family: var(--mono); font-size: 1rem; color: rgba(248,243,232,0.42); }

.hm-lum-cod-slot {
  margin-top: 34px;
  min-height: 80px;
}
.hm-lum-cta-button {
  display: inline-flex; align-items: center; gap: 14px;
  padding: 22px 36px;
  width: 100%; max-width: 460px;
  background: var(--amber);
  color: var(--carbon);
  font-family: var(--mono);
  font-size: 1rem; letter-spacing: 0.22em;
  text-transform: uppercase;
  border: 1px solid var(--amber-2);
  border-radius: 999px;
  position: relative; overflow: hidden;
  cursor: pointer;
  box-shadow:
    0 0 36px rgba(198,138,61,0.62),
    0 0 80px rgba(217,150,63,0.42),
    0 0 0 1px var(--amber);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  justify-content: center;
}
.hm-lum-cta-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 48px rgba(198,138,61,0.85), 0 0 100px rgba(217,150,63,0.55);
}
.hm-lum-cta-button__bg {
  position: absolute; inset: -50%;
  background: radial-gradient(circle, rgba(255,213,142,0.30) 0%, transparent 60%);
  animation: hm-lum-rotate 6s linear infinite;
  pointer-events: none;
}
.hm-lum-cta-button__text { position: relative; z-index: 2; }

.hm-lum-product-form { width: 100%; }
.hm-lum-product-form form { width: 100%; }
.hm-lum-product-form .product-form__buttons { width: 100%; display: flex; justify-content: center; }
.hm-lum-product-form .product-form__submit { width: 100%; max-width: 460px; }

.hm-lum-microcopy {
  margin-top: 22px;
  font-family: var(--mono);
  font-size: 0.78rem; letter-spacing: 0.10em;
  color: rgba(248,243,232,0.55);
}

.hm-lum-final__guarantees {
  margin-top: 34px;
  display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;
  font-family: var(--mono);
  font-size: 0.74rem; letter-spacing: 0.10em;
  color: rgba(248,243,232,0.6);
  text-transform: uppercase;
}
.hm-lum-final__guarantees li { display: inline-flex; align-items: center; gap: 6px; }
.hm-lum-final__guarantees span { color: var(--amber); }

/* ============================================================
   Releasit modal + form overrides (premium barbershop styling)
   Reforzado v1c — Releasit inline form needs visible contrast
   ============================================================ */

/* COD slot — kraft wrapper to ensure Releasit form is visible on dark page */
.hm-lum-cod-slot {
  margin-top: 34px;
  min-height: 96px;
  padding: 26px 22px;
  background: linear-gradient(180deg, var(--kraft) 0%, var(--kraft-warm) 100%);
  border: 1px solid rgba(198,138,61,0.45);
  border-radius: 18px;
  box-shadow:
    0 24px 48px -16px rgba(15,14,12,0.55),
    0 0 0 1px rgba(198,138,61,0.18),
    inset 0 1px 0 rgba(248,243,232,0.45);
  position: relative;
  overflow: hidden;
}
.hm-lum-cod-slot::before {
  content: 'PEDIDO CONTRA ENTREGA';
  position: absolute; top: 14px; left: 50%; transform: translateX(-50%);
  font-family: var(--mono);
  font-size: 0.62rem; letter-spacing: 0.30em;
  color: var(--rust);
  opacity: 0.7;
}
.hm-lum-cod-slot > * { position: relative; z-index: 1; }
.hm-lum-cod-slot .hm-lum-product-form,
.hm-lum-cod-slot form { padding-top: 18px; }

/* Releasit BUY-NOW button — INLINE (dentro del slot, full-width) */
.hm-lum ._rsi-buy-now-button,
.hm-lum #_rsi-buy-now-button-overwrite,
.hm-lum-cod-slot ._rsi-buy-now-button {
  background: var(--amber) !important;
  background-image: linear-gradient(135deg, var(--ember), var(--amber)) !important;
  color: var(--carbon) !important;
  font-family: var(--mono) !important;
  font-size: 1rem !important; letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  padding: 18px 28px !important;
  border-radius: 999px !important;
  border: 2px solid var(--amber-2) !important;
  box-shadow:
    0 0 36px rgba(198,138,61,0.65),
    0 0 80px rgba(217,150,63,0.45),
    0 8px 24px -4px rgba(15,14,12,0.45) !important;
  animation: none !important;
  font-weight: 700 !important;
  min-height: 54px !important;
  width: 100% !important;
  max-width: 460px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Releasit FLOATING button — OCULTAR completamente.
   Mi sticky HERMES amber lo reemplaza con mejor branding.
   El click de mi sticky igual dispara el modal Releasit. */
._rsi-buy-now-button-floating,
[class*="_rsi-buy-now"][class*="floating"],
[class*="_rsi-floating"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
._rsi-buy-now-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 0 48px rgba(198,138,61,0.85), 0 0 100px rgba(217,150,63,0.55) !important;
}

/* If Releasit injects inline form (NOT modal) inside the slot — make it visible */
.hm-lum-cod-slot ._rsi-cod-form,
.hm-lum-cod-slot ._rsi-form-container,
.hm-lum-cod-slot [class*="_rsi-"][class*="form"] {
  background: var(--ivory) !important;
  border: 1px solid rgba(74,69,65,0.25) !important;
  border-radius: 12px !important;
  color: var(--carbon) !important;
  padding: 16px !important;
}
.hm-lum-cod-slot ._rsi-cod-form *,
.hm-lum-cod-slot ._rsi-form-container *,
.hm-lum-cod-slot [class*="_rsi-"][class*="form"] * {
  color: var(--carbon) !important;
}
.hm-lum-cod-slot input,
.hm-lum-cod-slot select,
.hm-lum-cod-slot textarea {
  background: var(--ivory) !important;
  border: 1.5px solid rgba(74,69,65,0.35) !important;
  color: var(--carbon) !important;
  font-family: var(--body) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  min-height: 48px !important;
}
.hm-lum-cod-slot input:focus,
.hm-lum-cod-slot select:focus,
.hm-lum-cod-slot textarea:focus {
  border-color: var(--amber) !important;
  outline: 3px solid rgba(198,138,61,0.30) !important;
  outline-offset: 0 !important;
}
.hm-lum-cod-slot label {
  color: var(--carbon) !important;
  font-family: var(--mono) !important;
  font-size: 0.74rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
}

/* ════════════════════════════════════════════════════════════
   Releasit MODAL — BLANCO PURO + LETRA NEGRA (clean clinical UX)
   Wildcard targeting porque Releasit usa muchas clases distintas.
   ════════════════════════════════════════════════════════════ */

/* Backdrop / overlay del modal — fondo carbon transparente */
[class*="_rsi"][class*="modal"][class*="container"],
[class*="_rsi"][class*="popup"][class*="container"],
[class*="_rsi"][class*="overlay"],
._rsi-modal-overlay,
._rsi-popup-overlay,
._rsi-cod-form-overlay {
  background: rgba(15,14,12,0.85) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* Modal/popup container — BLANCO PURO */
[class*="_rsi"][class*="modal"]:not([class*="container"]):not([class*="header"]):not([class*="overlay"]):not(button),
[class*="_rsi"][class*="popup"]:not([class*="container"]):not([class*="overlay"]):not(button),
[class*="_rsi"][class*="dialog"]:not(button),
[class*="_rsi-cod-form"]:not(button):not(a),
[class*="_rsi-form-popup"],
[class*="_rsi-form-modal"] {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  border-radius: 14px !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
}

/* TODO descendiente del modal Releasit = LETRA NEGRA */
[class*="_rsi"][class*="modal"] *:not(img):not(svg):not(button):not(input):not(select):not(textarea):not([class*="_rsi-buy-now"]):not([class*="_rsi-buy-now"] *),
[class*="_rsi"][class*="popup"] *:not(img):not(svg):not(button):not(input):not(select):not(textarea):not([class*="_rsi-buy-now"]):not([class*="_rsi-buy-now"] *),
[class*="_rsi-cod-form"] *:not(img):not(svg):not(button):not(input):not(select):not(textarea):not([class*="_rsi-buy-now"]):not([class*="_rsi-buy-now"] *),
[class*="_rsi-form-popup"] *,
[class*="_rsi-form-modal"] * {
  color: #000000 !important;
  background-color: transparent !important;
}

/* Header del modal — BLANCO + letra negra (clean) */
[class*="_rsi"][class*="modal"][class*="header"],
[class*="_rsi"][class*="popup"][class*="header"],
[class*="_rsi"][class*="dialog"][class*="header"],
[class*="_rsi-cod-form"][class*="header"] {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  padding: 20px 24px !important;
  border-radius: 14px 14px 0 0 !important;
  border-bottom: 1px solid rgba(0,0,0,0.10) !important;
}
[class*="_rsi"][class*="modal"][class*="header"] *,
[class*="_rsi"][class*="popup"][class*="header"] *,
[class*="_rsi"][class*="dialog"][class*="header"] *,
[class*="_rsi-cod-form"][class*="header"] * {
  color: #000000 !important;
  background-color: transparent !important;
}

/* Inputs / selects / textareas — fondo blanco con borde gris + letra negra */
[class*="_rsi-cod-form"] input,
[class*="_rsi-cod-form"] select,
[class*="_rsi-cod-form"] textarea,
[class*="_rsi"][class*="modal"] input,
[class*="_rsi"][class*="modal"] select,
[class*="_rsi"][class*="modal"] textarea,
[class*="_rsi"][class*="popup"] input,
[class*="_rsi"][class*="popup"] select,
[class*="_rsi"][class*="popup"] textarea,
[class*="_rsi-form-popup"] input,
[class*="_rsi-form-modal"] input {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1.5px solid rgba(0,0,0,0.25) !important;
  color: #000000 !important;
  font-family: var(--body) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  min-height: 50px !important;
  font-size: 1rem !important;
}
[class*="_rsi-cod-form"] input::placeholder,
[class*="_rsi"][class*="modal"] input::placeholder,
[class*="_rsi"][class*="popup"] input::placeholder {
  color: rgba(0,0,0,0.42) !important;
}
[class*="_rsi-cod-form"] input:focus,
[class*="_rsi-cod-form"] select:focus,
[class*="_rsi-cod-form"] textarea:focus,
[class*="_rsi"][class*="modal"] input:focus,
[class*="_rsi"][class*="modal"] select:focus,
[class*="_rsi"][class*="modal"] textarea:focus,
[class*="_rsi-form-popup"] input:focus {
  border-color: var(--amber) !important;
  outline: 3px solid rgba(198,138,61,0.30) !important;
  outline-offset: 0 !important;
}

/* Labels — letra negra mono uppercase */
[class*="_rsi-cod-form"] label,
[class*="_rsi"][class*="modal"] label,
[class*="_rsi"][class*="popup"] label,
[class*="_rsi-form-popup"] label {
  color: #000000 !important;
  font-family: var(--mono) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
}

/* Submit button — amber glow (único elemento con color brand) */
[class*="_rsi-cod-form"] button[type="submit"],
[class*="_rsi"][class*="modal"] button[type="submit"],
[class*="_rsi"][class*="popup"] button[type="submit"],
[class*="_rsi-form-popup"] button[type="submit"],
[class*="_rsi-form-modal"] button[type="submit"] {
  background: linear-gradient(135deg, var(--ember), var(--amber)) !important;
  background-color: var(--amber) !important;
  color: #000000 !important;
  border-radius: 999px !important;
  border: 2px solid var(--amber-2) !important;
  box-shadow: 0 0 36px rgba(198,138,61,0.55) !important;
  font-family: var(--mono) !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.20em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  padding: 16px 28px !important;
  min-height: 54px !important;
  width: 100% !important;
}

/* Subtotal / Total rows */
[class*="_rsi-cod-form"] [class*="total"],
[class*="_rsi-cod-form"] [class*="subtotal"],
[class*="_rsi"][class*="modal"] [class*="total"],
[class*="_rsi"][class*="popup"] [class*="total"] {
  background: #f7f7f7 !important;
  color: #000000 !important;
}

/* Wrapper genérico — blanco */
[class*="_rsi-cod-form"] > div,
[class*="_rsi-cod-form"] > section,
[class*="_rsi"][class*="modal"] > div,
[class*="_rsi"][class*="popup"] > div {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* Close button (X) del modal — negro sobre blanco con hover */
[class*="_rsi-cod-form"] [class*="close"],
[class*="_rsi"][class*="modal"] [class*="close"],
[class*="_rsi"][class*="popup"] [class*="close"] {
  color: #000000 !important;
  background: rgba(0,0,0,0.06) !important;
  border-radius: 50% !important;
  min-width: 36px !important;
  min-height: 36px !important;
}
[class*="_rsi-cod-form"] [class*="close"]:hover,
[class*="_rsi"][class*="modal"] [class*="close"]:hover { background: rgba(0,0,0,0.12) !important; }

/* ============================================================
   STICKY CTA BAR — bottom mobile fixed, siempre visible
   ============================================================ */
.hm-lum-sticky-cta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 9990;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, rgba(15,14,12,0) 0%, rgba(15,14,12,0.78) 38%, rgba(15,14,12,0.94) 100%);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(198,138,61,0.32);
  transform: translateY(110%);
  transition: transform 0.4s cubic-bezier(.2,.7,.2,1), opacity 0.3s ease;
  opacity: 0;
  pointer-events: none;
  display: flex; flex-direction: row; align-items: center; gap: 12px;
}
.hm-lum-sticky-cta.is-visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.hm-lum-sticky-cta__price {
  display: flex; flex-direction: column;
  flex-shrink: 0;
}
.hm-lum-sticky-cta__now {
  font-family: var(--display);
  font-size: 1.7rem;
  line-height: 1;
  color: var(--ember);
  text-shadow: 0 0 18px rgba(217,150,63,0.42);
}
.hm-lum-sticky-cta__was {
  font-family: var(--mono);
  font-size: 0.74rem;
  color: rgba(248,243,232,0.45);
  text-decoration: line-through;
  text-decoration-color: rgba(198,138,61,0.6);
  margin-top: 2px;
}
.hm-lum-sticky-cta__btn {
  flex: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 16px 18px;
  font-family: var(--mono);
  font-size: 0.84rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--carbon);
  background: linear-gradient(135deg, var(--ember), var(--amber));
  border: 2px solid var(--amber-2);
  border-radius: 999px;
  font-weight: 700;
  box-shadow:
    0 0 28px rgba(198,138,61,0.55),
    0 0 56px rgba(217,150,63,0.32),
    0 4px 16px -2px rgba(15,14,12,0.4);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  min-height: 52px;
  animation: hm-lum-sticky-pulse 2.6s ease-in-out infinite;
}
@keyframes hm-lum-sticky-pulse {
  0%, 100% { box-shadow: 0 0 28px rgba(198,138,61,0.55), 0 0 56px rgba(217,150,63,0.32), 0 4px 16px -2px rgba(15,14,12,0.4); }
  50%      { box-shadow: 0 0 40px rgba(198,138,61,0.85), 0 0 96px rgba(217,150,63,0.45), 0 4px 16px -2px rgba(15,14,12,0.4); }
}
.hm-lum-sticky-cta__btn svg { width: 16px; height: 16px; }

/* ============================================================
   12) FAQ accordion
   ============================================================ */
.hm-lum-faq {
  background: var(--kraft);
  color: var(--carbon);
  padding: 110px 36px;
}
.hm-lum-faq__head { text-align: center; max-width: 760px; margin: 0 auto 60px; }
.hm-lum-faq__head .hm-lum-display-md { color: var(--carbon); }
.hm-lum-faq__head .hm-lum-display-md em { color: var(--rust); }
.hm-lum-faq__list { max-width: 880px; margin: 0 auto; }
.hm-lum-faq__item {
  border-top: 1px solid rgba(15,14,12,0.16);
  padding: 26px 0;
}
.hm-lum-faq__item:last-child { border-bottom: 1px solid rgba(15,14,12,0.16); }
.hm-lum-faq__item summary {
  list-style: none;
  font-family: var(--editorial); font-style: italic; font-weight: 400;
  font-size: clamp(1.1rem, 1.6vw + 0.5rem, 1.45rem);
  color: var(--carbon);
  cursor: pointer;
  display: flex; justify-content: space-between; align-items: center; gap: 22px;
  position: relative; padding-right: 36px;
}
.hm-lum-faq__item summary::-webkit-details-marker { display: none; }
.hm-lum-faq__item summary::after {
  content: '+';
  position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  font-family: var(--display); font-size: 1.4rem;
  color: var(--amber);
  transition: transform 0.3s ease;
}
.hm-lum-faq__item[open] summary::after { content: '−'; transform: translateY(-50%) rotate(180deg); }
.hm-lum-faq__item p {
  margin-top: 14px;
  font-size: 1rem; line-height: 1.7;
  color: rgba(15,14,12,0.74);
  max-width: 780px;
}

/* ============================================================
   Footer
   ============================================================ */
.hm-lum-footer {
  background: var(--carbon);
  color: var(--ivory);
  padding: 80px 36px 60px;
  border-top: 1px solid var(--line);
}
.hm-lum-footer__inner {
  max-width: 1100px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 22px; align-items: center; text-align: center;
}
.hm-lum-footer__brand {
  font-family: var(--display);
  font-size: clamp(1.4rem, 2vw + 0.5rem, 2rem);
  letter-spacing: 0.16em;
}
.hm-lum-footer__motto {
  font-family: var(--mono);
  font-size: 0.74rem; letter-spacing: 0.32em;
  color: var(--amber);
}
.hm-lum-footer__nav { display: flex; flex-wrap: wrap; gap: 22px; justify-content: center; }
.hm-lum-footer__nav a {
  font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.16em;
  color: rgba(248,243,232,0.68); text-transform: uppercase;
  transition: color 0.2s ease;
}
.hm-lum-footer__nav a:hover { color: var(--amber); }
.hm-lum-footer__copy {
  font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.18em;
  color: rgba(248,243,232,0.36);
}

/* ============================================================
   Reduced motion
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  .hm-lum *,
  .hm-lum *::before,
  .hm-lum *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================
   Mobile breakpoints (constitución: 749px + 380px)
   ============================================================ */
@media (max-width: 749px) {
  .hm-lum { font-size: 16px; }

  /* Hero rebuild for mobile — picture as block, text in flow */
  .hm-lum-hero {
    display: flex; flex-direction: column;
    min-height: auto;
  }
  .hm-lum-hero__media--video { display: none; }
  .hm-lum-hero__media--mobile {
    display: block;
    position: relative;
    width: 100%;
    height: 64vh;
    min-height: 460px;
  }
  .hm-lum-hero__media--mobile img { width: 100%; height: 100%; object-fit: cover; }
  .hm-lum-hero__veil {
    height: 64vh; min-height: 460px;
  }
  .hm-lum-hero__grain {
    height: 64vh; min-height: 460px;
  }
  .hm-lum-ember { display: none; }

  .hm-lum-hero__chrome {
    top: 18px; left: 18px; right: 18px;
  }
  .hm-lum-hero__chapter { font-size: 0.66rem; padding: 5px 10px; }
  .hm-lum-hero__badge-num { font-size: 1.6rem; }
  .hm-lum-hero__badge-lbl { font-size: 0.54rem; }

  .hm-lum-hero__content {
    position: relative; left: auto; right: auto; bottom: auto;
    padding: 28px 22px 24px;
    background: var(--carbon);
    max-width: none;
  }
  .hm-lum-hero__headline { font-size: clamp(2.4rem, 11vw, 3.6rem); }
  .hm-lum-hero__sub { font-size: 1rem; margin-top: 16px; }

  .hm-lum-hero__price-card { width: 100%; }
  .hm-lum-hero__price-now { font-size: 1.8rem; }

  .hm-lum-hero__variants { width: 100%; }

  /* CTA in flow, not absolute */
  .hm-lum-hero__cta {
    position: static;
    margin: 0 22px 28px;
    width: calc(100% - 44px);
    justify-content: center;
    padding: 18px 24px;
    font-size: 0.86rem;
    letter-spacing: 0.16em;
  }
  .hm-lum-hero__scrollhint { display: none; }

  /* Sections padding */
  .hm-lum-stats { padding: 70px 22px; }
  .hm-lum-stats__grid { grid-template-columns: 1fr; gap: 14px; max-width: 100%; }
  .hm-lum-stat { padding: 26px 18px; }
  .hm-lum-stat__num { font-size: 2.6rem; }

  .hm-lum-pullquote { padding: 70px 22px; }
  .hm-lum-pullquote__text { font-size: clamp(1.5rem, 6.5vw, 2rem); }
  .hm-lum-pullquote::before, .hm-lum-pullquote::after { display: none; }

  .hm-lum-tabla { grid-template-columns: 1fr; }
  .hm-lum-tabla__media { min-height: 360px; }
  .hm-lum-tabla__copy { padding: 50px 22px; }

  .hm-lum-spotlight {
    display: flex; flex-direction: column;
    min-height: auto;
  }
  .hm-lum-spotlight__layer { position: relative; inset: auto; height: 360px; }
  .hm-lum-spotlight__layer--reveal { display: none; }
  .hm-lum-spotlight__copy {
    position: relative; padding: 50px 22px;
    grid-column: auto;
    text-align: left;
    max-width: 100%;
  }
  .hm-lum-spotlight .hm-lum-display-lg { font-size: clamp(2.2rem, 9vw, 3rem); }
  .hm-lum-microhint { display: none !important; }

  .hm-lum-timeline { padding: 70px 0 90px; }
  .hm-lum-timeline__head { padding: 0 22px; margin-bottom: 40px; }
  .hm-lum-timeline__rail { padding: 0 22px 30px; }
  .hm-lum-timeline__node { flex: 0 0 84vw; padding: 24px 20px; }
  .hm-lum-timeline__title { font-size: 1.3rem; }
  .hm-lum-timeline__hint { display: block; top: 70px; right: 22px; }
  .hm-lum-timeline__progress { left: 22px; right: 22px; bottom: 26px; }

  .hm-lum-craft { grid-template-columns: 1fr; gap: 36px; padding: 70px 22px; }
  .hm-lum-craft__media { order: -1; }
  .hm-lum-bullets li { padding: 12px 0; font-size: 0.96rem; }

  .hm-lum-compare { padding: 70px 22px; }
  .hm-lum-compare__head { margin-bottom: 32px; }
  .hm-lum-compare__tag { font-size: 0.64rem; padding: 6px 10px; }
  .hm-lum-compare__body { font-size: 1rem; margin-top: 24px; }

  .hm-lum-bento {
    grid-template-columns: 1fr; gap: 14px;
    padding: 70px 22px;
  }
  .hm-lum-bento__cell--portrait { grid-row: auto; min-height: 480px; }
  .hm-lum-bento__cell--portrait .hm-lum-bento__caption { padding: 22px 20px; }
  .hm-lum-bento__cell--pack, .hm-lum-bento__cell--macro { min-height: 280px; }

  .hm-lum-final { padding: 80px 22px 70px; }
  .hm-lum-final__amber, .hm-lum-final__amber--b { width: 320px; height: 320px; opacity: 0.7; }
  .hm-lum-final__guarantees { gap: 12px; font-size: 0.68rem; }

  .hm-lum-faq { padding: 70px 22px; }

  .hm-lum-footer { padding: 56px 22px 40px; }

  /* Mobile: cod-slot smaller padding */
  .hm-lum-cod-slot { padding: 22px 16px; }
  .hm-lum-cod-slot::before { font-size: 0.58rem; letter-spacing: 0.24em; }

  /* Mobile: body bottom padding so sticky CTA doesn't cover footer */
  .hm-lum-footer { padding-bottom: 96px; }
}

/* Sticky CTA only visible on mobile (<=900px) */
@media (min-width: 901px) {
  .hm-lum-sticky-cta { display: none !important; }
}

/* Sticky CTA mobile: hide when final-CTA is in view (avoid duplicate) */
.hm-lum.is-final-cta-visible .hm-lum-sticky-cta {
  transform: translateY(110%) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-width: 380px) {
  .hm-lum-hero__media--mobile,
  .hm-lum-hero__veil,
  .hm-lum-hero__grain { height: 58vh; min-height: 400px; }
  .hm-lum-hero__headline { font-size: 2.2rem; }
  .hm-lum-hero__sub { font-size: 0.92rem; }
  .hm-lum-hero__price-now { font-size: 1.5rem; }
  .hm-lum-hero__cta { padding: 16px 20px; font-size: 0.78rem; letter-spacing: 0.12em; }
  .hm-lum-stat__num { font-size: 2.2rem; }
  .hm-lum-display-md { font-size: 1.8rem; }
  .hm-lum-display-lg { font-size: 2rem; }
  .hm-lum-timeline__node { flex: 0 0 88vw; }
}

/* ── Touch target enforcement ─────────────────────────────────── */
.hm-lum button,
.hm-lum a {
  min-height: 44px;
}
.hm-lum-hero__chapter, .hm-lum-eyebrow, .hm-lum-bento__mark { min-height: 0; }

/* ── focus-visible ─────────────────────────────────────────────── */
.hm-lum *:focus-visible {
  outline: 2px solid var(--amber);
  outline-offset: 3px;
  border-radius: 6px;
}