/* One document-sized field, independent of scroll and pointer position. */
body { position: relative; isolation: isolate; }
.ambient-figures { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: clip; }
.ambient-figure { position: absolute; width: clamp(40px, 4.6vw, 64px); aspect-ratio: 1; opacity: .25; transform: translate(-50%, -50%); }
.ambient-figure-spin { display: block; width: 100%; height: 100%; transform-origin: 50% 50%; }
.ambient-figure:nth-child(1) { left: 12.50%; top: 16.67%; --spin-time: 109s; --spin-phase: -0s; --spin-direction: normal; }
.ambient-figure:nth-child(2) { left: 37.50%; top: 16.67%; --spin-time: 126s; --spin-phase: -7s; --spin-direction: reverse; }
.ambient-figure:nth-child(3) { left: 62.50%; top: 16.67%; --spin-time: 143s; --spin-phase: -14s; --spin-direction: normal; }
.ambient-figure:nth-child(4) { left: 87.50%; top: 16.67%; --spin-time: 160s; --spin-phase: -21s; --spin-direction: reverse; }
.ambient-figure:nth-child(5) { left: 12.50%; top: 50.00%; --spin-time: 114s; --spin-phase: -28s; --spin-direction: normal; }
.ambient-figure:nth-child(6) { left: 37.50%; top: 50.00%; --spin-time: 131s; --spin-phase: -35s; --spin-direction: reverse; }
.ambient-figure:nth-child(7) { left: 62.50%; top: 50.00%; --spin-time: 148s; --spin-phase: -42s; --spin-direction: normal; }
.ambient-figure:nth-child(8) { left: 87.50%; top: 50.00%; --spin-time: 165s; --spin-phase: -49s; --spin-direction: reverse; }
.ambient-figure:nth-child(9) { left: 12.50%; top: 83.33%; --spin-time: 119s; --spin-phase: -56s; --spin-direction: normal; }
.ambient-figure:nth-child(10) { left: 37.50%; top: 83.33%; --spin-time: 136s; --spin-phase: -63s; --spin-direction: reverse; }
.ambient-figure:nth-child(11) { left: 62.50%; top: 83.33%; --spin-time: 153s; --spin-phase: -70s; --spin-direction: normal; }
.ambient-figure:nth-child(12) { left: 87.50%; top: 83.33%; --spin-time: 170s; --spin-phase: -77s; --spin-direction: reverse; }
@media (max-width: 599px) {
.ambient-figure:nth-child(1) { left: 25.00%; top: 8.33%; --spin-time: 109s; --spin-phase: -0s; --spin-direction: normal; }
.ambient-figure:nth-child(2) { left: 75.00%; top: 8.33%; --spin-time: 126s; --spin-phase: -7s; --spin-direction: reverse; }
.ambient-figure:nth-child(3) { left: 25.00%; top: 25.00%; --spin-time: 143s; --spin-phase: -14s; --spin-direction: normal; }
.ambient-figure:nth-child(4) { left: 75.00%; top: 25.00%; --spin-time: 160s; --spin-phase: -21s; --spin-direction: reverse; }
.ambient-figure:nth-child(5) { left: 25.00%; top: 41.67%; --spin-time: 114s; --spin-phase: -28s; --spin-direction: normal; }
.ambient-figure:nth-child(6) { left: 75.00%; top: 41.67%; --spin-time: 131s; --spin-phase: -35s; --spin-direction: reverse; }
.ambient-figure:nth-child(7) { left: 25.00%; top: 58.33%; --spin-time: 148s; --spin-phase: -42s; --spin-direction: normal; }
.ambient-figure:nth-child(8) { left: 75.00%; top: 58.33%; --spin-time: 165s; --spin-phase: -49s; --spin-direction: reverse; }
.ambient-figure:nth-child(9) { left: 25.00%; top: 75.00%; --spin-time: 119s; --spin-phase: -56s; --spin-direction: normal; }
.ambient-figure:nth-child(10) { left: 75.00%; top: 75.00%; --spin-time: 136s; --spin-phase: -63s; --spin-direction: reverse; }
.ambient-figure:nth-child(11) { left: 25.00%; top: 91.67%; --spin-time: 153s; --spin-phase: -70s; --spin-direction: normal; }
.ambient-figure:nth-child(12) { left: 75.00%; top: 91.67%; --spin-time: 170s; --spin-phase: -77s; --spin-direction: reverse; }
}
.ambient-figures[data-flow] .ambient-figure { left: 0; top: 0; will-change: transform; }
@media (prefers-reduced-motion: no-preference) {
  .ambient-figures[data-flow] .ambient-figure-spin { animation: figures-spin var(--spin-time) linear var(--spin-phase) infinite var(--spin-direction); }
  .ambient-figures[data-paused] .ambient-figure-spin { animation-play-state: paused; }
}
@keyframes figures-spin { to { transform: rotate(1turn); } }
@media print { .ambient-figures { display: none; } }

/* Keep the figures below text, cards and controls, above section backgrounds. */
main > section[class] { position: relative; isolation: auto; }
main > section[class] > .shell, main > .shell, .site-footer > .shell { position: relative; z-index: 3; }
.hero-background, .agent-decoration, .contact-section::after { z-index: 0; }
.hero::before { z-index: 1; }
