﻿/* ==========================================================================
   Hero Scene Widgets
   Extracted from core.css so the homepage hero stack stops inflating
   the shared stylesheet for unrelated pages.
   ========================================================================== */

/* ==========================================================================
   Earth Spinning  (.aes-*)
   ========================================================================== */

.aes-widget {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: transparent;
}

.aes-stage-wrap,
.aes-porthole-wrap {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

.aes-canvas {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}

.aes-globe {
  --aes-spin-duration: 50s;
  --aes-cloud-duration: 42s;
  width: min(65%, 65vh);
  height: min(65%, 65vh);
  min-width: 40px;
  min-height: 40px;
  overflow: hidden;
  border: 1px solid rgba(185, 215, 255, 0.18);
  border-radius: 50%;
  contain: layout paint style;
  isolation: isolate;
  background: #172d55;
  box-shadow:
    inset -22px -8px 40px rgba(0, 0, 0, 0.72),
    inset 10px 7px 18px rgba(205, 230, 255, 0.13),
    inset 7px 0 12px rgba(94, 144, 241, 0.22),
    0 0 20px rgba(94, 144, 241, 0.2);
}

.aes-globe-track,
.aes-globe-cloud-track {
  position: absolute;
  inset: 0 auto 0 0;
  display: flex;
  width: 400%;
  height: 100%;
  max-width: none;
  animation: aes-globe-spin var(--aes-spin-duration) linear infinite;
  animation-play-state: paused;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

.aes-globe-track {
  z-index: 0;
}

.aes-globe-cloud-track {
  z-index: 1;
  opacity: 0.32;
  mix-blend-mode: screen;
  animation: aes-globe-cloud-spin var(--aes-cloud-duration) linear infinite;
  animation-play-state: paused;
}

.aes-porthole-wrap[data-aes-visible="1"] .aes-globe-track,
.aes-porthole-wrap[data-aes-visible="1"] .aes-globe-cloud-track {
  animation-play-state: running;
}

.aes-globe-track img,
.aes-globe-cloud-track img {
  display: block;
  flex: 0 0 50%;
  width: 50%;
  height: 100%;
  max-width: none;
  object-fit: fill;
  pointer-events: none;
  user-select: none;
}

.aes-globe-light {
  position: absolute;
  inset: -1px;
  z-index: 2;
  border-radius: inherit;
  background:
    radial-gradient(circle at 34% 24%, rgba(255, 255, 255, 0.16), transparent 32%),
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.08) 0%,
      transparent 42%,
      rgba(0, 0, 0, 0.3) 72%,
      rgba(0, 0, 0, 0.78) 100%
    );
  box-shadow: inset 0 0 24px rgba(0, 0, 0, 0.28);
  pointer-events: none;
}

@keyframes aes-globe-spin {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-50%, 0, 0);
  }
}

@keyframes aes-globe-cloud-spin {
  from {
    transform: translate3d(-12.5%, 0, 0);
  }

  to {
    transform: translate3d(-62.5%, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .aes-globe-track,
  .aes-globe-cloud-track {
    animation: none;
    transform: translate3d(-12.5%, 0, 0);
  }
}

/* â”€â”€ Sun flare (behind-camera glow) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */

.aes-sun-flare {
  position: absolute;
  width: 70%;
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  background: radial-gradient(circle,
    rgba(255,255,240,0.3) 0%,
    rgba(220,235,255,0.12) 30%,
    transparent           65%
  );
  mix-blend-mode: screen;
  filter: blur(28px);
}

/* â”€â”€ WebGL not supported fallback â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */

.aes-stage-wrap[data-aes-no-webgl],
.aes-porthole-wrap[data-aes-no-webgl] {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #111;
  color: #666;
  font-family: -apple-system, sans-serif;
  font-size: 12px;
}


/* Earth widget: position:absolute fills its container. */
.elementor-widget:has(.aes-widget) {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.elementor-widget:has(.aes-widget) .elementor-widget-container {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
}
/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   SPACE OVERLAY WIDGET (.aso-)
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

/* Space Overlay wrapper â€” z:2 so strapline/button/HUD sit in front of Earth(z:1).
   Sandwich title is JS-injected OUTSIDE this wrapper at z:0, so Earth correctly
   renders on top of it without affecting the overlay's own z:2 children.
   Stack: SandwichTitle(z:0) â†’ Earth(z:1) â†’ Overlay(z:2) â†’ Doors(z:3) */
.elementor-widget:has(.aso-widget) {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none;
}
.elementor-widget:has(.aso-widget) .elementor-widget-container {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
}

/* â”€â”€ Base â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
/* Overlay base â€” z:2 stacking context keeps HUD/strapline/button in front of Earth.
   overflow:hidden clips decorations at widget boundary. */
.aso-widget {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  font-family: 'Courier New', Courier, monospace;
  --aso-hud:  #00ffaa;
  --aso-term: #00ff88;
}
.aso-widget .aso-btn,
.aso-widget .aso-btn-wrap {
  pointer-events: auto;
}

/* â”€â”€ Scanlines (shared HUD + Terminal) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
/* z:2 â€” in front of Earth (z:1) */
.aso-scanlines {
  position: absolute;
  inset: 0;
  z-index: 6;
  overflow: hidden;
  --aso-scanline-dark-alpha: 0.15;
  --aso-scanline-bright-alpha: 0.055;
  --aso-scanline-static-alpha: 0.22;
  --aso-scanline-zigzag: 1px;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 3px,
    rgba(0,0,0,var(--aso-scanline-dark-alpha)) 3px,
    rgba(0,0,0,var(--aso-scanline-dark-alpha)) 4px
  );
  pointer-events: none;
}
.aso-scanlines::before,
.aso-scanlines::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(
    to bottom,
    transparent 0px,
    transparent 3px,
    rgba(255,255,255,var(--aso-scanline-bright-alpha)) 3px,
    rgba(255,255,255,var(--aso-scanline-bright-alpha)) 4px,
    transparent 4px,
    transparent 8px
  );
  background-repeat: repeat;
  background-size: 100% 8px;
  opacity: var(--aso-scanline-static-alpha);
  will-change: transform, opacity;
}
.aso-scanlines::before {
  transform: translate3d(calc(var(--aso-scanline-zigzag) * -1), 0, 0);
  animation: aso-scan-static-a 0.22s steps(2, end) infinite;
}
.aso-scanlines::after {
  background-position: 0 4px;
  transform: translate3d(var(--aso-scanline-zigzag), 0, 0);
  animation: aso-scan-static-b 0.29s steps(2, end) infinite;
}

/* â”€â”€ Content wrapper (shared) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
/* No z-index on .aso-content â€” no stacking context created here.
   Children (title-wrap, strapline-wrap, btn-wrap) each carry their own z-index
   so they participate independently in the S2 GATE stacking context. */
.aso-content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 40px;
  text-align: center;
}

/* Two-layer title group â€” CSS Grid overlay (JS enforces this at runtime too).
   Both children share grid cell 1/1 â†’ pixel-perfect stack, no absolute positioning.
   JS also calls removeProperty on any position:absolute in Elementor-cached HTML. */
.aso-title-group {
  display: grid;
}
.aso-title-group > .aso-title-wrap--back,
.aso-title-group > .aso-title-wrap--front {
  grid-row: 1;
  grid-column: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* JS moves the back title clone into S2 container at z:0 so Earth (z:1)
   renders on top of the solid text. Stroke front stays in overlay at z:2. */
.aso-sandwich-title {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  overflow: hidden;
}

.aso-title {
  margin: 0;
}
/* Stroke mode: transparent fill so only the stroke outline is visible.
   Scoped to inside .aso-widget so the sandwich clone (outside .aso-widget)
   is NOT affected â€” the clone keeps its solid fill, Earth cuts through it,
   and the stroke outline in the overlay sits in front. */
.aso-widget .aso-title--stroke {
  -webkit-text-fill-color: transparent;
}
.aso-btn-wrap {
  display: flex;
  justify-content: center;
}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   HUD STYLE
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

/* Corner brackets â€” z:2 puts them in front of Earth(z:1) behind doors(z:3) */
.aso-hud .aso-corner {
  position: absolute;
  width: 40px;
  height: 40px;
  z-index: 2;
  border-color: var(--aso-hud);
  border-style: solid;
  opacity: 0.8;
}
.aso-hud .aso-tl { top: 20px;    left: 20px;    border-width: 2px 0 0 2px; }
.aso-hud .aso-tr { top: 20px;    right: 20px;   border-width: 2px 2px 0 0; }
.aso-hud .aso-bl { bottom: 20px; left: 20px;    border-width: 0 0 2px 2px; }
.aso-hud .aso-br { bottom: 20px; right: 20px;   border-width: 0 2px 2px 0; }

/* Crosshair */
.aso-hud .aso-crosshair {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.aso-hud .aso-ch-h,
.aso-hud .aso-ch-v {
  position: absolute;
  background: var(--aso-hud);
  opacity: 0.35;
}
.aso-hud .aso-ch-h {
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 80px; height: 1px;
}
.aso-hud .aso-ch-v {
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 1px; height: 80px;
}
.aso-hud .aso-ch-ring {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 30px; height: 30px;
  border: 1px solid var(--aso-hud);
  border-radius: 50%;
  opacity: 0.5;
}

/* Telemetry strips */
.aso-hud .aso-telem {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0 24px;
}
.aso-hud .aso-telem--l { left: 0; text-align: left; }
.aso-hud .aso-telem--r { right: 0; text-align: right; }
.aso-hud .aso-telem-line {
  font-size: 11px;
  letter-spacing: 0.08em;
  color: var(--aso-hud);
  opacity: 0.75;
  white-space: nowrap;
}

/* HUD cursor */
.aso-hud .aso-cursor {
  animation: aso-blink 1s step-end infinite;
  color: var(--aso-hud);
}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   CRT STRAPLINE
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

.aso-strapline-wrap {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.aso-intro {
  position: absolute;
  inset: 0;
  z-index: 7;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  text-align: center;
  --aso-intro-color: #ffffff;
  --aso-intro-glow-color: #00ffff;
  --aso-intro-layer1-color: #00ffff;
  --aso-intro-layer2-color: #ff00ff;
}
.aso-intro-copy {
  position: relative;
  display: inline-block;
  max-width: 100%;
  padding: 0.04em 0.06em;
  overflow: hidden;
}
.aso-intro-text {
  display: block;
  max-width: 100%;
  font-family: 'Orbitron', 'Arial Black', 'Roboto Mono', sans-serif;
  font-size: clamp(1.3rem, 5.4vw, 3.6rem);
  font-weight: 900;
  line-height: 0.92;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  white-space: normal;
  word-break: break-word;
}
.aso-intro-text--base {
  position: relative;
  z-index: 2;
  color: var(--aso-intro-color, #ffffff);
  text-shadow:
    0 0 10px var(--aso-intro-glow-color, #00ffff),
    0 0 24px var(--aso-intro-glow-color, #00ffff),
    0 0 46px var(--aso-intro-glow-color, #00ffff);
  animation: aso-intro-flicker 5s infinite alternate, aso-intro-distort 3s infinite;
}
.aso-intro-text--layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.aso-intro-text--layer1 {
  color: var(--aso-intro-layer1-color, #00ffff);
  opacity: 0.72;
  filter: blur(0.85px);
  transform: translateX(-1px);
  clip-path: inset(0 0 54% 0);
  mix-blend-mode: screen;
  animation: aso-intro-rgb-shift 2s steps(1, end) infinite;
}
.aso-intro-text--layer2 {
  color: var(--aso-intro-layer2-color, #ff00ff);
  opacity: 0.66;
  filter: blur(1.1px);
  transform: translateX(1px);
  clip-path: inset(56% 0 0 0);
  mix-blend-mode: screen;
  animation: aso-intro-rgb-shift-alt 1.6s steps(1, end) infinite;
}
.aso-intro.aso-intro-active {
  opacity: 1;
}
.aso-intro.aso-intro-static {
  opacity: 1;
}
.aso-intro.aso-intro-static .aso-intro-text--base {
  animation: none !important;
  transform: none !important;
  letter-spacing: inherit;
}
.aso-intro.aso-intro-static .aso-intro-text--layer {
  display: none !important;
}
.aso-crt-strapline {
  position: relative;
}
.aso-crt-warmup {
  position: absolute;
  inset: -2px 0;
  z-index: 5;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  color: var(--aso-decode-color, currentColor);
  transition: opacity 0.08s linear;
}
.aso-crt-warmup::before,
.aso-crt-warmup::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  will-change: transform, opacity, background-position;
}
.aso-crt-warmup::before {
  background-image:
    repeating-linear-gradient(
      to bottom,
      transparent 0px,
      transparent 2px,
      currentColor 2px,
      currentColor 3px,
      transparent 3px,
      transparent 7px
    ),
    linear-gradient(
      to bottom,
      transparent 0%,
      transparent 14%,
      currentColor 14%,
      currentColor 18%,
      transparent 18%,
      transparent 46%,
      currentColor 46%,
      currentColor 50%,
      transparent 50%,
      transparent 76%,
      currentColor 76%,
      currentColor 80%,
      transparent 80%,
      transparent 100%
    );
  background-repeat: repeat;
  background-size: 100% 7px, 100% 100%;
  opacity: 0.22;
  filter: blur(0.35px);
  animation: aso-crt-warmup-lines 0.18s steps(3, end) infinite;
}
.aso-crt-warmup::after {
  background-image:
    linear-gradient(
      to bottom,
      transparent 0%,
      currentColor 8%,
      transparent 12%,
      transparent 32%,
      currentColor 36%,
      transparent 40%,
      transparent 60%,
      currentColor 64%,
      transparent 68%,
      transparent 100%
    ),
    repeating-linear-gradient(
      to bottom,
      transparent 0px,
      transparent 1px,
      currentColor 1px,
      currentColor 2px,
      transparent 2px,
      transparent 6px
    );
  background-repeat: repeat;
  background-size: 100% 100%, 100% 6px;
  opacity: 0.18;
  mix-blend-mode: screen;
  filter: blur(0.9px);
  animation: aso-crt-warmup-noise 0.13s steps(4, end) infinite;
}
.aso-crt-strapline.aso-warmup-active .aso-crt-warmup {
  opacity: 1;
}
.aso-crt-strapline.aso-warmup-active .aso-crt-scanline {
  opacity: 0.26;
  animation-duration: 1.2s;
}
.aso-crt-strapline.aso-warmup-active .aso-crt-vline {
  opacity: 0.18;
  animation-duration: 0.75s;
}
.aso-crt-lines {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  z-index: 2;
  font-family: 'Courier New', Courier, monospace;
  letter-spacing: 0.04em;
  --aso-line-gap: 8px;
  --aso-decode-color: currentColor;
  --aso-decode-glow-near: 4px;
  --aso-decode-glow-far: 10px;
  --ato-accent: currentColor;
  animation: aso-crt-flicker 8s infinite, aso-crt-glow 1.6s infinite;
}
.aso-crt-lines.aso-decoder-active {
  animation: none !important;
  text-shadow: none !important;
}
.aso-crt-lines.aso-slide-up-active {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition: opacity 650ms ease, transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aso-crt-lines.aso-slide-up-active.aso-slide-up-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.aso-crt-line {
  display: grid;
  width: 100%;
  position: relative;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: inherit;
}
.aso-crt-line--reserve {
  position: relative;
}
.aso-crt-reserve {
  display: block;
  width: 100%;
  grid-row: 1;
  grid-column: 1;
  visibility: hidden;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: inherit;
}
.aso-crt-live {
  display: block;
  width: 100%;
  grid-row: 1;
  grid-column: 1;
  position: relative;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: inherit;
}
.aso-crt-word {
  display: inline-block;
  line-height: inherit;
  margin: 0;
}
.aso-decoder-word {
  display: inline-block;
  white-space: pre;
  line-height: inherit;
  vertical-align: baseline;
}
.aso-decoder-word--active {
  color: var(--aso-decoder-glow-color, var(--ato-accent, currentColor)) !important;
  text-shadow: none !important;
}
.aso-crt-line:not(:last-child) {
  margin-bottom: var(--aso-line-gap, 8px);
}
.aso-crt-cursor {
  display: inline-block;
  width: 0.55em;
  height: 1em;
  background: currentColor;
  vertical-align: text-bottom;
  margin-left: 3px;
  animation: aso-crt-blink 0.8s step-end infinite;
}
.aso-crt-cursor--done {
  display: none !important;
}

/* Moving horizontal scan band */
.aso-crt-scanline {
  position: absolute;
  left: 0;
  right: 0;
  top: -80px;
  width: 100%;
  height: 80px;
  z-index: 3;
  background: linear-gradient(0deg,
    transparent 0%,
    rgba(255, 255, 255, 0.14) 50%,
    transparent 100%);
  opacity: 0.12;
  pointer-events: none;
  animation: aso-crt-scan 9s linear infinite;
}

/* Thinner fast accent line */
.aso-crt-vline {
  position: absolute;
  left: 0;
  right: 0;
  top: -4px;
  width: 100%;
  height: 4px;
  z-index: 4;
  background: linear-gradient(to bottom,
    transparent 0%,
    rgba(255, 255, 255, 0.55) 50%,
    transparent 100%);
  opacity: 0.08;
  pointer-events: none;
  animation: aso-crt-vline 7s linear infinite;
}

@keyframes aso-crt-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}
@keyframes aso-crt-glow {
  0%, 100% {
    text-shadow: 0 0 2px currentColor, 0 0 5px currentColor;
  }
  30% {
    text-shadow: 0.4px 0 1px rgba(0, 30, 255, 0.35),
                 -0.4px 0 1px rgba(255, 0, 80, 0.25),
                 0 0 4px currentColor;
  }
  60% {
    text-shadow: -0.3px 0 1px rgba(0, 30, 255, 0.35),
                 0.3px 0 1px rgba(255, 0, 80, 0.25),
                 0 0 3px currentColor;
  }
}
@keyframes aso-crt-flicker {
  0%  { opacity: 1; }
  7%  { opacity: 0.96; }
  10% { opacity: 1; }
  43% { opacity: 0.97; }
  44% { opacity: 0.88; }
  45% { opacity: 1; }
  77% { opacity: 0.94; }
  78% { opacity: 1; }
}
@keyframes aso-crt-scan {
  0%   { top: -80px; }
  100% { top: calc(100% + 80px); }
}
@keyframes aso-crt-vline {
  0%   { top: -4px; }
  100% { top: calc(100% + 4px); }
}
@keyframes aso-intro-flicker {
  0%, 80%, 100% {
    opacity: 1;
  }
  70%, 90% {
    opacity: 0.8;
  }
  71%, 72%, 91%, 92% {
    opacity: 0.4;
  }
  73%, 93% {
    opacity: 0.62;
  }
  74%, 94% {
    opacity: 0.5;
  }
  75%, 95% {
    opacity: 0.72;
  }
}
@keyframes aso-intro-distort {
  0%, 100% {
    transform: translate3d(0, 0, 0) scaleX(1);
    letter-spacing: 0.12em;
  }
  10% {
    transform: translate3d(-1px, 0, 0) scaleX(1.01);
    letter-spacing: calc(0.12em + 1px);
  }
  20% {
    transform: translate3d(1px, 0, 0) scaleX(0.99);
    letter-spacing: calc(0.12em - 1px);
  }
  30%, 50% {
    transform: translate3d(0, 0, 0) scaleX(1);
    letter-spacing: 0.12em;
  }
  40% {
    transform: translate3d(-2px, 0, 0) scaleX(0.985);
    letter-spacing: calc(0.12em - 2px);
  }
  70% {
    transform: translate3d(2px, 0, 0) scaleX(1.02);
    letter-spacing: calc(0.12em + 2px);
  }
  80% {
    transform: translate3d(-1px, 0, 0) scaleX(0.995);
    letter-spacing: calc(0.12em - 1px);
  }
  90% {
    transform: translate3d(1px, 0, 0) scaleX(1.01);
    letter-spacing: calc(0.12em + 1px);
  }
}
@keyframes aso-intro-rgb-shift {
  0%, 100% {
    text-shadow: -2px 0 #00ffff, 2px 0 #ff00ff;
    opacity: 0.82;
  }
  25% {
    text-shadow: -2px 0 #39ff14, 2px 0 #00ffff;
    opacity: 0.72;
  }
  50% {
    text-shadow: -2px 0 #ff0000, 2px 0 #ffff00;
    opacity: 0.9;
  }
  75% {
    text-shadow: -2px 0 #ffff00, 2px 0 #39ff14;
    opacity: 0.64;
  }
}
@keyframes aso-intro-rgb-shift-alt {
  0%, 100% {
    text-shadow: 2px 0 #ff00ff, -2px 0 #00ffff;
    opacity: 0.8;
  }
  25% {
    text-shadow: 2px 0 #00ffff, -2px 0 #39ff14;
    opacity: 0.7;
  }
  50% {
    text-shadow: 2px 0 #ffff00, -2px 0 #ff0000;
    opacity: 0.9;
  }
  75% {
    text-shadow: 2px 0 #39ff14, -2px 0 #ffff00;
    opacity: 0.62;
  }
}
@keyframes aso-crt-warmup-lines {
  0%, 100% {
    transform: translate3d(0, 0, 0) scaleX(1);
    opacity: 0.2;
    background-position: 0 0, 0 0;
  }
  18% {
    transform: translate3d(-2px, 1px, 0) scaleX(1.01);
    opacity: 0.3;
    background-position: 0 2px, 0 0;
  }
  42% {
    transform: translate3d(3px, -1px, 0) scaleX(0.995);
    opacity: 0.24;
    background-position: 0 -3px, 0 0;
  }
  67% {
    transform: translate3d(-1px, 2px, 0) scaleX(1.015);
    opacity: 0.34;
    background-position: 0 4px, 0 0;
  }
}
@keyframes aso-crt-warmup-noise {
  0%, 100% {
    transform: translate3d(0, 0, 0);
    opacity: 0.16;
    background-position: 0 0, 0 0;
  }
  20% {
    transform: translate3d(4px, 0, 0);
    opacity: 0.3;
    background-position: 0 -8px, 0 1px;
  }
  40% {
    transform: translate3d(-3px, 0, 0);
    opacity: 0.22;
    background-position: 0 6px, 0 -1px;
  }
  60% {
    transform: translate3d(2px, 0, 0);
    opacity: 0.34;
    background-position: 0 -4px, 0 2px;
  }
  80% {
    transform: translate3d(-5px, 0, 0);
    opacity: 0.2;
    background-position: 0 10px, 0 -2px;
  }
}
@keyframes aso-scan-static-a {
  0%, 100% {
    transform: translate3d(calc(var(--aso-scanline-zigzag) * -1), 0, 0);
  }
  40% {
    transform: translate3d(0, 0, 0);
  }
  70% {
    transform: translate3d(calc(var(--aso-scanline-zigzag) * -1.7), 0, 0);
  }
}
@keyframes aso-scan-static-b {
  0%, 100% {
    transform: translate3d(var(--aso-scanline-zigzag), 0, 0);
  }
  30% {
    transform: translate3d(calc(var(--aso-scanline-zigzag) * 1.6), 0, 0);
  }
  65% {
    transform: translate3d(0, 0, 0);
  }
}

/* Show placeholder text in Elementor editor only when JS hasn't typed yet */
body.elementor-editor-active .aso-crt-lines:empty::before {
  content: attr(data-placeholder);
  opacity: 0.4;
  font-style: normal;
}

/* Editor: disable sandwich JS side-effects so both title layers stay visible.
   --back (solid) is forced visible; --front (stroke) overlays it via inline style. */
body.elementor-editor-active .aso-title-wrap--back {
  visibility: visible !important;
}
/* Editor: suppress sandwich clone â€” it can't position correctly in editor DOM */
body.elementor-editor-active ~ .aso-sandwich-title,
.elementor-editor-active .aso-sandwich-title {
  display: none !important;
}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   TERMINAL STYLE
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

.aso-terminal .aso-content {
  justify-content: center;
}
.aso-tagline {
  color: var(--aso-hud);
  font-family: 'Courier New', Courier, monospace;
  letter-spacing: 0.08em;
  margin: 0;
  --aso-decode-color: currentColor;
  --aso-decode-glow-near: 4px;
  --aso-decode-glow-far: 10px;
  --ato-accent: currentColor;
}
.aso-tagline.aso-decoder-active {
  text-shadow: none !important;
}
.aso-slide-up-content {
  display: inline-block;
  max-width: 100%;
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition: opacity 650ms ease, transform 650ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aso-slide-up-content.aso-slide-up-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.aso-terminal .aso-tagline {
  color: var(--aso-term);
}
.aso-crt-lines .ato-decoder-char--scrambling,
.aso-tagline .ato-decoder-char--scrambling {
  color: var(--aso-decoder-glow-color, var(--aso-decode-color, var(--ato-accent, currentColor))) !important;
  text-shadow:
    0 0 var(--aso-decode-glow-near, 4px) var(--aso-decoder-glow-color, var(--aso-decode-color, var(--ato-accent, currentColor))),
    0 0 var(--aso-decode-glow-far, 10px) var(--aso-decoder-glow-color, var(--aso-decode-color, var(--ato-accent, currentColor)));
}
.aso-terminal .aso-title-wrap {
  display: flex;
  align-items: baseline;
  gap: 4px;
}
.aso-terminal .aso-prompt {
  color: var(--aso-term);
  font-size: inherit;
  opacity: 0.8;
  flex-shrink: 0;
}
.aso-terminal .aso-cursor {
  color: var(--aso-term);
}


/* â”€â”€ Shared animations â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
@keyframes aso-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}
.aso-blink {
  animation: aso-blink 1s step-end infinite;
}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   SPACE OVERLAY â€” RESPONSIVE
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

/* â”€â”€ Tablet (â‰¤1024px) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
@media (max-width: 1024px) {
  /* Hide telemetry strips â€” too cramped on tablet */
  .aso-hud .aso-telem {
    display: none;
  }
  /* Scale HUD corners down */
  .aso-hud .aso-corner {
    width: 28px;
    height: 28px;
  }
  .aso-hud .aso-tl { top: 12px;    left: 12px; }
  .aso-hud .aso-tr { top: 12px;    right: 12px; }
  .aso-hud .aso-bl { bottom: 12px; left: 12px; }
  .aso-hud .aso-br { bottom: 12px; right: 12px; }
}

/* â”€â”€ Mobile (â‰¤736px) â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
@media (max-width: 736px) {
  /* Hide HUD chrome on mobile */
  .aso-hud .aso-corner,
  .aso-hud .aso-crosshair,
  .aso-hud .aso-telem {
    display: none;
  }
  /* Reduce CRT scanline animation intensity â€” battery/performance */
  .aso-crt-scanline,
  .aso-crt-vline {
    display: none;
  }
  .aso-crt-lines {
    animation: none;
    text-shadow: none;
  }
  .aso-crt-cursor {
    display: none !important;
    animation: none;
  }
}
