/* Casa de Resonancia — variante "Neón juvenil" de las secciones cr-pop (fondo negro, resplandor, esferas brillantes) */
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@400;500;600;700;800&display=swap');

.cr-pop.cr-pop--neon {
  --pop-papel: #0B0A12; --pop-tinta: #FFFFFF; --pop-fondo: #0B0A12;
  --neon-rosa: #FF3EA5; --neon-naranja: #FF8A1F; --neon-lima: #B8F51E; --neon-cian: #2EE6FF;
  --neon-amarillo: #FFE14D; --neon-violeta: #9B5CFF; --neon-card: #15131F; --neon-borde: rgba(255,255,255,.10);
  --pop-ambar: var(--neon-naranja); --pop-lima: var(--neon-lima); --pop-rosa: var(--neon-rosa); --pop-celeste: var(--neon-cian);
  background: #0B0A12 !important; color: #fff; font-family: 'Lexend', var(--cr-texto);
}
/* resplandor rosa-violeta y polvo de estrellas */
.cr-pop.cr-pop--neon::before {
  opacity: 1; background-size: auto;
  background-image:
    radial-gradient(1px 1px at 12% 22%, rgba(255,255,255,.7), transparent 60%),
    radial-gradient(1px 1px at 78% 14%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 88% 38%, rgba(255,190,240,.8), transparent 60%),
    radial-gradient(1px 1px at 64% 72%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(1.5px 1.5px at 30% 84%, rgba(190,230,255,.7), transparent 60%),
    radial-gradient(1px 1px at 46% 8%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(60% 70% at 100% 0%, rgba(255,62,165,.55), rgba(155,92,255,.25) 45%, transparent 70%),
    radial-gradient(45% 55% at 0% 100%, rgba(46,230,255,.16), transparent 70%);
}
.cr-pop--neon .cr-pop__doodle { display: none; }

/* Tipografía: geométrica redonda, en minúscula, como la referencia */
.cr-pop--neon .cr-pop__h, .cr-pop--neon .cr-pop-card__t, .cr-pop--neon .cr-pop-glos__palabra,
.cr-pop--neon .cr-pop__btn, .cr-pop--neon .cr-pop__eyebrow, .cr-pop--neon .cr-pop__sticker,
.cr-pop--neon .cr-pop-foto figcaption, .cr-pop--neon .cr-pop-card__precio {
  font-family: 'Lexend', var(--cr-texto) !important; font-style: normal !important; text-transform: none !important; letter-spacing: -0.01em;
}
.cr-pop--neon .cr-pop__h { font-weight: 700; line-height: 1.04; letter-spacing: -0.03em; color: #fff; }
.cr-pop--neon .cr-pop__h mark { color: transparent !important; background: linear-gradient(90deg, var(--neon-amarillo), var(--neon-naranja) 35%, var(--neon-rosa) 70%, var(--neon-violeta)); -webkit-background-clip: text; background-clip: text; padding: 0; }
.cr-pop--neon .cr-pop__h mark::before { display: none; }
.cr-pop--neon .cr-pop__p { color: rgba(255,255,255,.78); opacity: 1; }
.cr-pop--neon .cr-pop__eyebrow { background: rgba(255,255,255,.08); color: #fff; border: 1px solid var(--neon-borde); transform: none; font-weight: 600; font-size: 14px; backdrop-filter: blur(6px); }
.cr-pop--neon .cr-pop__eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--neon-lima); box-shadow: 0 0 10px var(--neon-lima); }

/* Botones: degradado naranja→rosa y lima, esquinas suaves, brillo */
.cr-pop--neon .cr-pop__btn { border: 0 !important; border-radius: 14px; font-weight: 700; font-size: 16px; padding: 18px 26px; color: #0B0A12; box-shadow: 0 10px 30px -8px rgba(255,62,165,.55) !important; background: linear-gradient(135deg, var(--neon-amarillo), var(--neon-naranja) 45%, var(--neon-rosa)); }
.cr-pop--neon .cr-pop__btn:hover { transform: translateY(-2px); box-shadow: 0 16px 40px -8px rgba(255,62,165,.75) !important; }
.cr-pop--neon .cr-pop__btn:active { transform: translateY(1px); }
.cr-pop--neon .cr-pop__btn--wsp { background: linear-gradient(135deg, #D7FF4A, var(--neon-lima) 50%, #5BE37A); box-shadow: 0 10px 30px -8px rgba(184,245,30,.55) !important; }
.cr-pop--neon .cr-pop__btn--claro { background: rgba(255,255,255,.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.22) !important; }

/* Stickers: píldoras de neón */
.cr-pop--neon .cr-pop__sticker { border: 0; box-shadow: 0 8px 24px -6px rgba(0,0,0,.6); font-weight: 700; color: #0B0A12; }
.cr-pop--neon .cr-pop__sticker--ambar { background: var(--neon-amarillo); }
.cr-pop--neon .cr-pop__sticker--rosa { background: var(--neon-rosa); color: #fff; }
.cr-pop--neon .cr-pop__sticker--papel { background: #fff; }

/* Hero */
.cr-pop--neon .cr-pop-hero__burbuja { background: rgba(255,255,255,.08); color: #fff; border: 1px solid var(--neon-borde); box-shadow: none; backdrop-filter: blur(6px); }
.cr-pop--neon .cr-pop-hero__burbuja::after { background: #1A1824; border-color: var(--neon-borde); border-width: 0 1px 1px 0; }
.cr-pop--neon .cr-pop-hero__chips li { background: rgba(255,255,255,.06); border: 1px solid var(--neon-borde); color: #fff; }
.cr-pop--neon .cr-pop-hero__chips li::before { background: var(--neon-lima); color: #0B0A12; }
.cr-pop--neon .cr-pop-foto { background: #fff; border: 0; padding: 8px 8px 12px; border-radius: 6px; box-shadow: 0 24px 50px -16px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.1); }
.cr-pop--neon .cr-pop-foto::after { background: linear-gradient(90deg, rgba(255,62,165,.85), rgba(255,138,31,.85)); }
.cr-pop--neon .cr-pop-foto figcaption { color: #111; font-weight: 600; }

/* Esferas brillantes (estilo 3D) */
.cr-neon__orbes { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.cr-neon__orbes i { position: absolute; border-radius: 50%; display: block; filter: saturate(1.15);
  background: radial-gradient(circle at 32% 28%, rgba(255,255,255,.95) 0 6%, rgba(255,255,255,.35) 14%, transparent 36%), radial-gradient(circle at 50% 50%, var(--c1), var(--c2) 70%, var(--c3));
  box-shadow: 0 18px 40px -10px var(--c2), inset -8px -12px 24px rgba(0,0,0,.25); }
.cr-neon__orbes .o1 { --c1: #FF7AC6; --c2: #FF3EA5; --c3: #B0127A; width: 120px; height: 120px; right: 3%; top: 8%; }
.cr-neon__orbes .o2 { --c1: #FFE38A; --c2: #FF8A1F; --c3: #C24B00; width: 64px; height: 64px; right: 40%; top: 6%; }
.cr-neon__orbes .o3 { --c1: #E8FF8A; --c2: #B8F51E; --c3: #5E8C00; width: 46px; height: 46px; right: 2%; bottom: 18%; }
.cr-neon__orbes .o4 { --c1: #9EF4FF; --c2: #2EE6FF; --c3: #0077A8; width: 34px; height: 34px; left: 45%; bottom: 10%; }
.cr-neon__orbes .o5 { --c1: #C9A8FF; --c2: #9B5CFF; --c3: #4B1BB0; width: 84px; height: 84px; left: -20px; bottom: 6%; }
.cr-neon__orbes .o6 { --c1: #FFF3A6; --c2: #FFE14D; --c3: #C9A100; width: 22px; height: 22px; right: 28%; top: 30%; }
.cr-neon__orbes .o7 { --c1: #FF9CC0; --c2: #FF5A7A; --c3: #A1102F; width: 16px; height: 16px; left: 8%; top: 14%; }
@media (prefers-reduced-motion: no-preference) {
  .cr-neon__orbes i { animation: cr-neon-flota 7s ease-in-out infinite; }
  .cr-neon__orbes i:nth-child(2n) { animation-duration: 9s; animation-delay: -3s; }
  .cr-neon__orbes i:nth-child(3n) { animation-duration: 11s; animation-delay: -5s; }
}
@keyframes cr-neon-flota { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(6px, -14px); } }

/* Tarjetas: vidrio oscuro con borde degradado */
.cr-pop--neon .cr-pop-card { background: linear-gradient(var(--neon-card), var(--neon-card)) padding-box, linear-gradient(140deg, var(--pop-acento, var(--neon-rosa)), rgba(255,255,255,.06) 55%) border-box; border: 1.5px solid transparent; color: #fff; box-shadow: 0 24px 50px -24px rgba(0,0,0,.9); transform: none !important; border-radius: 22px; }
.cr-pop--neon .cr-pop-card:hover { transform: translateY(-4px) !important; box-shadow: 0 28px 60px -20px color-mix(in srgb, var(--pop-acento, #FF3EA5) 55%, transparent); }
.cr-pop--neon .cr-pop-card__top { border-bottom: 0; background: #000; }
.cr-pop--neon .cr-pop-card__icono { background: transparent; border-bottom: 1px solid var(--neon-borde); }
.cr-pop--neon .cr-pop-card__icono span { background: var(--pop-acento, var(--neon-lima)); border: 0; color: #0B0A12; box-shadow: 0 0 24px -4px var(--pop-acento, var(--neon-lima)); }
.cr-pop--neon .cr-pop-card__t, .cr-pop--neon .cr-pop-glos__palabra { color: #fff !important; font-weight: 700; }
.cr-pop--neon .cr-pop-card__p, .cr-pop--neon .cr-pop-card__lista li { color: rgba(255,255,255,.78); }
.cr-pop--neon .cr-pop-card__lista li::before { content: "●"; color: var(--pop-acento, var(--neon-lima)); font-size: 10px; margin-top: 5px; }
.cr-pop--neon .cr-pop-card__precio { color: var(--pop-acento, var(--neon-lima)); font-weight: 700; }
.cr-pop--neon .cr-pop-card__precio small { color: rgba(255,255,255,.6); opacity: 1; }
.cr-pop--neon .cr-pop-card .cr-pop__btn { box-shadow: none !important; }

/* Traductor */
.cr-pop--neon .cr-pop-glos__item { background: var(--neon-card); border: 1px solid var(--neon-borde); color: #fff; box-shadow: 0 20px 40px -24px rgba(0,0,0,.9); }
.cr-pop--neon .cr-pop-glos__term { background: transparent; border-bottom: 1px solid var(--neon-borde); }
.cr-pop--neon .cr-pop-glos__palabra { background: linear-gradient(90deg, #fff, var(--pop-acento, var(--neon-lima))); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.cr-pop--neon .cr-pop-glos__dice, .cr-pop--neon .cr-pop-glos__trad .cr-pop-glos__dice { color: var(--pop-acento, var(--neon-lima)); opacity: 1; }
.cr-pop--neon .cr-pop-glos__trad p { color: rgba(255,255,255,.8); }

/* Llamado final: caja con degradado vivo */
.cr-pop--neon .cr-pop-cta__caja { background: linear-gradient(120deg, var(--neon-violeta), var(--neon-rosa) 45%, var(--neon-naranja)); border: 0 !important; box-shadow: 0 30px 80px -30px rgba(255,62,165,.8) !important; color: #fff; }
.cr-pop--neon .cr-pop-cta__caja .cr-pop__h mark { background: linear-gradient(90deg, var(--neon-amarillo), #fff); -webkit-background-clip: text; background-clip: text; }
.cr-pop--neon .cr-pop-cta__caja .cr-pop__p, .cr-pop--neon .cr-pop-cta__nota { color: #fff; }
.cr-pop--neon .cr-pop-cta__caja .cr-pop__btn--claro { background: rgba(0,0,0,.25); }

/* Secciones vecinas (productos, preguntas) con la misma tipografía en esta página */
body:has(.cr-pop--neon) .cr-section .cr-h { font-family: 'Lexend', var(--cr-texto) !important; font-style: normal; text-transform: none; font-weight: 700; letter-spacing: -0.03em; line-height: 1.04; }
body:has(.cr-pop--neon) .cr-section .cr-eyebrow { font-family: 'Lexend', var(--cr-texto); font-style: normal; font-weight: 600; font-size: 15px; color: #FF3EA5; }
body:has(.cr-pop--neon) .cr-marquee__item { font-family: 'Lexend', var(--cr-texto); font-style: normal; text-transform: none; font-weight: 700; }
body:has(.cr-pop--neon) .cr-card__price { font-family: 'Lexend', var(--cr-texto); font-style: normal; color: #B8F51E; }

@media (max-width: 640px) {
  .cr-neon__orbes .o1 { width: 70px; height: 70px; }
  .cr-neon__orbes .o5 { width: 50px; height: 50px; }
  .cr-neon__orbes .o2 { right: 8%; top: 2%; }
}