.enc-hover-card {
  --enc-card-accent: 70, 95, 255;
  --enc-card-border-alpha: .26;
  --enc-card-glow-alpha: .075;
  --enc-card-glow-soft-alpha: .025;
  --enc-card-shadow-alpha: .48;
  --enc-spot-x: 50%;
  --enc-spot-y: 50%;
  isolation: isolate;
  position: relative;
  scale: none !important;
  translate: none !important;
  transition-property: border-color, box-shadow, background-color;
  transition-duration: 480ms;
  transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}

.enc-hover-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  background: radial-gradient(
    300px circle at var(--enc-spot-x) var(--enc-spot-y),
    rgba(var(--enc-card-accent), var(--enc-card-glow-alpha)),
    rgba(var(--enc-card-accent), var(--enc-card-glow-soft-alpha)) 42%,
    transparent 72%
  );
  opacity: 0;
  pointer-events: none;
  transition: opacity 480ms cubic-bezier(.22, .61, .36, 1);
}

.enc-hover-card:hover {
  transform: none !important;
  scale: none !important;
  translate: none !important;
  border-color: rgba(var(--enc-card-accent), var(--enc-card-border-alpha)) !important;
  box-shadow:
    0 15px 34px -23px rgba(var(--enc-card-accent), var(--enc-card-shadow-alpha)),
    0 1px 0 rgba(255, 255, 255, .85) inset !important;
}

.enc-hover-card:hover::after {
  opacity: 1;
}

/* GEO cards use a restrained game-menu style focus: a small lift in scale,
   while the existing spotlight and shadow remain in sync. */
#geos article.enc-hover-card {
  --enc-card-glow-alpha: .16;
  --enc-card-glow-soft-alpha: .055;
  transform-origin: center;
  transition-property: transform, border-color, box-shadow, background-color;
}

#geos article.enc-hover-card:hover {
  z-index: 3;
  transform: scale(1.025) !important;
}

/* The account CTAs share the same pointer-following highlight, without
   changing their established button dimensions or layout. */
a.enc-hover-card {
  overflow: hidden;
}

a[href*="app.enc.network/signup"].enc-hover-card {
  --enc-card-accent: 255, 255, 255;
  --enc-card-glow-alpha: .2;
  --enc-card-glow-soft-alpha: .07;
}

a[href*="app.enc.network/signin"].enc-hover-card {
  --enc-card-accent: 70, 95, 255;
  --enc-card-glow-alpha: .12;
  --enc-card-glow-soft-alpha: .04;
}

#offers article.enc-hover-card:nth-of-type(1) {
  --enc-card-accent: 70, 95, 255;
  --enc-card-border-alpha: .42;
  --enc-card-glow-alpha: .14;
  --enc-card-glow-soft-alpha: .045;
  --enc-card-shadow-alpha: .5;
}

#offers article.enc-hover-card:nth-of-type(2) {
  --enc-card-accent: 132, 82, 224;
  --enc-card-border-alpha: .38;
  --enc-card-glow-alpha: .13;
  --enc-card-glow-soft-alpha: .04;
  --enc-card-shadow-alpha: .46;
}

#offers article.enc-hover-card:nth-of-type(3) {
  --enc-card-accent: 210, 148, 28;
  --enc-card-border-alpha: .42;
  --enc-card-glow-alpha: .14;
  --enc-card-glow-soft-alpha: .045;
  --enc-card-shadow-alpha: .48;
}

#offers article.enc-hover-card::after {
  background: radial-gradient(
    280px circle at var(--enc-spot-x) var(--enc-spot-y),
    rgba(var(--enc-card-accent), var(--enc-card-glow-alpha)),
    rgba(var(--enc-card-accent), var(--enc-card-glow-soft-alpha)) 48%,
    transparent 76%
  );
}

@media (hover: none), (pointer: coarse) {
  .enc-hover-card::after {
    display: none;
  }

  .enc-hover-card:hover {
    border-color: inherit !important;
    box-shadow: inherit !important;
  }

  #geos article.enc-hover-card:hover {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .enc-hover-card,
  .enc-hover-card::after {
    transition: none;
  }

  #geos article.enc-hover-card:hover {
    transform: none !important;
  }
}