:root { --motion-ease: cubic-bezier(.16, 1, .3, 1); --motion-settle: cubic-bezier(.22, .8, .24, 1); }
html { scrollbar-gutter: stable; }
.button { position: relative; isolation: isolate; overflow: hidden; transition: background .24s ease, border-color .24s ease, color .24s ease, box-shadow .35s var(--motion-ease); }
.button::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: -1;
  background: radial-gradient(110px circle at var(--pointer-x, 50%) var(--pointer-y, 50%), #ffffff21, transparent 75%);
  opacity: 0; transition: opacity .4s ease;
}
.button[data-pointer-lit]::before { opacity: 1; }
.button:active:not(:disabled) { box-shadow: inset 0 0 0 100px #ffffff12; }
.button > span { transition: opacity .18s ease; }
.button:active > span { opacity: .7; }
.inline-link { transition: color .24s ease, border-color .24s ease; }
.pricing-card, .download-primary { position: relative; isolation: isolate; }
.pricing-card::after, .download-primary::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(320px circle at var(--pointer-x, 50%) var(--pointer-y, 50%), #a992e60b, transparent 75%);
  opacity: 0; transition: opacity .45s ease;
}
.pricing-card[data-pointer-lit]::after, .download-primary[data-pointer-lit]::after { opacity: 1; }
.pricing-card, .download-primary { transition: border-color .3s ease, background .3s ease, box-shadow .4s var(--motion-ease); }
.pricing-card:hover, .download-primary:hover { border-color: #b3a0ff36; box-shadow: 0 20px 55px -40px #9e80ee33; }
.journey-strip { --journey-progress: 0; position: relative; }
.journey-strip::after {
  content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px;
  transform: scaleX(var(--journey-progress)); transform-origin: left; pointer-events: none;
  background: linear-gradient(90deg, #a88bdd00, #b3a0ff88 55%, #b3a0ff00);
}
.journey-strip > div > span { transition: color .4s ease; }
.journey-strip[data-journey-active="0"] > div > span:nth-of-type(1),
.journey-strip[data-journey-active="1"] > div > span:nth-of-type(2),
.journey-strip[data-journey-active="2"] > div > span:nth-of-type(3),
.journey-strip[data-journey-active="3"] > div > span:nth-of-type(4),
.journey-strip[data-journey-active="4"] > div > span:nth-of-type(5) { color: #ded2ff; }
.studio-bento article { --scene-focus: 0; transition: border-color .5s ease; }
.studio-bento article.scene-in-view { border-top-color: #b3a0ff2b; }
.studio-bento .bento-note { translate: calc(var(--scene-focus) * -8px) calc(var(--scene-focus) * -7px); }
.studio-bento .bento-image { translate: calc(var(--scene-focus) * 7px) 0; }
.asset-stack img { will-change: translate, rotate; }
.asset-stack img:nth-child(1) { translate: calc(var(--scene-focus) * -15px) calc(var(--scene-focus) * 8px); rotate: calc(-5deg - var(--scene-focus) * 4deg); }
.asset-stack img:nth-child(2) { translate: 0 calc(var(--scene-focus) * -9px); }
.asset-stack img:nth-child(3) { translate: calc(var(--scene-focus) * 15px) calc(var(--scene-focus) * 8px); rotate: calc(5deg + var(--scene-focus) * 4deg); }
.closing-cta::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(500px circle at var(--pointer-x, 50%) var(--pointer-y, 100%), #ab80ee09, transparent 75%);
  opacity: 0; transition: opacity .7s ease;
}
.closing-cta[data-pointer-lit]::after { opacity: 1; }
.closing-actions { position: relative; z-index: 1; }
@media (max-width: 650px) {
  .studio-bento .bento-note { translate: calc(var(--scene-focus) * -4px) calc(var(--scene-focus) * -4px); }
  .asset-stack img:nth-child(1) { translate: calc(var(--scene-focus) * -8px) calc(var(--scene-focus) * 5px); rotate: calc(-5deg - var(--scene-focus) * 2deg); }
  .asset-stack img:nth-child(3) { translate: calc(var(--scene-focus) * 8px) calc(var(--scene-focus) * 5px); rotate: calc(5deg + var(--scene-focus) * 2deg); }
}
@media (prefers-reduced-motion: reduce) {
  :root:not([data-website-motion="full"]) .button::before, :root:not([data-website-motion="full"]) .pricing-card::after, :root:not([data-website-motion="full"]) .download-primary::after, :root:not([data-website-motion="full"]) .closing-cta::after { display: none; }
  :root:not([data-website-motion="full"]) .asset-stack img { will-change: auto; }
  :root:not([data-website-motion="full"]) .asset-stack img, :root:not([data-website-motion="full"]) .studio-bento .bento-note, :root:not([data-website-motion="full"]) .studio-bento .bento-image { translate: none; }
  :root:not([data-website-motion="full"]) .asset-stack img:nth-child(1) { rotate: -5deg; }
  :root:not([data-website-motion="full"]) .asset-stack img:nth-child(3) { rotate: 5deg; }
}
