.agency-site .hero-matte .hero-workstation .hero-art{inset:0;width:100%;height:100%;animation:workstation-float 9s ease-in-out infinite}
.hero-platforms{position:absolute;inset:0;padding:0;margin:0;list-style:none;pointer-events:none}
.hero-platform{position:absolute;width:64px;height:64px;animation:platform-float 7s ease-in-out infinite;animation-delay:var(--platform-delay,0s);--platform-tilt:-6deg}
.hero-platform-salla{top:5%;left:6%;--platform-tilt:-8deg;--platform-delay:-1s}
.hero-platform-zid{top:10%;right:0;--platform-tilt:7deg;--platform-delay:-3s}
.hero-platform-wordpress{bottom:17%;right:0;--platform-tilt:-4deg;--platform-delay:-5s}
.hero-platform-figma{top:auto;bottom:20%;left:-5%;--platform-tilt:-4deg;--platform-delay:-2s}
.agency-site .hero-platform a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;height:100%;padding:8px;border-radius:8px;background:#f9fafc;border:1px solid #ffffffc7;box-shadow:0 12px 22px #16072740,inset 0 1px 0 #fff;pointer-events:auto;color:#321651;transition:transform .25s,box-shadow .25s}
.agency-site .hero-platform a:hover{transform:translateY(-4px);box-shadow:0 16px 28px #1607275c,inset 0 1px 0 #fff}
.agency-site .hero-platform-zid a{background:#4b2583;color:#fff;border-color:#ffffff80}
.hero-platform a:focus-visible{outline:3px solid var(--teal);outline-offset:4px}
.hero-platform:hover,.hero-platform:focus-within{animation-play-state:paused}
.hero-platform img{width:30px;height:30px;object-fit:contain;max-width:100%;flex:none}.hero-platform-zid img{width:42px;height:28px}.hero-platform-wordpress img{width:28px;height:28px}.hero-platform-figma img{height:28px;width:23px}
.hero-platform span{display:block;font-size:10px;line-height:1.4;font-weight:700;white-space:nowrap;letter-spacing:0;font-family:Cairo,sans-serif}
@keyframes workstation-float{0%,100%{transform:translateY(2px) rotate(-.35deg)}50%{transform:translateY(-5px) rotate(.35deg)}}
@keyframes platform-float{0%,100%{transform:translateY(1px) rotate(var(--platform-tilt))}50%{transform:translateY(-5px) rotate(var(--platform-tilt))}}
@media(max-width:1100px){.hero-platform{width:56px;height:56px}.agency-site .hero-platform a{padding:6px;gap:3px}.hero-platform img{width:26px;height:26px}.hero-platform span{font-size:9px}.hero-platform-zid img{width:36px;height:24px}.hero-platform-wordpress img{width:25px;height:25px}.hero-platform-figma img{width:21px;height:25px}}
@media(max-width:760px){.hero-platform{width:48px;height:48px}.agency-site .hero-matte .hero-workstation{margin-bottom:0}.agency-site .hero-matte .hero-actions .primary{margin-bottom:0}.agency-site .hero-platform a{padding:5px;gap:2px}.hero-platform span{font-size:8px}.hero-platform img{width:23px;height:23px}.hero-platform-zid img{width:32px;height:21px}.hero-platform-wordpress img{width:22px;height:22px}.hero-platform-figma img{width:19px;height:22px}.hero-platform-salla{top:5%;left:5%}.hero-platform-zid{right:0}.hero-platform-wordpress{right:0;bottom:17%}.hero-platform-figma{top:auto;bottom:20%;left:max(calc(4% - 48px - 8px),calc(12px - (100vw - 100%)/2))}}
@media(max-height:740px) and (max-width:760px){.hero-platform{width:44px;height:44px}.hero-platform span{font-size:7px}.hero-platform img{width:21px;height:21px}.hero-platform-zid img{width:29px;height:20px}.hero-platform-wordpress img{width:20px;height:20px}.hero-platform-figma img{width:18px;height:20px}}
@media(max-height:650px) and (max-width:760px){.agency-site .hero-matte{gap:6px;padding-bottom:20px}.agency-site .hero-matte :is(h1,h2){margin-bottom:6px}.agency-site .hero-matte .hero-description{margin-bottom:10px}.hero-platform{width:44px;height:44px}.hero-platform span{display:none}.hero-platform-wordpress{bottom:17%;right:0;animation:none;transform:none}.hero-platform-figma{top:auto;bottom:20%;left:max(calc(4% - 44px - 8px),calc(12px - (100vw - 100%)/2));animation:none;transform:none}.hero-platform-zid{top:10%;animation:none;transform:none}.hero-platform-zid img{width:28px;height:22px}}
@media(prefers-reduced-motion:reduce){.agency-site .hero-matte .hero-workstation .hero-art,.hero-platform{animation:none}.hero-platform{transform:rotate(var(--platform-tilt))}.agency-site .hero-platform a{transition:none}.agency-site .hero-platform a:hover{transform:none}}
