/* All In One Freelancing — Colorful Cinematic Layer v1.6.0 (additive) */

/* ---------- Animated gradient buttons ---------- */
.btn-primary{background:linear-gradient(135deg,#5B4BFF,#7C3AED 35%,#2563EB 70%,#5B4BFF)!important;background-size:220% 220%!important;background-position:0% 50%!important}
.btn-primary:hover{background-position:95% 50%!important}
.btn .arrow-move,.btn span[aria-hidden="true"]{display:inline-block;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.btn:hover .arrow-move,.btn:hover span[aria-hidden="true"]{transform:translateX(5px)}
.btn-whatsapp{background:linear-gradient(135deg,#22c55e,#16a34a 60%,#22c55e)!important;background-size:200% 200%!important}
.btn-whatsapp:hover{background-position:90% 50%!important}

/* ---------- Hero entrance for floats (opacity/filter only; no transform conflict) ---------- */
@keyframes floatIn{from{opacity:0}to{opacity:1}}
@keyframes dashIn{from{opacity:0;filter:blur(12px) saturate(.6)}to{opacity:1;filter:blur(0) saturate(1)}}
.hero-visual .dash-card{animation:dashIn .9s cubic-bezier(.22,1,.36,1) .25s both,floaty 6s ease-in-out 1.2s infinite}
.hero-visual .f1{animation:floatIn .7s ease .7s both,floaty 5s ease-in-out 1.4s infinite}
.hero-visual .f2{animation:floatIn .7s ease .85s both,floaty 7s ease-in-out 1.6s infinite}
.hero-visual .f3{animation:floatIn .7s ease 1s both,floaty 6.5s ease-in-out 1.8s infinite}

/* ---------- Premium glass stats ---------- */
.stats{position:relative;overflow:hidden;background:linear-gradient(135deg,#0B1020 0%,#221d4e 50%,#0B1020 100%)}
.stats::before,.stats::after{content:'';position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none}
.stats::before{width:420px;height:420px;top:-160px;left:8%;background:radial-gradient(circle,rgba(124,58,237,.45),transparent 65%)}
.stats::after{width:460px;height:460px;bottom:-200px;right:6%;background:radial-gradient(circle,rgba(37,99,235,.4),transparent 65%),radial-gradient(circle at 60% 40%,rgba(236,72,153,.22),transparent 60%)}
.stat{position:relative;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:26px 14px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s,border-color .3s;overflow:hidden}
.stat::after{content:'';position:absolute;top:0;left:20%;right:20%;height:3px;border-radius:3px;background:linear-gradient(90deg,#5B4BFF,#EC4899,#F59E0B);opacity:.9}
.stat:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.35);box-shadow:0 18px 44px rgba(91,75,255,.35)}
.stat strong{font-size:clamp(2rem,3.5vw,2.7rem)}

/* ---------- Featured CPA flagship ---------- */
#featured{position:relative;overflow:hidden;background:linear-gradient(135deg,#1e1b4b 0%,#4c1d95 48%,#1e3a8a 100%)}
#featured::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.22) 1.2px,transparent 1.2px);background-size:30px 30px;mask-image:radial-gradient(ellipse 75% 85% at 50% 50%,#000 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 75% 85% at 50% 50%,#000 30%,transparent 75%);animation:dotDrift 26s linear infinite}
@keyframes dotDrift{from{background-position:0 0}to{background-position:120px 60px}}
#featured::after{content:'';position:absolute;width:520px;height:520px;top:-180px;right:-140px;background:radial-gradient(circle,rgba(236,72,153,.28),transparent 65%);filter:blur(60px);pointer-events:none}
#featured .sec-head h2,#featured .sec-head .muted{color:#fff}
#featured .sec-head .eyebrow{background:linear-gradient(135deg,#F59E0B,#EC4899)}
.featured{background:radial-gradient(480px circle at var(--mx,80%) var(--my,20%),rgba(91,75,255,.10),transparent 65%),#fff;box-shadow:0 30px 90px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.15),0 0 70px rgba(124,58,237,.35)}
.featured::after{content:'';position:absolute;top:0;bottom:0;left:0;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-250%) skewX(-14deg);transition:transform 1s cubic-bezier(.22,1,.36,1);pointer-events:none}
.featured:hover::after{transform:translateX(340%) skewX(-14deg)}
.featured .pr strong{font-size:2.1rem;background:linear-gradient(135deg,#5B4BFF,#EC4899);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ---------- Course cards: gradient borders + colorful shadows ---------- */
.course-card{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#e3e8ff,#f6f1ff 45%,#e9f5ff) border-box}
.course-card:hover{transform:translateY(-8px);background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#5B4BFF,#EC4899 55%,#F59E0B) border-box;box-shadow:0 28px 60px rgba(91,75,255,.24),0 8px 24px rgba(236,72,153,.12)}
.cc-thumb::before{content:'';position:absolute;top:0;bottom:0;left:0;width:50%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:translateX(-220%) skewX(-14deg);transition:transform .9s cubic-bezier(.22,1,.36,1);pointer-events:none;z-index:4}
.course-card:hover .cc-thumb::before{transform:translateX(320%) skewX(-14deg)}

/* ---------- Categories: unique gradient icons ---------- */
.cat-card{position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s,border-color .3s}
.cat-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(91,75,255,.20);border-color:#C7D2FE}
.cat-ic{display:inline-flex;align-items:center;justify-content:center;width:66px;height:66px;border-radius:20px;color:#fff;font-size:1.8rem;margin-bottom:12px;box-shadow:0 10px 24px rgba(17,24,39,.18);transition:transform .3s cubic-bezier(.22,1,.36,1);animation:iconBob 5.5s ease-in-out infinite}
.cat-grid>.cat-card:nth-child(9n+1) .cat-ic{background:linear-gradient(135deg,#5B4BFF,#2563EB)}
.cat-grid>.cat-card:nth-child(9n+2) .cat-ic{background:linear-gradient(135deg,#7C3AED,#EC4899);animation-delay:.6s}
.cat-grid>.cat-card:nth-child(9n+3) .cat-ic{background:linear-gradient(135deg,#2563EB,#06b6d4);animation-delay:1.1s}
.cat-grid>.cat-card:nth-child(9n+4) .cat-ic{background:linear-gradient(135deg,#F59E0B,#EF4444);animation-delay:1.6s}
.cat-grid>.cat-card:nth-child(9n+5) .cat-ic{background:linear-gradient(135deg,#1877F2,#06b6d4);animation-delay:2.1s}
.cat-grid>.cat-card:nth-child(9n+6) .cat-ic{background:linear-gradient(135deg,#EF4444,#7C3AED);animation-delay:2.6s}
.cat-grid>.cat-card:nth-child(9n+7) .cat-ic{background:linear-gradient(135deg,#EC4899,#F59E0B);animation-delay:3.1s}
.cat-grid>.cat-card:nth-child(9n+8) .cat-ic{background:linear-gradient(135deg,#10b981,#2563EB);animation-delay:3.6s}
.cat-grid>.cat-card:nth-child(9n+9) .cat-ic{background:linear-gradient(135deg,#8b5cf6,#06b6d4);animation-delay:4.1s}
@keyframes iconBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.cat-card:hover .cat-ic{animation-play-state:paused;transform:rotate(-9deg) scale(1.1)}

/* ---------- Why cards: gradient reveal + icon chips ---------- */
.why-card{position:relative;overflow:hidden}
.why-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.why-grid>.why-card:nth-child(6n+1)::before{background:linear-gradient(90deg,#5B4BFF,#2563EB)}
.why-grid>.why-card:nth-child(6n+2)::before{background:linear-gradient(90deg,#7C3AED,#EC4899)}
.why-grid>.why-card:nth-child(6n+3)::before{background:linear-gradient(90deg,#F59E0B,#EF4444)}
.why-grid>.why-card:nth-child(6n+4)::before{background:linear-gradient(90deg,#06b6d4,#2563EB)}
.why-grid>.why-card:nth-child(6n+5)::before{background:linear-gradient(90deg,#EC4899,#F59E0B)}
.why-grid>.why-card:nth-child(6n+6)::before{background:linear-gradient(90deg,#10b981,#06b6d4)}
.why-card:hover::before{transform:scaleX(1)}
.why-ic{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:18px;color:#fff;font-size:1.6rem;margin-bottom:14px;background:linear-gradient(135deg,#5B4BFF,#7C3AED);box-shadow:0 10px 22px rgba(91,75,255,.3)}
.why-grid>.why-card:nth-child(6n+2) .why-ic{background:linear-gradient(135deg,#7C3AED,#EC4899);box-shadow:0 10px 22px rgba(124,58,237,.3)}
.why-grid>.why-card:nth-child(6n+3) .why-ic{background:linear-gradient(135deg,#F59E0B,#EF4444);box-shadow:0 10px 22px rgba(245,158,11,.3)}
.why-grid>.why-card:nth-child(6n+4) .why-ic{background:linear-gradient(135deg,#06b6d4,#2563EB);box-shadow:0 10px 22px rgba(37,99,235,.3)}
.why-grid>.why-card:nth-child(6n+5) .why-ic{background:linear-gradient(135deg,#EC4899,#8b5cf6);box-shadow:0 10px 22px rgba(236,72,153,.3)}
.why-grid>.why-card:nth-child(6n+6) .why-ic{background:linear-gradient(135deg,#10b981,#06b6d4);box-shadow:0 10px 22px rgba(16,185,129,.3)}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-10deg) scale(1.06)}60%{transform:rotate(8deg) scale(1.06)}}
.why-card:hover .why-ic{animation:wiggle .55s cubic-bezier(.22,1,.36,1)}

/* ---------- Mentor: animated gradient frame + reflection ---------- */
.mentor-photo{padding:7px;background:linear-gradient(135deg,#5B4BFF,#EC4899,#F59E0B,#2563EB,#5B4BFF);background-size:300% 300%;animation:borderFlow 9s ease infinite;box-shadow:0 26px 70px rgba(91,75,255,.30)}
@keyframes borderFlow{0%,100%{background-position:0% 40%}50%{background-position:100% 60%}}
.mentor-photo img{border-radius:18px}
.mentor-photo::before{content:'';position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-250%) skewX(-14deg);transition:transform 1s cubic-bezier(.22,1,.36,1);pointer-events:none;z-index:3}
.mentor-photo:hover::before{transform:translateX(380%) skewX(-14deg)}

/* ---------- Testimonials glow ---------- */
#stories{position:relative;overflow:hidden}
#stories::before{content:'';position:absolute;width:560px;height:560px;top:-200px;left:-160px;background:radial-gradient(circle,rgba(124,58,237,.12),transparent 65%);filter:blur(40px);pointer-events:none}
#stories::after{content:'';position:absolute;width:520px;height:520px;bottom:-220px;right:-140px;background:radial-gradient(circle,rgba(236,72,153,.10),transparent 65%);filter:blur(40px);pointer-events:none}
.testi{transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s,border-color .3s}
.testi:hover{transform:translateY(-5px);box-shadow:0 20px 48px rgba(91,75,255,.16);border-color:#DDD6FE}

/* ---------- Blog: gradient underline + lift ---------- */
.bc-body h3 a{background:linear-gradient(90deg,#5B4BFF,#EC4899);background-size:0% 2px;background-repeat:no-repeat;background-position:left calc(100% - 1px);transition:background-size .4s cubic-bezier(.22,1,.36,1);padding-bottom:2px}
.blog-card:hover .bc-body h3 a{background-size:100% 2px}

/* ---------- Payment: brand glows + animated checkmark ---------- */
.aio-method{position:relative}
.aio-method.active::after{content:'✓';position:absolute;top:9px;right:11px;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#10b981,#059669);color:#fff;font-size:.85rem;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(16,185,129,.45);animation:checkPop .35s cubic-bezier(.22,1,.36,1)}
@keyframes checkPop{0%{transform:scale(0)}65%{transform:scale(1.25)}100%{transform:scale(1)}}
.aio-method[data-method="bkash"].active,.aio-method.pick:has(input[value="bkash"]).active{border-color:#E2136E;box-shadow:0 12px 30px rgba(226,19,110,.25),0 0 0 3px rgba(226,19,110,.13)}
.aio-method[data-method="nagad"].active,.aio-method.pick:has(input[value="nagad"]).active{border-color:#F6921E;box-shadow:0 12px 30px rgba(246,146,30,.28),0 0 0 3px rgba(246,146,30,.15)}
.aio-method[data-method="rocket"].active,.aio-method.pick:has(input[value="rocket"]).active{border-color:#8C3494;box-shadow:0 12px 30px rgba(140,52,148,.28),0 0 0 3px rgba(140,52,148,.15)}

/* ---------- Forms: focus glow ---------- */
.aio-form input:focus,.aio-form select:focus,.aio-form textarea:focus,.filter-bar input:focus,.filter-bar select:focus,.woocommerce-checkout input:focus,.woocommerce-checkout select:focus,.woocommerce-checkout textarea:focus{outline:none!important;border-color:var(--aio-primary)!important;box-shadow:0 0 0 4px rgba(91,75,255,.13)!important}
.woocommerce-checkout input[type="text"],.woocommerce-checkout input[type="email"],.woocommerce-checkout input[type="tel"],.woocommerce-checkout input[type="number"],.woocommerce-checkout input[type="date"],.woocommerce-checkout select,.woocommerce-checkout textarea{border-radius:12px!important;border:2px solid #E8ECF3!important;padding:12px 14px!important;transition:border-color .25s,box-shadow .25s!important;background:#fff}
.woocommerce-checkout label{font-weight:700!important;font-size:.88rem!important}

/* ---------- Search overlay: colorful backdrop ---------- */
.aio-search-modal{background:linear-gradient(135deg,rgba(30,27,75,.86),rgba(76,29,149,.84) 55%,rgba(30,58,138,.86))!important}

/* ---------- Auth: gradient stage + glass card ---------- */
.aio-auth{position:relative;background:linear-gradient(135deg,#F2F3FF 0%,#FBF0FF 50%,#EDF4FF 100%);border-radius:28px;overflow:hidden}
.aio-auth::before,.aio-auth::after{content:'';position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none}
.aio-auth::before{width:380px;height:380px;top:-120px;left:-100px;background:radial-gradient(circle,rgba(91,75,255,.25),transparent 65%)}
.aio-auth::after{width:380px;height:380px;bottom:-140px;right:-100px;background:radial-gradient(circle,rgba(236,72,153,.22),transparent 65%)}
.aio-auth-card{position:relative;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.7);box-shadow:0 30px 80px rgba(91,75,255,.20)}

/* ---------- Dashboard: colorful stats + shimmer progress ---------- */
.sc{position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s}
.sc:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.sc::before{content:'';position:absolute;top:0;left:0;right:0;height:4px}
.stat-cards>.sc:nth-child(4n+1)::before{background:linear-gradient(90deg,#5B4BFF,#2563EB)}
.stat-cards>.sc:nth-child(4n+1) .n{background:linear-gradient(135deg,#5B4BFF,#2563EB);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat-cards>.sc:nth-child(4n+2)::before{background:linear-gradient(90deg,#EC4899,#F59E0B)}
.stat-cards>.sc:nth-child(4n+2) .n{background:linear-gradient(135deg,#EC4899,#F59E0B);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat-cards>.sc:nth-child(4n+3)::before{background:linear-gradient(90deg,#06b6d4,#2563EB)}
.stat-cards>.sc:nth-child(4n+3) .n{background:linear-gradient(135deg,#06b6d4,#2563EB);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat-cards>.sc:nth-child(4n+4)::before{background:linear-gradient(90deg,#10b981,#06b6d4)}
.stat-cards>.sc:nth-child(4n+4) .n{background:linear-gradient(135deg,#10b981,#059669);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.bar i{position:relative;overflow:hidden;background:linear-gradient(90deg,#5B4BFF,#7C3AED,#2563EB)!important;background-size:200% 100%!important;animation:barSlide 3.5s ease infinite}
@keyframes barSlide{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ---------- Footer links micro-interaction ---------- */
.f-list a{transition:color .25s,transform .25s cubic-bezier(.22,1,.36,1)}
.f-list a:hover{transform:translateX(5px)}

/* ---------- CTA glow follows cursor ---------- */
.cta-box{position:relative;overflow:hidden;background:radial-gradient(600px circle at var(--mx,50%) var(--my,30%),rgba(255,255,255,.16),transparent 60%),linear-gradient(135deg,#5B4BFF,#7C3AED)!important}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
.hero-visual .dash-card,.hero-visual .f1,.hero-visual .f2,.hero-visual .f3{animation:none}
.mentor-photo,.cat-ic,.bar i,#featured::before{animation:none}
.course-card:hover .cc-thumb::before,.featured:hover::after,.mentor-photo:hover::before{display:none}
}

/* ---------- Mobile: lighter motion ---------- */
@media(max-width:768px){
.cat-ic{animation:none}
.featured::after{display:none}
#featured::before{animation-duration:40s}
.stat{padding:20px 10px}
}
