/* tilt + glare */
.tilt {
  transition: transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1);
  will-change: transform;
  position: relative;
}
.v-card.tilt::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(260px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, 0.75), transparent 60%);
  mix-blend-mode: soft-light;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}
.panel:hover .v-card.tilt::after,
.rail-card:hover .v-card.tilt::after,
.tp-media:hover .v-card.tilt::after,
.sw-media:hover .v-card.tilt::after {
  opacity: 1;
}
/* spotlight on dark surfaces */
.dark,
.hero-dark,
.cta-band {
  position: relative;
  isolation: isolate;
}
.dark::before,
.hero-dark::before,
.cta-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(520px circle at var(--mx, 70%) var(--my, 10%), rgba(124, 134, 255, 0.28), transparent 62%);
}
.dl-item {
  transition:
    border-color 0.3s,
    background 0.3s,
    transform 0.3s;
}
.dl-item:hover {
  border-color: rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.05);
  transform: translateX(6px);
}
.step {
  transition:
    background 0.5s,
    border-color 0.5s,
    transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.step.lit {
  background: rgba(124, 134, 255, 0.22);
  border-color: rgba(185, 194, 255, 0.7);
  transform: translateY(-6px);
}
.step.lit b {
  text-shadow: 0 0 24px rgba(185, 194, 255, 0.9);
}
/* hover lifts, button shine */
.card,
.res,
.story,
.result,
.agent-card,
.split-card,
.int,
.logo {
  transition:
    transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1),
    box-shadow 0.35s,
    background 0.25s;
}
a.card:hover,
.res:hover,
.story:hover,
.agent-card:hover,
.split-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
}
.int:hover {
  transform: translateY(-3px);
  background: #fff;
}
.btn-solid,
.btn-accent,
.btn-light {
  position: relative;
  overflow: hidden;
}
.btn-solid::after,
.btn-accent::after,
.btn-light::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.35) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform 0.7s;
}
.btn-light::after {
  background: linear-gradient(105deg, transparent 35%, rgba(78, 89, 241, 0.25) 50%, transparent 65%);
}
.btn-solid:hover::after,
.btn-accent:hover::after,
.btn-light:hover::after {
  transform: translateX(120%);
}
.trio i {
  animation: drift 5s ease-in-out infinite;
}
.trio i:nth-child(2) {
  animation-delay: -1.6s;
}
.trio i:nth-child(3) {
  animation-delay: -3.2s;
}
.cta-band {
  background:
    linear-gradient(100deg, var(--ink-90) 35%, rgba(6, 19, 54, 0.55)),
    linear-gradient(135deg, var(--accent), var(--accent-3), var(--accent-2));
  background-size:
    auto,
    300% 300%;
  animation: ctaflow 14s ease infinite;
}
@keyframes ctaflow {
  0%,
  100% {
    background-position:
      0 0,
      0 50%;
  }
  50% {
    background-position:
      0 0,
      100% 50%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .split .w > span {
    transform: none;
    opacity: 1;
    filter: none;
  }
  * {
    animation: none !important;
    transition: none !important;
  }
  html {
    scroll-behavior: auto;
  }
  .js [data-reveal],
  .js [data-chat] [data-step] {
    opacity: 1;
    transform: none;
  }
}
