/* All In One Freelancing — Premium Motion Layer v1.4.0 (additive; safe to keep/disable) */
:root{--aio-ease:cubic-bezier(.22,1,.36,1)}

/* ---------- Page transition ---------- */
@keyframes aioPageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
#main{animation:aioPageIn .5s var(--aio-ease) both}
body.aio-leaving #main{opacity:0;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease}

/* ---------- Cinematic background blobs ---------- */
body::before,body::after{content:'';position:fixed;z-index:-1;pointer-events:none;border-radius:50%;filter:blur(90px)}
body::before{width:560px;height:560px;top:-180px;right:-140px;background:radial-gradient(circle,rgba(91,75,255,.14),transparent 65%);animation:aioDrift1 22s ease-in-out infinite alternate}
body::after{width:620px;height:620px;bottom:-220px;left:-180px;background:radial-gradient(circle,rgba(37,99,235,.10),transparent 65%),radial-gradient(circle at 70% 30%,rgba(245,158,11,.08),transparent 60%);animation:aioDrift2 26s ease-in-out infinite alternate}
@keyframes aioDrift1{from{transform:translate(0,0) scale(1)}to{transform:translate(-70px,60px) scale(1.12)}}
@keyframes aioDrift2{from{transform:translate(0,0) scale(1.05)}to{transform:translate(80px,-50px) scale(1)}}

/* ---------- Header ---------- */
.main-nav a{position:relative}
.main-nav a::after{content:'';position:absolute;left:13px;right:13px;bottom:3px;height:2px;border-radius:2px;background:var(--aio-grad);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--aio-ease)}
.main-nav a:hover::after,.main-nav li.current-menu-item a::after,.main-nav li.current_page_item a::after{transform:scaleX(1)}
.main-nav li.current-menu-item a,.main-nav li.current_page_item a{color:var(--aio-primary)}
.aio-header{transition:background .35s,box-shadow .35s,border-color .35s,backdrop-filter .35s}
.mobile-drawer{transition:right .38s var(--aio-ease)}
.drawer-overlay{transition:opacity .3s}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(91,75,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(91,75,255,.07) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse 70% 80% at 50% 20%,#000 20%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse 70% 80% at 50% 20%,#000 20%,transparent 75%)}
@keyframes aioRise{from{opacity:0;transform:translateY(26px);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
.hero-copy>*{animation:aioRise .8s var(--aio-ease) both}
.hero-copy>:nth-child(2){animation-delay:.08s}.hero-copy>:nth-child(3){animation-delay:.16s}
.hero-copy>:nth-child(4){animation-delay:.24s}.hero-copy>:nth-child(5){animation-delay:.32s}
.cursor-glow{position:absolute;width:560px;height:560px;border-radius:50%;pointer-events:none;left:var(--gx,72%);top:var(--gy,42%);transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(91,75,255,.15),rgba(124,58,237,.06) 45%,transparent 68%);transition:left .25s ease-out,top .25s ease-out}
/* Depth-aware float (JS sets --px/--py; keyframes override keeps idle float) */
@keyframes floaty{0%,100%{transform:translate3d(var(--px,0px),var(--py,0px),0)}50%{transform:translate3d(var(--px,0px),calc(var(--py,0px) - 12px),0)}}
.hero-visual{transition:transform .3s ease-out;transform-style:preserve-3d}
.hero-visual.in{transition:opacity .7s var(--aio-ease),filter .7s var(--aio-ease)}

/* ---------- Buttons ---------- */
.btn{transition:transform .25s var(--aio-ease),box-shadow .25s,background .25s,opacity .25s}
.btn-primary{position:relative;overflow:hidden;isolation:isolate}
.btn-primary::after{content:'';position:absolute;top:0;bottom:0;left:-70%;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-18deg);transition:left .6s var(--aio-ease);z-index:1}
.btn-primary:hover::after{left:130%}
.hero-cta .btn-primary{box-shadow:0 12px 32px rgba(91,75,255,.38)}
.hero-cta .btn-primary:hover{box-shadow:0 18px 44px rgba(91,75,255,.48)}
.btn-outline{transition:border-color .25s,background .25s,color .25s,transform .25s var(--aio-ease),box-shadow .25s}
.btn-outline:hover{box-shadow:0 10px 26px rgba(91,75,255,.25)}

/* ---------- Scroll reveals (blur-to-sharp + stagger) ---------- */
.reveal{filter:blur(6px);transition:opacity .7s var(--aio-ease),transform .7s var(--aio-ease),filter .7s var(--aio-ease)}
.reveal.in{filter:blur(0)}
.course-row>.reveal:nth-child(2),.why-grid>.reveal:nth-child(2),.cat-grid>.reveal:nth-child(2),.steps>.reveal:nth-child(2),.blog-grid>.reveal:nth-child(2),.stats-grid>.reveal:nth-child(2){transition-delay:.08s}
.course-row>.reveal:nth-child(3),.why-grid>.reveal:nth-child(3),.cat-grid>.reveal:nth-child(3),.steps>.reveal:nth-child(3),.blog-grid>.reveal:nth-child(3){transition-delay:.16s}
.course-row>.reveal:nth-child(4),.why-grid>.reveal:nth-child(4),.cat-grid>.reveal:nth-child(4),.steps>.reveal:nth-child(4){transition-delay:.22s}
.course-row>.reveal:nth-child(5),.why-grid>.reveal:nth-child(5),.cat-grid>.reveal:nth-child(5){transition-delay:.28s}
.course-row>.reveal:nth-child(6),.why-grid>.reveal:nth-child(6),.cat-grid>.reveal:nth-child(6){transition-delay:.34s}

/* ---------- Featured CPA (rotating gradient border) ---------- */
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
.featured.glow::before{animation:aioSpin 7s linear infinite}
@keyframes aioSpin{to{--a:360deg}}
.featured{transition:transform .35s var(--aio-ease),box-shadow .35s}
.feat-thumb{overflow:hidden}

/* ---------- Course cards (light sweep) ---------- */
.course-card{overflow:hidden}
.course-card .cc-body{position:relative}
.course-card::before{content:'';position:absolute;top:0;bottom:0;left:0;width:55%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);transform:translateX(-220%) skewX(-14deg);transition:transform .85s var(--aio-ease);pointer-events:none;z-index:5}
.course-card:hover::before{transform:translateX(320%) skewX(-14deg)}
.course-card{transition:transform .35s var(--aio-ease),box-shadow .35s}
.cc-btns .btn{transition:transform .25s var(--aio-ease),box-shadow .25s,background .25s}
.cc-btns .btn:hover{transform:translateY(-2px)}

/* ---------- Enrollment pulse ---------- */
@keyframes aioPulse{0%,100%{box-shadow:0 8px 24px rgba(91,75,255,.30)}50%{box-shadow:0 8px 32px rgba(91,75,255,.55),0 0 0 7px rgba(91,75,255,.10)}}
.price-card .btn-primary,.sticky-enroll .btn-primary{animation:aioPulse 2.8s ease-in-out infinite}
.price-card .btn-primary:hover,.sticky-enroll .btn-primary:hover{animation:none}

/* ---------- Accordions ---------- */
.acc{transition:border-color .3s,box-shadow .3s}
.acc[open]{border-color:#C7D2FE;box-shadow:var(--shadow)}
.acc summary::after{transition:transform .35s var(--aio-ease)}
.acc[open] summary::after{transform:rotate(180deg)}
.acc summary{transition:background .25s}
.acc summary:hover{background:#F8FAFF}

/* ---------- Payment ---------- */
.aio-method{transition:transform .25s var(--aio-ease),border-color .25s,box-shadow .25s,background .25s}
.aio-method.active{transform:scale(1.02);box-shadow:0 12px 30px rgba(91,75,255,.22),0 0 0 3px rgba(91,75,255,.14)}
.aio-method .m-logo{display:inline-block;transition:transform .25s}
.aio-method.active .m-logo{transform:scale(1.06)}
@keyframes aioPop{0%{transform:scale(1)}40%{transform:scale(.93)}70%{transform:scale(1.03)}100%{transform:scale(1)}}
.btn.pop{animation:aioPop .38s var(--aio-ease)}
@keyframes aioOkPop{0%{transform:scale(0)}60%{transform:scale(1.14)}100%{transform:scale(1)}}
.aio-success-card .ok,.aio-woo-thanks .ok{position:relative;animation:aioOkPop .65s var(--aio-ease) both}
.aio-success-card .ok::before,.aio-success-card .ok::after,.aio-woo-thanks .ok::before,.aio-woo-thanks .ok::after{content:'';position:absolute;inset:0;border-radius:50%;border:3px solid #10B981;animation:aioRing 1.8s ease-out 2}
.aio-success-card .ok::after,.aio-woo-thanks .ok::after{animation-delay:.35s}
@keyframes aioRing{from{transform:scale(1);opacity:.8}to{transform:scale(1.9);opacity:0}}

/* ---------- Search overlay ---------- */
.aio-search-modal{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.search-modal-box{animation:popIn .32s var(--aio-ease)}
@keyframes srIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.search-results .sr-item{animation:srIn .3s var(--aio-ease) both}
.search-results .sr-group:nth-child(2) .sr-item{animation-delay:.05s}
.search-results .sr-group:nth-child(3) .sr-item{animation-delay:.1s}

/* ---------- Mentor cinematic ---------- */
.mentor-grid{position:relative}
.mentor-grid::before{content:'';position:absolute;width:480px;height:480px;left:-140px;top:-60px;background:radial-gradient(circle,rgba(124,58,237,.12),transparent 65%);pointer-events:none}
.mentor-photo{position:relative;overflow:hidden;border-radius:24px}
.mentor-photo img{display:block;transition:transform .5s var(--aio-ease);will-change:transform}
.mentor-photo::after{content:'';position:absolute;inset:0;border-radius:24px;background:linear-gradient(200deg,rgba(255,255,255,.14),transparent 35%,transparent 70%,rgba(91,75,255,.12));pointer-events:none}
.skill-tags .tag{transition:transform .25s,box-shadow .25s}
.skill-tags .tag:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(91,75,255,.25)}

/* ---------- Testimonials slider ---------- */
.t-slider{overflow:hidden;position:relative;margin:0 -4px;padding:4px}
.t-track{display:flex;gap:20px;transition:transform .65s var(--aio-ease)}
.t-slide{flex:0 0 calc(33.333% - 14px);min-width:0}
.t-slide .testi{height:100%;margin:0}
.t-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:22px}
.t-arrow{width:46px;height:46px;border-radius:50%;border:var(--border);background:#fff;cursor:pointer;font-size:1.2rem;color:var(--aio-dark);transition:.25s;display:flex;align-items:center;justify-content:center}
.t-arrow:hover{background:var(--aio-primary);border-color:var(--aio-primary);color:#fff;transform:translateY(-2px)}
.t-dots{display:flex;gap:8px}
.t-dot{width:9px;height:9px;border-radius:50%;border:none;background:#D6DBE7;cursor:pointer;padding:0;transition:.25s}
.t-dot.on{background:var(--aio-primary);transform:scale(1.25)}

/* ---------- Blog / contact / footer ---------- */
.bc-meta .read{display:inline-block;transition:transform .25s var(--aio-ease)}
.blog-card:hover .bc-meta .read{transform:translateX(6px)}
.ccard{transition:transform .3s var(--aio-ease),box-shadow .3s}
.ccard:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.aio-footer{position:relative}
.aio-footer::before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--aio-primary) 30%,var(--aio-accent) 50%,var(--aio-secondary) 70%,transparent);opacity:.8}
.soc{transition:transform .25s var(--aio-ease),background .25s}
.soc:hover{transform:translateY(-3px)}
.wa-float{transition:transform .25s var(--aio-ease)}
.wa-float:hover{transform:scale(1.1)}

/* ---------- Toast ---------- */
.aio-toast{transition:transform .35s var(--aio-ease),opacity .3s}

/* ---------- Reduced motion: neutralize premium layer ---------- */
@media (prefers-reduced-motion:reduce){
#main{animation:none}
.reveal{filter:none}
.hero-copy>*{animation:none}
body::before,body::after{animation:none}
.t-track{transition:none}
.price-card .btn-primary,.sticky-enroll .btn-primary,.aio-success-card .ok,.aio-woo-thanks .ok,.aio-success-card .ok::before,.aio-success-card .ok::after,.aio-woo-thanks .ok::before,.aio-woo-thanks .ok::after,.btn.pop,.featured.glow::before{animation:none}
.course-card::before,.btn-primary::after{display:none}
}

/* ---------- Mobile guards ---------- */
@media(max-width:1024px){
.t-slide{flex-basis:calc(50% - 10px)}
.cursor-glow{display:none}
}
@media(max-width:768px){
.t-slide{flex-basis:100%}
body::before,body::after{opacity:.55}
.hero::after{background-size:32px 32px}
.course-card::before{display:none}
}