/* ============================================================
   Tema «neon» — 18 años (demo dieciocho-vip · intro ticket).
   Concepto: «Backstage VIP». Club nocturno, letrero «18» de neón que parpadea,
   láseres en la capa de efectos, glitch sutil y boleto negro con canto de neón.
   Paleta: negro #0B0B12 · fucsia #FF2E93 · violeta #7B2CF5 · cian #22D3EE · cromo #E5E7F0 · oro #D4AF37.
   Tipos: Unbounded (display y nombre) · Space Mono (etiquetas) · Inter (texto).
   Tema OSCURO completo. Contraste medido: texto #F4F5FA y #A9ADC2 sobre #0B0B12/#14141F ≥ 8:1;
   botones fucsia con texto negro (5,6:1). El violeta solo se usa en brillos, nunca en texto.
   Todo va acotado bajo html[data-theme="neon"].
   ============================================================ */
:root {
  --bg: #0B0B12;
  --bg-alt: #101019;
  --surface: #15151F;
  --ink: #F4F5FA;
  --ink-soft: #A9ADC2;
  --accent: #FF2E93;
  --accent-2: #22D3EE;
  --accent-ink: #0B0B12;
  --line: rgba(229, 231, 240, .12);
  --font-display: 'Unbounded', 'Arial Black', system-ui, sans-serif;
  --font-script: 'Unbounded', 'Arial Black', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 16px;
  --shadow: 0 18px 40px -22px rgba(0, 0, 0, .9), 0 0 0 1px rgba(255, 255, 255, .02);
  --hero-overlay: linear-gradient(180deg, rgba(11, 11, 18, .55) 0%, rgba(11, 11, 18, .18) 30%, rgba(11, 11, 18, .45) 55%, rgba(11, 11, 18, .96) 88%);
  --hero-ink: #F4F5FA;
  --intro-bg: #0B0B12;
  --intro-ink: #F4F5FA;
  --seal: #7B2CF5;
  /* piezas propias del tema */
  --nn-pink: #FF2E93;
  --nn-pink-hi: #FFD1E8;
  --nn-violet: #7B2CF5;
  --nn-cyan: #22D3EE;
  --nn-chrome: #E5E7F0;
  --nn-gold: #D4AF37;
  --nn-mono: 'Space Mono', ui-monospace, Menlo, Consolas, monospace;
  --nn-glow-pink: 0 0 4px rgba(255, 209, 232, .9), 0 0 11px rgba(255, 46, 147, .9), 0 0 24px rgba(255, 46, 147, .75), 0 0 48px rgba(255, 46, 147, .5);
  --nn-glow-cyan: 0 0 4px rgba(214, 250, 255, .9), 0 0 10px rgba(34, 211, 238, .9), 0 0 22px rgba(34, 211, 238, .6);
  --nn-holo: linear-gradient(115deg, #FF2E93, #7B2CF5 30%, #22D3EE 55%, #E5E7F0 70%, #FF2E93 100%);
  --pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='1' fill='%23E5E7F0' fill-opacity='.09'/%3E%3C/svg%3E");
  --nn-brick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='64' viewBox='0 0 128 64'%3E%3Cg fill='%23171623'%3E%3Crect x='1' y='1' width='62' height='30' rx='2'/%3E%3Crect x='65' y='1' width='62' height='30' rx='2' fill='%23141320'/%3E%3Crect x='-31' y='33' width='62' height='30' rx='2' fill='%23151422'/%3E%3Crect x='33' y='33' width='62' height='30' rx='2'/%3E%3Crect x='97' y='33' width='62' height='30' rx='2' fill='%23151422'/%3E%3C/g%3E%3C/svg%3E");
  --ornament: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 60'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='10' y1='0' x2='118' y2='0'%3E%3Cstop offset='0' stop-color='%23FF2E93' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23FF2E93'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='270' y1='0' x2='162' y2='0'%3E%3Cstop offset='0' stop-color='%2322D3EE' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%2322D3EE'/%3E%3C/linearGradient%3E%3Cfilter id='g' x='-50%25' y='-50%25' width='200%25' height='200%25'%3E%3CfeGaussianBlur stdDeviation='3'/%3E%3C/filter%3E%3C/defs%3E%3Cg filter='url(%23g)' opacity='.9'%3E%3Cpath d='M10 30H118' stroke='%23FF2E93' stroke-width='3'/%3E%3Cpath d='M162 30H270' stroke='%2322D3EE' stroke-width='3'/%3E%3Cpath d='M140 12 158 30 140 48 122 30Z' fill='none' stroke='%23FF8CC6' stroke-width='4'/%3E%3C/g%3E%3Cpath d='M10 30H118' stroke='url(%23a)' stroke-width='1.6'/%3E%3Cpath d='M162 30H270' stroke='url(%23b)' stroke-width='1.6'/%3E%3Cpath d='M140 12 158 30 140 48 122 30Z' fill='none' stroke='%23FFE3F1' stroke-width='1.8'/%3E%3Cpath d='M140 22 148 30 140 38 132 30Z' fill='%2322D3EE'/%3E%3C/svg%3E");
  color-scheme: dark;
}

/* ---------- lienzo general ---------- */
html[data-theme="neon"] {
  background-color: #07070C;
  background-image:
    radial-gradient(60vw 60vh at 0% 10%, rgba(255, 46, 147, .16), transparent 70%),
    radial-gradient(60vw 70vh at 100% 60%, rgba(123, 44, 245, .2), transparent 70%),
    radial-gradient(50vw 50vh at 30% 100%, rgba(34, 211, 238, .08), transparent 70%),
    var(--pattern);
}
html[data-theme="neon"] body.inv { color: var(--ink); }
html[data-theme="neon"] ::selection { background: var(--nn-pink); color: #0B0B12; }
html[data-theme="neon"] :focus-visible { outline-color: var(--nn-cyan); }

/* láseres «de techo»: dos abanicos de haces finos que nacen en las esquinas superiores,
   barren despacio y se desvanecen antes de la mitad de la pantalla (no cruzan formularios). */
html[data-theme="neon"] .inv-fx::before,
html[data-theme="neon"] .inv-fx::after {
  content: ''; position: absolute; top: -3vh; width: 170vw; height: 54vh;
  pointer-events: none; mix-blend-mode: screen; opacity: 0; transform-origin: 50% 0;
  -webkit-mask: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .55) 40%, transparent 100%);
  mask: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .55) 40%, transparent 100%);
}
html[data-theme="neon"] .inv-fx::before {
  left: -85vw;
  background: repeating-conic-gradient(from 100deg at 50% 0, transparent 0 8deg, rgba(255, 46, 147, .75) 8deg 8.3deg, transparent 8.3deg 17deg);
  animation: nnSweepL 13s ease-in-out infinite alternate, nnFxIn 2s ease 1.2s forwards;
}
html[data-theme="neon"] .inv-fx::after {
  right: -85vw;
  background: repeating-conic-gradient(from 110deg at 50% 0, transparent 0 10deg, rgba(34, 211, 238, .7) 10deg 10.3deg, transparent 10.3deg 21deg);
  animation: nnSweepR 17s ease-in-out infinite alternate, nnFxIn 2s ease 1.6s forwards;
}
html.is-intro[data-theme="neon"] .inv-fx { visibility: hidden; }
@keyframes nnSweepL { from { transform: rotate(-10deg); } to { transform: rotate(12deg); } }
@keyframes nnSweepR { from { transform: rotate(10deg); } to { transform: rotate(-12deg); } }
@keyframes nnFxIn { to { opacity: .34; } }

/* parpadeo de tubo de neón (irregular, como un letrero viejo) */
@keyframes nnFlicker {
  0%, 18%, 22%, 25%, 53%, 57%, 100% { opacity: 1; }
  20%, 24%, 55% { opacity: .38; }
}
@keyframes nnBuzz {
  0%, 100% { opacity: 1; }
  41% { opacity: 1; } 42% { opacity: .55; } 43% { opacity: 1; } 45% { opacity: .7; } 46% { opacity: 1; }
}
/* glitch sutil: separación RGB y salto lateral durante unas décimas */
@keyframes nnGlitch {
  0%, 91%, 100% { transform: none; text-shadow: var(--nn-glitch-rest); }
  92% { transform: translateX(-2px) skewX(-6deg); text-shadow: 3px 0 rgba(34, 211, 238, .9), -3px 0 rgba(255, 46, 147, .9); }
  93.5% { transform: translateX(2px); text-shadow: -2px 0 rgba(34, 211, 238, .9), 2px 0 rgba(255, 46, 147, .9); }
  95% { transform: none; text-shadow: var(--nn-glitch-rest); }
  96% { transform: translateX(1px) skewX(4deg); text-shadow: 2px 0 rgba(34, 211, 238, .8), -2px 0 rgba(255, 46, 147, .8); }
  97% { transform: none; text-shadow: var(--nn-glitch-rest); }
}
@keyframes nnPulse { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
@keyframes nnHolo { to { background-position: 300% 0; } }

/* ============================================================
   HERO — foto de club, letrero «18» de neón y nombre en cromo
   ============================================================ */
html[data-theme="neon"] .inv-hero--photo { background: #0B0B12; }
html[data-theme="neon"] .inv-hero__media {
  /* respaldo si la foto no carga: bruma de club */
  background:
    radial-gradient(60% 40% at 30% 55%, rgba(255, 46, 147, .45), transparent 70%),
    radial-gradient(60% 45% at 75% 35%, rgba(123, 44, 245, .5), transparent 70%),
    #0E0B18;
}
html[data-theme="neon"] .inv-hero__img { filter: saturate(1.2) contrast(1.06) brightness(.86); }
html[data-theme="neon"] .inv-hero__img.is-broken { opacity: 0; }
/* líneas de escaneo muy finas sobre la foto */
html[data-theme="neon"] .inv-hero__media::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(229, 231, 240, .045) 0 1px, transparent 1px 3px);
  mix-blend-mode: screen;
}
/* letrero «18»: tubo fucsia dentro de un marco cian */
html[data-theme="neon"] .inv-hero--photo::before {
  content: '18';
  position: absolute; z-index: 1; left: 50%; top: calc(max(58px, 8.5vh) + env(safe-area-inset-top));
  transform: translateX(-50%) rotate(-4deg);
  padding: .02em .2em .06em;
  font-family: 'Unbounded', var(--font-display); font-weight: 300;
  font-size: clamp(7.5rem, 41vw, 11.5rem); line-height: 1; letter-spacing: -.02em;
  color: #FFE9F4;
  text-shadow: var(--nn-glow-pink), 0 0 90px rgba(255, 46, 147, .45);
  border: 2.5px solid #C9F6FF; border-radius: 26px;
  box-shadow: 0 0 5px rgba(34, 211, 238, .95), 0 0 16px rgba(34, 211, 238, .7), 0 0 38px rgba(34, 211, 238, .35), inset 0 0 10px rgba(34, 211, 238, .55), inset 0 0 26px rgba(34, 211, 238, .2);
  pointer-events: none;
  animation: nnFlicker 5.5s linear 1.2s infinite;
}
/* luz del neón que baña la pared */
html[data-theme="neon"] .inv-hero--photo::after {
  content: ''; position: absolute; z-index: 0; left: 50%; top: calc(max(58px, 8.5vh) + env(safe-area-inset-top) - 30px);
  width: min(120vw, 560px); height: 300px; transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(255, 46, 147, .42), rgba(123, 44, 245, .18) 55%, transparent);
  pointer-events: none;
  animation: nnFlicker 5.5s linear 1.2s infinite;
}
html[data-theme="neon"] .inv-hero--photo .inv-hero__content { z-index: 2; }
html[data-theme="neon"] .inv-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--nn-mono); font-weight: 700; font-size: .7rem; letter-spacing: .24em;
  color: var(--nn-cyan); opacity: 1; text-shadow: 0 0 10px rgba(34, 211, 238, .6);
}
html[data-theme="neon"] .inv-hero__eyebrow::before {
  content: ''; flex: none; width: 8px; height: 8px; border-radius: 50%;
  background: var(--nn-pink); box-shadow: 0 0 8px var(--nn-pink), 0 0 16px rgba(255, 46, 147, .7);
  animation: nnPulse 1.4s ease-in-out infinite;
}
html[data-theme="neon"] .inv-hero__title {
  --nn-glitch-rest: 0 0 transparent;
  font-family: 'Unbounded', var(--font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(2.4rem, 13.4vw, 4.1rem); line-height: 1; letter-spacing: 0;
  margin: .2em 0 .26em;
  color: #F4F5FA;
  background: linear-gradient(180deg, #FFFFFF 0%, #E5E7F0 38%, #9EA3BB 52%, #F4F5FA 64%, #C9CCDB 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 14px rgba(255, 46, 147, .55)) drop-shadow(0 2px 0 rgba(123, 44, 245, .6));
}
html.is-revealed[data-theme="neon"] .inv-hero__title.hero-anim {
  animation: invUp 1.15s var(--ease) both, nnGlitch 6.5s linear 2.4s infinite;
  animation-delay: calc(.12s + var(--i, 0) * .11s), 2.4s;
}
html[data-theme="neon"] .inv-hero__subtitle {
  font-family: var(--font-body); font-style: normal; font-weight: 500; font-size: 1.02rem; line-height: 1.55;
  color: #D9DBE8; opacity: 1; max-width: 19rem;
}
html[data-theme="neon"] .inv-hero__date { font-family: var(--nn-mono); font-weight: 700; letter-spacing: .16em; color: var(--nn-chrome); margin-top: 1.3rem; }
html[data-theme="neon"] .inv-hero__date-side { border-color: rgba(34, 211, 238, .55); }
html[data-theme="neon"] .inv-hero__date-day {
  font-family: 'Unbounded', var(--font-display); font-weight: 700; font-size: 3rem; color: #E9FCFF;
  text-shadow: var(--nn-glow-cyan);
}
html[data-theme="neon"] .inv-hero__time { font-family: var(--nn-mono); color: var(--nn-pink-hi); opacity: 1; letter-spacing: .24em; }
html[data-theme="neon"] .inv-hero__place { font-family: var(--nn-mono); font-size: .8rem; letter-spacing: .08em; opacity: 1; color: #D9DBE8; }
html[data-theme="neon"] .inv-hero__place .inv-icon { color: var(--nn-pink); }
html[data-theme="neon"] .inv-hero__cue { font-family: var(--nn-mono); color: var(--nn-cyan); }

/* pase del invitado */
html[data-theme="neon"] .inv-guest {
  background: rgba(21, 21, 31, .92);
  color: var(--ink);
  border: 1px solid rgba(255, 46, 147, .55);
  border-radius: 14px;
  box-shadow: 0 0 0 1px rgba(255, 46, 147, .12), 0 0 26px -4px rgba(255, 46, 147, .45), inset 0 0 18px rgba(255, 46, 147, .08);
}
html[data-theme="neon"] .inv-hero--photo .inv-guest {
  background: rgba(11, 11, 18, .6);
  border-color: rgba(255, 46, 147, .7);
  box-shadow: 0 0 0 1px rgba(255, 46, 147, .15), 0 0 30px -4px rgba(255, 46, 147, .5), inset 0 0 18px rgba(255, 46, 147, .1);
}
html[data-theme="neon"] .inv-guest__label { font-family: var(--nn-mono); font-weight: 700; color: var(--nn-cyan); opacity: 1; letter-spacing: .24em; }
html[data-theme="neon"] .inv-guest__name { font-family: 'Unbounded', var(--font-display); font-weight: 700; font-size: 1.14rem; text-transform: uppercase; letter-spacing: .02em; }
html[data-theme="neon"] .inv-guest__passes { color: var(--ink-soft); opacity: 1; }

/* ============================================================
   SECCIONES
   ============================================================ */
html[data-theme="neon"] .inv-page { background: var(--bg); }
html[data-theme="neon"] .inv-section { background: var(--bg); }
html[data-theme="neon"] .inv-section.is-alt {
  background:
    radial-gradient(80% 45% at 100% 0%, rgba(123, 44, 245, .16), transparent 70%),
    radial-gradient(70% 40% at 0% 100%, rgba(255, 46, 147, .1), transparent 70%),
    var(--pattern),
    var(--bg-alt);
}
/* costura de neón entre secciones */
html[data-theme="neon"] .inv-section + .inv-section::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 46, 147, .55) 30%, rgba(34, 211, 238, .55) 70%, transparent);
  opacity: .5;
}
html[data-theme="neon"] .inv-main .inv-eyebrow {
  font-family: var(--nn-mono); font-weight: 700; font-size: .72rem; letter-spacing: .22em;
  color: var(--nn-cyan);
}
html[data-theme="neon"] .inv-head > .inv-eyebrow::before { content: '// '; color: var(--nn-pink); }
html[data-theme="neon"] .inv-main .inv-title {
  font-family: 'Unbounded', var(--font-display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(1.55rem, 7.2vw, 2.1rem); line-height: 1.12; letter-spacing: -.005em;
  color: #F4F5FA;
}
html[data-theme="neon"] .inv-text { color: var(--ink-soft); }
html[data-theme="neon"] .inv-head .inv-text { color: #C4C7D8; }
html[data-theme="neon"] .inv-card {
  background: var(--surface);
  border: 1px solid rgba(229, 231, 240, .1);
  box-shadow: var(--shadow);
}

/* botones: fucsia con texto negro y halo */
html[data-theme="neon"] .inv-btn {
  font-family: var(--font-body); font-weight: 700; letter-spacing: .02em;
  box-shadow: 0 0 0 1px rgba(255, 46, 147, .4), 0 0 22px -4px rgba(255, 46, 147, .8), inset 0 1px 0 rgba(255, 255, 255, .35);
}
@media (hover: hover) {
  html[data-theme="neon"] .inv-btn:hover { box-shadow: 0 0 0 1px rgba(255, 46, 147, .5), 0 0 34px -2px rgba(255, 46, 147, .9), inset 0 1px 0 rgba(255, 255, 255, .35); }
}
html[data-theme="neon"] .inv-btn--ghost {
  background: rgba(34, 211, 238, .04); color: #BDF4FC; border-color: rgba(34, 211, 238, .6);
  box-shadow: 0 0 16px -6px rgba(34, 211, 238, .7), inset 0 0 12px -4px rgba(34, 211, 238, .5);
}
html[data-theme="neon"] .inv-btn--ghost::after { background: linear-gradient(105deg, transparent 30%, rgba(34, 211, 238, .2) 50%, transparent 70%); }
html[data-theme="neon"] .inv-btn--wa { --accent: #25D366; --accent-ink: #062B14; box-shadow: 0 0 22px -6px rgba(37, 211, 102, .8); }

/* vip: pase negro holográfico con canto de neón */
html[data-theme="neon"] .inv-vip {
  filter: drop-shadow(0 0 1px rgba(255, 46, 147, .95)) drop-shadow(0 0 14px rgba(255, 46, 147, .45)) drop-shadow(0 26px 30px rgba(0, 0, 0, .7));
}
html[data-theme="neon"] .inv-vip__main, html[data-theme="neon"] .inv-vip__stub { color: #F4F5FA; }
html[data-theme="neon"] .inv-vip__main {
  padding-top: 40px;
  background:
    radial-gradient(90% 70% at 100% 0%, rgba(123, 44, 245, .5), transparent 60%),
    radial-gradient(80% 60% at 0% 100%, rgba(255, 46, 147, .28), transparent 65%),
    linear-gradient(160deg, #1B1428, #0F0F18);
}
/* franja holográfica */
html[data-theme="neon"] .inv-vip__main::before {
  content: 'BACKSTAGE · ACCESO TOTAL · BACKSTAGE · ACCESO TOTAL · BACKSTAGE · ACCESO TOTAL';
  position: absolute; left: 0; right: 0; top: 0; height: 24px; overflow: hidden; white-space: nowrap;
  display: flex; align-items: center; padding-left: 14px;
  font: 700 .56rem/1 var(--nn-mono); letter-spacing: .3em; color: rgba(12, 10, 20, .75);
  background: var(--nn-holo); background-size: 300% 100%;
  animation: nnHolo 9s linear infinite;
}
html[data-theme="neon"] .inv-vip__main::after { border-bottom-color: rgba(229, 231, 240, .3); }
html[data-theme="neon"] .inv-vip__kicker { font-family: var(--nn-mono); color: var(--nn-cyan); letter-spacing: .24em; opacity: 1; }
html[data-theme="neon"] .inv-vip__spark { fill: var(--nn-pink); }
html[data-theme="neon"] .inv-vip__event { font-family: var(--nn-mono); font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; opacity: .8; }
html[data-theme="neon"] .inv-vip__name {
  font-family: 'Unbounded', var(--font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(1.45rem, 7vw, 1.9rem); line-height: 1.08; margin-top: 6px;
  color: #FFE9F4; text-shadow: 0 0 6px rgba(255, 46, 147, .9), 0 0 18px rgba(255, 46, 147, .55);
}
html[data-theme="neon"] .inv-vip__grid dt { font-family: var(--nn-mono); opacity: .7; }
html[data-theme="neon"] .inv-vip__grid dd { font-family: 'Unbounded', var(--font-display); font-weight: 600; font-size: 1rem; }
html[data-theme="neon"] .inv-vip__stub { background: linear-gradient(160deg, #13131D, #0C0C14); }
html[data-theme="neon"] .inv-vip__code { font-family: var(--nn-mono); color: var(--nn-cyan); text-shadow: 0 0 10px rgba(34, 211, 238, .6); }
html[data-theme="neon"] .inv-vip__hint { color: var(--ink-soft); opacity: 1; }
html[data-theme="neon"] .inv-vip__qr { box-shadow: 0 0 0 2px rgba(34, 211, 238, .8), 0 0 18px rgba(34, 211, 238, .45); }
html[data-theme="neon"] .inv-vip__qr.is-generic { background: rgba(229, 231, 240, .06); border-color: rgba(34, 211, 238, .5); box-shadow: none; }

/* countdown: display de LED */
html[data-theme="neon"] .inv-countdown { gap: 8px; }
html[data-theme="neon"] .inv-countdown__unit {
  padding: 18px 2px 14px; border-radius: 12px;
  background: linear-gradient(180deg, #16161F, #0F0F17);
  border: 1px solid rgba(34, 211, 238, .28);
  box-shadow: inset 0 0 18px rgba(34, 211, 238, .08), 0 14px 30px -18px rgba(0, 0, 0, .9);
}
html[data-theme="neon"] .inv-countdown__unit::before { background: rgba(229, 231, 240, .1); opacity: 1; }
html[data-theme="neon"] .inv-countdown__num {
  font-family: 'Unbounded', var(--font-display); font-weight: 500; font-size: clamp(1.55rem, 7.4vw, 2.1rem);
  color: #E9FCFF; text-shadow: var(--nn-glow-cyan);
}
html[data-theme="neon"] .inv-countdown__unit:first-child .inv-countdown__num { color: #FFE9F4; text-shadow: var(--nn-glow-pink); }
html[data-theme="neon"] .inv-countdown__lbl { font-family: var(--nn-mono); color: var(--ink-soft); letter-spacing: .18em; }
html[data-theme="neon"] .inv-countdown__date { font-family: var(--nn-mono); color: var(--nn-pink-hi); letter-spacing: .14em; }
html[data-theme="neon"] .inv-countdown__done { font-family: 'Unbounded', var(--font-display); font-style: normal; color: #FFE9F4; text-shadow: var(--nn-glow-pink); }

/* events */
html[data-theme="neon"] .inv-event { border-radius: 18px; }
html[data-theme="neon"] .inv-event__media { background: radial-gradient(60% 60% at 50% 60%, rgba(123, 44, 245, .45), transparent 70%), #120E1C; }
html[data-theme="neon"] .inv-event__media::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 45%, rgba(21, 21, 31, .9)), repeating-linear-gradient(0deg, rgba(229, 231, 240, .04) 0 1px, transparent 1px 3px);
}
html[data-theme="neon"] .inv-event__media img.is-broken { opacity: 0; }
html[data-theme="neon"] .inv-event__icon {
  color: #FFE9F4; background: #15151F; border: 1.5px solid var(--nn-pink);
  box-shadow: 0 0 12px rgba(255, 46, 147, .7), inset 0 0 10px rgba(255, 46, 147, .35);
}
html[data-theme="neon"] .inv-event.has-img .inv-event__icon { background: #15151F; box-shadow: 0 0 12px rgba(255, 46, 147, .7), inset 0 0 10px rgba(255, 46, 147, .35); }
html[data-theme="neon"] .inv-event__icon .inv-icon { filter: drop-shadow(0 0 4px rgba(255, 46, 147, .9)); }
html[data-theme="neon"] .inv-event__name { font-family: 'Unbounded', var(--font-display); font-weight: 700; font-size: 1.3rem; text-transform: uppercase; }
html[data-theme="neon"] .inv-event__meta { color: #C4C7D8; }
html[data-theme="neon"] .inv-event__meta .inv-icon { color: var(--nn-cyan); }

/* timeline: tubo de neón degradado */
html[data-theme="neon"] .inv-timeline::before {
  width: 2px; left: 27px;
  background: linear-gradient(var(--nn-pink), var(--nn-violet) 50%, var(--nn-cyan));
  box-shadow: 0 0 10px rgba(255, 46, 147, .6), 0 0 20px rgba(123, 44, 245, .4);
}
html[data-theme="neon"] .inv-timeline__dot {
  color: #E9FCFF; background: #111119; border: 1.5px solid rgba(34, 211, 238, .75);
  box-shadow: 0 0 0 6px var(--bg), 0 0 14px rgba(34, 211, 238, .55), inset 0 0 10px rgba(34, 211, 238, .25);
}
html[data-theme="neon"] .inv-section.is-alt .inv-timeline__dot { box-shadow: 0 0 0 6px var(--bg-alt), 0 0 14px rgba(34, 211, 238, .55), inset 0 0 10px rgba(34, 211, 238, .25); }
html[data-theme="neon"] .inv-timeline__item:nth-child(3) .inv-timeline__dot { border-color: var(--nn-pink); color: #FFE9F4; box-shadow: 0 0 0 6px var(--bg), 0 0 16px rgba(255, 46, 147, .75), inset 0 0 10px rgba(255, 46, 147, .3); }
html[data-theme="neon"] .inv-timeline__time { font-family: var(--nn-mono); color: var(--nn-pink-hi); letter-spacing: .16em; }
html[data-theme="neon"] .inv-timeline__title { font-family: 'Unbounded', var(--font-display); font-weight: 600; font-size: 1.08rem; text-transform: uppercase; letter-spacing: .01em; margin-top: 4px; }
html[data-theme="neon"] .inv-timeline__text { color: var(--ink-soft); }

/* dresscode */
html[data-theme="neon"] .inv-dress__icon { color: #FFE9F4; background: #15151F; border: 1.5px solid var(--nn-pink); box-shadow: 0 0 14px rgba(255, 46, 147, .6); }
html[data-theme="neon"] .inv-dress__code {
  font-family: 'Unbounded', var(--font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(1.35rem, 6.6vw, 1.8rem); line-height: 1.2; color: #F4F5FA;
}
html[data-theme="neon"] .inv-dress__label { font-family: var(--nn-mono); color: var(--nn-cyan); }
html[data-theme="neon"] .inv-chip { background: #15151F; border-color: rgba(229, 231, 240, .14); color: #E5E7F0; }
html[data-theme="neon"] .inv-chip__swatch { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25), 0 0 10px rgba(255, 255, 255, .08); }
html[data-theme="neon"] .inv-chip--color:nth-child(2) .inv-chip__swatch { box-shadow: 0 0 10px rgba(255, 46, 147, .9); }
html[data-theme="neon"] .inv-chip--color:nth-child(3) .inv-chip__swatch { box-shadow: 0 0 10px rgba(34, 211, 238, .9); }
html[data-theme="neon"] .inv-chip--color:nth-child(4) .inv-chip__swatch { box-shadow: 0 0 10px rgba(123, 44, 245, .9); }
html[data-theme="neon"] .inv-chip--avoid { color: var(--ink-soft); }
html[data-theme="neon"] .inv-chip--avoid .inv-icon { color: var(--nn-pink); }

/* playlist */
html[data-theme="neon"] .inv-playlist__poster {
  background: radial-gradient(90% 120% at 0% 0%, rgba(255, 46, 147, .35), transparent 60%), linear-gradient(135deg, #1B1428, #0F0F18);
  border: 1px solid rgba(255, 46, 147, .4); box-shadow: 0 0 24px -8px rgba(255, 46, 147, .6);
}
html[data-theme="neon"] .inv-playlist__label { background: var(--nn-holo); }
html[data-theme="neon"] .inv-playlist__txt strong { font-family: 'Unbounded', var(--font-display); font-weight: 600; font-size: .95rem; text-transform: uppercase; }
html[data-theme="neon"] .inv-playlist__txt span { opacity: .8; }

/* note: letrero de advertencia */
html[data-theme="neon"] .inv-note {
  background: linear-gradient(160deg, #161420, #101018);
  border: 1.5px solid rgba(34, 211, 238, .7);
  box-shadow: 0 0 22px -6px rgba(34, 211, 238, .6), inset 0 0 22px -8px rgba(34, 211, 238, .45);
}
html[data-theme="neon"] .inv-note__icon { background: #0B0B12; color: #E9FCFF; border: 1.5px solid var(--nn-cyan); box-shadow: 0 0 12px rgba(34, 211, 238, .7); }
html[data-theme="neon"] .inv-note__icon .inv-icon { filter: drop-shadow(0 0 3px rgba(34, 211, 238, .9)); }
html[data-theme="neon"] .inv-note__title { font-family: 'Unbounded', var(--font-display); font-weight: 700; font-size: 1.12rem; text-transform: uppercase; line-height: 1.25; }
html[data-theme="neon"] .inv-note .inv-text { color: #C4C7D8; }

/* faq */
html[data-theme="neon"] .inv-faq__item { background: var(--surface); border-color: rgba(229, 231, 240, .1); }
html[data-theme="neon"] .inv-faq__item.is-open { border-color: rgba(255, 46, 147, .5); box-shadow: 0 0 22px -8px rgba(255, 46, 147, .6); }
html[data-theme="neon"] .inv-faq__q { font-family: var(--font-body); font-weight: 600; font-size: 1rem; color: #F4F5FA; }
html[data-theme="neon"] .inv-faq__icon { background: rgba(34, 211, 238, .12); color: var(--nn-cyan); }
html[data-theme="neon"] .inv-faq__a p { color: #C4C7D8; }

/* wishes */
html[data-theme="neon"] .inv-wish { background: var(--surface); border-color: rgba(229, 231, 240, .1); }
html[data-theme="neon"] .inv-wish:nth-child(3n + 2) { background: linear-gradient(160deg, #1A1426, #15151F); }
html[data-theme="neon"] .inv-wish::before { color: var(--nn-pink); opacity: .6; font-family: 'Unbounded', var(--font-display); }
html[data-theme="neon"] .inv-wish__msg p { font-family: var(--font-body); font-size: 1.02rem; color: #F4F5FA; }
html[data-theme="neon"] .inv-wishes__spark { fill: var(--nn-pink); }

/* formularios legibles en oscuro */
html[data-theme="neon"] .inv-field__label { color: #E5E7F0; font-family: var(--nn-mono); font-size: .74rem; letter-spacing: .08em; }
html[data-theme="neon"] .inv-field__label small, html[data-theme="neon"] .inv-field__count { color: #A9ADC2; }
html[data-theme="neon"] .inv-input { background: #0C0C13; border-color: rgba(229, 231, 240, .2); color: #F4F5FA; }
html[data-theme="neon"] .inv-input::placeholder { color: #8A8FA6; }
html[data-theme="neon"] .inv-input:focus { background: #0E0E16; border-color: var(--nn-cyan); box-shadow: 0 0 0 3px rgba(34, 211, 238, .22), 0 0 18px -4px rgba(34, 211, 238, .6); }

/* RSVP */
html[data-theme="neon"] .inv-section.inv-rsvp {
  background:
    radial-gradient(90% 45% at 50% 0%, rgba(255, 46, 147, .2), transparent 70%),
    radial-gradient(80% 45% at 50% 100%, rgba(123, 44, 245, .2), transparent 70%),
    var(--bg);
}
html[data-theme="neon"] .inv-rsvp__seats i { border-color: rgba(255, 46, 147, .7); }
html[data-theme="neon"] .inv-rsvp__seats i.is-on { background: var(--nn-pink); box-shadow: 0 0 8px var(--nn-pink); }
html[data-theme="neon"] .inv-rsvp__face { background: #0F0F17; border-color: rgba(229, 231, 240, .16); }
html[data-theme="neon"] .inv-rsvp__face-ico { background: #1B1B27; }
html[data-theme="neon"] .inv-rsvp__face-txt strong { font-family: 'Unbounded', var(--font-display); font-weight: 700; font-size: .95rem; }
html[data-theme="neon"] .inv-rsvp__face-txt small { color: #A9ADC2; }
html[data-theme="neon"] .inv-rsvp__radio:checked + .inv-rsvp__face { background: #1A1222; border-color: var(--nn-pink); box-shadow: 0 0 22px -6px rgba(255, 46, 147, .75); }
html[data-theme="neon"] .inv-stepper { background: #0F0F17; border-color: rgba(229, 231, 240, .16); }
html[data-theme="neon"] .inv-stepper__label { font-family: var(--nn-mono); color: #A9ADC2; }
html[data-theme="neon"] .inv-stepper__btn { background: #1B1B27; color: var(--nn-cyan); border-color: rgba(34, 211, 238, .45); }
html[data-theme="neon"] .inv-stepper__val { font-family: 'Unbounded', var(--font-display); color: #F4F5FA; }
html[data-theme="neon"] .inv-rsvp__hint, html[data-theme="neon"] .inv-rsvp__alt { color: #A9ADC2; }
html[data-theme="neon"] .inv-rsvp__alt:hover { color: var(--nn-cyan); }
html[data-theme="neon"] .inv-rsvp__done-title { font-family: 'Unbounded', var(--font-display); font-weight: 700; text-transform: uppercase; font-size: 1.5rem; }
html[data-theme="neon"] .inv-rsvp__badge { box-shadow: 0 0 0 8px rgba(255, 46, 147, .14), 0 0 30px rgba(255, 46, 147, .7); }
html[data-theme="neon"] .inv-rsvp__note { background: #0F0F17; color: #C4C7D8; }
html[data-theme="neon"] .inv-rsvp__change { color: #A9ADC2; }

/* divider */
html[data-theme="neon"] .inv-divider.has-ornament { height: 60px; max-width: 300px; }

/* pie */
html[data-theme="neon"] .inv-footer {
  background: radial-gradient(70% 60% at 50% 0%, rgba(255, 46, 147, .16), transparent 70%), #08080D;
  border-top: 1px solid rgba(255, 46, 147, .25);
}
html[data-theme="neon"] .inv-footer__orn { fill: var(--nn-cyan); filter: drop-shadow(0 0 6px rgba(34, 211, 238, .9)); }
html[data-theme="neon"] .inv-footer__text {
  font-family: 'Unbounded', var(--font-display); font-weight: 300; font-size: 2.6rem; letter-spacing: .02em;
  color: #FFE9F4; text-shadow: var(--nn-glow-pink);
  animation: nnBuzz 7s linear infinite;
}
html[data-theme="neon"] .inv-footer__date { font-family: var(--nn-mono); color: var(--nn-cyan); }
html[data-theme="neon"] .inv-footer__credit { color: #A9ADC2; }
html[data-theme="neon"] .inv-footer__brand { color: #F4F5FA; }

/* barra de acciones, música y hoja inferior */
html[data-theme="neon"] .inv-actionbar {
  background: rgba(16, 16, 25, .82); border-color: rgba(229, 231, 240, .12);
  box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .9), 0 0 0 1px rgba(255, 46, 147, .12);
}
html[data-theme="neon"] .inv-actionbar__btn:not(.is-primary) { color: #E5E7F0; }
html[data-theme="neon"] .inv-actionbar__btn.is-primary { box-shadow: 0 0 20px -4px rgba(255, 46, 147, .9); }
html[data-theme="neon"] .inv-music { background: rgba(16, 16, 25, .8); color: #F4F5FA; border-color: rgba(229, 231, 240, .14); }
html[data-theme="neon"] .inv-sheet__opt { background: #0F0F17; }
html[data-theme="neon"] .inv-sheet__ico { background: #1B1B27; }

/* ============================================================
   INTRO «ticket» — pared de ladrillo, letrero «18» y boleto negro con canto de neón
   ============================================================ */
html[data-theme="neon"] .inv-intro--ticket { background: #09090F; }
html[data-theme="neon"] .inv-intro--ticket .inv-intro__bg {
  background-image:
    radial-gradient(70% 34% at 50% 17%, rgba(255, 46, 147, .3), transparent 72%),
    radial-gradient(90% 50% at 50% 62%, rgba(123, 44, 245, .22), transparent 70%),
    radial-gradient(130% 90% at 50% 45%, transparent 45%, rgba(0, 0, 0, .85) 100%),
    var(--nn-brick);
  background-size: auto, auto, auto, 128px 64px;
}
html[data-theme="neon"] .inv-intro--ticket .inv-intro__bg::after { display: none; }
/* el letrero en la pared */
html[data-theme="neon"] .inv-intro--ticket::before {
  content: '18';
  position: absolute; z-index: 0; left: 50%; top: calc(env(safe-area-inset-top) + max(62px, 8vh));
  transform: translateX(-50%) rotate(-5deg);
  padding: .02em .2em .06em;
  font-family: 'Unbounded', var(--font-display); font-weight: 300;
  font-size: min(36vw, 16vh, 10rem); line-height: 1; letter-spacing: -.02em;
  color: #FFE9F4;
  text-shadow: var(--nn-glow-pink), 0 0 90px rgba(255, 46, 147, .45);
  border: 2.5px solid #C9F6FF; border-radius: 22px;
  box-shadow: 0 0 5px rgba(34, 211, 238, .95), 0 0 16px rgba(34, 211, 238, .7), 0 0 38px rgba(34, 211, 238, .35), inset 0 0 10px rgba(34, 211, 238, .55);
  pointer-events: none;
  animation: nnFlicker 4.8s linear .8s infinite;
}
/* láseres de piso detrás del boleto: nacen en las esquinas inferiores y se apagan hacia arriba */
html[data-theme="neon"] .inv-intro--ticket::after {
  content: ''; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 78%;
  pointer-events: none; mix-blend-mode: screen;
  background:
    repeating-conic-gradient(from -2deg at 0 100%, transparent 0 7deg, rgba(34, 211, 238, .6) 7deg 7.35deg, transparent 7.35deg 15deg),
    repeating-conic-gradient(from 4deg at 100% 100%, transparent 0 8deg, rgba(255, 46, 147, .6) 8deg 8.35deg, transparent 8.35deg 17deg);
  -webkit-mask: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, .45) 45%, transparent 88%);
  mask: linear-gradient(0deg, #000 0%, rgba(0, 0, 0, .45) 45%, transparent 88%);
  animation: nnStrobe 5s ease-in-out infinite;
}
@keyframes nnStrobe { 0%, 100% { opacity: .5; } 40% { opacity: .85; } 46% { opacity: .35; } 52% { opacity: .8; } }
html[data-theme="neon"] .inv-intro--ticket .inv-intro__scene { padding-top: min(19vh, 176px); }
html[data-theme="neon"] .inv-intro--ticket .inv-intro__eyebrow {
  font-family: var(--nn-mono); font-weight: 700; color: var(--nn-cyan); letter-spacing: .28em;
  text-shadow: 0 0 10px rgba(34, 211, 238, .7);
}
html[data-theme="neon"] .tkt {
  --w: min(78vw, 312px);
  --tk: #111119;
  --tk-ink: #F4F5FA;
  filter: drop-shadow(0 0 1.2px #FF7DBA) drop-shadow(0 0 10px rgba(255, 46, 147, .7)) drop-shadow(0 30px 34px rgba(0, 0, 0, .75));
}
html[data-theme="neon"] .tkt__main {
  background:
    radial-gradient(120% 70% at 100% 0%, rgba(123, 44, 245, .55), transparent 60%),
    radial-gradient(90% 60% at 0% 100%, rgba(255, 46, 147, .32), transparent 70%),
    linear-gradient(160deg, #1A1426, #0E0E16);
}
html[data-theme="neon"] .tkt__holo span { font-family: var(--nn-mono); }
html[data-theme="neon"] .tkt__kicker { font-family: var(--nn-mono); color: #E5E7F0; }
html[data-theme="neon"] .tkt__kicker span:last-child { border-color: var(--nn-cyan); color: #BDF4FC; box-shadow: 0 0 10px rgba(34, 211, 238, .5), inset 0 0 8px rgba(34, 211, 238, .3); }
html[data-theme="neon"] .tkt__title {
  font-family: 'Unbounded', var(--font-display); font-weight: 800; font-size: calc(var(--w) * .118); letter-spacing: 0;
  color: #FFE9F4; text-shadow: 0 0 6px rgba(255, 46, 147, .9), 0 0 20px rgba(255, 46, 147, .55);
}
html[data-theme="neon"] .tkt__row { border-color: rgba(229, 231, 240, .16); }
html[data-theme="neon"] .tkt__row span { font-family: var(--nn-mono); font-size: .86rem; font-weight: 700; }
html[data-theme="neon"] .tkt__row small, html[data-theme="neon"] .tkt__guest small { font-family: var(--nn-mono); opacity: .7; }
html[data-theme="neon"] .tkt__guest strong {
  font-family: 'Unbounded', var(--font-display); font-weight: 700; text-transform: uppercase;
  font-size: calc(var(--w) * .072); line-height: 1.2; color: #E9FCFF; text-shadow: 0 0 10px rgba(34, 211, 238, .55);
}
html[data-theme="neon"] .tkt__side { font-family: var(--nn-mono); opacity: .45; }
html[data-theme="neon"] .tkt__stub { background: linear-gradient(160deg, #16161F, #0C0C13); }
html[data-theme="neon"] .tkt__code { font-family: var(--nn-mono); color: var(--nn-cyan); text-shadow: 0 0 8px rgba(34, 211, 238, .6); white-space: nowrap; }
html[data-theme="neon"] .tkt__stub .bc i { width: calc(var(--w, 1) * 1.25px); margin-right: calc(var(--g, 1) * 1.45px); }
html[data-theme="neon"] .tkt__tear { font-family: var(--nn-mono); color: #FFD1E8; opacity: .9; white-space: nowrap; }
/* botón fucsia */
html[data-theme="neon"] .inv-intro--ticket .inv-intro__cta {
  background: var(--nn-pink); color: #0B0B12; font-weight: 700;
  box-shadow: 0 0 0 1px rgba(255, 209, 232, .7), 0 0 28px rgba(255, 46, 147, .75), 0 16px 30px -12px rgba(0, 0, 0, .8);
}
html[data-theme="neon"] .inv-intro--ticket .inv-intro__cta-ring { animation-name: nnCtaRing; }
@keyframes nnCtaRing { 0% { box-shadow: 0 0 0 0 rgba(255, 46, 147, .6); } 80%, 100% { box-shadow: 0 0 0 16px transparent; } }
html[data-theme="neon"] .inv-intro--ticket .inv-intro__cta:focus-visible { outline-color: var(--nn-cyan); }

/* ============================================================
   ESCRITORIO Y MOVIMIENTO REDUCIDO
   ============================================================ */
@media (min-width: 700px) {
  html[data-theme="neon"] .inv-page { box-shadow: 0 0 0 1px rgba(255, 46, 147, .25), 0 0 60px -10px rgba(255, 46, 147, .35), 0 50px 120px -30px rgba(0, 0, 0, .9); }
  /* tubos de neón verticales a los lados de la invitación */
  html[data-theme="neon"] body.inv::before,
  html[data-theme="neon"] body.inv::after {
    content: ''; position: fixed; top: 12vh; bottom: 12vh; width: 3px; border-radius: 3px; pointer-events: none;
  }
  html[data-theme="neon"] body.inv::before { left: calc(50% - 320px); background: #FFD1E8; box-shadow: 0 0 6px var(--nn-pink), 0 0 18px var(--nn-pink), 0 0 40px rgba(255, 46, 147, .6); animation: nnBuzz 6s linear infinite; }
  html[data-theme="neon"] body.inv::after { right: calc(50% - 320px); background: #D6FAFF; box-shadow: 0 0 6px var(--nn-cyan), 0 0 18px var(--nn-cyan), 0 0 40px rgba(34, 211, 238, .6); animation: nnBuzz 8s linear -3s infinite; }
  html[data-theme="neon"] .tkt { --w: 330px; }
  /* la columna del hero mide 30rem: el nombre en una sola línea */
  html[data-theme="neon"] .inv-hero__title { font-size: 3.5rem; }
}
@media (max-height: 700px) {
  html[data-theme="neon"] .inv-intro--ticket .inv-intro__scene { padding-top: 12vh; }
  html[data-theme="neon"] .tkt { --w: min(72vw, 280px); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-theme="neon"] .inv-fx, html[data-theme="neon"] .inv-intro--ticket::after { display: none; }
  html[data-theme="neon"] .inv-hero--photo::before, html[data-theme="neon"] .inv-intro--ticket::before { animation: none; }
}
