/* Interaction polish: hovers, shadows, lift */

.brand {
  transition: color 0.25s var(--ease), text-shadow 0.25s var(--ease);
}
.brand:hover {
  color: var(--accent-2);
  text-shadow: 0 0 24px rgba(129, 140, 248, 0.35);
}

.nav__links a {
  position: relative;
  padding: 0.25rem 0;
  transition: color 0.25s var(--ease);
}
.nav__links a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.15rem;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--accent-2);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.28s var(--ease);
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.45);
}
.nav__links a:hover::after,
.nav__links a:focus-visible::after {
  transform: scaleX(1);
}

.nav__cta {
  background: linear-gradient(180deg, #7c7ff5, var(--accent));
  box-shadow: var(--shadow-accent, 0 16px 40px rgba(99, 102, 241, 0.38));
  transition: transform 0.25s var(--ease), background 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.nav__cta:hover {
  background: linear-gradient(180deg, #9598ff, var(--accent-2));
  transform: translateY(-2px);
  box-shadow: var(--shadow-accent-strong, 0 22px 56px rgba(99, 102, 241, 0.5));
}
.nav__cta:active {
  transform: translateY(0);
}

.btn {
  transition:
    transform 0.25s var(--ease),
    background 0.25s var(--ease),
    border-color 0.25s var(--ease),
    box-shadow 0.25s var(--ease),
    filter 0.25s var(--ease);
}
.btn--primary {
  background: linear-gradient(180deg, #7c7ff5, var(--accent));
  box-shadow: var(--shadow-accent, 0 16px 40px rgba(99, 102, 241, 0.38));
}
.btn--primary:hover {
  background: linear-gradient(180deg, #9598ff, var(--accent-2));
  transform: translateY(-3px);
  box-shadow: var(--shadow-accent-strong, 0 22px 56px rgba(99, 102, 241, 0.5));
  filter: brightness(1.05);
}
.btn--primary:active {
  transform: translateY(-1px);
}
.btn--ghost {
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.btn--ghost:hover {
  border-color: rgba(129, 140, 248, 0.45);
  background: rgba(99, 102, 241, 0.1);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(129, 140, 248, 0.15);
}

.hero__proof li {
  padding: 0.55rem 0.65rem;
  margin: 0 -0.65rem;
  border-radius: 12px;
  transition:
    background 0.25s var(--ease),
    color 0.25s var(--ease),
    box-shadow 0.25s var(--ease),
    transform 0.25s var(--ease);
}
.hero__proof li:hover {
  background: rgba(99, 102, 241, 0.08);
  color: #cbd5e1;
  box-shadow: inset 0 0 0 1px rgba(129, 140, 248, 0.18);
  transform: translateX(4px);
}
.proof-icon {
  transition: transform 0.25s var(--ease), filter 0.25s var(--ease);
}
.hero__proof li:hover .proof-icon {
  transform: scale(1.08);
  filter: drop-shadow(0 4px 10px rgba(99, 102, 241, 0.45));
}

.stage__glow {
  transition: opacity 0.4s var(--ease), transform 0.4s var(--ease);
}
.stage:hover .stage__glow {
  opacity: 0.95;
  transform: scale(1.06);
}

.stage__dash {
  box-shadow: var(--shadow-lg, 0 28px 70px rgba(0, 0, 0, 0.5)), 0 0 0 1px rgba(99, 102, 241, 0.08);
  transition: transform 0.45s var(--ease), box-shadow 0.45s var(--ease), border-color 0.35s var(--ease);
}
.stage__dash:hover {
  transform: perspective(1400px) rotateY(-4deg) rotateX(2deg) translateY(-6px);
  border-color: rgba(129, 140, 248, 0.35);
  box-shadow: var(--shadow-lg, 0 28px 70px rgba(0, 0, 0, 0.5)), 0 0 40px rgba(99, 102, 241, 0.18);
}
.stage__dash img {
  transition: transform 0.55s var(--ease);
}
.stage__dash:hover img {
  transform: scale(1.02);
}

.stage__assist {
  border: 1px solid rgba(148, 163, 184, 0.18);
  transition: transform 0.4s var(--ease), filter 0.4s var(--ease), border-color 0.35s var(--ease);
}
.stage__assist img {
  width: 100%;
  height: auto;
  display: block;
}
.stage__assist:hover {
  transform: translateY(-8px) scale(1.03);
  filter: drop-shadow(0 24px 48px rgba(0, 0, 0, 0.55)) drop-shadow(0 0 24px rgba(99, 102, 241, 0.25));
  border-color: rgba(129, 140, 248, 0.4);
}
.stage:hover .stage__link {
  filter: drop-shadow(0 0 8px rgba(165, 180, 252, 0.65));
}

.pain {
  padding-inline: 0.85rem;
  margin-inline: -0.85rem;
  border-radius: 12px;
  transition: background 0.3s var(--ease), box-shadow 0.3s var(--ease), transform 0.3s var(--ease);
}
.pain:hover {
  background: linear-gradient(90deg, rgba(99, 102, 241, 0.1), rgba(99, 102, 241, 0.02));
  box-shadow: inset 3px 0 0 var(--accent-2), 0 10px 28px rgba(0, 0, 0, 0.22);
  transform: translateX(4px);
}
.pain:hover h3 {
  color: #e0e7ff;
}

.story__list li {
  padding: 0.65rem 0.7rem;
  margin: 0 -0.7rem;
  border-radius: 14px;
  transition: background 0.25s var(--ease), box-shadow 0.25s var(--ease), transform 0.25s var(--ease);
}
.story__list li:hover {
  background: rgba(255, 255, 255, 0.03);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
  transform: translateY(-2px);
}
.step {
  box-shadow: 0 6px 14px rgba(99, 102, 241, 0.2);
  transition: transform 0.25s var(--ease), background 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.story__list li:hover .step {
  transform: scale(1.08);
  background: rgba(99, 102, 241, 0.28);
  box-shadow: 0 8px 20px rgba(99, 102, 241, 0.35);
}

.chat {
  transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease), border-color 0.35s var(--ease);
}
.chat:hover {
  transform: translateY(-4px);
  border-color: rgba(129, 140, 248, 0.3);
  box-shadow: var(--shadow-lg, 0 28px 70px rgba(0, 0, 0, 0.5)), 0 0 32px rgba(99, 102, 241, 0.12);
}
.chat__bubble {
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease), border-color 0.25s var(--ease);
}
.chat__bubble:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}
.chat__bubble--out:hover {
  border-color: rgba(129, 140, 248, 0.5);
}

.modules span {
  cursor: default;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  transition:
    transform 0.25s var(--ease),
    background 0.25s var(--ease),
    border-color 0.25s var(--ease),
    color 0.25s var(--ease),
    box-shadow 0.25s var(--ease);
}
.modules span:hover {
  color: var(--text);
  background: rgba(99, 102, 241, 0.14);
  border-color: rgba(129, 140, 248, 0.4);
  transform: translateY(-3px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(129, 140, 248, 0.12);
}

.cta {
  box-shadow: var(--shadow);
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease), border-color 0.4s var(--ease);
}
.cta:hover {
  transform: translateY(-3px);
  border-color: rgba(129, 140, 248, 0.28);
  box-shadow: var(--shadow-lg, 0 28px 70px rgba(0, 0, 0, 0.5)), 0 0 48px rgba(99, 102, 241, 0.14);
}

.footer a {
  transition: color 0.2s var(--ease), text-shadow 0.2s var(--ease);
}
.footer a:hover {
  color: var(--text);
  text-shadow: 0 0 18px rgba(129, 140, 248, 0.35);
}

@media (max-width: 959px) {
  .stage__dash:hover {
    transform: translateY(-4px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .brand:hover,
  .btn:hover,
  .nav__cta:hover,
  .stage__dash:hover,
  .stage__assist:hover,
  .pain:hover,
  .modules span:hover,
  .cta:hover,
  .chat:hover,
  .story__list li:hover,
  .hero__proof li:hover {
    transform: none !important;
  }
}
