/* ===== Quota Solutions — MOTION / WOW layer ===== */

/* respect reduced-motion users */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
}

/* ---- Floating gradient orbs (ambient background movement) ---- */
.qs-orbs{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.qs-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.22;will-change:transform}
.qs-orb.a{width:420px;height:420px;background:radial-gradient(circle,#00c48c,transparent 70%);top:-80px;left:-60px;animation:orbFloat1 22s ease-in-out infinite}
.qs-orb.b{width:360px;height:360px;background:radial-gradient(circle,#00e0a1,transparent 70%);top:30%;right:-100px;animation:orbFloat2 26s ease-in-out infinite}
.qs-orb.c{width:300px;height:300px;background:radial-gradient(circle,#f6b73c,transparent 70%);bottom:-80px;left:30%;animation:orbFloat3 30s ease-in-out infinite}
@keyframes orbFloat1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,80px) scale(1.15)}}
@keyframes orbFloat2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-70px,50px) scale(1.1)}}
@keyframes orbFloat3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-60px) scale(1.2)}}

/* ---- Infinite marquee strip ---- */
.qs-marquee{overflow:hidden;white-space:nowrap;padding:18px 0;background:rgba(10,26,47,.04);border-top:1px solid var(--line,#e5ebf2);border-bottom:1px solid var(--line,#e5ebf2);position:relative}
.qs-marquee::before,.qs-marquee::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none}
.qs-marquee::before{left:0;background:linear-gradient(90deg,#fff,transparent)}
.qs-marquee::after{right:0;background:linear-gradient(270deg,#fff,transparent)}
.qs-track{display:inline-flex;gap:48px;align-items:center;animation:marquee 28s linear infinite;will-change:transform}
.qs-marquee:hover .qs-track{animation-play-state:paused}
.qs-chip{font-family:'Plus Jakarta Sans','Segoe UI',sans-serif;font-weight:700;font-size:1.05rem;color:#0a1a2f;display:inline-flex;align-items:center;gap:10px;opacity:.75}
.qs-chip .d{width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#00c48c,#00e0a1)}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ---- Animated counters wrapper ---- */
.qs-count{font-variant-numeric:tabular-nums}

/* ---- Animated stat bars ---- */
.qs-bar{height:10px;border-radius:999px;background:#e5ebf2;overflow:hidden;margin-top:8px}
.qs-bar > span{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,#00c48c,#00e0a1);transition:width 1.4s cubic-bezier(.16,1,.3,1)}

/* ---- Hero rotating word ---- */
.qs-rotate{display:inline-block;position:relative;color:#00e0a1;font-weight:800}
.qs-rotate .w{display:inline-block;animation:rotateWord .3s ease}
@keyframes rotateWord{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ---- Shine sweep on cards ---- */
.qs-shine{position:relative;overflow:hidden}
.qs-shine::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .7s ease}
.qs-shine:hover::after{left:130%}

/* ---- Fade/slide up on scroll ---- */
.qs-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.qs-reveal.in{opacity:1;transform:none}

/* ---- Floating badge bob ---- */
.qs-bob{animation:bob 3.5s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ---- Scroll progress bar ---- */
.qs-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:200;background:linear-gradient(90deg,#00c48c,#00e0a1,#f6b73c);transition:width .1s ease}
