/* AMLPRO — home hero: animated background + live screening console (prefix hx2-) */

/* ---------- background ---------- */
.hx2-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.st-118 > .st-121, .st-118 > .st-134 { position: relative; z-index: 1; }
.hx2-bg i { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .55; will-change: transform; }
.hx2-bg .b1 { width: 520px; height: 520px; left: -140px; top: -160px; background: radial-gradient(circle, rgba(124, 58, 237, .55), transparent 65%); animation: hx2Drift1 18s ease-in-out infinite alternate; }
.hx2-bg .b2 { width: 460px; height: 460px; right: 4%; top: 18%; background: radial-gradient(circle, rgba(180, 145, 238, .38), transparent 65%); animation: hx2Drift2 22s ease-in-out infinite alternate; }
.hx2-bg .b3 { width: 380px; height: 380px; left: 38%; bottom: -200px; background: radial-gradient(circle, rgba(84, 32, 172, .5), transparent 65%); animation: hx2Drift3 20s ease-in-out infinite alternate; }
.hx2-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: radial-gradient(ellipse 75% 65% at 70% 40%, #000 25%, transparent 78%); mask-image: radial-gradient(ellipse 75% 65% at 70% 40%, #000 25%, transparent 78%); }
.hx2-beam { position: absolute; top: 0; bottom: 0; width: 34%; left: -40%; background: linear-gradient(100deg, transparent, rgba(205, 189, 245, .07), transparent); transform: skewX(-18deg); animation: hx2Beam 9s ease-in-out infinite; }
@keyframes hx2Drift1 { to { transform: translate(120px, 90px) scale(1.12); } }
@keyframes hx2Drift2 { to { transform: translate(-90px, 60px) scale(.92); } }
@keyframes hx2Drift3 { to { transform: translate(-110px, -70px) scale(1.15); } }
@keyframes hx2Beam { 0%, 15% { left: -40%; } 70%, 100% { left: 120%; } }

/* ---------- dotted globe visual ---------- */
.hx3 { position: relative; width: 100%; max-width: 560px; aspect-ratio: 1; margin: 0 auto; animation: amlPanelIn 1.1s .2s cubic-bezier(.2, .8, .2, 1) both; }
.hx3-canvas { position: relative; display: block; width: 100%; height: 100%; }
.hx3-halo { position: absolute; inset: 6%; border-radius: 50%; background: radial-gradient(closest-side, rgba(128, 70, 225, .38), rgba(84, 32, 172, .12) 60%, transparent); filter: blur(28px); animation: hx2Glow 7s ease-in-out infinite alternate; }
@keyframes hx2Glow { from { opacity: .6; transform: scale(.95); } to { opacity: 1; transform: scale(1.06); } }
@media (max-width: 600px) { .hx3 { max-width: 420px; } }
@media (prefers-reduced-motion: reduce) { .hx2-bg i, .hx2-beam, .hx3-halo, .hx3 { animation: none; } }

/* keyword line now lives inside the H1; keep its original pill look */
.st-124 .hx-kw { display: flex; width: max-content; max-width: 100%; margin-bottom: 28px; letter-spacing: .02em; line-height: 1.5; -webkit-text-fill-color: currentColor; }
