/* Cerebo motion enhancement. The captured layout stylesheet is authoritative.
   Only paint/composite properties animate. No dimensions, gaps, positioning,
   font metrics, or original content are changed. */

@keyframes cerebo-reveal {
  from { opacity: 0; transform: translate3d(0, 14px, 0); }
  to { opacity: 1; transform: none; }
}

@keyframes cerebo-flow {
  0%, 100% { opacity: .48; filter: brightness(.9); }
  50% { opacity: 1; filter: brightness(1.35); }
}

@keyframes cerebo-core {
  0%, 100% { filter: drop-shadow(0 0 22px #1885fff2); }
  50% { filter: drop-shadow(0 0 29px #1885fff2); }
}

@keyframes cerebo-line {
  0%, 100% { opacity: .5; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: no-preference) {
  html[data-cerebo-motion="on"] .cerebo-enter {
    animation: cerebo-reveal 740ms cubic-bezier(.22, 1, .36, 1) both;
    animation-delay: var(--cerebo-delay, 0ms);
  }

  html[data-cerebo-motion="on"] .solution-flow::before {
    animation: cerebo-flow 5.2s ease-in-out infinite;
  }

  html[data-cerebo-motion="on"] .core-orb img {
    animation: cerebo-core 5.6s ease-in-out infinite;
  }

  html[data-cerebo-motion="on"] .platform-nodes button.selected::after {
    animation: cerebo-line 2.4s ease-in-out infinite;
  }

  html[data-cerebo-motion="on"] .primary-button > span {
    transition: transform 240ms cubic-bezier(.22, 1, .36, 1);
  }

  html[data-cerebo-motion="on"] .primary-button:hover > span,
  html[data-cerebo-motion="on"] .primary-button:focus-visible > span {
    transform: translateX(4px);
  }

  html[data-cerebo-motion="on"] .story-line i {
    animation: cerebo-line 3.8s ease-in-out infinite;
  }

  html[data-cerebo-motion="on"] .story-line i:nth-child(2) { animation-delay: .3s; }
  html[data-cerebo-motion="on"] .story-line i:nth-child(3) { animation-delay: .6s; }

  /* Stop perpetual paint work in offscreen sections and hidden tabs. */
  html[data-cerebo-motion="on"] .cerebo-motion-paused::before,
  html[data-cerebo-motion="on"] .cerebo-motion-paused::after,
  html[data-cerebo-motion="on"] .cerebo-motion-paused,
  html[data-cerebo-motion="on"] .cerebo-motion-paused img,
  html[data-cerebo-motion="on"] .cerebo-motion-paused i,
  html[data-cerebo-motion="on"] .cerebo-motion-paused button::after {
    animation-play-state: paused;
  }
}

/* Original animations and the added layer both honor the OS preference. */
@media (prefers-reduced-motion: reduce) {
  html .cerebo-enter { opacity: 1; transform: none; animation: none; }
}

@media print {
  html .cerebo-enter { opacity: 1; transform: none; animation: none; }
}