/* EphemerisXIT — Neon Galaxy Theme */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;600&display=swap');

:root{
  /* Palette */
  --ep-black: #00000C;
  --ep-navy: #070536;
  --ep-royal: #0F106D;
  --ep-electric: #1351CB;
  --ep-cyan: #10C7F9;
  --ep-purple: #340895;
  --ep-violet: #5B24D1;
  --ep-xit: #A128F3;
  --ep-magenta: #D559F9;
  --ep-lilac: #A79CF4;
  --ep-ice: #DCDBFB;

  /* Theme tokens */
  --bg: var(--ep-black);
  --bg-2: var(--ep-navy);
  --surface: rgba(7, 5, 54, 0.64);
  --surface-2: rgba(0, 0, 12, 0.72);
  --border: rgba(220, 219, 251, 0.10);
  --border-strong: rgba(220, 219, 251, 0.18);

  --text: var(--ep-ice);
  --muted: rgba(220, 219, 251, 0.72);
  --dim: rgba(220, 219, 251, 0.55);

  --accent: var(--ep-cyan);
  --accent-2: var(--ep-magenta);
  --accent-3: var(--ep-violet);
  --accent-xit: var(--ep-xit);

  --glow-cyan: rgba(16, 199, 249, 0.45);
  --glow-magenta: rgba(213, 89, 249, 0.45);
  --glow-violet: rgba(91, 36, 209, 0.35);

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --header-h: 118px;
}

html, body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif !important;
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* Base background (galaxy + aurora) */
.cx-bg{
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(ellipse 120% 80% at 50% -15%, rgba(15, 16, 109, 0.65) 0%, rgba(7, 5, 54, 0.65) 36%, rgba(0, 0, 12, 1) 70%),
    radial-gradient(ellipse 55% 40% at 18% 32%, rgba(16, 199, 249, 0.16) 0%, transparent 65%),
    radial-gradient(ellipse 45% 40% at 82% 62%, rgba(213, 89, 249, 0.12) 0%, transparent 62%),
    radial-gradient(ellipse 70% 55% at 60% 110%, rgba(91, 36, 209, 0.12) 0%, transparent 70%);
}
.cx-bg__glow{
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(ellipse 45% 40% at 20% 30%, rgba(16, 199, 249, 0.22), transparent 65%),
    radial-gradient(ellipse 40% 35% at 78% 70%, rgba(213, 89, 249, 0.18), transparent 60%),
    radial-gradient(ellipse 55% 40% at 50% 90%, rgba(91, 36, 209, 0.14), transparent 70%);
  filter: blur(60px);
  animation: epGlow 20s ease-in-out infinite;
  opacity: .95;
}
@keyframes epGlow{50%{transform:translate(2%,-2%) scale(1.03)}}

.cx-bg__grid{
  position:absolute;
  left:-25%;
  bottom:-6%;
  width:150%;
  height:55vh;
  background:
    linear-gradient(to right, rgba(16, 199, 249, 0.12) 1px, transparent 1px),
    linear-gradient(to top, rgba(213, 89, 249, 0.10) 1px, transparent 1px);
  background-size: 70px 70px;
  transform: perspective(900px) rotateX(58deg);
  mask-image: linear-gradient(to top, black 30%, transparent 85%);
  animation: epGrid 8s linear infinite;
  opacity: .55;
}
@keyframes epGrid{to{background-position:0 70px}}

/* Header/footer color unification */
.cx-header{
  background: rgba(0, 0, 12, 0.84) !important;
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border) !important;
}
.cx-trust{
  color: var(--muted) !important;
  border-bottom: 1px solid var(--border) !important;
  background: rgba(16, 199, 249, 0.06) !important;
}
.cx-trust i{ color: var(--accent) !important; }

.cx-logo-text em,
.cx-nav-links a.active,
.cx-icon-btn--active,
.cx-footer-col a:hover{
  color: var(--accent) !important;
}

.cx-icon-btn:hover{
  border-color: rgba(16, 199, 249, 0.35) !important;
  color: var(--text) !important;
}

.cx-btn--primary,
.cx-shop-buy,
.btn-neon,
.btn-demo-neon,
.btn-table{
  background: linear-gradient(135deg, var(--accent) 0%, var(--accent-3) 55%, var(--accent-2) 100%) !important;
  color: #fff !important;
  box-shadow: 0 10px 34px -14px var(--glow-cyan), 0 0 42px -18px var(--glow-magenta);
}
.cx-btn--ghost{
  background: rgba(220, 219, 251, 0.05) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}

/* Cards/glass */
.cx-card,
.cx-feature-card,
.cx-review-card,
.cx-shop-card,
.cx-plan-card,
.drop-notification{
  background: linear-gradient(165deg, rgba(7, 5, 54, 0.70), rgba(0, 0, 12, 0.78)) !important;
  border: 1px solid var(--border) !important;
  backdrop-filter: blur(14px);
}

.cx-card:hover,
.cx-feature-card:hover,
.cx-review-card:hover,
.cx-shop-card:hover,
.cx-plan-card:hover{
  border-color: rgba(16, 199, 249, 0.35) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,0.55), 0 0 50px rgba(16, 199, 249, 0.12), 0 0 40px rgba(213, 89, 249, 0.10);
}

/* Accents in content */
.cx-features-badge,
.cx-loja-badge,
.cx-reviews-badge,
.cx-loja-page-head .cx-loja-badge{
  color: var(--accent) !important;
  background: rgba(16, 199, 249, 0.10) !important;
  border: 1px solid rgba(16, 199, 249, 0.24) !important;
}

/* Small improvements */
a{ color: inherit; }
::selection{ background: rgba(213, 89, 249, 0.28); color: #fff; }

@media (max-width: 900px){
  :root{ --header-h: 72px; }
}