/* okaycab.in — light 2D animation layer (no 3D). Moving cabs, road, floating pins. */
#ay-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
#ay-bg i{position:absolute;border-radius:50%;filter:blur(60px);opacity:.45;animation:ayDrift 18s ease-in-out infinite alternate}
#ay-bg i:nth-child(1){width:38vmax;height:38vmax;left:-10vmax;top:-8vmax;background:#cfe3ff}
#ay-bg i:nth-child(2){width:32vmax;height:32vmax;right:-8vmax;top:30vh;background:#d9f0ff;animation-delay:-6s}
#ay-bg i:nth-child(3){width:28vmax;height:28vmax;left:30vw;bottom:-12vmax;background:#e6e1ff;animation-delay:-11s}
@keyframes ayDrift{to{transform:translate(5vmax,3vmax) scale(1.12)}}
.ay-pin{position:fixed;z-index:-1;pointer-events:none;width:26px;opacity:.3;animation:ayFloat 6s ease-in-out infinite}
@keyframes ayFloat{50%{transform:translateY(-16px)}}
#ay-progress{position:fixed;top:0;left:0;right:0;height:4px;z-index:9999;pointer-events:none}
#ay-progress b{display:block;height:100%;width:0;background:linear-gradient(90deg,#abc7ff,#1A3F75)}
#ay-progress svg{position:absolute;top:-1px;left:0;width:34px;height:15px;transform:translateX(-50%);opacity:0;transition:opacity .3s}
.ay-road{position:relative;height:104px;overflow:hidden;margin-top:36px}
.ay-road .ay-skyline{position:absolute;left:0;bottom:46px;width:200%;height:40px;opacity:.5;animation:ayScroll 60s linear infinite}
.ay-road .ay-ground{position:absolute;left:0;right:0;bottom:0;height:46px;background:#2b3548}
.ay-road .ay-lane{position:absolute;left:0;bottom:21px;height:3px;width:200%;background:repeating-linear-gradient(90deg,#fff 0 28px,transparent 28px 56px);animation:ayScroll 4s linear infinite;opacity:.85}
@keyframes ayScroll{to{transform:translateX(-50%)}}
.ay-car{position:absolute;left:0;bottom:6px;width:78px;will-change:transform}
.ay-car svg{display:block;width:100%;animation:ayBounce .45s ease-in-out infinite alternate}
.ay-car.l2{bottom:24px;width:64px}
.ay-car.rev svg{transform:scaleX(-1)}
@keyframes ayBounce{to{translate:0 -1.5px}}
.ay-wheel{transform-box:fill-box;transform-origin:center;animation:ayWheel .5s linear infinite}
@keyframes ayWheel{to{transform:rotate(360deg)}}
.ay-drive{position:absolute;left:0;right:0;bottom:-4px;height:0;pointer-events:none;z-index:1;overflow:visible}
.ay-drive .ay-car{bottom:0;width:56px}
a.bg-indigo,button.bg-indigo,a.bg-sapphire,button.bg-sapphire,a.grad-mint-cyan,button.grad-mint-cyan{position:relative;overflow:hidden}
a.bg-indigo::after,a.bg-sapphire::after,a.grad-mint-cyan::after,button.bg-indigo::after,button.grad-mint-cyan::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);animation:ayShine 4.2s ease-in-out infinite;pointer-events:none}
@keyframes ayShine{0%,60%{left:-70%}100%{left:130%}}
.ay-sticker{position:absolute;z-index:3;pointer-events:none;font:700 13px/1 'Sora',sans-serif;padding:9px 14px;border-radius:999px;background:#fff;color:#1A3F75;box-shadow:0 8px 22px -8px rgba(26,63,117,.35);border:1px solid rgba(0,0,42,.08);animation:ayFloat 5s ease-in-out infinite}
@media (max-width:760px){.ay-pin{display:none}.ay-road{height:88px}.ay-car{width:62px}.ay-car.l2{width:50px}}
@media (prefers-reduced-motion:reduce){#ay-bg i,.ay-pin,.ay-road *,.ay-wheel,.ay-sticker,a::after{animation:none!important}}
