/* Jurerê Night Run 2027 · Cosmic Edition — página de venda.
   Um filme cinematográfico percorre a rolagem (quadros WebP num canvas fixo): órbita, visor, Terra, Florianópolis,
   Jurerê e a corrida na areia. Abertura, show e embarque têm laços de vídeo. Texto sempre sobre superfície legível:
   véus escuros nas cenas e painéis de vidro escuro nos blocos.
   Sem JS ou com "reduzir movimento" (html.jx-estatico): página comum, com quadros parados no lugar do filme.
   Identidade: preto-violeta, ciano, violeta e magenta; Barlow Condensed itálica, Anton, Inter, JetBrains Mono. */

/* ---------------------------------------------------------------- fontes */
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/jnr-2027/fonts/barlow-condensed-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 800; font-display: swap; src: url(/assets/jnr-2027/fonts/barlow-condensed-latin-800-italic.woff2) format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-style: italic; font-weight: 900; font-display: swap; src: url(/assets/jnr-2027/fonts/barlow-condensed-latin-900-italic.woff2) format('woff2'); }
@font-face { font-family: 'Anton'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/jnr-2027/fonts/anton-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/assets/jnr-2027/fonts/inter-latin-wght-normal.woff2) format('woff2'); }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/jnr-2027/fonts/jetbrains-mono-latin-500-normal.woff2) format('woff2'); }

/* ---------------------------------------------------------------- tokens */
:root {
  --bg: #05030f;
  --ink: #f8f6ff;            /* títulos */
  --text: #e6e1f7;           /* corpo */
  --muted: #bdb5dc;          /* secundário */
  --faint: #9d95c4;          /* legenda curta, só sobre painel */
  --cyan: #00d8f8;           /* superfície, filete, brilho */
  --cyan-t: #5ce9ff;         /* ciano para texto (mais claro) */
  --violet: #7800f0;
  --magenta: #f000f0;
  --magenta-t: #ff7af3;      /* magenta para texto */
  --lilac: #a690ff;
  --grad: linear-gradient(100deg, #0a80c4 0%, #6a3dff 50%, #c400d6 100%);
  --grad-text: linear-gradient(90deg, #52e8ff 0%, #a893ff 50%, #ff6cf2 100%);
  --glass: linear-gradient(180deg, rgba(28, 17, 64, 0.8), rgba(11, 7, 30, 0.88));
  --glass-strong: linear-gradient(180deg, rgba(24, 14, 56, 0.94), rgba(9, 5, 24, 0.96));
  --stroke: rgba(255, 255, 255, 0.1);
  --stroke-2: rgba(170, 145, 255, 0.3);
  --shadow: 0 34px 90px -30px rgba(0, 0, 0, 0.8);
  --r-lg: 24px;
  --r-md: 16px;
  --r-sm: 12px;
  --f-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --f-mega: 'Anton', Impact, 'Arial Narrow', sans-serif;
  --f-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --gutter: 20px;
  --header: 64px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --vh-l: 1vh;               /* 1% da tela com a barra do navegador recolhida (celular) */
  --bar: 0px;                /* altura que a barra do navegador ocupa quando aparece */
  /* moldura do modal de inscrição (/css/ts-checkout.css) */
  --co-bg1: #160a3a; --co-bg2: #05020f; --co-ink: #f8f6ff; --co-muted: rgba(226, 220, 255, 0.76); --co-accent: #00d8f8;
  --co-line: rgba(157, 123, 255, 0.28); --co-ring: rgba(0, 216, 248, 0.4); --co-overlay: rgba(2, 0, 10, 0.84);
  --co-title: 'Barlow Condensed', 'Arial Narrow', sans-serif; --co-ui: 'Inter', system-ui, sans-serif;
  --co-dot: radial-gradient(circle at 35% 30%, #ffffff, #00d8f8 40%, #7800f0 75%, #f000f0);
}
@supports (height: 100lvh) { :root { --vh-l: 1lvh; --bar: calc(100lvh - 100svh); } }

/* ------------------------------------------------------------------ base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 80px; background: var(--bg); }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }
body.jnr27 { margin: 0; min-height: 100vh; background: transparent; color: var(--text); font: 400 16px/1.6 var(--f-body); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; }
img, svg, canvas, video { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-weight: 800; color: var(--ink); }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
main:focus { outline: none; }
::selection { background: var(--violet); color: #fff; }
.jx-skip { position: fixed; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: #fff; color: #000; font-weight: 700; text-decoration: none; border-radius: 8px; transition: top 0.2s; }
.jx-skip:focus { top: 12px; }
.jx-wrap { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 var(--gutter); }
.jx-ic { display: inline-block; width: 1em; height: 1em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.14em; }

/* ------------------------------------------------------------ tipografia */
.jx-kicker { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 18px; font: 500 12px/1.4 var(--f-mono); letter-spacing: 0.22em; text-transform: uppercase; color: var(--cyan-t); }
.jx-kicker::before { content: ''; width: 26px; height: 1px; background: currentColor; box-shadow: 0 0 10px currentColor; }
.jnr27 h2, .jx-h2 { font: italic 800 clamp(38px, 10vw, 52px)/0.94 var(--f-display); text-transform: uppercase; letter-spacing: -0.004em; text-wrap: balance; }
.jnr27 h3 { font: italic 800 clamp(26px, 7vw, 34px)/1 var(--f-display); text-transform: uppercase; }
.jnr27 h2 em, .jnr27 h3 em, .jx-hero__lede em, .jx-statement em {
  font-style: italic; padding: 0.06em 0.08em 0.1em 0; margin-right: -0.08em;
  background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.jx-lead { font-size: 17px; line-height: 1.65; color: var(--text); max-width: 34em; }
.jx-mega { font-family: var(--f-mega); font-style: normal; font-weight: 400; }

/* ---------------------------------------------------------------- botões */
.jx-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.55em;
  min-height: 54px; padding: 2px 28px 0; border: 0; border-radius: 999px; cursor: pointer; text-decoration: none; white-space: nowrap;
  color: #fff; background: var(--grad); background-size: 140% 100%; background-position: 0 0;
  font: italic 800 19px/1 var(--f-display); letter-spacing: 0.05em; text-transform: uppercase; text-shadow: 0 1px 1px rgba(10, 0, 40, 0.35);
  box-shadow: 0 12px 34px -12px rgba(120, 50, 255, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.32);
  transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease), background-position 0.6s var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.jx-btn:hover { transform: translateY(-2px); background-position: 100% 0; box-shadow: 0 18px 44px -14px rgba(208, 0, 224, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.4); }
.jx-btn:active { transform: translateY(0) scale(0.98); }
.jx-btn .jx-ic { width: 0.9em; height: 0.9em; stroke-width: 2.2; transition: transform 0.35s var(--ease); }
.jx-btn:hover .jx-ic { transform: translateX(3px); }
.jx-btn--ghost { background: rgba(255, 255, 255, 0.06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); text-shadow: none; }
.jx-btn--ghost:hover { background: rgba(255, 255, 255, 0.12); box-shadow: inset 0 0 0 1px rgba(92, 233, 255, 0.6); }
.jx-btn--sm { min-height: 42px; padding: 2px 18px 0; font-size: 19px; }
.jx-btn--xl { min-height: 62px; padding: 2px 36px 0; font-size: 22px; }
.jx-btn--block { width: 100%; }
.jx-link { display: inline-flex; align-items: center; gap: 8px; padding: 6px 0; font: 500 12px/1.3 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, 0.28); transition: color 0.3s, border-color 0.3s; }
.jx-link:hover { color: var(--cyan-t); border-color: var(--cyan-t); }
.jx-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; }
.jx-actions--center { justify-content: center; }

/* ------------------------------------------------- superfícies e peças */
.jx-glass { position: relative; background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--r-lg); box-shadow: var(--shadow); backdrop-filter: blur(22px) saturate(1.35); -webkit-backdrop-filter: blur(22px) saturate(1.35); }
.jx-glass::before { content: ''; position: absolute; left: 24px; right: 24px; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(0, 216, 248, 0.75), rgba(240, 0, 240, 0.6), transparent); pointer-events: none; }
.jx-chip { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px; border-radius: 999px; background: rgba(12, 6, 32, 0.92); border: 1px solid var(--stroke-2); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-size: 14px; color: var(--text); }
.jx-chip b { color: var(--ink); font-weight: 650; }
.jx-chip__dot { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); animation: jx-blink 1.6s ease-in-out infinite; }
@keyframes jx-blink { 50% { opacity: 0.35; } }
.jx-tag { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 5px; border-radius: 999px; font: 500 11px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: #04121a; background: var(--cyan); }
.jx-tag--magenta { background: var(--magenta-t); color: #1a0218; }
.jx-tag--quieto { color: var(--muted); background: rgba(255, 255, 255, 0.08); }
.jx-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.jx-list li { position: relative; padding-left: 24px; color: var(--text); font-size: 15px; line-height: 1.5; }
.jx-list li::before { content: ''; position: absolute; left: 4px; top: 0.52em; width: 7px; height: 7px; transform: rotate(45deg); background: var(--kit, var(--cyan)); box-shadow: 0 0 8px var(--kit, var(--cyan)); }
.jx-list b { color: var(--ink); font-weight: 650; }
.jx-list a { color: var(--cyan-t); }
.jx-facts { margin: 0; display: grid; gap: 14px; }
.jx-facts div { display: grid; gap: 3px; padding-top: 14px; border-top: 1px solid var(--stroke); }
.jx-facts div:first-child { padding-top: 0; border-top: 0; }
.jx-facts dt { font: 500 11px/1.4 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--cyan-t); }
.jx-facts dd { margin: 0; color: var(--ink); font-size: 16px; line-height: 1.45; }
.jx-micro { color: var(--muted); font-size: 13px; }
.jx-micro a { color: var(--ink); text-underline-offset: 3px; }

/* --------------------------------------------- fundo, filme, cabeçalho */
.jx-fundo { position: fixed; inset: 0; z-index: 0; height: 100vh; height: calc(100 * var(--vh-l)); background: var(--bg) url(/assets/jnr-2027/img/fundo.webp) center / cover no-repeat; pointer-events: none; }
.jx-fundo::after { content: ''; position: absolute; inset: 0; background: radial-gradient(120% 80% at 50% 120%, rgba(5, 3, 15, 0.2), rgba(5, 3, 15, 0.75)); }
.jx-filme { position: fixed; left: 0; top: 0; z-index: 1; width: 100%; height: 100vh; height: calc(100 * var(--vh-l)); pointer-events: none; background: var(--bg); will-change: opacity; }
.jx-filme__tela, .jx-filme__laco, .jx-filme__cena { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jx-filme__cena { opacity: 0; transition: opacity 0.35s ease; }
.jx-filme__cena.is-on { opacity: 1; }
.jx-filme__tela { opacity: 0; transition: opacity 0.5s ease; }
.jx-filme.is-tela .jx-filme__tela { opacity: 1; }
.jx-filme__laco { transition: opacity 0.5s ease; }
.jx-filme.is-tela .jx-filme__laco { opacity: 0; }
.jx-filme__veu { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5, 3, 15, 0.62) 0%, rgba(5, 3, 15, 0) 16%, rgba(5, 3, 15, 0) 76%, rgba(5, 3, 15, 0.5) 100%); }
main, .jx-footer { position: relative; z-index: 2; }
.jx-progress { position: fixed; left: 0; right: 0; top: 0; z-index: 60; height: 2px; pointer-events: none; }
.jx-progress i { display: block; height: 100%; background: linear-gradient(90deg, #00d8f8, #7800f0 55%, #f000f0); transform-origin: 0 50%; transform: scaleX(0); box-shadow: 0 0 10px rgba(0, 216, 248, 0.6); }
.jx-header { position: fixed; left: 0; right: 0; top: 0; z-index: 50; height: var(--header); display: flex; align-items: center; gap: 14px; padding: 0 var(--gutter); padding-top: env(safe-area-inset-top); transition: background 0.4s, transform 0.45s var(--ease), border-color 0.4s; border-bottom: 1px solid transparent; }
.jx-header.is-scrolled { background: rgba(6, 3, 18, 0.72); backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4); border-color: var(--stroke); }
.jx-header.is-hidden { transform: translateY(-110%); }
.jx-header__home img { width: 118px; height: auto; }
.jx-header__back { display: none; align-items: center; gap: 6px; color: var(--muted); text-decoration: none; font-size: 13px; }
.jx-header__back:hover { color: #fff; }
.jx-header__nav, .jx-header__count { display: none; }
.jx-header .jx-btn { margin-left: auto; }
.jx-dock { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 45; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 18px; border-radius: 999px; background: rgba(10, 5, 28, 0.88); border: 1px solid var(--stroke-2); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 18px 40px -16px rgba(0, 0, 0, 0.8); transform: translateY(150%); transition: transform 0.5s var(--ease); }
.jx-dock.is-on { transform: none; }
.jx-dock__label { display: grid; font: italic 800 17px/1.05 var(--f-display); text-transform: uppercase; color: var(--ink); }
.jx-dock__label small { font: 500 10px/1.4 var(--f-mono); letter-spacing: 0.14em; color: var(--cyan-t); font-style: normal; }
.ts-co-aberto .jx-dock, .ts-co-aberto .jx-header { visibility: hidden; }

/* ----------------------------------------------- seções grudadas e blocos */
.jx-sec { position: relative; }
.jx-sec--film { height: calc(var(--len, 1) * 100vh); height: calc(var(--len, 1) * 100 * var(--vh-l)); }
.jx-stick { position: sticky; top: 0; height: 100vh; height: calc(100 * var(--vh-l)); overflow: hidden; }
.jx-beat { position: absolute; left: 0; right: 0; z-index: 3; opacity: 0; transform: translate3d(0, 26px, 0); pointer-events: none; visibility: hidden; transition: opacity 0.8s var(--ease), transform 1s var(--ease), visibility 0s linear 0.8s; }
.jx-beat.is-on { opacity: 1; transform: none; pointer-events: auto; visibility: visible; transition: opacity 0.8s var(--ease), transform 1s var(--ease), visibility 0s; }
.jx-beat:focus-within { opacity: 1; transform: none; pointer-events: auto; visibility: visible; }
/* véus: escurecem o filme atrás do texto (entram e saem com o bloco) */
.jx-veu { position: absolute; inset: 0; z-index: 2; transform: none; }
.jx-veu--esq, .jx-veu--dir { background: linear-gradient(180deg, rgba(5, 3, 15, 0.94) 0%, rgba(5, 3, 15, 0.84) 36%, rgba(5, 3, 15, 0.42) 54%, rgba(5, 3, 15, 0) 70%); }
.jx-veu--base { background: linear-gradient(0deg, rgba(5, 3, 15, 0.92) 0%, rgba(5, 3, 15, 0.7) 40%, rgba(5, 3, 15, 0) 70%); }
.jx-beat--top { top: calc(var(--header) + 26px); }
.jx-beat--left, .jx-beat--right { top: calc(var(--header) + 26px); }
.jx-statement { font: italic 800 clamp(40px, 11vw, 60px)/0.92 var(--f-display); text-transform: uppercase; color: var(--ink); text-wrap: balance; max-width: 13ch; }
.jx-beat .jx-lead { margin-top: 16px; text-shadow: 0 1px 14px rgba(5, 3, 15, 0.95); }
.jx-beat--card { left: var(--gutter); right: var(--gutter); bottom: calc(16px + var(--bar) + env(safe-area-inset-bottom)); }
.jx-beat--right.jx-beat--painel { top: auto; bottom: calc(88px + var(--bar) + env(safe-area-inset-bottom)); }

/* HUD do filme */
.jx-hud { position: absolute; inset: 0; z-index: 2; pointer-events: none; font: 500 10px/1.4 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: #cdeffd; transition: opacity 0.6s; }
.jx-hud > span { position: absolute; display: inline-flex; gap: 8px; align-items: center; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.8); }
.jx-hud b { color: #fff; font-weight: 500; }
.jx-hud__tl { left: var(--gutter); top: calc(var(--header) + 10px); }
.jx-hud__tr { right: var(--gutter); top: calc(var(--header) + 10px); }
.jx-hud__bl { left: var(--gutter); bottom: calc(20px + var(--bar)); }
.jx-hud__tl::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); animation: jx-blink 1.6s infinite; }

/* ----------------------------------------------------------- abertura */
.jx-hero { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; justify-content: flex-end; padding: calc(var(--header) + 16px) var(--gutter) calc(24px + var(--bar) + env(safe-area-inset-bottom)); }
.jx-hero__veu { position: absolute; inset: 0; z-index: 2; background: linear-gradient(0deg, rgba(5, 3, 15, 0.95) 0%, rgba(5, 3, 15, 0.8) 38%, rgba(5, 3, 15, 0) 64%); pointer-events: none; }
.jx-hero__col { position: relative; }
.jx-hero__col > * { max-width: 620px; }
.jx-hero__title { margin: 0 0 14px; }
.jx-hero__logo { width: min(64vw, 290px); height: auto; filter: drop-shadow(0 8px 30px rgba(120, 0, 240, 0.55)); }
.jx-hero__lede { font: italic 800 clamp(34px, 9.6vw, 48px)/0.93 var(--f-display); text-transform: uppercase; color: var(--ink); margin: 0 0 14px; text-wrap: balance; }
.jx-hero__facts { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 14px; color: var(--text); }
.jx-hero__facts li { display: inline-flex; align-items: center; gap: 8px; }
.jx-hero__facts .jx-ic { color: var(--cyan-t); width: 16px; height: 16px; }
.jx-hero .jx-actions { margin-bottom: 18px; }
.jx-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.jx-countdown { display: flex; gap: 6px; }
.jx-countdown > span { display: grid; justify-items: center; min-width: 54px; padding: 8px 6px 7px; border-radius: 12px; background: rgba(12, 6, 32, 0.72); border: 1px solid var(--stroke); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.jx-countdown b { font: 400 24px/1 var(--f-mega); color: #fff; font-variant-numeric: tabular-nums; letter-spacing: 0.02em; }
.jx-countdown small { margin-top: 4px; font: 500 9px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.jx-countdown b.tick { animation: jx-tick 0.5s var(--ease); }
@keyframes jx-tick { from { color: var(--cyan-t); text-shadow: 0 0 14px var(--cyan); } }
.jx-scrollcue { display: none; }

/* -------------------------------------------------- destino e percursos */
.jx-plan { padding: 24px 24px 20px; }
.jx-plan .jx-kicker { margin-bottom: 16px; }
.jx-plan .jx-facts { margin-bottom: 18px; }
.jx-odo { position: absolute; left: var(--gutter); top: calc(var(--header) + 10px); z-index: 3; display: flex; align-items: baseline; gap: 8px; color: #fff; transition: opacity 0.6s; }
.jx-odo::before { content: ''; position: absolute; z-index: -1; left: -50px; right: -80px; top: -36px; bottom: -36px; background: radial-gradient(closest-side, rgba(5, 3, 15, 0.92), rgba(5, 3, 15, 0)); }
.jx-odo b { font: 400 46px/1 var(--f-mega); font-variant-numeric: tabular-nums; text-shadow: 0 0 24px rgba(0, 216, 248, 0.55), 0 2px 12px rgba(0, 0, 0, 0.8); }
.jx-odo span { font: 500 13px/1 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; color: #a8f5ff; text-shadow: 0 0 2px #05030f, 0 1px 10px #05030f; }
.jx-card { padding: 22px 22px 20px; }
.jx-card__tag { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font: 500 11px/1.3 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; color: var(--cyan-t); }
.jx-card h3 { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; font-size: 28px; }
.jx-card h3 .jx-mega { font-size: 64px; line-height: 0.82; background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; padding: 0.06em 0.04em 0 0; }
.jx-card > p { color: var(--text); margin-bottom: 14px; font-size: 15px; }
.jx-card .jx-list { margin-bottom: 18px; }

/* ----------------------------------------------------- seções de leitura */
.jx-sec--flow { padding: 92px 0; }
.jx-cab { max-width: 760px; margin-bottom: 40px; }
.jx-cab--centro { margin-inline: auto; text-align: center; }
.jx-cab--centro .jx-kicker { justify-content: center; }
.jx-cab .jx-lead { margin-top: 16px; }
.jx-cab--centro .jx-lead { margin-inline: auto; }
.jx-js [data-reveal] { opacity: 0; transform: translate3d(0, 34px, 0); transition: opacity 1s var(--ease), transform 1.2s var(--ease); transition-delay: calc(var(--i, 0) * 90ms); }
.jx-js [data-reveal].is-in { opacity: 1; transform: none; }

/* Corrida Kids */
.jx-kids { display: grid; overflow: hidden; }
.jx-kids__arte { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--r-lg) var(--r-lg) 0 0; }
.jx-kids__arte img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; transform: scale(1.06); transition: transform 2.2s var(--ease); }
.jx-kids.is-in .jx-kids__arte img { transform: none; }
.jx-kids__arte::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10, 6, 28, 0.92), rgba(10, 6, 28, 0) 42%); }
.jx-kids__corpo { padding: 26px 22px 26px; }
.jx-kids__corpo h2 { margin-bottom: 14px; }
.jx-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 22px 0; }
.jx-tile:first-child { grid-column: 1 / -1; }
.jx-tile { margin: 0; padding: 14px 16px; border-radius: var(--r-md); background: rgba(255, 255, 255, 0.045); border: 1px solid var(--stroke); }
.jx-tile dt { margin-bottom: 4px; font: 500 10px/1.4 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--cyan-t); }
.jx-tile dd { margin: 0; color: var(--ink); font-size: 15px; line-height: 1.4; }
.jx-preco { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-bottom: 18px; }
.jx-preco b { font: 400 46px/1 var(--f-mega); color: #fff; }
.jx-preco span { color: var(--muted); font-size: 14px; }

/* Kits: cada cartão em blocos (janela do planeta, nome, preços, botão, itens, observação) */
.jx-kits { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(var(--gutter) * -1); padding: 6px var(--gutter) 18px; scrollbar-width: none; }
.jx-kits::-webkit-scrollbar { display: none; }
.jx-kit { position: relative; flex: 0 0 86%; scroll-snap-align: center; display: flex; flex-direction: column; gap: 14px; padding: 14px 14px 18px; border-radius: var(--r-lg); background: var(--glass-strong); border: 1px solid var(--stroke); box-shadow: var(--shadow); transition: transform 0.6s var(--ease), border-color 0.4s, box-shadow 0.6s var(--ease); }
.jx-kit::before { content: ''; position: absolute; left: 22px; right: 22px; top: -1px; height: 2px; border-radius: 2px; background: var(--kit); box-shadow: 0 0 18px var(--kit); z-index: 2; }
/* janela de espaço: o planeta inteiro, sem quadrado (o preto da imagem some no preto da janela) */
.jx-kit__janela { position: relative; display: grid; place-items: center; aspect-ratio: 1.12; border-radius: var(--r-md); overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.08); background: #000; }
.jx-kit__janela::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 0 70px -18px var(--kit-glow), inset 0 1px 0 rgba(255, 255, 255, 0.06); }
.jx-kit__janela img { position: relative; width: 92%; height: auto; transition: transform 1.6s var(--ease); }
.jx-kit:hover .jx-kit__janela img { transform: rotate(-6deg) scale(1.05); }
.jx-kit__orbita { position: absolute; left: 12px; bottom: 12px; padding: 7px 11px 6px; border-radius: 999px; background: rgba(5, 3, 15, 0.78); border: 1px solid rgba(255, 255, 255, 0.12); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font: 500 10px/1 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--kit-t, var(--kit)); }
.jx-kit__selo { position: absolute; right: 12px; top: 12px; }
.jx-kit h3 { font-size: 30px; padding: 0 4px; white-space: nowrap; }
.jx-kit__precos { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 8px; }
.jx-kit__preco { display: grid; gap: 5px; align-content: start; padding: 14px 14px 13px; border-radius: var(--r-md); background: rgba(255, 255, 255, 0.045); border: 1px solid var(--stroke); min-width: 0; }
.jx-kit__preco--corrida { background: linear-gradient(160deg, color-mix(in srgb, var(--kit) 16%, rgba(12, 7, 32, 0.9)), rgba(12, 7, 32, 0.9)); border-color: color-mix(in srgb, var(--kit) 45%, transparent); }
.jx-kit__label { font: 500 10px/1.3 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.jx-kit__preco b { font: 400 30px/1 var(--f-mega); color: #fff; white-space: nowrap; }
.jx-kit__preco--corrida b { font-size: 36px; text-shadow: 0 0 28px var(--kit-glow, transparent); }
.jx-kit__next { font-size: 12.5px; line-height: 1.35; color: var(--kit-t, var(--kit)); }
.jx-kit__sub { font-size: 12.5px; color: var(--muted); }
.jx-kit .jx-btn { margin: 0; }
.jx-kit__inclui { display: grid; gap: 8px; align-content: start; }
.jx-kit__titulo { padding: 0 4px; font: 500 10px/1.3 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--kit-t, var(--cyan-t)); }
.jx-kit__itens { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.jx-kit__itens li { position: relative; padding: 11px 12px 11px 34px; border-radius: 12px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.07); font-size: 14.5px; line-height: 1.4; color: var(--text); }
.jx-kit__itens li::before { content: ''; position: absolute; left: 14px; top: 1.05em; width: 7px; height: 7px; transform: rotate(45deg); background: var(--kit); box-shadow: 0 0 8px var(--kit); }
.jx-kit__itens b { color: var(--ink); font-weight: 650; }
.jx-kit__nota { padding: 11px 14px; border-radius: 12px; border: 1px dashed var(--stroke-2); font-size: 13px; line-height: 1.45; color: var(--muted); }
.jx-kit--destaque { border-color: rgba(255, 122, 243, 0.42); box-shadow: 0 0 0 1px rgba(255, 122, 243, 0.18), 0 40px 100px -40px rgba(240, 0, 240, 0.6); }
.jx-kits__pontos { display: flex; justify-content: center; gap: 8px; margin-top: 6px; }
.jx-kits__pontos i { width: 24px; height: 3px; border-radius: 3px; background: rgba(166, 144, 255, 0.3); transition: background 0.4s, box-shadow 0.4s; }
.jx-kits__pontos i.is-on { background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
.jx-lote { margin-top: 18px; }

/* Show */
.jx-sec--show { position: relative; isolation: isolate; overflow: hidden; display: grid; align-items: center; min-height: 100vh; min-height: calc(100 * var(--vh-l)); padding: calc(var(--header) + 40px) 0 72px; }
.jx-bgvideo { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.jx-show__veu { position: absolute; inset: 0; z-index: -1; background: radial-gradient(56% 30% at 50% 42%, rgba(5, 3, 15, 0.6), rgba(5, 3, 15, 0.18) 100%), radial-gradient(75% 55% at 50% 44%, rgba(5, 3, 15, 0.1), rgba(5, 3, 15, 0.62) 78%), linear-gradient(0deg, rgba(5, 3, 15, 0.94) 0%, rgba(5, 3, 15, 0.42) 34%, rgba(5, 3, 15, 0.1) 58%, rgba(5, 3, 15, 0.6) 100%); }
.jx-show { text-align: center; }
.jx-show .jx-kicker { justify-content: center; }
.jx-show__tag { margin-bottom: 12px; }
.jnr27 .jx-show__nome { margin: 0 0 18px; font: 400 clamp(76px, 22vw, 120px)/0.86 var(--f-mega); text-transform: uppercase; letter-spacing: 0.01em; }
.jx-show__nome span { display: inline-block; padding: 0.06em 0.1em 0.1em; transform: skewX(-7deg); background: linear-gradient(100deg, #efeaff 0%, #ffffff 34%, #d4c8ff 47%, #ffffff 58%, #ece6ff 100%); background-size: 260% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 1.5px rgba(5, 3, 15, 0.95)) drop-shadow(0 4px 0 rgba(20, 0, 60, 0.7)) drop-shadow(0 0 34px rgba(120, 0, 240, 0.6)); animation: jx-cromo 7s ease-in-out infinite; }
@keyframes jx-cromo { 0%, 100% { background-position: 100% 0; } 50% { background-position: 0 0; } }
.jx-show__lede { max-width: 36em; margin: 0 auto 30px; font-size: 18px; color: var(--ink); text-shadow: 0 2px 16px rgba(5, 3, 15, 0.9); }
.jx-show__info { list-style: none; margin: 0 auto 30px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 1080px; text-align: left; }
.jx-show__info li { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; align-items: start; padding: 16px; border-radius: var(--r-md); background: rgba(10, 6, 28, 0.84); border: 1px solid var(--stroke); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.jx-show__info .jx-ic { grid-row: span 2; width: 22px; height: 22px; color: var(--cyan-t); margin-top: 2px; }
.jx-show__info small { font: 500 10px/1.4 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--cyan-t); }
.jx-show__info span { color: var(--ink); font-size: 14px; line-height: 1.4; }

/* Trajetória */
.jx-traj { display: grid; gap: 36px; }
.jx-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 26px; }
.jx-stat { padding: 16px 14px; border-radius: var(--r-md); background: rgba(12, 7, 32, 0.84); border: 1px solid var(--stroke); }
.jx-stat b { display: block; font: 400 34px/1 var(--f-mega); color: #fff; }
.jx-stat span { display: block; margin-top: 6px; font-size: 13px; line-height: 1.35; color: var(--muted); }
.jx-bars { margin: 0; padding: 24px 20px 20px; }
.jx-bars__tit { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 22px; }
.jx-bars__tit span { font: 500 11px/1.3 var(--f-mono); letter-spacing: 0.18em; text-transform: uppercase; color: var(--cyan-t); }
.jx-bars__tit b { font: 500 11px/1.3 var(--f-mono); letter-spacing: 0.14em; color: var(--muted); }
.jx-bars ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: end; gap: 10px; height: 280px; border-bottom: 1px solid var(--stroke); background: repeating-linear-gradient(0deg, transparent 0 55px, rgba(255, 255, 255, 0.05) 55px 56px); }
.jx-bars li { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.jx-bars li b { margin-bottom: 8px; font: 400 clamp(15px, 4vw, 24px)/1 var(--f-mega); color: #fff; font-variant-numeric: tabular-nums; }
.jx-bars li i { display: block; width: 100%; max-width: 64px; height: calc(var(--v) * 210px); border-radius: 10px 10px 3px 3px; background: linear-gradient(180deg, var(--c1), var(--c2)); box-shadow: 0 0 26px -6px var(--c1); transform: scaleY(0); transform-origin: 50% 100%; transition: transform 1.3s var(--ease); transition-delay: calc(var(--i) * 110ms); -webkit-mask: repeating-linear-gradient(0deg, #000 0 9px, rgba(0, 0, 0, 0.55) 9px 11px); mask: repeating-linear-gradient(0deg, #000 0 9px, rgba(0, 0, 0, 0.55) 9px 11px); }
.jx-bars.is-in li i { transform: none; }
.jx-bars li.is-voce i { background: rgba(255, 255, 255, 0.03); border: 1.5px dashed rgba(255, 122, 243, 0.7); box-shadow: 0 0 26px -6px var(--magenta); -webkit-mask: none; mask: none; animation: jx-voce 2.4s ease-in-out infinite; }
.jx-bars li.is-voce b { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; padding: 0.08em 0.06em 0; }
@keyframes jx-voce { 50% { box-shadow: 0 0 40px -4px var(--magenta); } }
.jx-bars li > span { margin-top: 10px; font: 500 11px/1 var(--f-mono); letter-spacing: 0.12em; color: var(--muted); }
.jx-bars__fonte { margin-top: 14px; font-size: 12px; color: var(--faint); }

/* Plano de voo */
.jx-plano { display: grid; gap: 36px; }
.jx-agora { margin-top: 26px; padding: 22px 22px 20px; }
.jx-agora__topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.jx-agora__topo b { font: italic 800 26px/1 var(--f-display); text-transform: uppercase; color: var(--ink); }
.jx-precos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.jx-precos li { padding: 12px 12px 11px; border-radius: var(--r-sm); background: rgba(255, 255, 255, 0.05); border: 1px solid var(--stroke); }
.jx-precos span { display: block; margin-bottom: 6px; font: 500 9.5px/1.3 var(--f-mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.jx-precos b { font: 400 22px/1 var(--f-mega); color: #fff; white-space: nowrap; }
.jx-agora__nota { margin: 12px 0 16px; font-size: 13px; color: var(--muted); }
.jx-tl { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.jx-tl::before { content: ''; position: absolute; left: 31px; top: 30px; bottom: 30px; width: 2px; background: linear-gradient(180deg, rgba(0, 216, 248, 0.6), rgba(120, 0, 240, 0.6) 60%, rgba(240, 0, 240, 0.6)); opacity: 0.5; }
.jx-tl > li { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: start; }
.jx-tl__data { position: relative; z-index: 1; display: grid; place-items: center; align-content: center; width: 64px; height: 64px; border-radius: 16px; background: #0d0826; border: 1px solid var(--stroke-2); text-align: center; }
.jx-tl__data small { font: 500 8.5px/1 var(--f-mono); letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.jx-tl__data b { font: 400 26px/1 var(--f-mega); color: #fff; }
.jx-tl__data span { margin-top: 3px; font: 500 8.5px/1 var(--f-mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--cyan-t); }
.jx-tl__card { padding: 16px 18px 16px; border-radius: var(--r-md); background: rgba(12, 7, 32, 0.86); border: 1px solid var(--stroke); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: border-color 0.4s, box-shadow 0.4s; }
.jx-tl__card .jx-tag { margin-bottom: 10px; }
.jx-tl__card h3 { font-size: 23px; margin-bottom: 6px; }
.jx-tl__card p { font-size: 15px; color: var(--text); }
.jx-tl__card .jx-precos { margin-top: 12px; }
.jx-tl__card .jx-precos b { font-size: 19px; }
.jx-tl > li.is-past .jx-tl__card { background: rgba(12, 7, 32, 0.66); }
.jx-tl > li.is-past .jx-tl__card > :not(.jx-tag), .jx-tl > li.is-past .jx-tl__data > * { opacity: 0.7; }
.jx-tl > li.is-now .jx-tl__card { border-color: rgba(0, 216, 248, 0.6); box-shadow: 0 0 0 1px rgba(0, 216, 248, 0.25), 0 20px 60px -24px rgba(0, 216, 248, 0.6); }
.jx-tl > li.is-now .jx-tl__data { border-color: var(--cyan); box-shadow: 0 0 0 5px rgba(0, 216, 248, 0.14), 0 0 22px rgba(0, 216, 248, 0.45); }
.jx-tl > li.is-main .jx-tl__card { border-color: rgba(255, 122, 243, 0.55); box-shadow: 0 20px 60px -24px rgba(240, 0, 240, 0.6); }
.jx-tl > li.is-main .jx-tl__data { border-color: var(--magenta-t); box-shadow: 0 0 22px rgba(240, 0, 240, 0.45); }
.jx-tl > li.is-main h3 { font-size: 30px; }
.jx-js .jx-tl > li { opacity: 0; transform: translate3d(28px, 0, 0); transition: opacity 0.9s var(--ease), transform 1s var(--ease); }
.jx-js .jx-tl > li.is-in { opacity: 1; transform: none; }

/* Dúvidas */
.jx-faq { display: grid; gap: 30px; }
.jx-faq__links { display: grid; gap: 10px; justify-items: start; margin-top: 22px; }
.jx-faq__lista { display: grid; gap: 10px; }
.jx-faq__lista details { border-radius: var(--r-md); background: rgba(12, 7, 32, 0.86); border: 1px solid var(--stroke); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: border-color 0.4s, background 0.4s; }
.jx-faq__lista details[open] { border-color: rgba(0, 216, 248, 0.5); background: rgba(16, 9, 42, 0.94); }
.jx-faq__lista summary { position: relative; display: block; padding: 18px 58px 18px 20px; cursor: pointer; list-style: none; font: italic 800 19px/1.2 var(--f-display); text-transform: uppercase; color: var(--ink); transition: color 0.3s; }
.jx-faq__lista summary::-webkit-details-marker { display: none; }
.jx-faq__lista summary:hover { color: var(--cyan-t); }
.jx-faq__lista summary i { position: absolute; right: 16px; top: 50%; width: 28px; height: 28px; margin-top: -14px; border-radius: 50%; border: 1px solid var(--stroke-2); }
.jx-faq__lista summary i::before, .jx-faq__lista summary i::after { content: ''; position: absolute; left: 8px; top: 13px; width: 10px; height: 1.5px; background: var(--cyan-t); transition: transform 0.4s var(--ease); }
.jx-faq__lista summary i::after { transform: rotate(90deg); }
.jx-faq__lista details[open] summary i::after { transform: rotate(0); }
.jx-faq__lista details > div { padding: 0 20px 20px; }
.jx-faq__lista details p { color: var(--text); font-size: 15.5px; max-width: 680px; }
.jx-faq__lista details a { color: var(--cyan-t); }

/* Embarque: cartão de embarque */
.jx-sec--final { position: relative; isolation: isolate; overflow: hidden; display: grid; align-items: center; min-height: 100vh; min-height: calc(100 * var(--vh-l)); padding: calc(var(--header) + 36px) 0 120px; }
.jx-final__veu { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5, 3, 15, 0.88) 0%, rgba(5, 3, 15, 0.58) 40%, rgba(5, 3, 15, 0.84) 100%); }
.jx-final { display: grid; gap: 28px; }
.jx-final__copy h2 { font-size: clamp(48px, 13vw, 72px); margin-bottom: 14px; }
.jx-pass { --tilt-x: 0deg; --tilt-y: 0deg; --corte: calc(100% - 170px); position: relative; width: 100%; max-width: 560px; border-radius: 26px; background: linear-gradient(155deg, rgba(34, 20, 78, 0.95), rgba(10, 6, 28, 0.97) 60%); border: 1px solid rgba(255, 255, 255, 0.13); box-shadow: 0 50px 120px -36px rgba(120, 0, 240, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.08); overflow: hidden; transform: perspective(1300px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transition: transform 0.6s var(--ease);
  -webkit-mask: radial-gradient(circle 13px at 0 var(--corte), #0000 98%, #000 100%) left / 51% 100% no-repeat, radial-gradient(circle 13px at 100% var(--corte), #0000 98%, #000 100%) right / 51% 100% no-repeat;
  mask: radial-gradient(circle 13px at 0 var(--corte), #0000 98%, #000 100%) left / 51% 100% no-repeat, radial-gradient(circle 13px at 100% var(--corte), #0000 98%, #000 100%) right / 51% 100% no-repeat; }
.jx-pass::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(115deg, transparent 32%, rgba(0, 216, 248, 0.14) 44%, rgba(240, 0, 240, 0.14) 54%, transparent 66%); background-size: 260% 100%; animation: jx-holo 7s ease-in-out infinite; }
@keyframes jx-holo { 0%, 100% { background-position: 100% 0; } 50% { background-position: 0 0; } }
.jx-pass > * { position: relative; z-index: 1; }
.jx-pass__topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: 1px solid var(--stroke); }
.jx-pass__topo img { width: 84px; height: auto; }
.jx-pass__topo span { font: 500 10px/1.3 var(--f-mono); letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); }
.jx-pass__topo b { font: 400 18px/1 var(--f-mega); letter-spacing: 0.06em; color: var(--cyan-t); }
.jx-pass__rota { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 22px 22px 10px; }
.jx-pass__rota div { display: grid; }
.jx-pass__rota div:last-child { text-align: right; }
.jx-pass__rota b { font: 400 50px/1 var(--f-mega); color: #fff; letter-spacing: 0.02em; }
.jx-pass__rota small { margin-top: 4px; font: 500 10px/1.3 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.jx-pass__trilha { position: relative; height: 2px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.35) 0 6px, transparent 6px 11px); }
.jx-pass__trilha i { position: absolute; left: 0; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 14px var(--cyan), 0 0 30px var(--magenta); animation: jx-voo 3.6s var(--ease) infinite; }
@keyframes jx-voo { 0% { left: 0; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { left: calc(100% - 10px); opacity: 0; } }
.jx-pass__campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; margin: 0; padding: 14px 22px 22px; }
.jx-pass__campos div { display: grid; gap: 3px; }
.jx-pass__campos dt { font: 500 9.5px/1.3 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--cyan-t); }
.jx-pass__campos dd { margin: 0; font-size: 15px; line-height: 1.35; color: var(--ink); }
.jx-pass__campos dd small { color: var(--muted); font-size: 12px; }
.jx-pass__corte { height: 0; margin: 0 22px; border-top: 2px dashed rgba(255, 255, 255, 0.2); }
.jx-pass__base { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 86px; padding: 0 22px; }
.jx-pass__contagem { display: grid; }
.jx-pass__contagem small { font: 500 9.5px/1.3 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.jx-pass__contagem b { font: 400 40px/1 var(--f-mega); color: #fff; }
.jx-pass__contagem span { font: 500 10px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--cyan-t); }
.jx-pass__codigo { width: 150px; height: 44px; color: rgba(255, 255, 255, 0.85); }
.jx-pass__acoes { display: grid; gap: 10px; padding: 0 22px 22px; }
.jx-save { min-height: 48px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--stroke-2); background: rgba(255, 255, 255, 0.04); color: var(--ink); cursor: pointer; font: 500 12px/1 var(--f-mono); letter-spacing: 0.14em; text-transform: uppercase; transition: border-color 0.3s, color 0.3s, background 0.3s; }
.jx-save:hover, .jx-save[aria-pressed="true"] { border-color: var(--cyan); color: var(--cyan-t); background: rgba(0, 216, 248, 0.06); }
.jx-final .jx-micro { grid-column: 1 / -1; }

/* rodapé, aviso, som */
.jx-footer { padding: 44px 0 120px; border-top: 1px solid var(--stroke); background: rgba(5, 3, 15, 0.94); }
.jx-footer__main { display: grid; gap: 14px; margin-bottom: 26px; }
.jx-footer__main img { width: 140px; height: auto; }
.jx-footer__main p { color: var(--muted); font-size: 14px; }
.jx-footer__main > a:last-child { color: var(--ink); text-decoration: none; font-size: 14px; display: inline-flex; gap: 6px; align-items: center; }
.jx-footer__races { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 26px; }
.jx-footer__races a, .jx-footer__meta a { color: var(--text); text-decoration: none; font-size: 14px; }
.jx-footer__races a:hover, .jx-footer__meta a:hover { color: var(--cyan-t); }
.jx-footer__meta { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; color: var(--muted); }
.toast { position: fixed; left: 50%; bottom: 96px; z-index: 70; transform: translate(-50%, 20px); opacity: 0; padding: 10px 16px; border-radius: 999px; background: #f8f6ff; color: #05030f; font-size: 14px; pointer-events: none; transition: opacity 0.3s, transform 0.3s; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.jnr27 .race-sound { --sound-color: #00d8f8; z-index: 46; }
.jnr27 .race-sound button { background: rgba(10, 5, 28, 0.9); border-color: rgba(166, 144, 255, 0.4); font-family: var(--f-body); }
.jnr27 .race-sound button:hover { background: #160a3a; }
.jnr27 .race-sound-hint { background: rgba(10, 5, 28, 0.94); }

/* ============================================================== celular */
@media (max-width: 760px) {
  .jnr27 .race-sound { top: calc(var(--header) + 12px + env(safe-area-inset-top)); bottom: auto !important; right: 12px; }
  .jnr27 .race-sound button { min-height: 40px; width: 40px; padding: 0; gap: 0; }
  .jnr27 .race-sound [data-sound-label] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .jnr27 .race-sound-hint { display: none !important; }
  .jx-hud__tr { display: none; }
  .jx-pinned .jx-dock { transform: translateY(150%); }
  /* abertura no celular: o astronauta limpo em cima, o essencial embaixo sobre fundo escuro */
  .jx-hero .jx-kicker, .jx-hero__facts, .jx-countdown { display: none; }
  .jx-hero__logo { width: min(56vw, 230px); }
  .jx-hero__lede { font-size: clamp(32px, 9vw, 42px); }
  .jx-hero .jx-actions { gap: 10px 16px; margin-bottom: 14px; }
  .jx-hero .jx-btn--xl { min-height: 56px; padding: 2px 26px 0; font-size: 20px; }
  .jx-hero .jx-btn--ghost { min-height: 56px; padding: 2px 20px 0; font-size: 18px; }
  .jx-hero__veu { background: linear-gradient(0deg, rgba(5, 3, 15, 0.97) 0%, rgba(5, 3, 15, 0.9) 34%, rgba(5, 3, 15, 0.45) 52%, rgba(5, 3, 15, 0) 64%); }
  /* kits: os dois preços empilhados; "só a arena" numa linha só */
  .jx-kit__precos { grid-template-columns: 1fr; }
  .jx-kit__preco:not(.jx-kit__preco--corrida) { grid-template-columns: 1fr auto; grid-template-areas: 'rotulo valor' 'sub valor'; align-items: center; column-gap: 12px; padding: 12px 14px; }
  .jx-kit__preco:not(.jx-kit__preco--corrida) .jx-kit__label { grid-area: rotulo; }
  .jx-kit__preco:not(.jx-kit__preco--corrida) .jx-kit__sub { grid-area: sub; }
  .jx-kit__preco:not(.jx-kit__preco--corrida) b { grid-area: valor; font-size: 26px; }
  .jx-kit__preco--corrida b { font-size: 40px; }
  /* cartões 5K/8K compactos: o corredor continua aparecendo em cima */
  .jx-card { padding: 18px 18px 16px; }
  .jx-card .jx-list { display: none; }
  .jx-card h3 { margin-bottom: 6px; }
  .jx-card h3 .jx-mega { font-size: 52px; }
  .jx-card > p { margin-bottom: 12px; }
}
@media (max-width: 760px) and (max-height: 700px) {
  .jx-hero__facts, .jx-countdown, .jx-hud { display: none; }
  .jx-card .jx-list { display: none; }
}

/* ============================================================== computador */
@media (min-width: 761px) {
  :root { --gutter: clamp(28px, 5vw, 72px); --header: 78px; }
  body.jnr27 { font-size: 17px; }
  .jx-kicker { font-size: 12.5px; }
  .jnr27 h2, .jx-h2 { font-size: clamp(50px, 5vw, 84px); }
  .jnr27 h3 { font-size: clamp(30px, 2.6vw, 40px); }
  .jx-lead { font-size: 19px; }
  .jx-btn { min-height: 56px; padding: 2px 32px 0; font-size: 20px; }
  .jx-btn--sm { min-height: 44px; padding: 2px 22px 0; font-size: 19px; }
  .jx-btn--xl { min-height: 64px; padding: 2px 42px 0; font-size: 23px; }
  .jx-header__home img { width: 136px; }
  .jx-header__back { display: inline-flex; }
  .jx-header__nav { display: flex; gap: clamp(14px, 2vw, 30px); margin-left: auto; }
  .jx-header__nav a { position: relative; color: var(--muted); text-decoration: none; font: 500 11px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; padding: 8px 0; transition: color 0.3s; }
  .jx-header__nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--cyan); transform: scaleX(0); transition: transform 0.4s var(--ease); }
  .jx-header__nav a:hover, .jx-header__nav a[aria-current] { color: #fff; }
  .jx-header__nav a[aria-current]::after { transform: none; }
  .jx-header__count { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--stroke); font: 500 11px/1 var(--f-mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--cyan-t); white-space: nowrap; }
  .jx-header__count i { width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); animation: jx-blink 1.6s infinite; }
  .jx-header .jx-btn { margin-left: 6px; }
  .jx-dock { display: none; }
  .jnr27 .race-sound { bottom: 24px; }
  .jx-hud { font-size: 11px; }

  /* abertura: texto à esquerda, o astronauta à direita */
  .jx-hero { justify-content: center; padding-bottom: 48px; }
  .jx-hero__veu { background: linear-gradient(90deg, rgba(5, 3, 15, 0.9) 0%, rgba(5, 3, 15, 0.7) 30%, rgba(5, 3, 15, 0) 58%), linear-gradient(0deg, rgba(5, 3, 15, 0.55), rgba(5, 3, 15, 0) 30%); }
  .jx-hero__col > * { max-width: min(620px, 46vw); }
  .jx-hero__logo { width: min(440px, 30vw); }
  .jx-hero__lede { font-size: clamp(46px, 4.4vw, 76px); margin-bottom: 18px; }
  .jx-hero__facts { font-size: 15px; margin-bottom: 26px; }
  .jx-hero .jx-actions { margin-bottom: 22px; }
  .jx-countdown > span { min-width: 62px; }
  .jx-countdown b { font-size: 28px; }
  .jx-scrollcue { position: absolute; left: var(--gutter); bottom: 26px; z-index: 3; display: inline-flex; align-items: center; gap: 12px; font: 500 10px/1 var(--f-mono); letter-spacing: 0.24em; text-transform: uppercase; color: var(--muted); }
  .jx-scrollcue i { width: 1px; height: 34px; background: linear-gradient(var(--cyan), transparent); animation: jx-cue 1.8s ease-in-out infinite; transform-origin: 50% 0; }
  @keyframes jx-cue { 0% { transform: scaleY(0); opacity: 1; } 60% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1); opacity: 0; } }

  /* filme: textos à esquerda ou à direita, com véu lateral */
  .jx-veu--esq { background: linear-gradient(90deg, rgba(5, 3, 15, 0.95) 0%, rgba(5, 3, 15, 0.86) 34%, rgba(5, 3, 15, 0.45) 50%, rgba(5, 3, 15, 0) 66%); }
  .jx-veu--dir { background: linear-gradient(270deg, rgba(5, 3, 15, 0.95) 0%, rgba(5, 3, 15, 0.86) 34%, rgba(5, 3, 15, 0.45) 50%, rgba(5, 3, 15, 0) 66%); }
  .jx-beat--left { top: 50%; translate: 0 -50%; }
  .jx-beat--alto { top: calc(var(--header) + 70px); translate: none; }
  .jx-beat--left > * { max-width: min(46vw, 640px); }
  .jx-beat--right { top: 50%; translate: 0 -50%; display: flex; justify-content: flex-end; }
  .jx-beat--right > * { width: min(470px, 38vw); }
  .jx-beat--right.jx-beat--painel { top: 50%; bottom: auto; }
  .jx-beat--copy { display: block; padding-left: 54vw; }
  .jx-beat--copy > * { width: auto; }
  .jx-statement { font-size: clamp(56px, 5.6vw, 96px); max-width: 12ch; }
  .jx-beat--card { left: auto; right: var(--gutter); bottom: auto; top: 50%; translate: 0 -46%; width: min(440px, 34vw); }
  .jx-card { padding: 28px 28px 26px; }
  .jx-card h3 .jx-mega { font-size: 84px; }
  .jx-card > p { font-size: 16px; }
  .jx-odo { top: calc(var(--header) + 22px); }
  .jx-odo b { font-size: 96px; }
  .jx-odo span { font-size: 14px; }

  /* leitura */
  .jx-sec--flow { padding: 140px 0; }
  .jx-cab { margin-bottom: 56px; }
  .jx-kids { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); }
  .jx-kids__arte { aspect-ratio: auto; height: 100%; min-height: 560px; border-radius: var(--r-lg) 0 0 var(--r-lg); }
  .jx-kids__arte::after { background: linear-gradient(270deg, rgba(10, 6, 28, 0.85), rgba(10, 6, 28, 0) 35%); }
  .jx-kids__corpo { padding: 56px 56px 50px; align-self: center; }
  .jx-kits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(6, auto); column-gap: 20px; overflow: visible; margin: 0; padding: 0; }
  .jx-kit { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 16px; padding: 16px 16px 20px; }
  .jx-kit:hover { transform: translateY(-6px); border-color: rgba(255, 255, 255, 0.2); }
  .jx-kit h3 { font-size: clamp(26px, 2.3vw, 34px); }
  .jx-kit__preco b { font-size: clamp(26px, 2.1vw, 32px); }
  .jx-kit__preco--corrida b { font-size: clamp(30px, 2.6vw, 40px); }
  .jx-kit--destaque:hover { border-color: rgba(255, 122, 243, 0.65); }
  .jx-kits__pontos { display: none; }
  .jnr27 .jx-show__nome { font-size: clamp(120px, 14vw, 230px); }
  .jx-show__lede { font-size: 20px; }
  .jx-show__info { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .jx-show__info li { padding: 20px; }
  .jx-show__info span { font-size: 15px; }
  .jx-traj { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: center; gap: 64px; }
  .jx-bars { padding: 32px 32px 26px; }
  .jx-bars ol { height: 360px; gap: 18px; background: repeating-linear-gradient(0deg, transparent 0 71px, rgba(255, 255, 255, 0.05) 71px 72px); }
  .jx-bars li i { height: calc(var(--v) * 270px); }
  .jx-plano { grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr); gap: 64px; align-items: start; }
  .jx-plano__cab { position: sticky; top: 120px; }
  .jx-tl { gap: 14px; }
  .jx-tl::before { left: 45px; }
  .jx-tl > li { grid-template-columns: 92px minmax(0, 1fr); gap: 18px; }
  .jx-tl__data { width: 92px; height: 92px; border-radius: 20px; }
  .jx-tl__data b { font-size: 36px; }
  .jx-tl__data small, .jx-tl__data span { font-size: 10px; }
  .jx-tl__card { padding: 22px 26px 22px; }
  .jx-tl__card h3 { font-size: 28px; }
  .jx-tl__card p { font-size: 16px; }
  .jx-tl > li.is-main h3 { font-size: 36px; }
  .jx-faq { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; }
  .jx-faq__cab { position: sticky; top: 120px; }
  .jx-faq__lista summary { font-size: 22px; padding: 22px 64px 22px 24px; }
  .jx-faq__lista details > div { padding: 0 24px 24px; }
  .jx-final { grid-template-columns: minmax(0, 1fr) minmax(0, 560px); align-items: center; gap: 56px; }
  .jx-final__veu { background: linear-gradient(90deg, rgba(5, 3, 15, 0.9) 0%, rgba(5, 3, 15, 0.62) 42%, rgba(5, 3, 15, 0.35) 100%), linear-gradient(0deg, rgba(5, 3, 15, 0.8), rgba(5, 3, 15, 0) 40%); }
  .jx-final__copy h2 { font-size: clamp(64px, 6.4vw, 110px); }
  .jx-pass__campos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .jx-pass__acoes { grid-template-columns: 1.4fr 1fr; }
  .jx-footer { padding: 56px 0 50px; }
  .jx-footer__main { grid-template-columns: auto 1fr auto; align-items: center; gap: 30px; }
}
@media (min-width: 761px) and (max-height: 760px) {
  .jx-card .jx-list { display: none; }
  .jx-hero__facts { display: none; }
}

/* ============================== sem filme (sem JS, "reduzir movimento") */
.jx-estatico .jx-filme { display: none; }
.jx-estatico .jx-sec--film { height: auto; }
.jx-estatico .jx-stick { position: relative; height: auto; overflow: visible; padding: 110px 0 70px; display: grid; gap: 22px; background: var(--still) center / cover no-repeat; }
.jx-estatico .jx-stick::before { content: ''; position: absolute; inset: 0; background: rgba(5, 3, 15, 0.72); }
.jx-estatico .jx-stick > * { position: relative; }
.jx-estatico .jx-beat, .jx-estatico .jx-hero { position: relative; inset: auto; top: auto; bottom: auto; left: auto; right: auto; translate: none; opacity: 1; visibility: visible; transform: none; pointer-events: auto; width: auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.jx-estatico .jx-beat > *, .jx-estatico .jx-beat--copy > * { max-width: 640px; width: auto; }
.jx-estatico .jx-beat--right { display: block; }
.jx-estatico .jx-beat--copy { padding-left: var(--gutter); }
.jx-estatico .jx-beat--card { width: auto; max-width: 560px; margin: 0 var(--gutter); }
.jx-estatico .jx-veu, .jx-estatico .jx-hud, .jx-estatico .jx-odo, .jx-estatico .jx-scrollcue, .jx-estatico .jx-hero__veu { display: none; }
.jx-estatico [data-reveal], .jx-estatico .jx-tl > li { opacity: 1; transform: none; }
.jx-estatico .jx-bars li i { transform: none; }
@media (min-width: 761px) { .jx-estatico .jx-beat--card { margin: 0 auto; width: 560px; } .jx-estatico .jx-beat, .jx-estatico .jx-hero { padding-left: max(var(--gutter), calc((100% - 1320px) / 2 + var(--gutter))); } }

@media (prefers-reduced-motion: reduce) {
  .jx-chip__dot, .jx-header__count i, .jx-scrollcue i, .jx-show__nome span, .jx-pass::before, .jx-pass__trilha i, .jx-bars li.is-voce i, .jx-hud__tl::before { animation: none; }
  .jx-beat, [data-reveal], .jx-tl > li, .jx-bars li i { transition: none !important; }
}