/* Champions Academy — Motion Layer
   Award-winning interactions: cursor, progress, reveals, grain, cards */

/* ── Custom Cursor ── */
.ca-has-cursor,.ca-has-cursor *{cursor:none!important}
.ca-cursor{
  position:fixed;top:-5px;left:-5px;width:10px;height:10px;
  background:#ffde02;border-radius:50%;pointer-events:none;
  z-index:99999;mix-blend-mode:difference;
  transition:width .3s cubic-bezier(.23,1,.32,1),height .3s cubic-bezier(.23,1,.32,1),margin .3s cubic-bezier(.23,1,.32,1),background .3s;
}
.ca-cursor.is-hover{width:44px;height:44px;margin:-17px 0 0 -17px;background:rgba(255,222,2,.25)}
.ca-cursor-follower{
  position:fixed;top:-20px;left:-20px;width:40px;height:40px;
  border:1.5px solid rgba(255,222,2,.35);border-radius:50%;
  pointer-events:none;z-index:99998;
  transition:width .45s cubic-bezier(.23,1,.32,1),height .45s cubic-bezier(.23,1,.32,1),margin .45s cubic-bezier(.23,1,.32,1),border-color .4s,opacity .4s;
}
.ca-cursor-follower.is-hover{width:64px;height:64px;margin:-12px 0 0 -12px;border-color:rgba(255,222,2,.08);opacity:.5}

/* ── Scroll Progress ── */
.ca-progress{
  position:fixed;top:0;left:0;height:3px;width:0;
  background:linear-gradient(90deg,#ffde02,#ffc800);z-index:100001;
  box-shadow:0 0 12px rgba(255,222,2,.45),0 0 4px rgba(255,222,2,.7);
  pointer-events:none;
}

/* ── Header Shrink ── */
body.champions-theme .site-header.e-con{
  transition:padding .45s cubic-bezier(.23,1,.32,1),background .35s!important;
}
body.champions-theme .hdr-shrunk.site-header.e-con{
  padding-top:6px!important;padding-bottom:6px!important;
  background:rgba(7,7,10,.97)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.06);
}

/* ── Split Text ── */
.ca-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:0.05em}
.ca-wi{display:inline-block;will-change:transform}

/* ── Reveal States ── */
.ca-r,.ca-rl,.ca-rr{will-change:transform,opacity,filter}
.ca-rs{will-change:transform,opacity}

/* ── Grain Overlay ── */
.ca-grain{position:relative}
.ca-grain::before{
  content:'';position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px;opacity:.03;pointer-events:none;z-index:1;
  border-radius:inherit;
}
.ca-grain>*{position:relative;z-index:2}

/* ── Card Hover ── */
.ca-card{
  transition:transform .5s cubic-bezier(.23,1,.32,1),
    border-color .4s cubic-bezier(.23,1,.32,1),
    box-shadow .45s cubic-bezier(.23,1,.32,1)!important;
}
.ca-card:hover{
  transform:translateY(-6px)!important;
  border-color:rgba(255,222,2,.28)!important;
  box-shadow:0 24px 60px rgba(0,0,0,.45)!important;
}

/* ── Eyebrow ── */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:Barlow,system-ui,sans-serif;font-weight:600;
  font-size:13px;letter-spacing:.1em;text-transform:uppercase;
  color:#ffde02;margin:0 0 .75rem;
}
.eyebrow::before{
  content:'';display:block;width:20px;height:2px;
  background:#ffde02;border-radius:2px;flex-shrink:0;
}

/* ── Marquee ── */
.marquee-track{
  display:flex;gap:2.5rem;white-space:nowrap;
  animation:marquee-scroll 30s linear infinite;
  font-family:Barlow,system-ui,sans-serif;font-weight:700;
  font-size:0.95rem;letter-spacing:.08em;text-transform:uppercase;
  color:#07070a;
}
.marquee-track span{flex-shrink:0}
@keyframes marquee-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* ── Buttons ── */
.btn.btn-primary .elementor-button,
body.champions-theme .btn-primary .elementor-button{
  background:#ffde02!important;color:#07070a!important;
  border-radius:999px!important;border:none!important;
  font-family:Barlow,system-ui,sans-serif!important;
  font-weight:700!important;font-size:.9rem!important;
  letter-spacing:.08em!important;text-transform:uppercase!important;
  padding:.85rem 2rem!important;
  box-shadow:0 4px 20px rgba(255,222,2,.25),0 1px 3px rgba(255,222,2,.15)!important;
  transition:transform .35s cubic-bezier(.23,1,.32,1),box-shadow .35s!important;
}
.btn.btn-primary .elementor-button:hover{
  box-shadow:0 8px 30px rgba(255,222,2,.35),0 2px 6px rgba(255,222,2,.2)!important;
}
.btn.btn-ghost .elementor-button,
body.champions-theme .btn-ghost .elementor-button{
  background:rgba(255,255,255,.04)!important;color:#fff!important;
  border:1.5px solid rgba(255,255,255,.14)!important;
  border-radius:999px!important;
  font-family:Barlow,system-ui,sans-serif!important;
  font-weight:700!important;font-size:.9rem!important;
  letter-spacing:.08em!important;text-transform:uppercase!important;
  padding:.82rem 2rem!important;
  transition:background .3s,border-color .3s,color .3s,transform .35s cubic-bezier(.23,1,.32,1)!important;
}
.btn.btn-ghost .elementor-button:hover{
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(255,255,255,.24)!important;
  color:#ffde02!important;
}

/* ── Section Spacing ── */
.sec{padding:clamp(4rem,8vw,6.5rem) 1.5rem}
.sec-alt{background:#111114}
.sec .container{max-width:1280px;margin:0 auto;width:100%}

/* ── Display Typography ── */
.display-xl{
  font-family:'Bebas Neue',Oswald,Impact,sans-serif!important;
  font-size:clamp(3rem,8.5vw,7.5rem)!important;
  font-weight:400!important;line-height:.9!important;
  letter-spacing:.02em!important;text-transform:uppercase!important;
  color:#fff!important;
}
.display-lg{
  font-family:'Bebas Neue',Oswald,Impact,sans-serif!important;
  font-size:clamp(2.2rem,5vw,3.8rem)!important;
  font-weight:400!important;line-height:.92!important;
  letter-spacing:.02em!important;text-transform:uppercase!important;
  color:#fff!important;
}
.display-md{
  font-family:'Bebas Neue',Oswald,Impact,sans-serif!important;
  font-size:clamp(1.8rem,3.5vw,2.8rem)!important;
  font-weight:400!important;line-height:.94!important;
  letter-spacing:.02em!important;text-transform:uppercase!important;
  color:#fff!important;
}

/* ── Yellow Accent Span ── */
.yl{color:#ffde02!important}

/* ── Course Cards ── */
.course-card{
  background:#171717;border:1px solid rgba(255,255,255,.08);
  border-radius:22px;overflow:hidden;
  transition:transform .5s cubic-bezier(.23,1,.32,1),border-color .4s,box-shadow .45s;
}
.course-card:hover{
  transform:translateY(-6px);
  border-color:rgba(255,222,2,.28);
  box-shadow:0 24px 60px rgba(0,0,0,.45);
}
.course-card .thumb{
  position:relative;padding-top:65%;overflow:hidden;
  background:radial-gradient(ellipse at 30% 20%,rgba(255,222,2,.18),transparent 70%),#111114;
}
.course-card .badge{
  position:absolute;top:14px;left:14px;
  background:rgba(255,222,2,.14);color:#ffde02;
  font-family:Barlow,system-ui,sans-serif;font-weight:700;
  font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.35rem .75rem;border-radius:999px;
}
.course-card .body{padding:1.25rem 1.35rem 1.5rem}
.course-card .meta{
  font-family:Barlow,system-ui,sans-serif;font-weight:600;
  font-size:.72rem;color:#7e8395;letter-spacing:.06em;
  text-transform:uppercase;margin-bottom:.5rem;
}
.course-card h3{
  font-family:'Bebas Neue',sans-serif;font-weight:400;
  font-size:1.6rem;line-height:.95;text-transform:uppercase;
  color:#fff;margin:0 0 .5rem;letter-spacing:.02em;
}
.course-card .excerpt{font-family:Manrope,sans-serif;font-weight:500;font-size:.88rem;color:#d8dade;line-height:1.5;margin-bottom:1rem}
.course-card .foot{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:1rem;border-top:1px solid rgba(255,255,255,.08);
}
.course-card .price{
  font-family:'Bebas Neue',sans-serif;font-size:1.5rem;color:#ffde02;
}
.course-card .price .was{
  font-family:Manrope,sans-serif;font-size:.8rem;color:#585c6b;
  text-decoration:line-through;margin-left:.5rem;
}
.course-card .enroll{
  font-family:Barlow,sans-serif;font-weight:700;
  font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;
  color:#ffde02;text-decoration:none;
  padding:.55rem 1.1rem;border:1.5px solid rgba(255,222,2,.3);
  border-radius:999px;transition:all .3s;
}
.course-card .enroll:hover{background:#ffde02;color:#07070a}

/* ── Pricing Cards ── */
.price-card{
  background:#171717;border:1px solid rgba(255,255,255,.08);
  border-radius:22px;padding:2.5rem 2rem;
  transition:transform .5s cubic-bezier(.23,1,.32,1),border-color .4s,box-shadow .45s;
}
.price-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,222,2,.2);
}
.price-card.featured{
  transform:scale(1.03);
  border-color:rgba(255,222,2,.35);
  background:radial-gradient(ellipse at 50% 0%,rgba(255,222,2,.08),transparent 65%),#171717;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
}
.price-card.featured:hover{transform:scale(1.03) translateY(-4px)}
.price-card .popular{
  display:inline-block;background:#ffde02;color:#07070a;
  font-family:Barlow,sans-serif;font-weight:700;
  font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.35rem .85rem;border-radius:999px;margin-bottom:1.25rem;
}

/* ── Step Cards ── */
.step-card{
  position:relative;background:#171717;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;padding:2rem 1.75rem 1.75rem;overflow:hidden;
}
.step-card .num{
  position:absolute;top:-8px;right:12px;
  font-family:'Bebas Neue',sans-serif;font-size:5rem;
  color:rgba(255,255,255,.04);line-height:1;pointer-events:none;
}
.step-card .label{
  font-family:Barlow,sans-serif;font-weight:700;
  font-size:.78rem;color:#ffde02;letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:.65rem;
}
.step-card h3{
  font-family:'Bebas Neue',sans-serif;font-weight:400;
  font-size:1.5rem;line-height:.95;text-transform:uppercase;
  color:#fff;margin:0 0 .6rem;letter-spacing:.02em;
}
.step-card p{font-family:Manrope,sans-serif;font-weight:500;font-size:.88rem;color:#d8dade;line-height:1.5;margin:0}

/* ── FAQ ── */
.faq-item{
  background:#171717;border:1px solid rgba(255,255,255,.08);
  border-radius:14px;margin-bottom:12px;overflow:hidden;
}
.faq-item summary{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.15rem 1.35rem;cursor:pointer;
  font-family:Manrope,sans-serif;font-weight:600;
  font-size:1rem;color:#fff;list-style:none;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:'+';font-family:Barlow,sans-serif;font-weight:700;
  font-size:1.3rem;width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);border-radius:50%;
  color:#fff;flex-shrink:0;transition:transform .35s cubic-bezier(.23,1,.32,1),background .3s,color .3s;
}
.faq-item[open] summary::after{
  transform:rotate(45deg);background:#ffde02;color:#07070a;
}
.faq-item .answer{
  padding:0 1.35rem 1.25rem;
  font-family:Manrope,sans-serif;font-weight:500;
  font-size:.9rem;color:#d8dade;line-height:1.6;
}

/* ── CTA Band ── */
.cta-band{
  background:radial-gradient(ellipse at 20% 50%,rgba(255,222,2,.12),transparent 55%),#171717;
  border:1px solid rgba(255,255,255,.08);border-radius:22px;
  padding:clamp(2.5rem,5vw,4rem) clamp(2rem,4vw,3.5rem);
}

/* ── Footer Mega ── */
.footer-mega{
  font-family:'Bebas Neue',sans-serif;font-weight:400;
  font-size:clamp(3rem,10vw,7rem);line-height:.85;
  text-transform:uppercase;color:rgba(255,255,255,.06);
  letter-spacing:.02em;overflow:hidden;
}

/* ── Proof Cards ── */
.proof-card{
  background:#171717;border:1px solid rgba(255,255,255,.08);
  border-radius:22px;padding:1.5rem;position:relative;overflow:hidden;
  min-height:180px;
  transition:transform .5s cubic-bezier(.23,1,.32,1),border-color .4s;
}
.proof-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,222,2,.2);
}
.proof-card .stat{
  font-family:'Bebas Neue',sans-serif;font-size:1.4rem;
  color:#ffde02;text-transform:uppercase;margin-bottom:.5rem;
}
.proof-card .course-name{
  font-family:Manrope,sans-serif;font-weight:600;
  font-size:.92rem;color:#fff;margin-bottom:.25rem;
}
.proof-card .note{
  font-family:Manrope,sans-serif;font-weight:500;
  font-size:.82rem;color:#7e8395;
}

/* ── Responsive ── */
@media(max-width:768px){
  .ca-cursor,.ca-cursor-follower{display:none!important}
  .sec{padding:3rem 1rem}
}

/* ── Reduced Motion ── */
@media(prefers-reduced-motion:reduce){
  .ca-cursor,.ca-cursor-follower{display:none!important}
  .ca-progress{display:none!important}
  .ca-card,.course-card,.price-card,.step-card,.proof-card{transition:none!important}
  .ca-card:hover,.course-card:hover,.price-card:hover,.proof-card:hover{transform:none!important}
  .marquee-track{animation:none!important}
}