/* =====================================================
   BARAKAH WEB DESIGN AGENCY - ANIMATIONS
   ===================================================== */
@keyframes scrollBounce{0%,100%{transform:translateY(0);opacity:1}50%{transform:translateY(8px);opacity:.5}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInLeft{from{opacity:0;transform:translateX(-36px)}to{opacity:1;transform:translateX(0)}}
@keyframes fadeInRight{from{opacity:0;transform:translateX(36px)}to{opacity:1;transform:translateX(0)}}
@keyframes blobFloat{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-20px) scale(1.05)}66%{transform:translate(-20px,20px) scale(.95)}}
@keyframes navSlideDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}
@keyframes counterPop{0%{transform:scale(.8);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
@keyframes pulseDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:.6}}
.hero__blob--1{animation:blobFloat 12s ease-in-out infinite}
.hero__blob--2{animation:blobFloat 15s ease-in-out infinite reverse}
.reveal-up,.reveal-left,.reveal-right{opacity:0;will-change:opacity,transform;transition:opacity .65s ease,transform .65s ease}
.reveal-up{transform:translateY(32px)}.reveal-left{transform:translateX(-36px)}.reveal-right{transform:translateX(36px)}
.reveal-up.is-visible,.reveal-left.is-visible,.reveal-right.is-visible{opacity:1;transform:translate(0);transition-delay:var(--delay,0s)}
.stat-item__num.animate{animation:counterPop .6s cubic-bezier(.34,1.56,.64,1) both}
.navbar{animation:navSlideDown .4s ease both}
#progressBar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--accent),#f0c040);width:0%;z-index:9999;transition:width .1s linear}
#loadingOverlay{position:fixed;inset:0;background:var(--primary);display:flex;align-items:center;justify-content:center;z-index:99999;transition:opacity .5s ease,visibility .5s ease}
#loadingOverlay.hidden{opacity:0;visibility:hidden}
.loading__logo{font-family:'Montserrat',sans-serif;font-size:2.2rem;font-weight:900;color:#fff;letter-spacing:-1px;animation:pulseDot 1.2s ease-in-out infinite}
.loading__logo span{color:#f0a500}
[data-tooltip]{position:relative}
[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--dark);color:#fff;font-size:.72rem;padding:5px 10px;border-radius:4px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s;font-family:'Montserrat',sans-serif}
[data-tooltip]:hover::after{opacity:1}