.shape-stack{align-items:center;aspect-ratio:1/1;display:flex;justify-content:center;margin:0 auto;max-height:400px;max-width:400px;position:relative}@media(max-width:782px){.shape-stack{max-height:200px;max-width:200px}}.shape-stack__item{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;transform-origin:center center;width:100%}.shape-stack__orbit .shape-stack__shape{scale:1.1}.shape-stack__orbit .shape-stack__overlay{animation:orbit 8s cubic-bezier(.25,0,.25,1) infinite}@keyframes orbit{0%{transform:rotate(0deg)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}to{transform:rotate(1turn)}}.shape-stack__balance .shape-stack__shape{animation:balance 8s cubic-bezier(.25,0,.25,1) infinite}@keyframes balance{0%{transform:scaleX(1.1) scaleY(1.1)}25%{transform:scaleX(-1.1) scaleY(-1.1)}50%{transform:scaleX(-1.1) scaleY(1.1)}75%{transform:scaleX(1.1) scaleY(-1.1)}to{transform:scaleX(1.1) scaleY(1.1)}}.shape-stack__converge .shape-stack__shape{animation:converge-shape 8s cubic-bezier(.25,0,.25,1) infinite}.shape-stack__converge .shape-stack__overlay{animation:converge-overlay 8s cubic-bezier(.25,0,.25,1) infinite}@keyframes converge-shape{0%{transform:rotateY(0deg) rotateX(0deg) scale(1)}18%{transform:rotateY(180deg) rotateX(0deg) scale(1.1)}48%{transform:rotateY(180deg) rotateX(180deg) scale(1.1)}72%{transform:rotateY(0deg) rotateX(180deg) scale(1.1)}to{transform:rotateY(0deg) rotateX(0deg) scale(1)}}@keyframes converge-overlay{0%{transform:rotateY(0deg) rotateX(0deg) translateY(0)}25%{transform:rotateY(180deg) rotateX(0deg) translateY(10px)}48%{transform:rotateY(180deg) rotateX(180deg) translateY(20px)}75%{transform:rotateY(0deg) rotateX(180deg) translateY(20px)}to{transform:rotateY(0deg) rotateX(0deg) translateY(0)}}.shape-stack__harmony .shape-stack__shape{animation:harmony 8s cubic-bezier(.2,0,.2,1) infinite}@keyframes harmony{0%{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(1.1) scaleY(-1.1)}50%{transform:scaleX(-1) scaleY(-1)}75%{transform:scaleX(-1.1) scaleY(1.1)}to{transform:scaleX(1) scaleY(1)}}.shape-stack__ascend .shape-stack__shape{animation:ascend-shape 8s cubic-bezier(.2,0,.2,1) infinite}.shape-stack__ascend .shape-stack__overlay{transform:rotate(315deg) scale(.85) translateX(-3px)}@keyframes ascend-shape{0%{transform:rotateY(0deg) rotate(-45deg) scale(.75)}to{transform:rotateY(1turn) rotate(-45deg) scale(.75)}}.shape-stack__pivot .shape-stack__shape{animation:pivot-swing 8s cubic-bezier(.25,0,.25,1) infinite}.shape-stack__pivot .shape-stack__overlay{animation:pivot-scale 8s cubic-bezier(.4,0,.4,1) infinite}@keyframes pivot-swing{0%,to{transform:rotate(0deg)}50%{transform:rotate(180deg)}}@keyframes pivot-scale{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.shape-stack__reflect .shape-stack__shape{animation:reflect-bounce 10s cubic-bezier(.25,0,.25,1) infinite}.shape-stack__reflect .shape-stack__overlay{animation:reflect-mirror 10s cubic-bezier(.25,0,.25,1) infinite}@keyframes reflect-bounce{0%,to{transform:scaleX(1)}50%{transform:scaleX(-1)}}@keyframes reflect-mirror{0%,to{transform:rotateY(0deg)}50%{transform:rotateY(180deg)}}.shape-stack__intersect .shape-stack__shape{animation:intersect-shape 8s cubic-bezier(.25,0,.25,1) infinite}.shape-stack__intersect .shape-stack__overlay{animation:intersect-overlay 8s cubic-bezier(.25,0,.25,1) infinite}@keyframes intersect-shape{0%{transform:scale(1.1)}25%{transform:scale(1.1)}50%{transform:scale(1) rotateX(180deg)}75%{transform:scale(1) rotateX(180deg)}to{transform:scale(1.1)}}@keyframes intersect-overlay{0%{transform:scaleX(1)}25%{transform:scaleX(-1)}50%{transform:scaleX(-1) rotate(90deg)}75%{transform:scaleX(1) rotate(90deg)}to{transform:scaleX(1)}}
