.directory-motion{isolation:isolate;color:#fff;background:#123329;border-radius:0 112px 0 0;height:clamp(340px,34vw,500px);margin:40px 0 0;position:relative;overflow:hidden}.directory-motion-grid,.directory-motion-scene{position:absolute;inset:0}.directory-motion-scene{inset:52px 0 68px;overflow:hidden}.directory-motion-grid{opacity:.42}.grid-vertical,.grid-horizontal{background:#6c8b7f;display:block;position:absolute}.grid-vertical{width:1px;top:0;bottom:0}.grid-vertical.line-0{left:20%}.grid-vertical.line-1{left:40%}.grid-vertical.line-2{left:60%}.grid-vertical.line-3{left:80%}.grid-horizontal{height:1px;left:0;right:0}.grid-horizontal.line-0{top:25%}.grid-horizontal.line-1{top:50%}.grid-horizontal.line-2{top:75%}.directory-motion-index,.directory-motion-caption{z-index:8;letter-spacing:.075em;font-size:.8125rem;line-height:1.5;position:absolute;left:22px}.directory-motion-index{color:#d8e6df;top:18px}.directory-motion-caption{letter-spacing:0;color:#fff;max-width:calc(100% - 132px);font-size:.875rem;bottom:20px}.directory-motion-block{z-index:2;color:#132d25;letter-spacing:.055em;text-transform:uppercase;will-change:transform;align-items:flex-end;padding:14px;font-size:.75rem;font-weight:650;line-height:1;display:flex;position:absolute}.block-orange{background:#ff9b61;width:52%;height:21%;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-orange;top:10%;left:-8%}.block-pink{background:#f3b7d2;width:37%;height:39%;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-pink;top:22%;right:-9%}.block-blue{background:#9cd5ee;width:47%;height:23%;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-blue;bottom:15%;left:-6%}.block-yellow{background:#ffdf55;width:24%;height:34%;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-yellow;top:-7%;right:22%}.block-lime{background:#dcee78;width:38%;height:27%;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-lime;bottom:-7%;right:7%}.directory-motion-orbit{z-index:4;aspect-ratio:1;border:1px solid #fff;border-radius:50%;width:47%;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-orbit;position:absolute;top:50%;left:52%;transform:translate(-50%,-50%)}.directory-motion-answer{z-index:6;aspect-ratio:1;color:#123329;text-align:center;background:#fff;border-radius:50%;place-content:center;width:33%;padding:20px;animation:13s cubic-bezier(.65,0,.35,1) infinite directory-answer;display:grid;position:absolute;top:50%;left:52%;transform:translate(-50%,-50%)}.directory-motion-answer small{letter-spacing:.11em;font-size:clamp(.55rem,.65vw,.7rem)}.directory-motion-answer strong{letter-spacing:-.045em;margin-top:3px;font-size:clamp(1rem,2vw,1.55rem);line-height:1}.directory-motion-answer b{color:#ff7649;margin-top:9px;font-size:1.2rem;font-weight:450}.directory-motion-control{z-index:9;color:#fff;background:#123329;border:1px solid #aec4ba;border-radius:0;gap:7px;height:auto;min-height:38px;padding:8px 12px;font-size:.75rem;position:absolute;bottom:17px;right:18px}.directory-motion-control:hover{background:#234c3e}.directory-motion-control:focus-visible{outline-offset:4px;outline:2px solid #ffdf55!important}.directory-motion[data-paused=true] *{animation-play-state:paused!important}@keyframes directory-orange{0%,to{transform:translate(-4%,10%)rotate(-8deg)}48%,62%{transform:translate(66%,248%)rotate(0)}}@keyframes directory-pink{0%,to{transform:translate(8%,-4%)rotate(7deg)}48%,62%{transform:translate(-148%,-25%)rotate(0)}}@keyframes directory-blue{0%,to{transform:translate(-3%,5%)rotate(5deg)}48%,62%{transform:translate(122%,-205%)rotate(0)}}@keyframes directory-yellow{0%,to{transform:translate(5%,-6%)rotate(-5deg)}48%,62%{transform:translate(-205%,242%)rotate(0)}}@keyframes directory-lime{0%,to{transform:translate(7%,4%)rotate(-6deg)}48%,62%{transform:translate(-175%,-78%)rotate(0)}}@keyframes directory-orbit{0%,to{transform:translate(-50%,-50%)rotate(0)scale(1)}48%,62%{transform:translate(-50%,-50%)rotate(180deg)scale(.76)}}@keyframes directory-answer{0%,to{transform:translate(-50%,-50%)scale(.92)}48%,62%{transform:translate(-50%,-50%)scale(1.08)}}@media (max-width:800px){.directory-motion{width:min(100%,590px);height:clamp(330px,78vw,470px)}}@media (max-width:450px){.directory-motion{border-radius:0 76px 0 0;height:340px;margin-top:30px}.directory-motion-block{padding:10px;font-size:.625rem}.directory-motion-answer{width:38%}.directory-motion-caption{max-width:calc(100% - 132px)}}@media (prefers-reduced-motion:reduce){.directory-motion *{animation:none!important}}