@charset "UTF-8";

body { isolation: isolate; }
main, .site-footer { position: relative; z-index: 1; }
.tech-atmosphere { position: fixed; inset: 0; z-index: 2; overflow: hidden; pointer-events: none; contain: strict; }
.tech-particles { display: block; width: 100%; height: 100%; opacity: .24; }
.hero-art { translate: var(--parallax-x, 0px) var(--parallax-y, 0px); }

html[data-motion] .hero-art > img { animation: cinema-frame-breathe 42s ease-in-out infinite alternate paused; }
html[data-motion="running"][data-page-visibility="visible"] .hero-art > img { animation-play-state: running; }
html:is([data-motion="reduced"], [data-motion="static"]) .hero-art { translate: none; }
html:is([data-motion="reduced"], [data-motion="static"]) .hero-art > img { animation: none; }
@keyframes cinema-frame-breathe { from { scale: 1; } to { scale: 1.025; } }

.motion-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 6px 10px;
  border: 1px solid #526b85;
  border-radius: 7px;
  background: #101923;
  color: #d0dfef;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  transition: border-color .2s ease, background .2s ease;
}
.motion-toggle:not(:disabled):hover { border-color: var(--accent); background: #203044; }
.motion-toggle:disabled { cursor: default; }
.motion-icon { width: 16px; height: 16px; color: var(--accent); }
html:is([data-motion="paused"], [data-motion="reduced"]) .motion-icon { color: #a0aec0; }

@media (max-width: 680px) {
  .tech-particles { opacity: .13; }
}
@media (pointer: coarse) {
  .hero-art { translate: none !important; }
}
@media (prefers-reduced-motion: reduce), print {
  .tech-atmosphere { display: none; }
  .hero-art { translate: none !important; }
  html[data-motion] .hero-art > img { animation: none !important; }
}
@media print {
  .motion-toggle { display: none; }
}