/* VecteX — tokens de diseño + estilos del sitio para las clases .vx-* usadas en Elementor.
   Regla de marca: el estudio es neutro (blanco y negro); los colores de cada juego
   solo viven dentro de .vx-cryptobro / .vx-techlocracy. */
:root {
  --surface: #0a0a0a;
  --surface-raised: #141414;
  --surface-overlay: #1f1f1f;
  --line: #262626;
  --line-strong: #6e6e6e;
  --ink: #f5f5f5;
  --ink-muted: #a6a6a6;
  --ink-subtle: #8c8c8c;
  --primary: #f5f5f5;
  --primary-hover: #d4d4d4;
  --on-primary: #0a0a0a;
  --success: #4ade80;
  --danger: #f87171;
  --cryptobro-gold: #f2c12e;
  --cryptobro-gold-light: #fce794;
  --cryptobro-forest: #1a271d;
  --cryptobro-deep: #101a11;
  --crash-red: #f6465d;
  --techlocracy-cyan: #08e0f0;
  --techlocracy-orange: #f89000;
  --techlocracy-navy: #0b2a8f;
  --techlocracy-yellow: #f8c430;
  --shadow-pop: 0 24px 64px #000000b3;
  --shadow-frame: 0 0 0 1px #ffffff14, 0 24px 48px #00000099;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 40px;
  --space-7: 64px;
  --space-8: 120px;
  --radius-none: 0px;
  --radius-sm: 2px;
  --radius-frame: 12px;
  --font-sans: "Saira", "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --font-product: "Saira Condensed", "Arial Narrow", sans-serif;
}

html { scroll-behavior: smooth; scroll-padding-top: 72px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ---------- Base ---------- */
/* Controles nativos (barras de desplazamiento, desplegables) en oscuro */
:root:has(body.vx-site) { color-scheme: dark; }
body.vx-site { margin: 0; background: var(--surface); color: var(--ink); font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
body.vx-site a { color: var(--ink); }
body.vx-site a:hover { color: var(--primary-hover); }
body.vx-site a:focus-visible, body.vx-site button:focus-visible, body.vx-site input:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }

/* Neutraliza los valores por defecto de los contenedores de Elementor (relleno y separación) */
body.vx-site :where(.e-con.vx-c) {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --padding-block-start: 0px; --padding-block-end: 0px; --padding-inline-start: 0px; --padding-inline-end: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px; --min-height: 0px;
  padding: 0; min-height: 0;
}
body.vx-site :where(.vx-c > .elementor-widget) { width: auto; max-width: 100%; min-width: 0; margin: 0; }

/* Los textos heredan la tipografía de su widget, donde se aplican las clases .vx-* */
body.vx-site .vx-c .elementor-heading-title { font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; margin: 0; padding: 0; }
body.vx-site .vx-c .elementor-heading-title a { color: inherit; text-decoration: inherit; }
body.vx-site :where(.vx-c .elementor-widget-heading, .vx-c .elementor-widget-text-editor) { font-family: inherit; font-size: inherit; line-height: inherit; font-weight: inherit; color: inherit; }
body.vx-site .vx-c .elementor-widget-text-editor p { margin: 0; }
body.vx-site .vx-c .elementor-widget-image img { display: block; border-radius: 0; }

/* ---------- Tipografía ---------- */
body.vx-site .vx-mono { font-family: var(--font-mono); font-size: 13px; line-height: 18px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-muted); }
/* En el hero las etiquetas van a 12 px para que la línea superior no se parta */
body.vx-site .vx-hero-text .vx-mono, body.vx-site .vx-hero-panel .vx-mono { font-size: 12px; line-height: 16px; }
body.vx-site .vx-hero-t { font-size: 88px; line-height: 84px; font-weight: 600; letter-spacing: -.035em; }
body.vx-site .vx-sec-t { font-size: 48px; line-height: 52px; font-weight: 600; letter-spacing: -.015em; }
body.vx-site .vx-cta-t { font-size: 56px; line-height: 60px; font-weight: 600; letter-spacing: -.02em; }
body.vx-site .vx-lead { font-size: 19px; line-height: 30px; color: var(--ink-muted); }
body.vx-site .vx-muted { color: var(--ink-muted); }
body.vx-site .e-con.vx-c > .elementor-widget.vx-mw-520 { max-width: 520px; }
body.vx-site .e-con.vx-c > .elementor-widget.vx-mw-680 { max-width: 680px; }

/* ---------- Botones ---------- */
body.vx-site .vx-btn .elementor-button {
  display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 32px;
  font: 600 15px/20px var(--font-sans); letter-spacing: .02em; text-decoration: none; text-transform: none;
  box-sizing: border-box; border-radius: 0; border: 0; box-shadow: none; fill: currentColor;
  transition: background 150ms ease-out, border-color 150ms ease-out;
}
body.vx-site .vx-btn-sm .elementor-button { height: 44px; padding: 0 20px; font-size: 14px; }
body.vx-site .vx-btn-p .elementor-button { background: var(--primary); color: var(--on-primary); }
body.vx-site .vx-btn-p .elementor-button:hover, body.vx-site .vx-btn-p .elementor-button:focus { background: var(--primary-hover); color: var(--on-primary); }
body.vx-site .vx-btn-s .elementor-button { background: transparent; border: 1px solid var(--line-strong); color: var(--ink); }
body.vx-site .vx-btn-s .elementor-button:hover, body.vx-site .vx-btn-s .elementor-button:focus { background: var(--surface-overlay); border-color: var(--ink); color: var(--ink); }
body.vx-site .vx-btn-w .elementor-button { background: transparent; border: 1px solid #ffffff59; color: var(--ink); }
body.vx-site .vx-btn-w .elementor-button:hover, body.vx-site .vx-btn-w .elementor-button:focus { background: #ffffff14; border-color: var(--ink); color: var(--ink); }
body.vx-site .vx-actions { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; }
body.vx-site .vx-actions > .elementor-widget { flex: 0 0 auto; }

/* ---------- Marcas de esquina ---------- */
body.vx-site .vx-ticks-2, body.vx-site .vx-ticks-4 { position: relative; }
body.vx-site .vx-ticks-2::after, body.vx-site .vx-ticks-4::after {
  content: ""; position: absolute; inset: -1px; pointer-events: none; z-index: 2; background-repeat: no-repeat;
  background-image:
    linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink)),
    linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink));
  background-position: left top, left top, right bottom, right bottom;
  background-size: 16px 2px, 2px 16px, 16px 2px, 2px 16px;
}
body.vx-site .vx-ticks-4::after {
  background-image:
    linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink)),
    linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink)),
    linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink)),
    linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink));
  background-position: left top, left top, right top, right top, left bottom, left bottom, right bottom, right bottom;
  background-size: 16px 2px, 2px 16px, 16px 2px, 2px 16px, 16px 2px, 2px 16px, 16px 2px, 2px 16px;
}

/* ---------- Cabecera ---------- */
body.vx-site .vx-sticky { position: sticky; top: 0; z-index: 50; }
body.vx-site .vx-header { display: block; background: #0a0a0acc; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
body.vx-site .vx-header-in { max-width: 1280px; margin: 0 auto; padding: 0 40px; height: 72px; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 40px; box-sizing: border-box; }
body.vx-site .vx-header-in > .elementor-widget { flex: 0 0 auto; }
body.vx-site .vx-logo img { height: 22px; width: auto; max-width: none; }
body.vx-site .vx-logo a { display: flex; }
body.vx-site .vx-header-in > .vx-nav { flex: 1 1 auto; }
body.vx-site .vx-nav .elementor-icon-list-items { display: flex; flex-wrap: wrap; gap: 32px; margin: 0; padding: 0; list-style: none; }
body.vx-site .vx-nav .elementor-icon-list-item { margin: 0 !important; padding: 0; }
body.vx-site .vx-nav .elementor-icon-list-item::after { display: none; }
body.vx-site .vx-nav .elementor-icon-list-item a { color: var(--ink-muted); text-decoration: none; }
body.vx-site .vx-nav .elementor-icon-list-text { padding: 0; color: inherit; font: 600 14px/20px var(--font-sans); letter-spacing: .02em; transition: none; }
body.vx-site .vx-nav .elementor-icon-list-item a:hover { color: var(--ink); }
body.vx-site.vx-game-page .vx-nav .elementor-icon-list-item:nth-child(2) a { color: var(--ink); border-bottom: 1px solid var(--ink); padding-bottom: 4px; }
body.vx-site .vx-header-right { width: auto; margin-left: auto; flex: 0 0 auto; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 16px; }
body.vx-site .vx-header-right > .elementor-widget { flex: 0 0 auto; }
body.vx-site .vx-lang { display: flex; border: 1px solid var(--line-strong); border-radius: 2px; overflow: hidden; font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .08em; }
body.vx-site .vx-lang a { display: flex; align-items: center; justify-content: center; width: 44px; height: 32px; color: var(--ink-muted); text-decoration: none; }
body.vx-site .vx-lang a[aria-current="true"] { background: var(--ink); color: var(--surface); }
body.vx-site .vx-menu-btn { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--line-strong); border-radius: 0; color: var(--ink); cursor: pointer; padding: 0; box-shadow: none; }
body.vx-site .vx-menu-btn:hover, body.vx-site .vx-menu-btn:focus { background: transparent; color: var(--ink); border-color: var(--line-strong); }
body.vx-site .vx-m-nav { display: none; }
body.vx-site .vx-m-nav .elementor-icon-list-items { display: flex; flex-direction: column; margin: 0; padding: 8px 16px 24px; list-style: none; border-top: 1px solid var(--line); }
body.vx-site .vx-m-nav .elementor-icon-list-item { margin: 0; padding: 0; }
body.vx-site .vx-m-nav .elementor-icon-list-item::after { display: none; }
body.vx-site .vx-m-nav .elementor-icon-list-item a { display: block; width: 100%; padding: 14px 0; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
body.vx-site .vx-m-nav .elementor-icon-list-text { padding: 0; color: inherit; font: 600 24px/32px var(--font-sans); }

/* ---------- Índice de anclas (raíl derecho) ---------- */
body.vx-site .vx-anc { position: fixed; right: 24px; top: 50%; transform: translateY(-50%); z-index: 40; width: auto; }
body.vx-site .vx-anc .elementor-icon-list-items { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; counter-reset: vx-anc -1; }
body.vx-site .vx-anc .elementor-icon-list-item { margin: 0; padding: 0; counter-increment: vx-anc; }
body.vx-site .vx-anc .elementor-icon-list-item::after { display: none; }
body.vx-site .vx-anc .elementor-icon-list-item a { display: flex; align-items: center; justify-content: flex-end; gap: 12px; width: 100%; height: 32px; text-decoration: none; color: var(--ink-subtle); font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
body.vx-site .vx-anc .elementor-icon-list-text { padding: 0; color: inherit; font: inherit; letter-spacing: inherit; opacity: 0; transform: translateX(6px); transition: opacity 150ms ease-out, transform 150ms ease-out; }
body.vx-site .vx-anc .elementor-icon-list-item a::after { content: counter(vx-anc, decimal-leading-zero); padding-right: 36px; background: linear-gradient(var(--line-strong), var(--line-strong)) right center / 12px 1px no-repeat; }
body.vx-site .vx-anc .elementor-icon-list-item a:hover { color: var(--ink); }
body.vx-site .vx-anc .elementor-icon-list-item a:hover .elementor-icon-list-text,
body.vx-site .vx-anc .elementor-icon-list-item a[aria-current="true"] .elementor-icon-list-text { opacity: 1; transform: none; }
body.vx-site .vx-anc .elementor-icon-list-item a[aria-current="true"] { color: var(--ink); }
body.vx-site .vx-anc .elementor-icon-list-item a[aria-current="true"]::after { background: linear-gradient(var(--ink), var(--ink)) right center / 24px 2px no-repeat; }

/* ---------- Hero de la home ---------- */
body.vx-site .vx-hero { position: relative; display: block; overflow: hidden; border-bottom: 1px solid var(--line); }
body.vx-site .vx-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image: linear-gradient(#ffffff0a 1px, transparent 1px), linear-gradient(90deg, #ffffff0a 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, #000 35%, transparent 80%);
  mask-image: radial-gradient(ellipse 80% 70% at 70% 40%, #000 35%, transparent 80%);
}
body.vx-site .vx-hero-grid { position: relative; z-index: 1; max-width: 1280px; margin: 0 auto; padding: 112px 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 64px; align-items: stretch; box-sizing: border-box; }
body.vx-site .vx-hero-copy { display: flex; flex-direction: column; justify-content: space-between; gap: 40px; min-width: 0; }
body.vx-site .vx-hero-text { display: flex; flex-direction: column; gap: 28px; }
body.vx-site .vx-hero-panel {
  position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; min-height: 0;
  border: 1px solid var(--line); background-color: #0a0a0acc; background-repeat: no-repeat;
  background-image: linear-gradient(var(--surface-overlay), var(--surface-overlay)), linear-gradient(var(--surface-overlay), var(--surface-overlay));
  background-position: center, center; background-size: 1px calc(100% - 128px), calc(100% - 128px) 1px;
}
body.vx-site .vx-hero-panel > .vx-panel-tl, body.vx-site .vx-hero-panel > .vx-panel-tr,
body.vx-site .vx-hero-panel > .vx-panel-bl, body.vx-site .vx-hero-panel > .vx-panel-br { position: absolute; width: auto; }
body.vx-site .vx-panel-tl { top: 24px; left: 24px; }
body.vx-site .vx-panel-tr { top: 24px; right: 24px; }
body.vx-site .vx-panel-bl { bottom: 24px; left: 24px; }
body.vx-site .vx-panel-br { bottom: 24px; right: 24px; }
body.vx-site .vx-hero-panel > .vx-panel-mark { position: relative; height: 56%; width: auto; flex: 0 0 auto; }
body.vx-site .vx-panel-mark .elementor-widget-container, body.vx-site .vx-panel-mark a { height: 100%; }
body.vx-site .vx-panel-mark img { height: 100%; width: auto; max-width: none; }

/* Logo 3D giratorio del panel (las capas las crea vectex.js; sin JS se ve el logo plano de siempre).
   Cada vuelta arranca y frena despacio para que el logo descanse de frente. */
body.vx-site .vx-panel-mark.has-3d > img { opacity: 0; }
body.vx-site .vx-panel-mark .vx-logo3d { position: absolute; inset: 0; perspective: 900px; }
body.vx-site .vx-panel-mark .vx-logo3d-body { position: absolute; inset: 0; transform-style: preserve-3d; animation: vx-logo-spin 12s cubic-bezier(.65, 0, .35, 1) infinite; }
body.vx-site .vx-panel-mark .vx-logo3d-layer { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; filter: brightness(.42); }
body.vx-site .vx-panel-mark .vx-logo3d-layer.is-face { filter: none; }
@keyframes vx-logo-spin { from { transform: rotateX(-6deg) rotateY(0deg); } to { transform: rotateX(-6deg) rotateY(360deg); } }

/* ---------- Cinta de juegos ---------- */
body.vx-site .vx-ticker { display: flex; align-items: center; height: 48px; overflow: hidden; border-bottom: 1px solid var(--line); font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-subtle); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
body.vx-site .vx-ticker .elementor-widget-container { height: 48px; display: flex; align-items: center; }
body.vx-site .vx-ticker .elementor-icon-list-items { display: flex; flex-wrap: nowrap; width: max-content; margin: 0; padding: 0; list-style: none; }
body.vx-site .vx-ticker.vx-ticker-on .elementor-icon-list-items { animation: vx-mq 36s linear infinite; }
body.vx-site .vx-ticker:hover .elementor-icon-list-items { animation-play-state: paused; }
body.vx-site .vx-ticker .elementor-icon-list-item { display: flex; align-items: center; gap: 10px; margin: 0 !important; padding: 0 40px; border-right: 1px solid var(--line); white-space: nowrap; width: auto; }
body.vx-site .vx-ticker .elementor-icon-list-item::after { display: none; }
body.vx-site .vx-ticker .elementor-icon-list-icon { display: flex; }
body.vx-site .vx-ticker .elementor-icon-list-icon svg, body.vx-site .vx-ticker .elementor-icon-list-icon i { width: 6px; height: 6px; font-size: 6px; fill: var(--ink); color: var(--ink); }
body.vx-site .vx-ticker .elementor-icon-list-text { padding: 0; color: inherit; font: inherit; letter-spacing: inherit; }
body.vx-site .vx-ticker .elementor-icon-list-text b { color: var(--ink); font-weight: inherit; }
@keyframes vx-mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- Secciones ---------- */
body.vx-site .vx-section { display: block; max-width: 1280px; margin: 0 auto; padding: 0 40px 120px; box-sizing: border-box; }
body.vx-site .vx-section.vx-section-top { padding-top: 120px; }
/* Anclas: al saltar a una sección, su contenido empieza justo bajo la cabecera fija, sin dejar a la vista
   nada de la sección anterior (html tiene scroll-padding-top: 72px). La línea superior de la sección queda
   bajo el borde de la cabecera; la sección con relleno superior de 120 px lo compensa, y el bloque de
   contacto, que es una caja, deja 24 px de aire. */
body.vx-site .vx-hero[id] { scroll-margin-top: 200px; }
body.vx-site .vx-section[id] { scroll-margin-top: 0; }
body.vx-site .vx-section.vx-section-top[id] { scroll-margin-top: -120px; }
body.vx-site .vx-section[id]:has(> .vx-cta) { scroll-margin-top: 24px; }
/* Con la barra de administración de WordPress (sesión iniciada), la cabecera y las anclas bajan con ella */
@media (min-width: 601px) {
  body.vx-site.admin-bar .vx-sticky { top: var(--wp-admin--admin-bar--height, 32px); }
  html:has(body.vx-site.admin-bar) { scroll-padding-top: calc(72px + var(--wp-admin--admin-bar--height, 32px)); }
}
body.vx-site .vx-section.vx-section-crumb { padding: 40px 40px 0; }
body.vx-site .vx-section.vx-section-first { padding-top: 24px; }
body.vx-site .vx-sec-head { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; padding-top: 24px; border-top: 1px solid var(--line); }
body.vx-site .vx-sec-head-body { display: block; min-width: 0; }
body.vx-site .vx-sec-head-body > .vx-lead { margin-top: 12px; }
body.vx-site .vx-breadcrumb a { color: var(--ink-subtle); text-decoration: none; }
body.vx-site .vx-breadcrumb strong { color: var(--ink); font-weight: inherit; }

/* Pilares del estudio */
body.vx-site .vx-pcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin-top: 64px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
body.vx-site .vx-pcard { position: relative; padding: 40px 32px 32px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 12px; align-content: start; transition: border-color 150ms ease-out, background 150ms ease-out; }
body.vx-site .vx-pcard:hover { background: var(--surface-raised); }
body.vx-site .vx-pcard::after { content: ""; position: absolute; top: -1px; left: -1px; width: 48px; height: 2px; background: var(--ink); }
body.vx-site .vx-pcard-t { font-size: 28px; line-height: 34px; font-weight: 600; letter-spacing: -.01em; }
/* Dato concreto de cada pilar */
body.vx-site .vx-pcard-fact { align-self: end; margin-top: 12px; padding-top: 16px; border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); }

/* ---------- Ventanas de juego ---------- */
body.vx-site .vx-cryptobro { --g-bg: var(--cryptobro-forest); --g-media: #1d2b21; --g-deep: var(--cryptobro-deep); --g-ink: #f4f1e6; --g-accent: var(--cryptobro-gold); --g-title: var(--cryptobro-gold); --g-kicker: #aab8ad; --g-text: #c9d3c9; --dot-on: var(--cryptobro-gold); --dot-off: #ffffff33; }
body.vx-site .vx-techlocracy { --g-bg: var(--techlocracy-navy); --g-media: #061a5c; --g-deep: #061a5c; --g-ink: #ffffff; --g-accent: var(--techlocracy-yellow); --g-title: #ffffff; --g-kicker: #c8d2f5; --g-text: #dfe5fb; --dot-on: var(--techlocracy-yellow); --dot-off: #ffffff40; }
body.vx-site .vx-frame { border-radius: var(--radius-frame); background: var(--g-bg); box-shadow: var(--shadow-frame); color: var(--g-ink); }
body.vx-site .vx-frame-clip { overflow: hidden; }

/* Altura contenida (cabecera de sección + tarjetas ≈ 760 px) para que, al saltar al ancla de juegos,
   las dos tarjetas quepan enteras con sus botones en una pantalla de 1080p. */
body.vx-site .vx-wins { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); column-gap: 24px; row-gap: 24px; margin-top: 48px; }
body.vx-site .vx-win { display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 0; overflow: hidden; transition: transform 150ms ease-out; }
body.vx-site .vx-win:hover { transform: translateY(-4px); }
body.vx-site .vx-win-media { position: relative; aspect-ratio: 11 / 5; background: var(--g-media); display: flex; align-items: center; justify-content: center; overflow: hidden; }
body.vx-site .vx-win-media > .elementor-widget { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
body.vx-site .vx-win-media .elementor-widget-container, body.vx-site .vx-win-media a { height: 100%; display: flex; align-items: center; justify-content: center; }
body.vx-site .vx-win-media img { height: 82%; width: auto; max-width: 90%; object-fit: contain; }
body.vx-site .vx-techlocracy .vx-win-media img { height: 64%; }
body.vx-site .vx-win > .vx-tags { padding: 28px 28px 0; }
body.vx-site .vx-win > .vx-prod-card-t { padding: 16px 28px 0; }
body.vx-site .vx-win > .vx-kicker { padding: 8px 28px 0; }
body.vx-site .vx-win > .vx-win-desc { padding: 12px 28px 0; color: var(--g-text); }
body.vx-site .vx-win > .vx-actions { padding: 24px 28px 28px; align-self: end; }

/* Insignia oficial de Google Play */
body.vx-site .vx-actions { align-items: center; }
body.vx-site .vx-play-badge a { display: block; transition: opacity 150ms ease-out; }
body.vx-site .vx-play-badge a:hover { opacity: .85; }
body.vx-site .vx-play-badge img { height: 52px; width: auto; max-width: none; }
body.vx-site .vx-win .vx-play-badge img { height: 44px; }

/* Juegos en desarrollo (sin página propia): fila neutra bajo las ventanas de juego */
body.vx-site .vx-upcoming { display: flex; flex-direction: column; gap: 16px; margin-top: 48px; }
body.vx-site .vx-upcoming-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
body.vx-site .vx-upcoming-cell { padding: 20px 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 8px; box-sizing: border-box; transition: background 150ms ease-out; }
body.vx-site .vx-upcoming-cell:hover { background: var(--surface-raised); }
body.vx-site .vx-upcoming-status { font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
body.vx-site .vx-upcoming-status .elementor-heading-title { display: inline-flex; align-items: center; gap: 8px; }
body.vx-site .vx-upcoming-status .elementor-heading-title::before { content: ""; width: 6px; height: 6px; border-radius: 50%; border: 1px solid var(--ink); box-sizing: border-box; }
body.vx-site .vx-upcoming-t { font-size: 20px; line-height: 26px; font-weight: 600; letter-spacing: -.01em; }

body.vx-site .vx-tags { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--g-accent); }
body.vx-site .vx-tags > .elementor-widget { flex: 0 0 auto; }
body.vx-site .vx-tag .elementor-heading-title { display: inline-flex; align-items: center; gap: 8px; height: 24px; padding: 0 8px; border: 1px solid color-mix(in srgb, var(--g-accent) 40%, transparent); border-radius: 2px; box-sizing: border-box; }
body.vx-site .vx-tag-live .elementor-heading-title::before, body.vx-site .vx-tag-dev .elementor-heading-title::before { content: ""; width: 6px; height: 6px; border-radius: 50%; box-sizing: border-box; }
body.vx-site .vx-tag-live .elementor-heading-title::before { background: var(--g-accent); }
body.vx-site .vx-tag-dev .elementor-heading-title::before { border: 1px solid var(--g-accent); }
body.vx-site .vx-prod-card-t, body.vx-site .vx-prod-h2 { font-family: var(--font-product); font-size: 48px; line-height: 46px; font-weight: 800; }
body.vx-site .vx-prod-card-t { color: var(--g-title); }
body.vx-site .vx-kicker { font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--g-kicker); }
body.vx-site .vx-kicker-accent { color: var(--g-accent); font-size: 12px; }
body.vx-site .vx-kicker-lg { font-size: 12px; }

/* Hero de la página de juego */
body.vx-site .vx-hero2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.vx-site .vx-hero2-media { aspect-ratio: 1 / 1; overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--g-media); }
body.vx-site .vx-cryptobro .vx-hero2-media > .elementor-widget, body.vx-site .vx-cryptobro .vx-hero2-media .elementor-widget-container { width: 100%; height: 100%; }
body.vx-site .vx-cryptobro .vx-hero2-media img { width: 100%; height: 100%; object-fit: cover; }
body.vx-site .vx-techlocracy .vx-hero2-media > .elementor-widget { width: 64%; }
body.vx-site .vx-techlocracy .vx-hero2-media img { width: 100%; height: auto; }
body.vx-site .vx-hero2-body { padding: 56px; display: flex; flex-direction: column; justify-content: center; gap: 16px; min-width: 0; box-sizing: border-box; }
body.vx-site .vx-prod-t { font-family: var(--font-product); font-size: 88px; line-height: 82px; font-weight: 800; color: var(--g-title); }
body.vx-site .vx-techlocracy .vx-prod-t { font-size: 76px; line-height: 76px; }
body.vx-site .vx-hero2-body > .vx-prod-lead { margin-top: 8px; max-width: 520px; font-size: 19px; line-height: 30px; color: var(--g-text); }
body.vx-site .vx-hero2-body > .vx-actions, body.vx-site .vx-hero2-body > .vx-notify { margin-top: 16px; }

/* Cifras */
body.vx-site .vx-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border-top: 1px solid #ffffff14; }
body.vx-site .vx-stat { padding: 32px; border-right: 1px solid #ffffff14; display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 8px; align-content: start; }
body.vx-site .vx-stat:last-child { border-right: 0; }
body.vx-site .vx-stat-n { font-family: var(--font-mono); font-size: 32px; line-height: 36px; font-weight: 600; color: var(--g-accent); }
body.vx-site .vx-stat-n.vx-c-red { color: var(--crash-red); }
body.vx-site .vx-stat-n.vx-c-gold-light { color: var(--cryptobro-gold-light); }
body.vx-site .vx-stat-t { font-family: var(--font-product); font-size: 26px; line-height: 28px; font-weight: 800; }
body.vx-site .vx-stat-d { color: var(--g-text); }

/* Carruseles */
body.vx-site .vx-carousel { padding: 40px; display: flex; flex-direction: column; gap: 28px; }
body.vx-site .vx-carousel-head { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; }
body.vx-site .vx-carousel-titles { width: auto; display: flex; flex-direction: column; gap: 8px; }
body.vx-site .vx-sl-nav { width: auto; display: flex; flex-direction: row; gap: 8px; }
body.vx-site .vx-sl-btn { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: transparent; border: 1px solid #ffffff59; border-radius: 0; color: var(--ink); cursor: pointer; padding: 0; box-shadow: none; transition: background 150ms ease-out; }
body.vx-site .vx-sl-btn:hover, body.vx-site .vx-sl-btn:focus { background: #ffffff14; color: var(--ink); border-color: #ffffff59; }
body.vx-site .vx-sl-btn[disabled] { opacity: .35; cursor: default; background: transparent; }
body.vx-site .vx-sl-view { display: block; overflow: hidden; }
body.vx-site .vx-sl-track { display: flex; flex-direction: row; flex-wrap: nowrap; gap: 16px; transition: transform 300ms ease-out; transform: translateX(0); }
body.vx-site .vx-sl-track > .vx-sl-slide { flex: 0 0 calc((100% - 48px) / 4); width: auto; min-width: 0; margin: 0; }
body.vx-site .vx-sl-slide figure { margin: 0; display: flex; flex-direction: column; gap: 12px; }
body.vx-site .vx-sl-slide img { width: 100%; height: auto; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 12px; border: 1px solid #ffffff1a; background: var(--g-deep); }
body.vx-site .vx-sl-slide figcaption { margin: 0; padding: 0; text-align: left; font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; font-style: normal; letter-spacing: .08em; text-transform: uppercase; color: var(--g-kicker); }
body.vx-site .vx-dots { display: flex; flex-direction: row; justify-content: center; gap: 8px; min-height: 24px; }
body.vx-site .vx-dots button { width: 44px; height: 24px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: pointer; display: flex; align-items: center; justify-content: center; }
body.vx-site .vx-dots button:hover, body.vx-site .vx-dots button:focus { background: transparent; }
body.vx-site .vx-dots .vx-dot { display: block; width: 28px; height: 4px; background: var(--dot-off, #ffffff33); }
body.vx-site .vx-dots button[aria-current="true"] .vx-dot { background: var(--dot-on, #f5f5f5); }

/* Avance desenfocado (Techlocracy) */
body.vx-site .vx-stage { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 12px; background: var(--g-deep); border: 1px solid #ffffff1a; }
body.vx-site .vx-stage > .vx-slide { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; opacity: 0; visibility: hidden; }
body.vx-site .vx-stage > .vx-slide.is-active, body.vx-site .vx-stage:not(.vx-ready) > .vx-slide:first-child { opacity: 1; visibility: visible; }
body.vx-site .vx-stage > .vx-slide .elementor-widget-container { width: 100%; height: 100%; }
body.vx-site .vx-stage > .vx-slide img { width: 100%; height: 100%; object-fit: contain; }
body.vx-site .vx-stage-overlay { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background: #061a5c66; text-align: center; padding: 24px; box-sizing: border-box; }
body.vx-site .vx-stage-overlay svg { display: block; }
body.vx-site .vx-stage-kicker { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--g-accent); }
body.vx-site .vx-stage-t { font-family: var(--font-product); font-size: 40px; line-height: 40px; font-weight: 800; }

/* Formulario "Avísame cuando salga" */
body.vx-site .e-con.vx-c > .elementor-widget.vx-notify { max-width: 520px; }
body.vx-site .vx-notify form, body.vx-site .vx-notify .vx-notify-form { display: flex; flex-direction: column; gap: 8px; margin: 0; }
body.vx-site .vx-notify label { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--g-kicker); margin: 0; }
body.vx-site .vx-notify .vx-notify-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
body.vx-site .vx-notify .wpcf7-form-control-wrap { flex: 1 1 220px; display: block; }
body.vx-site .vx-notify input[type="email"] { width: 100%; flex: 1 1 220px; height: 52px; padding: 0 16px; background: var(--g-deep); border: 1px solid #ffffff59; color: #ffffff; font: 400 16px/24px var(--font-sans); box-sizing: border-box; border-radius: 0; box-shadow: none; }
body.vx-site .vx-notify input[type="email"]:hover, body.vx-site .vx-notify input[type="email"]:focus, body.vx-site .vx-notify input[type="email"]:active { background: var(--g-deep); border: 1px solid #ffffff; color: #ffffff; box-shadow: none; }
/* El autocompletado del navegador no debe cambiar el fondo ni apagar el texto */
body.vx-site .vx-notify input[type="email"]:-webkit-autofill, body.vx-site .vx-notify input[type="email"]:-webkit-autofill:hover, body.vx-site .vx-notify input[type="email"]:-webkit-autofill:focus { -webkit-text-fill-color: #ffffff; caret-color: #ffffff; box-shadow: 0 0 0 1000px var(--g-deep) inset; transition: background-color 9999s ease-out; }
body.vx-site .vx-notify input[type="email"] { -webkit-text-fill-color: #ffffff; caret-color: #ffffff; opacity: 1; }
body.vx-site .vx-notify input::placeholder { color: #a6b4e8; -webkit-text-fill-color: #a6b4e8; opacity: 1; }
body.vx-site .vx-notify input[type="submit"], body.vx-site .vx-notify button { display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 32px; background: var(--primary); color: var(--on-primary); font: 600 15px/20px var(--font-sans); letter-spacing: .02em; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; transition: background 150ms ease-out; }
body.vx-site .vx-notify input[type="submit"]:hover, body.vx-site .vx-notify button:hover { background: var(--primary-hover); color: var(--on-primary); }
body.vx-site .vx-notify .vx-notify-note, body.vx-site .vx-notify p { margin: 0; font-size: 13px; line-height: 20px; color: var(--g-kicker); }
body.vx-site .vx-notify .vx-notify-row .wpcf7-spinner { display: none; }
body.vx-site .vx-notify .wpcf7-response-output { margin: 8px 0 0; padding: 8px 12px; border: 1px solid #ffffff59; font-size: 13px; line-height: 20px; color: #ffffff; }
body.vx-site .vx-notify .wpcf7-not-valid-tip { font-size: 13px; line-height: 20px; color: var(--techlocracy-yellow); }

/* Páginas legales de cada juego */
body.vx-site .vx-sec-head-body > .vx-legal-meta { margin-top: 12px; }
body.vx-site .e-con.vx-c > .elementor-widget.vx-prose { max-width: 760px; margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--line); color: var(--ink-muted); }
body.vx-site .vx-c .vx-prose p { margin: 0 0 20px; }
body.vx-site .vx-c .vx-prose p:last-child { margin-bottom: 0; }
body.vx-site .vx-prose strong { color: var(--ink); font-weight: 600; }
body.vx-site .vx-prose a { text-decoration: underline; }

/* Documentos legales de un juego: los lista [vectex_legal_links] */
body.vx-site .vx-legal-nav { margin-top: 48px; }
body.vx-site .vx-legal-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
body.vx-site .vx-legal-grid li { margin: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
body.vx-site .vx-legal-grid a { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 20px 24px; box-sizing: border-box; color: var(--ink); text-decoration: none; transition: background 150ms ease-out; }
body.vx-site .vx-legal-grid a:hover, body.vx-site .vx-legal-grid a[aria-current="page"] { background: var(--surface-raised); }
body.vx-site .vx-legal-grid .vx-legal-name { text-decoration: underline; text-underline-offset: 4px; }
body.vx-site .vx-legal-grid a[aria-current="page"] .vx-legal-name { text-decoration: none; }

/* Ventana de contacto */
body.vx-site .vx-dialog { width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; background: var(--surface-raised); color: var(--ink); border: 1px solid var(--line-strong); border-radius: 0; box-shadow: var(--shadow-pop); overflow: auto; }
body.vx-site .vx-dialog::backdrop { background: #000000b3; }
body.vx-site .vx-dialog-in { padding: 32px; display: flex; flex-direction: column; gap: 24px; }
body.vx-site .vx-dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
body.vx-site .vx-dialog-head .vx-mono { margin: 0 0 8px; }
body.vx-site .vx-dialog-head h2 { margin: 0; font: 600 34px/40px var(--font-sans); letter-spacing: -.015em; color: var(--ink); }
body.vx-site .vx-dialog-close { flex: 0 0 auto; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; padding: 0; background: transparent; border: 1px solid var(--line-strong); border-radius: 0; color: var(--ink); cursor: pointer; box-shadow: none; }
body.vx-site .vx-dialog-close:hover, body.vx-site .vx-dialog-close:focus { background: var(--surface-overlay); border-color: var(--ink); color: var(--ink); }
body.vx-site .vx-form, body.vx-site .vx-dialog form { display: flex; flex-direction: column; gap: 16px; margin: 0; }
body.vx-site .vx-form-field { display: flex; flex-direction: column; gap: 6px; }
body.vx-site .vx-dialog label { font-family: var(--font-mono); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-subtle); margin: 0; }
body.vx-site .vx-dialog .wpcf7-form-control-wrap { display: block; }
body.vx-site .vx-dialog input[type="text"], body.vx-site .vx-dialog input[type="email"], body.vx-site .vx-dialog select, body.vx-site .vx-dialog textarea {
  width: 100%; height: 48px; padding: 0 14px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 0; box-shadow: none; box-sizing: border-box;
  color: var(--ink); -webkit-text-fill-color: var(--ink); caret-color: var(--ink); font: 400 16px/24px var(--font-sans); opacity: 1;
}
body.vx-site .vx-dialog textarea { height: 140px; padding: 12px 14px; resize: vertical; }
body.vx-site .vx-dialog select { appearance: auto; }
body.vx-site .vx-dialog select option { background: var(--surface); color: var(--ink); }
body.vx-site .vx-dialog input:focus, body.vx-site .vx-dialog select:focus, body.vx-site .vx-dialog textarea:focus { background: var(--surface); border-color: var(--ink); color: var(--ink); box-shadow: none; }
body.vx-site .vx-dialog input:-webkit-autofill, body.vx-site .vx-dialog input:-webkit-autofill:focus { -webkit-text-fill-color: var(--ink); box-shadow: 0 0 0 1000px var(--surface) inset; transition: background-color 9999s ease-out; }
body.vx-site .vx-dialog input[type="submit"] { align-self: flex-start; display: inline-flex; align-items: center; justify-content: center; height: 52px; padding: 0 32px; background: var(--primary); color: var(--on-primary); -webkit-text-fill-color: var(--on-primary); font: 600 15px/20px var(--font-sans); letter-spacing: .02em; border: 0; border-radius: 0; box-shadow: none; cursor: pointer; transition: background 150ms ease-out; }
body.vx-site .vx-dialog input[type="submit"]:hover { background: var(--primary-hover); color: var(--on-primary); }
body.vx-site .vx-dialog .vx-form-note { margin: 0; font-size: 13px; line-height: 20px; color: var(--ink-muted); }
body.vx-site .vx-dialog .vx-form-note a { text-decoration: underline; }
body.vx-site .vx-dialog .wpcf7-spinner { display: none; }
body.vx-site .vx-dialog .wpcf7-response-output { margin: 0; padding: 10px 14px; border: 1px solid var(--line-strong); font-size: 14px; line-height: 20px; color: var(--ink); }
body.vx-site .vx-dialog .wpcf7-not-valid-tip { margin-top: 4px; font-size: 13px; line-height: 20px; color: var(--danger); }
body.vx-site .vx-dialog form.sent .vx-form-field, body.vx-site .vx-dialog form.sent input[type="submit"], body.vx-site .vx-dialog form.sent .vx-form-note { display: none; }

/* Ficha del juego */
body.vx-site .vx-dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 48px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
body.vx-site .vx-dl.vx-dl-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.vx-site .vx-dl-cell { padding: 20px 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; box-sizing: border-box; }

/* ---------- Bloque de contacto ---------- */
body.vx-site .vx-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 32px; padding: 48px; background: var(--surface-raised); border: 1px solid var(--line); box-sizing: border-box; }
body.vx-site .vx-cta-body { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
body.vx-site .vx-cta > .vx-actions { width: auto; }
body.vx-site .vx-cta-mail { font-size: 22px; line-height: 32px; }
body.vx-site .vx-cta-mail a { text-decoration: underline; text-underline-offset: 6px; }
body.vx-site .vx-cta-mails { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 24px; margin-top: 8px; }
body.vx-site .vx-cta-mails-cell { display: flex; flex-direction: column; gap: 4px; }
body.vx-site .vx-mail-sm { font-size: 15px; }
body.vx-site .vx-mail-sm a, body.vx-site .vx-dl-cell a { text-decoration: underline; }

/* ---------- Pie ---------- */
body.vx-site .vx-footer { display: block; border-top: 1px solid var(--line); }
body.vx-site .vx-footer-in { max-width: 1280px; margin: 0 auto; padding: 64px 40px 32px; display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; box-sizing: border-box; }
body.vx-site .vx-footer-mark img { height: 112px; width: auto; max-width: none; }
body.vx-site .vx-footer-mark, body.vx-site .vx-footer-mark .elementor-widget-container { text-align: left; }
body.vx-site .vx-footer-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; font-size: 14px; line-height: 20px; }
body.vx-site .vx-footer-col { display: flex; flex-direction: column; gap: 12px; }
body.vx-site .vx-footer-col > .vx-mono { margin-bottom: 4px; }
body.vx-site .vx-footer-links .elementor-icon-list-items { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
body.vx-site .vx-footer-links .elementor-icon-list-item { margin: 0; padding: 0; }
body.vx-site .vx-footer-links .elementor-icon-list-item::after { display: none; }
body.vx-site .vx-footer-links .elementor-icon-list-item a { color: var(--ink-muted); text-decoration: none; }
body.vx-site .vx-footer-links .elementor-icon-list-text { padding: 0; color: inherit; font: 400 14px/20px var(--font-sans); transition: none; }
body.vx-site .vx-footer-links .elementor-icon-list-item a:hover { color: var(--ink); text-decoration: underline; }
body.vx-site .vx-footer-bar { grid-column: 1 / -1; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
body.vx-site .vx-footer-bar > .elementor-widget { flex: 0 0 auto; }
body.vx-site .vx-social .elementor-social-icons-wrapper { display: flex; gap: 8px; font-size: 0; }
body.vx-site .vx-social .elementor-grid-item { margin: 0; }
body.vx-site .vx-social .elementor-social-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; font-size: 20px; background: transparent; border: 1px solid var(--line); border-radius: 0; color: var(--ink); transition: border-color 150ms ease-out, background 150ms ease-out; }
body.vx-site .vx-social .elementor-social-icon:hover { border-color: var(--ink); background: var(--surface-raised); opacity: 1; }
body.vx-site .vx-social .elementor-social-icon svg { width: 20px; height: 20px; fill: var(--ink); }
body.vx-site .vx-social .elementor-social-icon i { font-size: 20px; color: var(--ink); }

/* El botón azul "volver arriba" del tema Astra no pertenece a la marca */
body.vx-site #ast-scroll-top { display: none !important; }
/* Elementos que solo se muestran en escritorio o solo en móvil (el corte está en "Adaptación") */
body.vx-site .vx-only-mobile { display: none; }

/* Barra de descarga de la página de juego: solo existe en móvil (ver "Adaptación") */
body.vx-site .vx-mobile-cta { display: none; }
body.vx-site .vx-mobile-cta-t { font-family: var(--font-product); font-size: 22px; line-height: 24px; font-weight: 800; text-transform: uppercase; color: var(--g-title); }

/* ---------- Página 404 (templates/404.php) ---------- */
body.vx-site .vx-404-main { max-width: 1280px; margin: 0 auto; padding: 120px 40px; min-height: 55vh; display: flex; flex-direction: column; justify-content: center; gap: 28px; box-sizing: border-box; }
body.vx-site .vx-404-main > * { margin: 0; }
body.vx-site .vx-404-main .vx-hero-t { color: var(--ink); font-family: var(--font-sans); text-transform: none; }
body.vx-site .vx-404-main .vx-lead { max-width: 520px; }

/* ---------- Animación ----------
   Discreta y corta: entrada suave de los bloques al aparecer en pantalla (la clase .vx-reveal la pone
   vectex.js), microinteracciones al pasar el cursor y transiciones en carruseles y ventana de contacto.
   Con "reducir movimiento" activado en el sistema se mantienen los fundidos pero sin desplazamientos. */
body.vx-site .vx-reveal { opacity: 0; transform: translateY(18px); transition: opacity 600ms cubic-bezier(.2, .7, .2, 1) var(--vx-delay, 0ms), transform 600ms cubic-bezier(.2, .7, .2, 1) var(--vx-delay, 0ms) !important; }
body.vx-site .vx-reveal.is-in { opacity: 1; transform: none; }
body.vx-site .vx-btn .elementor-button { transition: background 150ms ease-out, border-color 150ms ease-out, transform 150ms ease-out; }
body.vx-site .vx-btn .elementor-button:active { transform: translateY(1px); }
body.vx-site .vx-win-media img { transition: transform 500ms cubic-bezier(.2, .7, .2, 1); }
body.vx-site .vx-win:hover .vx-win-media img { transform: scale(1.04); }
body.vx-site .vx-win { transition: transform 250ms cubic-bezier(.2, .7, .2, 1), box-shadow 250ms ease-out; }
body.vx-site .vx-win:hover { box-shadow: 0 0 0 1px #ffffff24, 0 32px 56px #000000b3; }
body.vx-site .vx-stage > .vx-slide { transition: opacity 350ms ease-out, visibility 0s linear 350ms; }
body.vx-site .vx-stage > .vx-slide.is-active { transition: opacity 350ms ease-out; }
body.vx-site .vx-dots .vx-dot { transition: background 200ms ease-out; }
body.vx-site .vx-social .elementor-social-icon, body.vx-site .vx-footer-links a, body.vx-site .vx-nav a, body.vx-site .vx-lang a { transition: color 150ms ease-out, background 150ms ease-out, border-color 150ms ease-out; }
body.vx-site .vx-dialog[open] { animation: vx-pop 220ms cubic-bezier(.2, .7, .2, 1); }
body.vx-site .vx-dialog[open]::backdrop { animation: vx-fade 220ms ease-out; }
@keyframes vx-pop { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes vx-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  body.vx-site .vx-reveal { transform: none; transition: opacity 400ms ease-out var(--vx-delay, 0ms) !important; }
  body.vx-site .vx-win:hover, body.vx-site .vx-win:hover .vx-win-media img, body.vx-site .vx-btn .elementor-button:active { transform: none; }
  body.vx-site .vx-dialog[open] { animation: vx-fade 200ms ease-out; }
}

/* Hero a pantalla completa en escritorio: cabecera (73) + hero + cinta de juegos (49) ocupan justo el alto
   de la ventana, así el ancla de inicio muestra el bloque entero con la cinta en el borde inferior.
   El contenido queda centrado en vertical; el relleno mínimo evita que se pegue en pantallas bajas. */
@media (min-width: 901px) {
  body.vx-site .vx-hero-grid { min-height: calc(100vh - 123px); padding-top: 40px; padding-bottom: 40px; align-content: center; }
  body.vx-site.admin-bar .vx-hero-grid { min-height: calc(100vh - 123px - var(--wp-admin--admin-bar--height, 32px)); }
}

/* ---------- Adaptación ---------- */
/* El índice lateral solo cabe sin pisar el panel del hero en pantallas anchas */
@media (max-width: 1560px) {
  body.vx-site .vx-anc { display: none; }
}
@media (max-width: 900px) {
  body.vx-site .vx-hero-grid { grid-template-columns: 1fr; gap: 48px; }
  /* Panel del hero en versión compacta bajo los botones (antes se ocultaba) */
  body.vx-site .vx-hero-panel { aspect-ratio: 4 / 3; width: 100%; max-width: 560px; background-size: 1px calc(100% - 96px), calc(100% - 96px) 1px; }
  body.vx-site .vx-hero-panel .vx-mono { font-size: 10px; line-height: 14px; letter-spacing: .1em; }
  body.vx-site .vx-panel-tl { top: 16px; left: 16px; }
  body.vx-site .vx-panel-tr { top: 16px; right: 16px; }
  body.vx-site .vx-panel-bl { bottom: 16px; left: 16px; }
  body.vx-site .vx-panel-br { bottom: 16px; right: 16px; }
  body.vx-site .vx-hero2 { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  /* En móvil las tarjetas de juego van a una columna: la imagen recupera su proporción 16:9 */
  body.vx-site .vx-win-media { aspect-ratio: 16 / 9; }
  /* Pie: la marca más pequeña para que no pese más que las columnas de enlaces */
  body.vx-site .vx-footer-mark img { height: 64px; }
  /* Pie: iconos sociales centrados y, debajo, el copyright */
  body.vx-site .vx-footer-bar { flex-direction: column-reverse; align-items: center; justify-content: center; gap: 20px; text-align: center; }
  body.vx-site .vx-social .elementor-social-icons-wrapper { justify-content: center; }
  /* Botones del hero a ancho completo */
  body.vx-site .vx-hero .vx-actions { flex-direction: column; align-items: stretch; }
  body.vx-site .vx-hero .vx-actions .elementor-button { width: 100%; }
  /* En la página de juego el logo ocupa menos alto para que el botón de descarga suba */
  body.vx-site .vx-hero2-media { aspect-ratio: 16 / 10; }
  body.vx-site .vx-only-desktop { display: none; }
  body.vx-site .vx-only-mobile { display: block; }
  body.vx-site .vx-cryptobro .vx-hero2-media img { object-fit: contain; padding: 16px 0; box-sizing: border-box; }
  body.vx-site .vx-techlocracy .vx-hero2-media > .elementor-widget { width: 44%; }
  /* Barra fija de descarga (solo móvil); vectex.js la esconde mientras la insignia del hero está a la vista */
  body.vx-site .vx-mobile-cta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); box-sizing: border-box; background: color-mix(in srgb, var(--g-bg) 92%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-top: 1px solid #ffffff24; color: var(--g-ink); transition: transform 250ms cubic-bezier(.2, .7, .2, 1); }
  body.vx-site .vx-mobile-cta.is-hidden { transform: translateY(110%); }
  body.vx-site .vx-mobile-cta > .elementor-widget { flex: 0 0 auto; }
  body.vx-site .vx-mobile-cta .vx-play-badge img { height: 44px; }
  body.vx-site:has(.vx-mobile-cta) .vx-footer { padding-bottom: 72px; }
  body.vx-site .vx-nav, body.vx-site .vx-hide-sm { display: none; }
  body.vx-site .vx-menu-btn { display: flex; }
  body.vx-site .vx-m-nav.is-open { display: block; }
  body.vx-site .vx-header-in { padding: 0 16px; gap: 12px; }
  body.vx-site .vx-hero-t { font-size: 48px; line-height: 48px; }
  body.vx-site .vx-sec-t, body.vx-site .vx-cta-t { font-size: 34px; line-height: 40px; }
  body.vx-site .vx-prod-t, body.vx-site .vx-techlocracy .vx-prod-t { font-size: 56px; line-height: 52px; }
  body.vx-site .vx-hero-grid { padding: 64px 16px; }
  body.vx-site .vx-section { padding-left: 16px; padding-right: 16px; padding-bottom: 64px; }
  body.vx-site .vx-section.vx-section-top { padding-top: 120px; }
  body.vx-site .vx-section.vx-section-crumb { padding-bottom: 0; }
  body.vx-site .vx-sec-head, body.vx-site .vx-cta, body.vx-site .vx-footer-in { grid-template-columns: 1fr; }
  body.vx-site .vx-footer-in { padding-left: 16px; padding-right: 16px; }
  body.vx-site .vx-footer-cols, body.vx-site .vx-dl, body.vx-site .vx-dl.vx-dl-4, body.vx-site .vx-legal-grid, body.vx-site .vx-upcoming-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.vx-site .vx-dialog-in { padding: 20px; }
  body.vx-site .vx-404-main { padding: 64px 16px; }
  body.vx-site .vx-hero2-body, body.vx-site .vx-cta { padding: 24px; }
  body.vx-site .vx-carousel { padding: 20px; }
  body.vx-site .vx-ticker .elementor-icon-list-item { padding: 0 24px; }
  body.vx-site .vx-strip .vx-sl-view { overflow-x: auto; scroll-snap-type: x mandatory; }
  body.vx-site .vx-strip .vx-sl-track { transform: none !important; }
  body.vx-site .vx-strip .vx-sl-track > .vx-sl-slide { flex-basis: 70%; scroll-snap-align: start; }
  body.vx-site .vx-strip .vx-sl-nav, body.vx-site .vx-strip .vx-dots { display: none; }
}