/* Casa de Resonancia — PROPUESTA "Neón juvenil" para todo el sitio.
   Solo se carga si Configuración del tema → Casa de Resonancia · Modo reserva → "Estilo neón juvenil" está activado. */
:root {
  --cr-negro: #0B0A12; --cr-carbon: #13111C; --cr-grafito: #1C1A28; --cr-linea: rgba(255,255,255,.10);
  --cr-hueso: #FFFFFF; --cr-gris: #B9B4C8;
  --cr-ambar: #FF3EA5; --cr-ambar-osc: #C21E7A;
  --cr-display: 'Lexend', 'Inter', sans-serif; --cr-texto: 'Lexend', 'Inter', -apple-system, sans-serif;
  --neon-rosa: #FF3EA5; --neon-naranja: #FF8A1F; --neon-lima: #B8F51E; --neon-cian: #2EE6FF; --neon-amarillo: #FFE14D; --neon-violeta: #9B5CFF;
  --neon-grad: linear-gradient(90deg, #FFE14D, #FF8A1F 35%, #FF3EA5 70%, #9B5CFF);
  --neon-grad-btn: linear-gradient(135deg, #FFE14D, #FF8A1F 45%, #FF3EA5);
  --font-body-family: 'Lexend', 'Inter', sans-serif; --font-heading-family: 'Lexend', 'Inter', sans-serif;
}

/* Fondo: negro con resplandor rosa-violeta y polvo de estrellas, fijo detrás de todo */
html {
  background-color: #0B0A12;
  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(1px 1px at 6% 60%, rgba(255,255,255,.5), transparent 60%),
    radial-gradient(55% 60% at 100% 0%, rgba(255,62,165,.42), rgba(155,92,255,.18) 45%, transparent 70%),
    radial-gradient(45% 50% at 0% 100%, rgba(46,230,255,.13), transparent 70%);
  background-attachment: fixed; background-repeat: no-repeat;
}
body, body.gradient { background: transparent !important; font-family: 'Lexend', 'Inter', sans-serif; color: #fff; }
main .shopify-section, main [id^="shopify-section-"], .cr-section, main .section, main .gradient, main .color-scheme-1, main .color-scheme-2,
.footer, .footer.gradient { background-color: transparent !important; }
.drawer__inner, .menu-drawer, .cart-drawer, .predictive-search, .header__submenu, .global-settings-popup, .modal__content { background-color: #13111C !important; color: #fff; }
main [id^="shopify-section-"] { background-image: none; }

/* Tipografía: Lexend en todo, sin cursiva ni mayúsculas forzadas */
body *:not(em):not(i):not(svg):not(path) { font-style: normal !important; }
h1, h2, h3, h4, h5, .h0, .h1, .h2, .h3, .h4, .cr-h, .button, .cr-btn, .price, .price-item,
.cr-marquee__item, .cr-cat__name, .cr-hero__sello, .cr-hero__stat strong, .cr-card__price, .cr-card__title,
.cr-madera__name, .cr-maderas__tab, .cr-luthier__name, .cr-paso__n, [class*="__name"], [class*="__title"], [class*="__titulo"],
.shopify-payment-button__button--unbranded, .menu-drawer__menu-item, .header__menu-item, .footer-block__heading {
  font-family: 'Lexend', 'Inter', sans-serif !important; text-transform: none !important;
}
h1, h2, h3, .h0, .h1, .h2, .cr-h { font-weight: 700 !important; letter-spacing: -0.03em !important; line-height: 1.04 !important; color: #fff; }
.cr-h { line-height: 1.04; }
.cr-outline, .cr-acento { color: transparent !important; -webkit-text-stroke: 0 !important; background: var(--neon-grad); -webkit-background-clip: text; background-clip: text; }
.cr-p { color: rgba(255,255,255,.75); }
.cr-eyebrow { font-family: 'Lexend', sans-serif !important; font-weight: 600 !important; font-size: 14px !important; color: #fff !important;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); padding: 7px 14px; border-radius: 999px; backdrop-filter: blur(6px); }
.cr-eyebrow::before { content: "" !important; display: inline-block !important; width: 8px; height: 8px; border-radius: 50%; background: var(--neon-lima); box-shadow: 0 0 10px var(--neon-lima); }

/* Cabecera y cinta de anuncios */
.announcement-bar-section, .announcement-bar, .utility-bar { background: linear-gradient(90deg, #9B5CFF, #FF3EA5 50%, #FF8A1F) !important; color: #fff !important; }
.announcement-bar-section *, .announcement-bar *, .utility-bar * { color: #fff !important; opacity: 1 !important; }
.announcement-bar__message { font-weight: 600 !important; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.section-header, .header-wrapper { background: rgba(11,10,18,.78) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.header__menu-item:hover span, .header__active-menu-item { color: var(--neon-rosa) !important; text-decoration-color: var(--neon-rosa); }

/* Botones */
.cr-btn, .button, .shopify-payment-button__button--unbranded { border-radius: 14px !important; letter-spacing: 0 !important; font-weight: 700 !important; }
.button:after, .button:before { border-radius: 14px !important; box-shadow: none !important; }
.cr-btn--ambar, .button--primary, .button:not(.button--secondary):not(.button--tertiary), .shopify-payment-button__button--unbranded, .cr-btn--reserva {
  background: var(--neon-grad-btn) !important; color: #0B0A12 !important; border: 0 !important; box-shadow: 0 10px 30px -10px rgba(255,62,165,.6) !important;
}
.cr-btn--ambar:hover, .button--primary:hover { transform: translateY(-2px); box-shadow: 0 16px 40px -10px rgba(255,62,165,.8) !important; }
.cr-btn--linea, .button--secondary { background: rgba(255,255,255,.06) !important; color: #fff !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.25) !important; }
.cr-btn--claro { background: #fff !important; color: #0B0A12 !important; }
.cr-wsp-flot, a[href*="wa.me"].cr-btn { background: linear-gradient(135deg, #D7FF4A, #B8F51E 50%, #5BE37A) !important; color: #0B0A12 !important; }
.cr-link { border-bottom-color: var(--neon-rosa); }
.cr-link:hover { color: var(--neon-rosa); }

/* Marquesina */
.cr-marquee { background: var(--neon-grad) !important; color: #0B0A12 !important; }
.cr-marquee__item { font-weight: 700 !important; }
.cr-marquee__item::after { background: #0B0A12; border-radius: 50%; transform: none; }

/* Sello y destacados */
.cr-hero__sello { background: var(--neon-amarillo) !important; color: #0B0A12 !important; font-weight: 700; box-shadow: 0 20px 40px -15px rgba(255,225,77,.6) !important; }
.cr-hero__ondas i { border-color: rgba(255,62,165,.45) !important; }
.cr-paso__n { background: var(--neon-grad-btn) !important; color: #0B0A12 !important; }

/* Tarjetas (productos, categorías, bloques) en vidrio oscuro */
.cr-card, .card-wrapper .card, .card--standard .card__inner, .cr-faq__item, .cr-garantia, .cr-beneficio {
  background: rgba(21,19,31,.85) !important; border: 1px solid rgba(255,255,255,.09) !important; border-radius: 20px !important; color: #fff;
}
.cr-card:hover, .card-wrapper:hover .card { border-color: rgba(255,62,165,.5) !important; box-shadow: 0 24px 50px -24px rgba(255,62,165,.55); }
.cr-card__price, .price-item--sale, .price-item--regular { color: var(--neon-lima) !important; }
.cr-cat { border-radius: 22px !important; }
.cr-cat__tag { color: var(--neon-lima) !important; }
.cr-cat img { filter: none !important; }
.badge, .cr-card__badge { border-radius: 999px !important; font-family: 'Lexend', sans-serif !important; }

/* Formularios */
.field__input, .select__select, .customer .field input, textarea { background: rgba(255,255,255,.05) !important; border-radius: 12px !important; color: #fff !important; }
.field:after, .select:after { border-radius: 12px !important; box-shadow: 0 0 0 1px rgba(255,255,255,.18) !important; }

/* Pie de página */
.footer { border-top: 1px solid rgba(255,255,255,.08) !important; }
.footer-block__heading { font-weight: 700 !important; color: #fff !important; }

/* Esferas de color decorativas (solo pantallas grandes, sin bloquear clics) */
@media (min-width: 990px) {
  body::after { content: ""; position: fixed; z-index: -1; pointer-events: none; right: 3vw; top: 22vh; width: 90px; height: 90px; border-radius: 50%;
    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, #FF7AC6, #FF3EA5 70%, #B0127A);
    box-shadow: 0 18px 40px -10px #FF3EA5; opacity: .9; animation: cr-neon-flota 8s ease-in-out infinite; }
}
@keyframes cr-neon-flota { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(6px, -14px); } }
@media (prefers-reduced-motion: reduce) { body::after { animation: none; } }
