body.motion-enhanced {
  --motion-glow-x: 50%;
  --motion-glow-y: 30%;
}

body.motion-enhanced .site-header,
body.motion-enhanced .nav {
  transition: background 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

body.motion-enhanced .site-header:hover,
body.motion-enhanced .nav:hover {
  box-shadow: 0 14px 34px rgba(16, 35, 61, 0.08);
}

body.motion-enhanced .page-hero,
body.motion-enhanced .hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

body.motion-enhanced .page-hero::before,
body.motion-enhanced .hero::before {
  content: "";
  position: absolute;
  inset: -12% auto auto -10%;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(16, 89, 176, 0.12), transparent 70%);
  filter: blur(8px);
  animation: motionDrift 11s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}

body.motion-enhanced .page-hero::after,
body.motion-enhanced .hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at var(--motion-glow-x) var(--motion-glow-y), rgba(15, 118, 110, 0.12), transparent 18%),
    linear-gradient(110deg, transparent 0%, rgba(255, 255, 255, 0.08) 48%, transparent 100%);
  transform: translateX(-100%);
  animation: motionSweep 9s linear infinite;
  pointer-events: none;
  z-index: 0;
}

body.motion-enhanced .motion-scene {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

body.motion-enhanced .motion-chip,
body.motion-enhanced .motion-node,
body.motion-enhanced .motion-line,
body.motion-enhanced .motion-beam,
body.motion-enhanced .motion-dot {
  position: absolute;
  pointer-events: none;
}

body.motion-enhanced .motion-chip,
body.motion-enhanced .motion-node {
  border: 1px solid rgba(16, 89, 176, 0.14);
  background: rgba(255, 255, 255, 0.46);
  backdrop-filter: blur(8px);
  box-shadow: 0 14px 28px rgba(16, 35, 61, 0.06);
}

body.motion-enhanced .motion-line {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(16, 89, 176, 0.55), transparent);
  animation: motionLineDrift 8s linear infinite;
  opacity: 0.7;
}

body.motion-enhanced .motion-beam {
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(15, 118, 110, 0.45), transparent);
  animation: motionBeamRise 6.5s linear infinite;
  opacity: 0.7;
}

body.motion-enhanced .motion-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(16, 89, 176, 0.95), rgba(15, 118, 110, 0.95));
  box-shadow: 0 0 0 8px rgba(16, 89, 176, 0.08), 0 0 22px rgba(16, 89, 176, 0.24);
  animation: motionDotPulse 3.8s ease-in-out infinite;
}

body.motion-enhanced .motion-node {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(16, 89, 176, 0.9), rgba(15, 118, 110, 0.9));
  box-shadow: 0 0 0 10px rgba(16, 89, 176, 0.08);
  animation: motionDotPulse 4.6s ease-in-out infinite;
}

body.motion-enhanced .motion-chip {
  min-width: 140px;
  padding: 12px 14px;
  border-radius: 18px;
  color: var(--ink, #10233d);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  animation: motionCardFloat 7s ease-in-out infinite;
}

body.motion-enhanced .motion-chip span {
  display: block;
  margin-top: 6px;
  color: rgba(16, 35, 61, 0.66);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: 0;
}

body.motion-enhanced .page-hero > *,
body.motion-enhanced .hero > *,
body.motion-enhanced .hero-inner > *,
body.motion-enhanced .hero-panel > *,
body.motion-enhanced .hero-board > * {
  position: relative;
  z-index: 1;
}

body.motion-enhanced .card,
body.motion-enhanced .section-card,
body.motion-enhanced .workflow-step,
body.motion-enhanced .tool,
body.motion-enhanced .service,
body.motion-enhanced .result-card,
body.motion-enhanced .search-panel,
body.motion-enhanced .results-panel,
body.motion-enhanced .journey-item,
body.motion-enhanced .trust-panel,
body.motion-enhanced .audience-card,
body.motion-enhanced .pain,
body.motion-enhanced .step,
body.motion-enhanced .module,
body.motion-enhanced .mini,
body.motion-enhanced .stat,
body.motion-enhanced .process-item,
body.motion-enhanced .tier,
body.motion-enhanced .tool-link,
body.motion-enhanced .tier-link {
  transition:
    transform 0.28s ease,
    box-shadow 0.28s ease,
    border-color 0.28s ease,
    background 0.28s ease;
  transform: translateY(0);
}

body.motion-enhanced .card:hover,
body.motion-enhanced .section-card:hover,
body.motion-enhanced .workflow-step:hover,
body.motion-enhanced .tool:hover,
body.motion-enhanced .service:hover,
body.motion-enhanced .result-card:hover,
body.motion-enhanced .search-panel:hover,
body.motion-enhanced .results-panel:hover,
body.motion-enhanced .journey-item:hover,
body.motion-enhanced .trust-panel:hover,
body.motion-enhanced .audience-card:hover,
body.motion-enhanced .pain:hover,
body.motion-enhanced .step:hover,
body.motion-enhanced .module:hover,
body.motion-enhanced .mini:hover,
body.motion-enhanced .stat:hover,
body.motion-enhanced .process-item:hover,
body.motion-enhanced .tier:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 38px rgba(16, 35, 61, 0.12);
}

body.motion-enhanced .motion-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.68s ease, transform 0.68s ease;
  transition-delay: var(--motion-delay, 0s);
}

body.motion-enhanced .motion-reveal.motion-visible {
  opacity: 1;
  transform: translateY(0);
}

body.motion-enhanced .hero-actions .btn,
body.motion-enhanced .hero-actions .btn-primary,
body.motion-enhanced .hero-actions .btn-outline,
body.motion-enhanced .hero-actions .btn-ghost,
body.motion-enhanced .btn-primary,
body.motion-enhanced .btn-outline,
body.motion-enhanced .btn-ghost,
body.motion-enhanced .btn-secondary,
body.motion-enhanced .nav-action,
body.motion-enhanced .nav-cta {
  transition: transform 0.24s ease, box-shadow 0.24s ease, filter 0.24s ease;
}

body.motion-enhanced .hero-actions .btn:hover,
body.motion-enhanced .hero-actions .btn-primary:hover,
body.motion-enhanced .hero-actions .btn-outline:hover,
body.motion-enhanced .hero-actions .btn-ghost:hover,
body.motion-enhanced .btn-primary:hover,
body.motion-enhanced .btn-outline:hover,
body.motion-enhanced .btn-ghost:hover,
body.motion-enhanced .btn-secondary:hover,
body.motion-enhanced .nav-action:hover,
body.motion-enhanced .nav-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(16, 89, 176, 0.16);
  filter: saturate(1.03);
}

body.motion-enhanced.motion-page-downloads .page-hero::before {
  background: radial-gradient(circle, rgba(16, 89, 176, 0.16), transparent 70%);
}

body.motion-enhanced.motion-page-downloads .motion-chip.a { top: 78px; left: 7%; }
body.motion-enhanced.motion-page-downloads .motion-chip.b { right: 8%; top: 128px; animation-delay: 1.2s; }
body.motion-enhanced.motion-page-downloads .motion-line.a { top: 112px; left: 18%; width: 280px; }
body.motion-enhanced.motion-page-downloads .motion-line.b { top: 220px; right: 14%; width: 240px; animation-delay: 2s; }
body.motion-enhanced.motion-page-downloads .motion-beam.a { right: 22%; top: 60px; height: 180px; }

body.motion-enhanced.motion-page-knowledge-map .motion-node.a { left: 14%; top: 110px; }
body.motion-enhanced.motion-page-knowledge-map .motion-node.b { left: 50%; top: 72px; animation-delay: 1.1s; }
body.motion-enhanced.motion-page-knowledge-map .motion-node.c { right: 16%; top: 140px; animation-delay: 2s; }
body.motion-enhanced.motion-page-knowledge-map .motion-line.a { top: 117px; left: 16%; width: 38%; }
body.motion-enhanced.motion-page-knowledge-map .motion-line.b { top: 117px; right: 16%; width: 24%; }
body.motion-enhanced.motion-page-knowledge-map .motion-chip.a { left: 24%; top: 170px; min-width: 160px; }
body.motion-enhanced.motion-page-knowledge-map .motion-chip.b { right: 12%; top: 222px; min-width: 150px; animation-delay: 1.3s; }

body.motion-enhanced.motion-page-knowledge-search .motion-line.a { top: 96px; left: 10%; width: 320px; }
body.motion-enhanced.motion-page-knowledge-search .motion-line.b { top: 184px; left: 22%; width: 260px; animation-delay: 1.8s; }
body.motion-enhanced.motion-page-knowledge-search .motion-beam.a { right: 17%; top: 48px; height: 200px; }
body.motion-enhanced.motion-page-knowledge-search .motion-chip.a { right: 8%; top: 88px; min-width: 168px; }
body.motion-enhanced.motion-page-knowledge-search .motion-chip.b { right: 18%; top: 212px; min-width: 150px; animation-delay: 1.1s; }

body.motion-enhanced.motion-page-hazard-search .page-hero::before {
  background: radial-gradient(circle, rgba(11, 45, 87, 0.16), transparent 70%);
}
body.motion-enhanced.motion-page-hazard-search .motion-dot.a { left: 12%; top: 120px; }
body.motion-enhanced.motion-page-hazard-search .motion-dot.b { right: 14%; top: 98px; animation-delay: 1.4s; }
body.motion-enhanced.motion-page-hazard-search .motion-chip.a { left: 20%; top: 166px; }
body.motion-enhanced.motion-page-hazard-search .motion-chip.b { right: 10%; top: 196px; animation-delay: 1.3s; }
body.motion-enhanced.motion-page-hazard-search .motion-line.a { top: 126px; left: 14%; width: 220px; }
body.motion-enhanced.motion-page-hazard-search .motion-beam.a { left: 50%; top: 64px; height: 180px; }

body.motion-enhanced.motion-page-report-generator .hero::before {
  background: radial-gradient(circle, rgba(15, 118, 110, 0.14), transparent 70%);
}
body.motion-enhanced.motion-page-report-generator .motion-chip.a { top: 34px; right: 6%; min-width: 170px; }
body.motion-enhanced.motion-page-report-generator .motion-chip.b { top: 120px; right: 16%; min-width: 150px; animation-delay: 1.4s; }
body.motion-enhanced.motion-page-report-generator .motion-line.a { top: 92px; right: 22%; width: 240px; }
body.motion-enhanced.motion-page-report-generator .motion-beam.a { right: 28%; top: 40px; height: 170px; }

body.motion-enhanced.motion-page-enterprise .motion-chip.a,
body.motion-enhanced.motion-page-station .motion-chip.a,
body.motion-enhanced.motion-page-terminal .motion-chip.a {
  top: 90px;
  right: 7%;
  min-width: 170px;
}

body.motion-enhanced.motion-page-enterprise .motion-chip.b,
body.motion-enhanced.motion-page-station .motion-chip.b,
body.motion-enhanced.motion-page-terminal .motion-chip.b {
  bottom: 80px;
  right: 16%;
  min-width: 155px;
  animation-delay: 1.2s;
}

body.motion-enhanced.motion-page-enterprise .motion-line.a,
body.motion-enhanced.motion-page-station .motion-line.a,
body.motion-enhanced.motion-page-terminal .motion-line.a {
  top: 126px;
  right: 18%;
  width: 250px;
}

body.motion-enhanced.motion-page-docs .motion-chip.a { top: 80px; right: 8%; min-width: 180px; }
body.motion-enhanced.motion-page-docs .motion-chip.b { top: 178px; right: 18%; min-width: 160px; animation-delay: 1.1s; }
body.motion-enhanced.motion-page-docs .motion-line.a { top: 120px; right: 23%; width: 230px; }
body.motion-enhanced.motion-page-docs .motion-beam.a { right: 14%; top: 58px; height: 190px; }

body.motion-enhanced.motion-page-tools .motion-chip.a,
body.motion-enhanced.motion-page-member .motion-chip.a,
body.motion-enhanced.motion-page-hazards .motion-chip.a {
  top: 84px;
  left: 8%;
}

body.motion-enhanced.motion-page-tools .motion-chip.b,
body.motion-enhanced.motion-page-member .motion-chip.b,
body.motion-enhanced.motion-page-hazards .motion-chip.b {
  top: 162px;
  right: 10%;
  animation-delay: 1.1s;
}

body.motion-enhanced.motion-page-tools .motion-line.a,
body.motion-enhanced.motion-page-member .motion-line.a,
body.motion-enhanced.motion-page-hazards .motion-line.a {
  top: 118px;
  left: 16%;
  width: 260px;
}

@keyframes motionSweep {
  to { transform: translateX(100%); }
}

@keyframes motionDrift {
  50% {
    transform: translate3d(0, -16px, 0) scale(1.08);
    opacity: 0.82;
  }
}

@keyframes motionCardFloat {
  50% { transform: translateY(-7px); }
}

@keyframes motionLineDrift {
  from { transform: translateX(-120%); opacity: 0; }
  18% { opacity: 0.8; }
  82% { opacity: 0.8; }
  to { transform: translateX(120%); opacity: 0; }
}

@keyframes motionBeamRise {
  from { transform: translateY(100%); opacity: 0; }
  16% { opacity: 0.72; }
  84% { opacity: 0.72; }
  to { transform: translateY(-100%); opacity: 0; }
}

@keyframes motionDotPulse {
  50% {
    transform: scale(1.12);
    box-shadow: 0 0 0 14px rgba(16, 89, 176, 0.05), 0 0 28px rgba(16, 89, 176, 0.22);
  }
}

@media (max-width: 900px) {
  body.motion-enhanced .motion-scene {
    display: none;
  }
}