*{box-sizing:border-box}html,body{margin:0;background:#fff}
body{min-height:100svh;display:grid;place-items:center;padding:40px 60px}
.network{position:relative;width:min(900px,100%,calc(100svh - 130px));aspect-ratio:1;isolation:isolate}
.connections{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}
.logo{position:absolute;display:flex;align-items:center;justify-content:center;width:210px;min-height:54px;padding:10px;left:var(--x);top:var(--y);transform:translate(-50%,-50%);border:0;background:transparent;text-decoration:none;outline-offset:6px;border-radius:4px}
.logo img{display:block;width:100%;height:auto;transition:transform .35s cubic-bezier(.2,.7,.2,1);animation:arrive .75s both;animation-delay:var(--delay,0s)}
.logo:hover img{transform:translateY(-5px) scale(1.06)}.logo:focus-visible{outline:2px solid #bb1824}
.hub{--x:50%;--y:50%;width:290px}.hub img{aspect-ratio:2066/400;object-fit:cover;object-position:center}
.sea,.mountain{width:184px}.bird{width:230px}.handyman{width:112px}.book{width:205px}
.bird{--x:50.0000%;--y:4.0000%;--delay:0.00s}
.mountain{--x:75.7115%;--y:19.3582%;--delay:0.08s}
.mariola{--x:66%;--y:87.5877%;--delay:0.32s}
.plant{--x:89.3923%;--y:43.0541%;--delay:0.16s}
.handyman{--x:84.6410%;--y:70.0000%;--delay:0.24s}
.book{--x:34%;--y:87.5877%;--delay:0.40s}
.therapy{--x:15.3590%;--y:70.0000%;--delay:0.48s}
.wedding{--x:10.6077%;--y:43.0541%;--delay:0.56s}
.sea{--x:24.2885%;--y:19.3582%;--delay:0.64s}
@keyframes arrive{from{opacity:0;translate:0 9px}to{opacity:1;translate:0 0}}
.flow{fill:none;stroke:#bb1824;stroke-width:3;stroke-linecap:round;stroke-dasharray:.7 99.3;animation:connect 8s linear infinite;pointer-events:none}
@keyframes connect{0%{stroke-dashoffset:100;opacity:0}15%{opacity:.55}75%{opacity:.55}100%{stroke-dashoffset:0;opacity:0}}
@media(max-width:900px){.logo{width:175px}.hub{width:250px}.sea,.mountain{width:155px}.bird{width:190px}.handyman{width:100px}.book{width:165px}}
@media(max-width:650px){body{padding:32px 30px}.network{width:100%;aspect-ratio:700/850}.logo{width:138px;padding:8px}.hub{width:190px}.sea,.mountain{width:125px}.bird{width:155px}.handyman{width:88px}.book{width:135px}.connections{opacity:.7}.flow{stroke-width:4}}
@media(max-width:440px){body{padding:30px 24px}.network{aspect-ratio:700/900}.logo{width:108px;min-height:44px;padding:5px}.hub{width:146px}.sea,.mountain{width:112px}.mariola{width:100px}.plant,.therapy{width:108px}.bird{width:125px}.handyman{width:78px}.book{width:104px}.connections{opacity:.55}}
@media(max-width:360px){body{padding:28px 22px}.logo{width:92px;min-height:40px;padding:4px}.hub{width:126px}.sea,.mountain{width:100px}.mariola{width:88px}.plant,.therapy{width:96px}.bird{width:115px;--y:3%}.wedding,.plant{width:90px}.handyman{width:68px}.book{width:82px}}
@media(prefers-reduced-motion:reduce){.logo img{animation:none;transition:none}.logo:hover img{transform:none}.flow{display:none;animation:none}}