html { overflow-x: clip; }
/* Ixion Market — capa propia sobre site.css (paleta lima/esmeralda ya aplicada en site.css) */
.hero-video { filter: grayscale(.35) contrast(1.1) brightness(.9); transform: scale(1.06); animation: kenburns 28s ease-in-out infinite alternate; }
@keyframes kenburns { to { transform: scale(1.16) translate(-2%, -1.5%); } }
.hero-chips { margin-top: 26px; }
.hero-chips .chip { text-decoration: none; backdrop-filter: blur(6px); background: rgba(7, 8, 12, .35); transition: border-color .25s, color .25s, transform .25s; }
.hero-chips .chip:hover { border-color: var(--c1); color: var(--c1); transform: translateY(-2px); }

.xunits { display: grid; gap: clamp(64px, 9vw, 120px); }
.xunit { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.xunit.flip .xlogo { order: 2; }
.xlogo { position: relative; display: grid; place-items: center; aspect-ratio: 7 / 5; border-radius: 24px; background: #e8e8e8; overflow: hidden;
  border: 1px solid var(--line); box-shadow: 0 40px 80px -40px rgba(163, 230, 53, .25); }
.xlogo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.xlogo:hover img { transform: scale(1.05); }
.xlogo::after { background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(163, 230, 53, .18), transparent 60%); }
.xnum { position: absolute; top: 16px; left: 18px; color: #7a8070; font-size: .85rem; }
.xbody h3 { font-size: clamp(2rem, 4vw, 3.2rem); margin-bottom: .4em; }
.xbody p { color: var(--muted); font-size: 1.05rem; max-width: 560px; }
.xfoot { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; margin-top: 26px; }
.xstat strong { display: block; font: 700 1.8rem var(--display); background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.xstat span { color: var(--muted); font-size: .85rem; }
.xunit .tag { font-size: .8rem; }

.marquee { padding: 26px 0; }
.marquee-track span:nth-child(4n+1) { color: var(--c1); }

@media (max-width: 820px) {
  .xunit { grid-template-columns: 1fr; }
  .xunit.flip .xlogo { order: 0; }
}
@media (prefers-reduced-motion: reduce) { .hero-video { animation: none; transform: none; } }
