/* =========================================================
   REVEAL STATES
========================================================= */
.reveal {
  opacity: 0;
  transform: translateY(1.6rem);
  transition:
    opacity var(--duration-slow) var(--ease-standard),
    transform var(--duration-slow) var(--ease-standard);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* =========================================================
   SYSTEM MOTION: MOVEMENT COMMUNICATES DATA FLOW
========================================================= */
.identity-topology__lines path {
  animation: topology-flow 13s linear infinite;
}

.identity-topology__lines circle:first-of-type {
  animation: topology-rotate 32s linear infinite;
  transform-origin: center;
}

.identity-topology__lines circle:last-of-type {
  animation: topology-rotate-reverse 46s linear infinite;
  transform-origin: center;
}

.identity-core::before {
  animation: topology-rotate 18s linear infinite;
}

.orbit-node.is-active {
  animation: node-confirm 420ms var(--ease-standard);
}

.continue-indicator i::after {
  animation: line-scan 2.8s var(--ease-standard) infinite;
}

.domain-map__connections path.is-active {
  animation: domain-flow 3s linear infinite;
}

.pipeline-link.is-complete i {
  animation: pipeline-confirm 520ms var(--ease-standard) both;
}

.stage-panel.is-active .packet--a {
  animation: packet-a 4.2s var(--ease-standard) infinite;
}

.stage-panel.is-active .packet--b {
  animation: packet-b 4.8s var(--ease-standard) 0.35s infinite;
}

.stage-panel.is-active .packet--c {
  animation: packet-c 5.2s var(--ease-standard) 0.7s infinite;
}

.stage-panel.is-active .wave--one {
  animation: wave-breathe 4s ease-in-out infinite;
}

.stage-panel.is-active .wave--two {
  animation: wave-breathe 4s ease-in-out 0.8s infinite;
}

.stage-panel.is-active .stage-waveform path {
  stroke-dasharray: 1100;
  stroke-dashoffset: 1100;
  animation: waveform-draw 2.2s var(--ease-standard) forwards;
}

.stage-panel.is-active .technology-chain i::before {
  animation: chain-pulse 2.6s linear infinite;
}

.technology-chain i::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 0.35rem;
  height: 0.35rem;
  content: "";
  transform: translateY(-50%);
  border-radius: 50%;
  background: var(--electric-blue);
  box-shadow: 0 0 8px rgba(var(--electric-blue-rgb), 0.7);
}

.architecture-view:not([hidden]) {
  animation: interface-enter 420ms var(--ease-standard) both;
}

.architecture-view:not([hidden]) .architecture-transfer span {
  animation: architecture-flow 2s linear infinite;
}

.evidence-frame {
  transition:
    border-color var(--duration-medium) ease,
    transform var(--duration-medium) var(--ease-standard);
}

.evidence-frame:hover {
  transform: translateY(-0.35rem);
  border-color: var(--line-strong);
}

.case-file__details:not([hidden]) {
  animation: case-open 420ms var(--ease-standard) both;
}

.case-file__visual--surrogate .visual-curve--one {
  animation: curve-drift 5s ease-in-out infinite alternate;
}

.case-file__visual--surrogate .visual-curve--two {
  animation: curve-drift 6s ease-in-out 0.4s infinite alternate-reverse;
}

.case-file:hover .pulse-dot--a {
  animation: embedded-pulse-a 2s linear infinite;
}

.case-file:hover .pulse-dot--b {
  animation: embedded-pulse-b 2s linear 0.5s infinite;
}

.case-file:hover .alert-marker {
  animation: alert-pulse 1.8s ease-in-out infinite;
}


.case-file--publication:hover .publication-wave,
.case-file--publication.is-open .publication-wave {
  animation: publication-signal 3.4s ease-in-out infinite;
}

.case-file--publication.is-open .publication-channel {
  animation: publication-channel-active 2.8s ease-in-out infinite;
}

.system-display.is-updating [data-system-title],
.system-display.is-updating [data-system-description],
.system-display.is-updating [data-system-tools],
.system-display.is-updating [data-system-projects] {
  animation: system-refresh 360ms var(--ease-standard) both;
}

.system-path--main {
  stroke-dasharray: 9 12;
  animation: system-path-flow 8s linear infinite;
}

.system-pulse--a {
  animation: signal-glow 2.5s ease-in-out infinite;
}

.system-pulse--b {
  animation: signal-glow 2.5s ease-in-out 0.8s infinite;
}

.system-pulse--c {
  animation: signal-glow 2.5s ease-in-out 1.6s infinite;
}

.contact-success:not([hidden]) .contact-success__signal span:nth-child(1) {
  animation: confirmation-signal 1.5s ease-in-out infinite;
}

.contact-success:not([hidden]) .contact-success__signal span:nth-child(2) {
  animation: confirmation-signal 1.5s ease-in-out 0.2s infinite;
}

.contact-success:not([hidden]) .contact-success__signal span:nth-child(3) {
  animation: confirmation-signal 1.5s ease-in-out 0.4s infinite;
}

.mobile-navigation:not([hidden]) {
  animation: menu-enter 260ms var(--ease-standard) both;
}

@keyframes topology-flow {
  to { stroke-dashoffset: -140; }
}

@keyframes topology-rotate {
  to { transform: rotate(360deg); }
}

@keyframes topology-rotate-reverse {
  to { transform: rotate(-360deg); }
}

@keyframes node-confirm {
  0% { box-shadow: 0 0 0 rgba(var(--electric-blue-rgb), 0); }
  50% { box-shadow: 0 0 0 0.5rem rgba(var(--electric-blue-rgb), 0.08); }
  100% { box-shadow: var(--shadow-blue); }
}

@keyframes line-scan {
  0% { transform: translateX(-100%); }
  55%, 100% { transform: translateX(100%); }
}

@keyframes domain-flow {
  to { stroke-dashoffset: -60; }
}

@keyframes pipeline-confirm {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}

@keyframes packet-a {
  0%, 100% { transform: translate(0, 0); opacity: 0.25; }
  45% { transform: translate(13rem, 5rem); opacity: 1; }
  70% { transform: translate(18rem, 7rem); opacity: 0; }
}

@keyframes packet-b {
  0%, 100% { transform: translate(0, 0); opacity: 0.2; }
  48% { transform: translate(-14rem, -4rem); opacity: 1; }
  72% { transform: translate(-19rem, -6rem); opacity: 0; }
}

@keyframes packet-c {
  0%, 100% { transform: translate(0, 0); opacity: 0.2; }
  48% { transform: translate(-8rem, 7rem); opacity: 1; }
  72% { transform: translate(-11rem, 9rem); opacity: 0; }
}

@keyframes wave-breathe {
  0%, 100% { opacity: 0.35; transform: translateX(-50%) scale(0.92); }
  50% { opacity: 0.85; transform: translateX(-50%) scale(1.04); }
}

@keyframes waveform-draw {
  to { stroke-dashoffset: 0; }
}

@keyframes chain-pulse {
  from { left: 0; }
  to { left: calc(100% - 0.35rem); }
}

@keyframes interface-enter {
  from { opacity: 0; transform: scale(0.985); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes architecture-flow {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

@keyframes case-open {
  from { opacity: 0; transform: translateY(-0.6rem); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes curve-drift {
  from { transform: skewY(-10deg) translateY(0); }
  to { transform: skewY(-4deg) translateY(-0.55rem); }
}

@keyframes embedded-pulse-a {
  from { left: 21%; opacity: 0; }
  20% { opacity: 1; }
  to { left: 46%; opacity: 0; }
}

@keyframes embedded-pulse-b {
  from { right: 46%; opacity: 0; }
  20% { opacity: 1; }
  to { right: 21%; opacity: 0; }
}

@keyframes alert-pulse {
  0%, 100% { transform: scale(0.82); opacity: 0.55; }
  50% { transform: scale(1.1); opacity: 1; }
}

@keyframes publication-signal {
  0%, 100% { opacity: 0.35; transform: translateX(0) skewX(-18deg); }
  50% { opacity: 0.9; transform: translateX(1.2rem) skewX(-18deg); }
}

@keyframes publication-channel-active {
  0%, 100% { box-shadow: inset 0 0 0 0.55rem rgba(var(--electric-blue-rgb), 0.035); }
  50% { box-shadow: inset 0 0 0 0.55rem rgba(var(--electric-blue-rgb), 0.11), 0 0 18px rgba(var(--electric-blue-rgb), 0.12); }
}

@keyframes system-refresh {
  from { opacity: 0; transform: translateY(0.45rem); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes system-path-flow {
  to { stroke-dashoffset: -84; }
}

@keyframes signal-glow {
  0%, 100% { opacity: 0.35; transform: scale(0.85); }
  50% { opacity: 1; transform: scale(1.2); }
}

@keyframes confirmation-signal {
  0%, 100% { opacity: 0.35; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(-0.35rem); }
}

@keyframes menu-enter {
  from { opacity: 0; transform: translateY(-0.65rem); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}
