/* ============ TOKENS ============ */
:root{
  --ink:#0a0612;
  --plum:#160a26;
  --violet-deep:#3b1d6e;
  --violet:#7c3aed;
  --orchid:#a855f7;
  --lilac:#c4b5fd;
  --pale:#ede9fe;
  --white:#ffffff;
  --grad:linear-gradient(100deg,#7c3aed 0%,#a855f7 45%,#d8b4fe 100%);
  --grad-soft:linear-gradient(135deg,#a855f7,#7c3aed);
  --glass-w:rgba(255,255,255,.62);
  --glass-brd:rgba(255,255,255,.75);
  --serif:'Fraunces',Georgia,serif;
  --sans:'Manrope',sans-serif;
  --shadow-lg:0 30px 80px -20px rgba(60,20,120,.28);
  --r:20px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden;width:100%}
body{font-family:var(--sans);font-weight:300;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;width:100%}
::selection{background:var(--orchid);color:#fff}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.wrap{max-width:1600px;margin:0 auto;padding:0 48px}
.hero .wrap{max-width:1385px !important;padding:0}
.learners .wrap{max-width:1384px}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.serif-i{font-family:var(--serif);font-style:italic;font-weight:300}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--violet)}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--grad)}
.btn{display:inline-flex;align-items:center;gap:12px;padding:17px 34px;border-radius:100px;font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.04em;cursor:pointer;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;border:none}
.btn svg{transition:transform .35s}
.btn:hover svg{transform:translateX(5px)}
.btn-grad{background:var(--grad);color:#fff;box-shadow:0 12px 34px -10px rgba(124,58,237,.55)}
.btn-grad:hover{transform:translateY(-2px);box-shadow:0 18px 44px -10px rgba(124,58,237,.65)}
.btn-ghost{background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(12px)}
.btn-ghost:hover{background:rgba(255,255,255,.14)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{transform:translateY(-2px);box-shadow:0 16px 40px -12px rgba(10,6,18,.5)}

/* ============ LINE-ART TEXTURE for white areas ============ */
.lined{position:relative}
.lined::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(124,58,237,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(124,58,237,.05) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(ellipse 90% 80% at 50% 30%,#000 30%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 50% 30%,#000 30%,transparent 100%);
}
.lined>*{position:relative;z-index:1}

/* ============ NAV — 1700px glass, 20px radius ============ */
.nav{
  width:100%;max-width:1600px;border-radius:var(--r);
  background:#d8d7db;
  backdrop-filter:blur(26px) saturate(1.6);-webkit-backdrop-filter:blur(26px) saturate(1.6);
  border:1px solid var(--glass-brd);
  box-shadow:0 8px 40px -12px rgba(60,20,120,.18),inset 0 1px 0 rgba(255,255,255,.9);
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 28px;transition:box-shadow .4s,background .4s;
  overflow:hidden;position:relative;
}
.nav.scrolled{background:rgba(255,255,255,.82);box-shadow:0 14px 50px -12px rgba(60,20,120,.28)}
.logo{position:relative;z-index:1;font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:-.01em;display:flex;align-items:baseline;width:132px !important}
.logo-glow{
  position:absolute;left:-170px;top:50%;transform:translateY(-50%);
  width:400px;height:138px;border-radius:50%;
  background:radial-gradient(ellipse,rgba(255,255,255,.98) 0%,rgba(255,255,255,.75) 32%,rgba(255,255,255,.25) 58%,rgba(255,255,255,0) 75%);
  pointer-events:none;z-index:0;
}
.nav.dark .logo-glow{
  background:radial-gradient(ellipse,rgba(100,70,147,.98) 0%,rgba(100,70,147,.75) 32%,rgba(100,70,147,.25) 58%,rgba(100,70,147,0) 75%);
}
.logo .logo-white{display:none}
.nav.dark .logo .logo-default{display:none}
.nav.dark .logo .logo-white{display:block}
.logo-img{position:relative;z-index:1;width:132px;max-width:none;height:auto;display:block}
.nav-links{display:flex;align-items:center;gap:6px;list-style:none}
.nav-links>li{position:relative}
.nav-links>li>a{display:flex;align-items:center;gap:7px;padding:11px 18px;border-radius:12px;font-size:14px;font-weight:500;color:#241536;transition:background .3s,color .3s}
.nav-links>li>a:hover{background:rgba(124,58,237,.08);color:var(--violet)}
.nav-links .chev{width:9px;height:9px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .3s}
.has-mega:hover .chev{transform:rotate(225deg) translateY(-1px)}
.nav-cta{display:flex;align-items:center;gap:10px}
.nav-cta .btn{padding:12px 26px;font-size:13px}
.nav-user{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:#fff;background:var(--grad-soft);box-shadow:0 8px 22px -8px rgba(124,58,237,.6);transition:transform .3s,box-shadow .3s;flex:0 0 auto}
.nav-user:hover{transform:translateY(-2px);box-shadow:0 14px 30px -8px rgba(124,58,237,.7);color:#fff}
.nav-user svg{display:block}
.burger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:8px;line-height:0}
.burger span{width:24px;height:2px;min-height:2px;flex:0 0 auto;background:var(--ink);display:block;border-radius:1px}

.video-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px}
.video-modal.is-open{display:flex}
.video-modal-backdrop{position:absolute;inset:0;background:rgba(8,5,14,.9);backdrop-filter:blur(6px)}
.video-modal-inner{position:relative;z-index:1;width:min(900px,92vw);max-height:90vh}
.video-modal-inner video{width:100%;max-height:90vh;border-radius:16px;display:block;background:#000;box-shadow:0 40px 100px -20px rgba(0,0,0,.7)}
.video-modal-close{position:absolute;top:-44px;right:0;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.video-modal-close:hover{background:rgba(255,255,255,.22)}

.class-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:24px}
.class-modal.is-open{display:flex}
.class-modal-backdrop{position:absolute;inset:0;background:rgba(8,5,14,.9);backdrop-filter:blur(6px)}
.class-modal-inner{position:relative;z-index:1;width:min(980px,94vw);max-height:88vh;border-radius:22px;overflow:hidden;display:grid;grid-template-columns:62% 38%;background:#0f0a18;box-shadow:0 50px 120px -20px rgba(0,0,0,.75)}
.class-modal-body{order:1}
.class-modal-photo{order:2}
.class-modal-close{position:absolute;top:18px;right:18px;z-index:3;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:50%;width:38px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff}
.class-modal-close:hover{background:rgba(255,255,255,.22)}
.class-modal-photo{position:relative;min-height:100%;background-size:cover;background-position:center top}
.class-modal-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,10,24,.15) 0%,rgba(15,10,24,.55) 60%,rgba(15,10,24,.92) 100%)}
.class-modal-presenter{position:absolute;left:26px;bottom:26px;z-index:2;color:#fff}
.class-modal-presenter b{display:block;font-family:var(--serif);font-size:22px;font-weight:400}
.class-modal-presenter span{font-size:12.5px;color:#d8b4fe;letter-spacing:.02em}
.class-modal-body{padding:46px 46px 40px;overflow-y:auto;color:#e7ddf5}
.class-modal-body .eyebrow{color:#c8a6f5}
.class-modal-body h2{font-family:var(--serif);font-weight:400;font-size:32px;color:#fff;margin:14px 0 16px;letter-spacing:-.01em}
.class-modal-meta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.class-modal-meta span{font-size:12px;font-weight:600;letter-spacing:.06em;color:#e9d5ff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);padding:8px 16px;border-radius:100px}
.class-modal-body p.desc{font-size:15px;line-height:1.75;color:#cfc4e6;margin-bottom:22px}
.class-modal-highlights{list-style:none;margin:0 0 26px;padding:0;display:flex;flex-direction:column;gap:11px}
.class-modal-highlights li{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:#e7ddf5}
.class-modal-highlights li::before{content:'';flex:0 0 auto;width:8px;height:8px;margin-top:5px;border-radius:50%;background:var(--grad-soft, linear-gradient(135deg,#a855f7,#6366f1))}
.class-modal-stats{display:flex;gap:22px;margin-bottom:26px;padding:16px 0;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.class-modal-stats div{display:flex;flex-direction:column;gap:2px}
.class-modal-stats b{font-family:var(--serif);font-size:20px;font-weight:400;color:#fff}
.class-modal-stats span{font-size:11px;letter-spacing:.04em;color:#a897c4}
.class-modal-body .btn{width:100%;justify-content:center}
@media(max-width:700px){
  .class-modal-inner{grid-template-columns:1fr;max-height:92vh;overflow-y:auto}
  .class-modal-body{order:1}
  .class-modal-photo{order:0;min-height:220px}
  .class-modal-body{padding:32px 26px 34px}
}

/* mega menu — unnested from .nav so its backdrop-filter samples real page content, not an already-blurred parent */
header{position:fixed;top:18px;left:0;right:0;z-index:100;display:flex;flex-direction:column;align-items:center;padding:0 48px;width:100%;max-width:100vw;box-sizing:border-box}
.mega{
  position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(12px);
  width:min(920px,92vw);border-radius:var(--r);padding:34px;
  background:rgba(255,255,255,.42);
  backdrop-filter:blur(36px) saturate(2.1);-webkit-backdrop-filter:blur(36px) saturate(2.1);
  border:1px solid rgba(255,255,255,.6);
  box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,1),inset 0 0 60px rgba(255,255,255,.15);
  background-image:linear-gradient(135deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.15) 45%,rgba(255,255,255,.3) 100%),
    radial-gradient(120% 60% at 0% 0%,rgba(255,255,255,.4),transparent 60%);
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .35s,transform .35s,visibility .35s;
  z-index:99;
}
.mega.is-open{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);pointer-events:auto}
.mega-col h5{font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--violet);margin-bottom:14px;padding:0 14px}
.mega-col a{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:14px;transition:background .25s}
.mega-col a:hover{background:rgba(124,58,237,.08)}
.mega-col a b{font-size:14px;font-weight:600;color:var(--ink)}
.mega-col a span{font-size:12.5px;color:#6b5c80;font-weight:400}
.mega-feature{grid-column:4;border-radius:16px;background:linear-gradient(180deg,rgba(22,10,38,.15) 0%,rgba(22,10,38,.85) 100%),url("mega-feature.png");background-size:cover;background-position:top center;color:#fff;padding:24px;display:flex;flex-direction:column;justify-content:space-between;min-height:220px;overflow:hidden;position:relative}
.mega-feature::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(168,85,247,.55),transparent 70%);bottom:-110px;right:-70px}
.mega-feature p{font-family:var(--serif);font-style:italic;font-size:19px;font-weight:300;line-height:1.35;position:relative;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.mega-feature a{font-size:13px;font-weight:600;color:var(--lilac);position:relative}

/* ============ HERO — video background, text left, video card right ============ */
.hero{
  position:relative;min-height:100vh;display:flex;align-items:center;
  background:#08050e;
  color:#fff;padding:170px 0 120px;overflow:hidden;
}
.hero-bg-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none;
}
.hero-bg-video-rev{opacity:0}
.hero-overlay{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,#000 0%,rgba(10,6,18,.6) 35%,rgba(59,29,110,.55) 75%,#3b1d6e 100%);
}
.hero::after{ /* grain */
  content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.035 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero::before{ /* glass sheen layer */
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    linear-gradient(120deg,rgba(255,255,255,.06) 0%,transparent 30%),
    radial-gradient(60% 45% at 75% 15%,rgba(255,255,255,.09),transparent 70%);
  backdrop-filter:blur(0px);
}

.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:80px;align-items:center;position:relative;z-index:2;padding:0}
.hero-copy{position:relative;left:-143px}
.hero-copy .eyebrow{color:var(--lilac)}
.hero-copy .eyebrow::before{background:var(--lilac)}
.hero-mobile-eyebrow{display:none}
.hero-sub .mobile-br{display:none}
h1{font-family:var(--serif);font-weight:300;font-size:clamp(52px,5.6vw,96px);line-height:1.02;letter-spacing:-.015em;margin:28px 0 30px}
h1 .accent{display:block;font-style:italic;background:linear-gradient(95deg,#8b5cf6 0%,#a855f7 40%,#e9d5ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right: 0.1em;}
.hero-sub{font-size:18px;line-height:1.75;font-weight:300;color:#cfc4e6;max-width:none;margin-bottom:44px}
.hero-sub b{font-weight:600;color:#fff}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.hero-proof{display:flex;gap:44px;margin-top:64px;padding-top:36px;border-top:1px solid rgba(255,255,255,.12)}
.hero-startinfo{display:flex;gap:28px}
.hero-startinfo>div{display:flex;flex-direction:column;gap:4px;padding-left:22px;border-left:1px solid rgba(255,255,255,.16)}
.hero-startinfo span{font-size:12px;color:#a794c9;font-weight:500}
.hero-startinfo b{font-size:14px;font-weight:600;color:#fff}
.hero-proof div b{display:block;font-family:var(--serif);font-weight:400;font-size:30px}
.hero-proof div span{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:#a794c9}

/* hero video panel */
.hero-visual{position:relative;left:60px}
.hero-media{perspective:1400px}
.video-frame{
  position:relative;border-radius:26px;overflow:hidden;transform:rotateY(-7deg) rotateX(2deg);
  width:115%;margin-left:-15%;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 60px 120px -30px rgba(0,0,0,.7),0 0 0 10px rgba(255,255,255,.04),inset 0 1px 0 rgba(255,255,255,.3);
  transition:transform .8s cubic-bezier(.2,.8,.2,1);
}
.hero-visual:hover .video-frame{transform:rotateY(-2deg) rotateX(0)}
.video-frame video{width:100%;height:644px;object-fit:cover;display:block}
.video-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,rgba(124,58,237,.24),transparent 45%,rgba(10,6,18,.35));pointer-events:none}
.hero-play{
  position:absolute;top:55%;left:38%;transform:translate(-50%,-50%);
  width:76px;height:76px;border-radius:50%;border:none;cursor:pointer;z-index:2;
  background:rgba(124,58,237,.35);
  backdrop-filter:blur(14px) saturate(1.8);-webkit-backdrop-filter:blur(14px) saturate(1.8);
  border:1px solid rgba(168,85,247,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 30px -6px rgba(124,58,237,.45);
  display:flex;align-items:center;justify-content:center;
  transition:transform .3s ease,box-shadow .3s ease;
}
.hero-play svg{margin-left:3px}
.hero-play:hover{transform:translate(-50%,-50%) scale(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 36px -6px rgba(124,58,237,.55)}
.hero-chip{
  position:absolute;border-radius:16px;padding:14px 20px;z-index:3;overflow:hidden;
  background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.45);
  backdrop-filter:blur(22px) saturate(1.8);-webkit-backdrop-filter:blur(22px) saturate(1.8);
  box-shadow:0 20px 50px -18px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.5);
  font-size:13px;font-weight:500;color:#fff;
  display:flex;align-items:center;gap:10px;animation:float 12s ease-in-out infinite;
}
.hero-chip .pulse{width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.chip-a{position:absolute;top:34px;left:-84px;animation-delay:-3s}
.chip-b{position:absolute;bottom:44px;right:-24px;animation-delay:-7s}
.chip-b b{font-family:var(--serif);font-weight:400;font-size:18px}

/* ============ REVIEWS GLASS STRIP ============ */
.reviews-strip{position:relative;z-index:5;margin-top:-111px;display:flex;justify-content:center;padding:0 24px;background:none !important}
.reviews-card{
  width:100%;max-width:1384px;border-radius:var(--r);
  background:rgba(255,255,255,.55);backdrop-filter:blur(28px) saturate(1.7);-webkit-backdrop-filter:blur(28px) saturate(1.7);
  border:1px solid var(--glass-brd);box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.95);
  display:flex;align-items:center;justify-content:space-between;gap:32px;padding:26px 44px;flex-wrap:wrap;
}
.stars{display:flex;align-items:center;gap:18px}
.stars-row{display:flex;gap:4px}
.stars-row svg{width:22px;height:22px;fill:url(#starGrad)}
.stars .score{font-family:var(--serif);font-size:34px;font-weight:400}
.stars .count{font-size:13.5px;color:#5d4d75;font-weight:400;line-height:1.4}
.stars .count b{font-weight:700;color:var(--ink)}
.avatars{display:flex;align-items:center}
.avatars span,.avatars img{width:42px;height:42px;border-radius:50%;border:2.5px solid #fff;margin-left:-12px;display:flex;align-items:center;justify-content:center}
.avatars img{object-fit:cover}
.avatars span{background:var(--grad-soft);color:#fff;font-size:13px;font-weight:600}
.avatars span:nth-child(4){background:linear-gradient(135deg,#a855f7,#2e1065)}
.avatars em{font-style:normal;font-size:13px;color:#5d4d75;margin-left:16px}
.review-quote{max-width:360px;font-family:var(--serif);font-style:italic;font-size:16.5px;font-weight:300;line-height:1.5;color:#2c1b45}

/* ============ LEARNERS MARQUEE ============ */
.learners{background:#fdfcff;padding-bottom:0}
.marquee{overflow:hidden;margin-top:14px;padding:10px 0 26px;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:20px;width:max-content;animation:marquee 92s linear infinite}
/* marquee never pauses */
@keyframes marquee{to{transform:translateX(-50%)}}
.learner-card{
  width:158px;border-radius:18px;overflow:hidden;flex:0 0 auto;
  background:rgba(255,255,255,.8);border:1px solid rgba(124,58,237,.12);
  box-shadow:0 10px 30px -14px rgba(60,20,120,.16);
  transition:transform .4s,box-shadow .4s;
}
.learner-card:hover{transform:translateY(-5px);box-shadow:0 20px 44px -16px rgba(90,40,180,.3)}
.learner-card .co{font-size:12px;font-weight:700;letter-spacing:.03em;color:#42335c;padding:13px 10px 11px;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px}
.learner-card .co i{width:7px;height:7px;border-radius:50%;background:var(--grad-soft);font-style:normal}
.learner-card .face{height:126px;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-weight:300;font-size:36px;color:rgba(255,255,255,.92)}
.learner-card .role{font-size:11px;color:#8a7aa3;text-align:center;padding:10px 8px 14px;letter-spacing:.04em}

/* ============ MINI GRIDS (frameworks & tools) ============ */
.mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.mini-card{
  display:flex;align-items:center;gap:20px;padding:26px 28px;border-radius:18px;cursor:default;
  background:rgba(255,255,255,.72);backdrop-filter:blur(12px);
  border:1px solid rgba(124,58,237,.11);box-shadow:0 4px 20px -12px rgba(60,20,120,.1);
  transition:transform .4s,border-color .4s,box-shadow .4s;
}
.mini-card:hover{transform:translateY(-4px);border-color:rgba(168,85,247,.35);box-shadow:0 18px 44px -18px rgba(90,40,180,.28)}
.mini-icon{flex:0 0 46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:rgba(124,58,237,.06);border:1px solid rgba(124,58,237,.14)}
.mini-icon svg{width:22px;height:22px;stroke:var(--violet);stroke-width:1.1;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mini-card b{font-size:15.5px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.mini-card span{display:block;font-size:12.5px;font-weight:400;color:#8a7aa3;margin-top:3px}

/* tool name chips */
.chips-label{font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--violet);margin:70px 0 26px}
.chips{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.chip{
  padding:20px 14px;border-radius:14px;text-align:center;font-size:14px;font-weight:600;letter-spacing:.01em;color:#2c1b45;
  background:rgba(255,255,255,.75);backdrop-filter:blur(10px);
  border:1px solid rgba(124,58,237,.12);box-shadow:0 4px 18px -10px rgba(60,20,120,.1);
  display:flex;align-items:center;justify-content:center;gap:9px;
  transition:transform .35s,border-color .35s;
}
.chip:hover{transform:translateY(-3px);border-color:rgba(168,85,247,.4)}
.chip i{width:8px;height:8px;border-radius:50%;flex:0 0 auto;font-style:normal;background:var(--grad-soft)}
.chip:nth-child(3n) i{background:linear-gradient(135deg,#4c1d95,#a855f7)}
.chip:nth-child(3n+1) i{background:linear-gradient(135deg,#c4b5fd,#7c3aed)}

/* ============ GUARANTEE STEPS ============ */
.gsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1240px;margin:0 auto 84px}
.gstep{
  border-radius:18px;padding:32px 30px;
  background:rgba(255,255,255,.66);backdrop-filter:blur(16px);
  border:1px solid var(--glass-brd);box-shadow:0 8px 30px -14px rgba(60,20,120,.14),inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .4s,box-shadow .4s;
}
.gstep:hover{transform:translateY(-4px);box-shadow:0 20px 46px -18px rgba(90,40,180,.26)}
.gstep .glabel{display:block;font-size:11px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:12px}
.gstep p{font-family:var(--serif);font-weight:400;font-size:19px;letter-spacing:-.01em;color:var(--ink);line-height:1.4}

/* ============ SECTION SHELL ============ */
section{padding:130px 0}
.sec-head{max-width:820px;margin-bottom:72px}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head.center .eyebrow{justify-content:center}
.sec-head.center .eyebrow::before{display:inline-block}
h2{font-family:var(--serif);font-weight:300;font-size:clamp(38px,3.6vw,62px);line-height:1.08;letter-spacing:-.015em;margin:22px 0 20px}
h2 .accent{font-style:italic;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right: 0.1em;}
.sec-sub{font-size:17px;line-height:1.75;color:#5d4d75;max-width:600px}
.classes .sec-sub{padding-bottom:40px}
.sec-head.center .sec-sub{margin-inline:auto}

/* ============ CLASSES GRID ============ */
.classes{background:linear-gradient(180deg,rgba(239,230,254,.5) 0%,transparent 100px),#fdfcff}
.grid-classes{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.class-card{
  position:relative;border-radius:var(--r);padding:38px 30px 34px;overflow:hidden;cursor:pointer;
  background:rgba(255,255,255,.72);backdrop-filter:blur(14px);
  border:1px solid rgba(124,58,237,.1);
  box-shadow:0 4px 24px -12px rgba(60,20,120,.1);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s;
}
.class-card::before{content:"";position:absolute;inset:0;background:linear-gradient(170deg,rgba(168,85,247,.09),rgba(124,58,237,.03) 55%,transparent);opacity:0;transition:opacity .45s}
.class-card:hover{transform:translateY(-8px);border-color:rgba(168,85,247,.35);box-shadow:0 26px 60px -20px rgba(90,40,180,.3)}
.class-card:hover::before{opacity:1}
.class-icon{width:58px;height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:26px;
  background:rgba(124,58,237,.06);border:1px solid rgba(124,58,237,.14);transition:background .45s,transform .45s}
.class-card:hover .class-icon{background:var(--grad);transform:scale(1.06)}
.class-icon svg{width:27px;height:27px;stroke:var(--violet);stroke-width:1.1;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:stroke .45s}
.class-card:hover .class-icon svg{stroke:#fff}
.class-card h3{font-family:var(--serif);font-weight:400;font-size:21px;margin-bottom:10px;letter-spacing:-.01em}
.class-card p{font-size:14px;line-height:1.65;color:#6b5c80;margin-bottom:22px}
.class-meta{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--violet)}
.class-meta .arrow{width:30px;height:30px;border-radius:50%;border:1px solid rgba(124,58,237,.3);display:flex;align-items:center;justify-content:center;transition:background .35s}
.class-meta .arrow svg{width:13px;height:13px;stroke:var(--violet);stroke-width:1.4;fill:none;transition:stroke .35s}
.class-card:hover .class-meta .arrow{background:var(--violet)}
.class-card:hover .class-meta .arrow svg{stroke:#fff}
.classes-cta{text-align:center;margin-top:58px}

/* ============ CAROUSEL ============ */
.tracks{background:linear-gradient(180deg,#fdfcff,#f6f2fd)}
.carousel-shell{position:relative}
.carousel{display:flex;gap:26px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;padding:6px 6px 6px;scroll-behavior:smooth}
.carousel::-webkit-scrollbar{display:none}
.slide{
  position:relative;flex:0 0 clamp(300px,31vw,470px);height:560px;border-radius:26px;overflow:hidden;
  scroll-snap-align:start;cursor:pointer;
  box-shadow:0 18px 50px -18px rgba(60,20,120,.25);
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
  isolation:isolate;
}
.slide:hover{transform:translateY(-6px)}
.slide-bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 1.2s cubic-bezier(.2,.8,.2,1);z-index:0}
.slide:hover .slide-bg{transform:scale(1.06)}
/* white gradient overlay: fades bottom -> top */
.slide::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(255,255,255,.96) 0%,rgba(255,255,255,.75) 30%,rgba(255,255,255,.28) 60%,rgba(255,255,255,0) 100%)}
/* purple hover overlay: still lets image through */
.slide::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(to top,rgba(124,58,237,.55),rgba(168,85,247,.25) 55%,rgba(168,85,247,.05));opacity:0;transition:opacity .5s;mix-blend-mode:multiply}
.slide:hover::after{opacity:1}
.slide-content{position:absolute;top:25%;left:0;right:0;padding:0 34px;z-index:3}
.slide-icon{width:54px;height:54px;border-radius:15px;display:flex;align-items:center;justify-content:center;margin-bottom:22px;
  background:rgba(255,255,255,.55);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.7);box-shadow:0 10px 30px -10px rgba(60,20,120,.3)}
.slide-icon svg{width:25px;height:25px;stroke:var(--violet);stroke-width:1.1;fill:none;stroke-linecap:round;stroke-linejoin:round}
.slide-content h3{font-family:var(--serif);font-weight:400;font-size:27px;letter-spacing:-.01em;margin-bottom:12px;color:var(--ink)}
.slide-content p{font-size:14.5px;line-height:1.7;color:#3f2f56;max-width:330px}
.slide-tag{position:absolute;top:26px;left:26px;z-index:3;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--violet);
  background:rgba(255,255,255,.6);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.8);padding:8px 15px;border-radius:100px}
.slide-enroll{position:absolute;bottom:30px;left:34px;z-index:3;display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--ink);opacity:0;transform:translateY(10px);transition:opacity .45s,transform .45s}
.slide:hover .slide-enroll{opacity:1;transform:translateY(0)}
.slide-enroll svg{width:15px;height:15px;stroke:currentColor;stroke-width:1.6;fill:none}

/* carousel controls: progress bottom-left, thin arrows bottom-right */
.carousel-controls{display:flex;align-items:center;justify-content:space-between;margin-top:44px}
.progress-track{width:min(380px,40vw);height:2px;background:rgba(124,58,237,.14);border-radius:2px;overflow:hidden}
.progress-fill{height:100%;width:0%;background:var(--grad);border-radius:2px;transition:width .4s ease}
.car-arrows{display:flex;gap:14px}
.car-btn{width:58px;height:58px;border-radius:50%;background:transparent;border:1px solid rgba(20,10,35,.22);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .3s,background .3s}
.car-btn svg{width:26px;height:26px;stroke:var(--ink);stroke-width:1;fill:none;stroke-linecap:round;transition:stroke .3s,transform .3s}
.car-btn:hover{border-color:var(--violet);background:rgba(124,58,237,.06)}
.car-btn:hover svg{stroke:var(--violet)}
.car-btn.prev:hover svg{transform:translateX(-3px)}
.car-btn.next:hover svg{transform:translateX(3px)}

/* ============ FUNNEL LAB ============ */
.funnels{background:#fff}
.funnel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.funnel-card{
  position:relative;border-radius:var(--r);padding:38px 32px;overflow:hidden;
  background:rgba(255,255,255,.72);backdrop-filter:blur(14px);
  border:1px solid rgba(124,58,237,.1);box-shadow:0 4px 24px -12px rgba(60,20,120,.1);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s;
}
.funnel-card:hover{transform:translateY(-8px);border-color:rgba(168,85,247,.35);box-shadow:0 26px 60px -20px rgba(90,40,180,.3)}
.funnel-num{font-family:var(--serif);font-style:italic;font-weight:300;font-size:15px;color:var(--orchid);letter-spacing:.08em;margin-bottom:16px;display:block}
.funnel-card h3{font-family:var(--serif);font-weight:400;font-size:22px;letter-spacing:-.01em;margin-bottom:12px}
.funnel-card>p{font-size:14px;line-height:1.7;color:#6b5c80;margin-bottom:24px}
.funnel-steps{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.funnel-steps span{font-size:11.5px;font-weight:600;letter-spacing:.05em;color:var(--violet);background:rgba(124,58,237,.07);border:1px solid rgba(124,58,237,.14);padding:7px 13px;border-radius:100px}
.funnel-steps i{font-style:normal;color:#b8a6d9;font-size:12px}
.stat-band{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:64px}
.stat-cell{border-radius:var(--r);padding:38px 24px;text-align:center;
  background:rgba(255,255,255,.6);backdrop-filter:blur(16px);
  border:1px solid rgba(124,58,237,.12);box-shadow:0 8px 30px -14px rgba(60,20,120,.14)}
.stat-cell b{display:block;font-family:var(--serif);font-weight:300;font-size:44px;letter-spacing:-.02em;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:8px}
.stat-cell span{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#6b5c80}

/* ============ TESTIMONIALS ============ */
.testi{background:linear-gradient(180deg,#fff,#f6f2fd)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.testi-card{
  border-radius:var(--r);padding:40px 34px;display:flex;flex-direction:column;gap:24px;
  background:rgba(255,255,255,.66);backdrop-filter:blur(20px) saturate(1.5);
  border:1px solid var(--glass-brd);box-shadow:0 10px 40px -18px rgba(60,20,120,.18),inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .45s,box-shadow .45s;
}
.testi-card:hover{transform:translateY(-6px);box-shadow:0 26px 60px -20px rgba(90,40,180,.26)}
.testi-card .stars-row svg{width:17px;height:17px}
.testi-card blockquote{font-family:var(--serif);font-style:italic;font-weight:300;font-size:19px;line-height:1.55;color:#2c1b45;flex:1}
.testi-id{display:flex;align-items:center;gap:14px}
.testi-id .face{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:600;background:var(--grad-soft)}
.testi-card:nth-child(2) .face{background:linear-gradient(135deg,#4c1d95,#a855f7)}
.testi-card:nth-child(3) .face{background:linear-gradient(135deg,#c4b5fd,#7c3aed)}
.testi-id b{display:block;font-size:14px;font-weight:600}
.testi-id span{font-size:12.5px;color:#8a7aa3}

/* ============ METHOD / HOW IT WORKS ============ */
.method{background:#fff}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:step}
.step{position:relative;border-radius:var(--r);padding:44px 36px;border:1px solid rgba(124,58,237,.12);background:rgba(255,255,255,.7);backdrop-filter:blur(10px);transition:transform .45s,box-shadow .45s}
.step:hover{transform:translateY(-6px);box-shadow:0 24px 56px -22px rgba(90,40,180,.28)}
.step::before{counter-increment:step;content:"0" counter(step);font-family:var(--serif);font-style:italic;font-weight:300;font-size:64px;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:block;margin-bottom:26px}
.step h3{font-family:var(--serif);font-weight:400;font-size:23px;margin-bottom:14px}
.step p{font-size:15px;line-height:1.75;color:#5d4d75}

/* ============ INSTRUCTOR / DARK BAND ============ */
.mentor{
  background:
    radial-gradient(90% 100% at 100% 0%,#3b1d6e 0%,transparent 55%),
    linear-gradient(180deg,#0d0718,#160a26);
  color:#fff;position:relative;overflow:hidden;
}
.mentor::after{content:"";position:absolute;inset:0;opacity:.4;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
.mentor-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;position:relative;z-index:1}
.mentor h2{color:#fff}
.mentor .sec-sub{color:#bda9dd}
.mentor-points{list-style:none;margin-top:36px;display:flex;flex-direction:column;gap:20px}
.mentor-points li{display:flex;gap:18px;align-items:flex-start;font-size:15.5px;line-height:1.65;color:#d8ccef;font-weight:300}
.mentor-points li b{color:#fff;font-weight:600}
.mentor-points .tick{flex:0 0 26px;height:26px;border-radius:50%;border:1px solid rgba(196,181,253,.4);display:flex;align-items:center;justify-content:center;margin-top:2px}
.mentor-points .tick svg{width:12px;height:12px;stroke:var(--lilac);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.mentor-visual{position:relative}
.mentor-card{
  border-radius:26px;padding:48px 44px;position:relative;overflow:hidden;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  box-shadow:0 50px 100px -30px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.14);
}
.mentor-card::before{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(168,85,247,.4),transparent 70%);top:-140px;right:-100px}
.mentor-card blockquote{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(22px,1.8vw,28px);line-height:1.45;position:relative;margin-bottom:36px}
.mentor-card blockquote .accent{background:linear-gradient(95deg,#a855f7,#e9d5ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.mentor-id{display:flex;align-items:center;gap:16px;position:relative}
.mentor-id .face{width:56px;height:56px;border-radius:50%;background:var(--grad-soft);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:22px;font-style:italic}
.mentor-id b{display:block;font-size:15px;font-weight:600}
.mentor-id span{font-size:13px;color:#a794c9}
.mentor-stats{display:flex;gap:20px;margin-top:26px}
.m-stat{flex:1;border-radius:18px;padding:22px;text-align:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(16px)}
.m-stat b{display:block;font-family:var(--serif);font-weight:400;font-size:28px;background:linear-gradient(95deg,#c4b5fd,#e9d5ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.m-stat span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#a794c9}

/* ============ ENROLL / PRICING ============ */
.enroll{background:#fdfcff}
.enroll-card{
  max-width:1240px;margin:0 auto;border-radius:30px;overflow:hidden;position:relative;
  display:grid;grid-template-columns:1.1fr .9fr;
  background:rgba(255,255,255,.66);backdrop-filter:blur(30px) saturate(1.6);
  border:1px solid var(--glass-brd);box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.95);
}
.enroll-left{padding:70px 64px}
.enroll-left h2{margin-top:0}
.enroll-perks{list-style:none;margin:34px 0 44px;display:flex;flex-direction:column;gap:16px}
.enroll-perks li{display:flex;gap:14px;align-items:center;font-size:15px;color:#42335c}
.enroll-perks .tick{flex:0 0 24px;height:24px;border-radius:50%;background:rgba(124,58,237,.1);display:flex;align-items:center;justify-content:center}
.enroll-perks .tick svg{width:11px;height:11px;stroke:var(--violet);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.enroll-form{display:flex;gap:12px;max-width:520px}
.enroll-form input{flex:1;padding:17px 24px;border-radius:100px;border:1px solid rgba(124,58,237,.22);background:rgba(255,255,255,.85);font-family:var(--sans);font-size:14.5px;font-weight:400;color:var(--ink);outline:none;transition:border-color .3s,box-shadow .3s}
.enroll-form input:focus{border-color:var(--orchid);box-shadow:0 0 0 4px rgba(168,85,247,.14)}
.enroll-note{font-size:12.5px;color:#8a7aa3;margin-top:16px}
.enroll-right{position:relative;background:linear-gradient(165deg,#1e0f38,#3b1d6e 60%,#6d28d9);color:#fff;padding:70px 56px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.enroll-right::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(216,180,254,.35),transparent 70%);bottom:-160px;right:-120px}
.price-tag{font-family:var(--serif);font-weight:300;font-size:64px;line-height:1}
.price-tag em{font-style:italic;background:linear-gradient(95deg,#c4b5fd,#f3e8ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.price-tag sub{font-family:var(--sans);font-size:14px;font-weight:400;color:#c7b8e8;vertical-align:baseline}
.price-was{font-size:15px;color:#a794c9;text-decoration:line-through;margin-top:10px}
.price-detail{margin:30px 0 0;padding-top:30px;border-top:1px solid rgba(255,255,255,.14);font-size:14.5px;line-height:1.8;color:#d8ccef;position:relative;z-index:1}
.seats{display:inline-flex;align-items:center;gap:10px;margin-top:26px;font-size:13px;font-weight:600;letter-spacing:.06em;color:#e9d5ff}
.seats .pulse{width:8px;height:8px;border-radius:50%;background:#c084fc;box-shadow:0 0 0 0 rgba(244,114,182,.6);animation:pulse 2s infinite}

/* ============ FAQ ============ */
.faq{background:#fff}
.faq-list{max-width:860px;margin:0 auto}
.faq-item{border-bottom:1px solid rgba(124,58,237,.12)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:30px 8px;font-family:var(--serif);font-weight:400;font-size:21px;letter-spacing:-.01em;transition:color .3s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--violet)}
.faq-x{flex:0 0 34px;height:34px;border-radius:50%;border:1px solid rgba(124,58,237,.3);position:relative;transition:transform .4s,background .4s}
.faq-x::before,.faq-x::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:1.4px;background:var(--violet);transform:translate(-50%,-50%)}
.faq-x::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s}
.faq-item[open] .faq-x{background:var(--violet)}
.faq-item[open] .faq-x::before,.faq-item[open] .faq-x::after{background:#fff}
.faq-item[open] .faq-x::after{transform:translate(-50%,-50%) rotate(0)}
.faq-item p{padding:0 8px 32px;font-size:15.5px;line-height:1.8;color:#5d4d75;max-width:720px}

/* ============ FINAL CTA ============ */
.final{
  background:
    radial-gradient(110% 100% at 50% 120%,#6d28d9 0%,#3b1d6e 40%,transparent 75%),
    linear-gradient(180deg,#08050e,#160a26);
  color:#fff;text-align:center;padding:170px 0 150px;position:relative;overflow:hidden;
}
.final::after{content:"";position:absolute;inset:0;opacity:.4;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
.final>.wrap{position:relative;z-index:2}
.final .eyebrow{color:var(--lilac);justify-content:center}
.final .eyebrow::before{background:var(--lilac)}
.final h2{font-size:clamp(44px,5vw,84px);color:#fff;margin:26px auto 22px;max-width:900px}
.final h2 .accent{background:linear-gradient(95deg,#8b5cf6,#a855f7 45%,#e9d5ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.final p{font-size:17px;color:#cfc4e6;max-width:520px;margin:0 auto 48px;line-height:1.75}
.final-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}

/* ============ FOOTER ============ */
footer{background:#08050e;color:#8a7aa3;padding:80px 0 44px;font-size:14px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,.08)}
.foot-grid .logo{color:#fff;margin-bottom:18px}
.foot-grid p{line-height:1.75;max-width:320px}
.foot-grid h6{color:#fff;font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;margin-bottom:20px}
.foot-grid ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.foot-grid ul a{transition:color .3s}
.foot-grid ul a:hover{color:var(--lilac)}
.foot-base{display:flex;justify-content:space-between;align-items:center;padding-top:36px;flex-wrap:wrap;gap:16px;font-size:13px}
.foot-base a{color:#8a7aa3}
.foot-base a:hover{color:var(--lilac)}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(36px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none;margin-top:50px;margin-bottom:-50px}
.marquee.reveal.in{margin-top:14px;margin-bottom:0}
.reveal[data-d="1"]{transition-delay:.12s}.reveal[data-d="2"]{transition-delay:.24s}.reveal[data-d="3"]{transition-delay:.36s}

/* ============ RESPONSIVE ============ */
@media(max-width:1280px){
  .grid-classes{grid-template-columns:repeat(3,1fr)}
  .hero-grid{grid-template-columns:1fr;gap:60px}
  .video-frame video{height:440px}
  .nav-links{display:none}.burger{display:flex}
}
@media(max-width:1280px){
  .funnel-grid,.testi-grid{grid-template-columns:repeat(2,1fr)}
  .mini-grid{grid-template-columns:repeat(2,1fr)}
  .chips{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:900px){
  .wrap{padding:0 24px;max-width:100%}
  section{padding:90px 0}
  .nav{max-width:100%}
  .grid-classes,.method-grid{grid-template-columns:1fr 1fr}
  .funnel-grid,.testi-grid{grid-template-columns:1fr}
  .stat-band{grid-template-columns:1fr 1fr}
  .mini-grid,.gsteps{grid-template-columns:1fr}
  .chips{grid-template-columns:repeat(3,1fr)}
  .mentor-grid,.enroll-card{grid-template-columns:1fr}
  .enroll-left,.enroll-right{padding:48px 34px}
  .hero{padding:125px 0 110px}
  .reviews-card{justify-content:center;text-align:center}
  .hero-copy .eyebrow{display:none}
  .hero-grid{display:flex;flex-direction:column}
  .hero-copy{display:contents;left:0}
  .hero-visual{left:0}
  .hero-mobile-eyebrow{display:flex;align-items:center;justify-content:center;gap:8px;order:0;text-align:center;color:var(--lilac) !important;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:-10px}
  .hero-mobile-orb{width:8px;height:8px;border-radius:50%;background:#c084fc;box-shadow:0 0 0 0 rgba(192,132,252,.6);animation:pulse 2s infinite;flex:0 0 auto}
  .hero-copy h1{order:1}
  .hero-copy .hero-sub{order:2}
  .hero-sub .mobile-br{display:block}
  .hero-visual{order:3;display:flex;justify-content:center}
  .hero-media{width:100%;max-width:420px}
  .video-frame{width:100%;margin-left:0;transform:none}
  .chip-a{left:-39px}
  .chip-b{right:-18px}
  .hero-copy .hero-actions{order:4}
  .hero-copy .hero-proof{display:none}
  header{padding:0 24px}
  .nav-cta .btn{display:none}
  .nav{
    width:100%;
    max-width:1600px;
    border-radius:var(--r);
    background:#d8d7db;
    backdrop-filter:blur(26px) saturate(1.6);
    -webkit-backdrop-filter:blur(26px) saturate(1.6);
    border:1px solid var(--glass-brd);
    box-shadow:0 8px 40px -12px rgba(60,20,120,.18),inset 0 1px 0 rgba(255,255,255,.9);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:2px 28px;
    transition:box-shadow .4s,background .4s;
    overflow:hidden;
    position:relative;
  }
  .logo{padding-top:10px;padding-bottom:10px}
  .hero-copy h1{text-align:center;margin-bottom:17px;margin-top:-27px;font-size:40px}
  .hero-copy .hero-sub{text-align:center;margin-bottom:-16px;margin-top:-50px;font-size:14px}
  .classes .sec-sub{padding-bottom:30px}
  .hero-copy .hero-actions{justify-content:center}
}
@media(max-width:640px){
  .grid-classes,.method-grid{grid-template-columns:1fr}
  .slide{flex-basis:86vw}
  .hero-proof{gap:26px;flex-wrap:wrap}
  .enroll-form{flex-direction:column}
  .enroll-form .btn{justify-content:center}
  h1{font-size:46px}
}

/* ============ SUBPAGES ============ */
.page-hero{position:relative;color:#fff;padding:200px 0 110px;overflow:hidden;
  background:
    radial-gradient(100% 80% at 80% 120%,#4c1d95 0%,transparent 55%),
    radial-gradient(70% 50% at 10% 110%,#6d28d9 0%,transparent 50%),
    linear-gradient(180deg,#08050e 0%,#0d0718 45%,#2e1065 100%);
}
.page-hero::after{content:"";position:absolute;inset:0;opacity:.45;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.8' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.035 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}
.page-hero .wrap{position:relative;z-index:2}
.crumb{display:flex;gap:12px;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#a794c9;margin-bottom:28px}
.crumb a{transition:color .3s}
.crumb a:hover{color:#fff}
.page-hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(44px,5vw,82px);line-height:1.04;letter-spacing:-.015em;margin:18px 0 24px}
.page-hero h1 .accent{font-style:italic;background:linear-gradient(95deg,#8b5cf6 0%,#a855f7 40%,#e9d5ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.1em}
.page-hero .sec-sub{color:#cfc4e6}
.page-hero .eyebrow{color:var(--lilac)}
.page-hero .eyebrow::before{background:var(--lilac)}
.hero-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.hero-meta span{font-size:12.5px;font-weight:600;letter-spacing:.08em;color:#e9d5ff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(12px);padding:10px 18px;border-radius:100px}

/* pricing tiers */
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.tier{
  position:relative;border-radius:26px;padding:48px 40px;display:flex;flex-direction:column;
  background:rgba(255,255,255,.66);backdrop-filter:blur(24px) saturate(1.5);
  border:1px solid var(--glass-brd);box-shadow:0 10px 40px -18px rgba(60,20,120,.18),inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .45s,box-shadow .45s;
}
.tier:hover{transform:translateY(-6px);box-shadow:0 30px 70px -24px rgba(90,40,180,.3)}
.tier h3{font-family:var(--serif);font-weight:400;font-size:24px;margin-bottom:6px}
.tier .t-for{font-size:13.5px;color:#8a7aa3;margin-bottom:28px}
.tier .t-price{font-family:var(--serif);font-weight:300;font-size:52px;letter-spacing:-.02em;margin-bottom:4px}
.tier .t-price em{font-style:italic;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tier .t-per{font-size:13px;color:#8a7aa3;margin-bottom:30px}
.tier ul{list-style:none;display:flex;flex-direction:column;gap:14px;margin-bottom:38px}
.tier ul li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;line-height:1.55;color:#42335c}
.tier ul .tick{flex:0 0 22px;height:22px;border-radius:50%;background:rgba(124,58,237,.1);display:flex;align-items:center;justify-content:center;margin-top:1px}
.tier ul .tick svg{width:10px;height:10px;stroke:var(--violet);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tier .btn{margin-top:auto;justify-content:center}
.tier.hot{background:linear-gradient(165deg,#1e0f38,#3b1d6e 60%,#6d28d9);color:#fff;border-color:rgba(196,181,253,.3)}
.tier.hot h3,.tier.hot .t-price{color:#fff}
.tier.hot .t-price em{background:linear-gradient(95deg,#c4b5fd,#f3e8ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tier.hot .t-for,.tier.hot .t-per{color:#a794c9}
.tier.hot ul li{color:#d8ccef}
.tier.hot ul .tick{background:rgba(255,255,255,.12)}
.tier.hot ul .tick svg{stroke:var(--lilac)}
.hot-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:var(--grad);padding:9px 20px;border-radius:100px;box-shadow:0 10px 26px -8px rgba(124,58,237,.6);white-space:nowrap}

/* syllabus weeks */
.wk-num{flex:0 0 auto;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--violet);background:rgba(124,58,237,.08);border:1px solid rgba(124,58,237,.16);padding:8px 15px;border-radius:100px;margin-right:20px}
.faq-item summary .wk-title{flex:1;text-align:left}

/* class detail layout */
.detail-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:start}
.sticky-card{position:sticky;top:120px}
.side-card{
  border-radius:26px;padding:44px 40px;
  background:rgba(255,255,255,.66);backdrop-filter:blur(26px) saturate(1.6);
  border:1px solid var(--glass-brd);box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.95);
}
.side-card .t-price{font-family:var(--serif);font-weight:300;font-size:48px}
.side-card .t-price em{font-style:italic;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.side-card hr{border:none;border-top:1px solid rgba(124,58,237,.14);margin:26px 0}
.side-row{display:flex;justify-content:space-between;font-size:14px;padding:9px 0;color:#42335c}
.side-row b{font-weight:600;color:var(--ink)}
.prose{font-size:16.5px;line-height:1.85;color:#42335c;max-width:70ch}
.prose h3{font-family:var(--serif);font-weight:400;font-size:26px;margin:44px 0 16px;color:var(--ink)}
.prose p{margin-bottom:18px}
.check-list{list-style:none;display:flex;flex-direction:column;gap:14px;margin:10px 0 20px}
.check-list li{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;line-height:1.6;color:#42335c}
.check-list .tick{flex:0 0 23px;height:23px;border-radius:50%;background:rgba(124,58,237,.1);display:flex;align-items:center;justify-content:center;margin-top:2px}
.check-list .tick svg{width:11px;height:11px;stroke:var(--violet);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* contact form */
.cform{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cform input,.cform textarea,.cform select{padding:17px 24px;border-radius:16px;border:1px solid rgba(124,58,237,.2);background:rgba(255,255,255,.85);font-family:var(--sans);font-weight:400;font-size:14.5px;color:var(--ink);outline:none;width:100%;transition:border-color .3s,box-shadow .3s}
.cform input:focus,.cform textarea:focus,.cform select:focus{border-color:var(--orchid);box-shadow:0 0 0 4px rgba(168,85,247,.13)}
.cform textarea{min-height:160px;resize:vertical}
.cform .full{grid-column:1/-1}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:18px}
.info-card{display:flex;gap:18px;align-items:flex-start;border-radius:20px;padding:26px 28px;background:rgba(255,255,255,.7);backdrop-filter:blur(14px);border:1px solid rgba(124,58,237,.12);box-shadow:0 6px 26px -14px rgba(60,20,120,.14)}
.info-card .mini-icon{flex:0 0 46px}
.info-card b{font-size:15px;font-weight:600;display:block;margin-bottom:4px}
.info-card span,.info-card a{font-size:14px;color:#6b5c80}
.info-card a:hover{color:var(--violet)}

@media(max-width:1100px){.tier-grid{grid-template-columns:1fr}.tier.hot{transform:none}.detail-grid,.contact-grid{grid-template-columns:1fr}.sticky-card{position:static}}
@media(max-width:640px){.cform{grid-template-columns:1fr}.page-hero{padding:170px 0 80px}}

/* ============ COLOR LAYERS v2 ============ */
.tint-lav{background:linear-gradient(180deg,#f7f2ff 0%,#efe6fe 100%)}
.section-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none}
.section-bg-overlay{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(170deg,rgba(22,10,38,.88),rgba(46,16,101,.85) 75%,rgba(76,29,149,.88))}
.aura{position:relative;overflow:hidden}
.aura::before{content:"";position:absolute;width:1200px;height:1200px;border-radius:50%;filter:blur(140px);opacity:.48;background:radial-gradient(circle,#c084fc,transparent 65%);top:-180px;right:-300px;pointer-events:none;z-index:0}
.aura::after{content:"";position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(100px);opacity:.38;background:radial-gradient(circle,#7c3aed,transparent 65%);bottom:-220px;left:-140px;pointer-events:none;z-index:0}
.aura>.wrap,.aura>.marquee{position:relative;z-index:2}

/* colorful class icons */
.grid-classes .class-card:nth-child(4n+1) .class-icon{background:linear-gradient(135deg,#7c3aed,#a855f7);border-color:transparent}
.grid-classes .class-card:nth-child(4n+2) .class-icon{background:linear-gradient(135deg,#d946ef,#a855f7);border-color:transparent}
.grid-classes .class-card:nth-child(4n+3) .class-icon{background:linear-gradient(135deg,#4c1d95,#7c3aed);border-color:transparent}
.grid-classes .class-card:nth-child(4n) .class-icon{background:linear-gradient(135deg,#a855f7,#7c3aed);border-color:transparent}
.grid-classes .class-icon svg{stroke:#fff}
.grid-classes .class-card::after{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);opacity:0;transition:opacity .4s}
.grid-classes .class-card:hover::after{opacity:1}
.grid-classes .class-card:nth-child(4n+2) .class-meta span:first-child{color:#9333ea}
.grid-classes .class-card:nth-child(4n) .class-meta span:first-child{color:#7c3aed}

/* alumni photo cards */
.learner-card img{width:100%;height:132px;object-fit:cover;display:block}
.learner-card{background:rgba(255,255,255,.9)}

/* dark band (frameworks) */
.dark-band{background:radial-gradient(90% 90% at 90% -10%,#4c1d95 0%,transparent 55%),linear-gradient(170deg,#160a26,#2e1065 75%,#4c1d95);color:#fff}
.dark-band h2{color:#fff}
.dark-band .sec-sub{color:#bda9dd}
.dark-band .eyebrow{color:var(--lilac)}
.dark-band .eyebrow::before{background:var(--lilac)}
.dark-band .mini-card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14);backdrop-filter:blur(16px);box-shadow:0 10px 34px -16px rgba(0,0,0,.5)}
.dark-band .mini-card:hover{border-color:rgba(196,181,253,.45);background:rgba(255,255,255,.11)}
.dark-band .mini-card b{color:#fff}
.dark-band .mini-card span{color:#a794c9}
.dark-band .mini-icon{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18)}
.dark-band .mini-icon svg{stroke:#c4b5fd}

/* tool logo carousel */
.logo-band{padding:70px 0 90px}
.logo-band .marquee-track{animation-duration:32s}
.logo-chip{display:flex;align-items:center;gap:13px;padding:17px 30px;border-radius:100px;flex:0 0 auto;
  background:rgba(255,255,255,.85);backdrop-filter:blur(12px);
  border:1px solid rgba(124,58,237,.15);box-shadow:0 8px 26px -12px rgba(60,20,120,.18);
  font-weight:700;font-size:15px;letter-spacing:.01em;color:#2c1b45;transition:transform .35s,border-color .35s}
.logo-chip:hover{transform:translateY(-4px);border-color:rgba(168,85,247,.45)}
.logo-chip img{width:26px;height:26px;object-fit:contain;display:block}
.logo-chip i{width:10px;height:10px;border-radius:50%;background:var(--grad-soft);font-style:normal}

/* ============ v3 tweaks ============ */
.learner-card img{filter:grayscale(1);transition:filter .5s}
.learner-card:hover img{filter:grayscale(0)}
.logo-band .marquee-track{animation-duration:90s}

/* ============ v4: glass 3D icons ============ */
.class-icon,.mini-icon,.slide-icon{
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,.6);
  box-shadow:
    0 16px 32px -12px rgba(124,58,237,.5),
    0 4px 10px -4px rgba(46,16,101,.35),
    inset 0 -10px 16px rgba(46,16,101,.38),
    inset 0 2px 6px rgba(255,255,255,.75);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;
}
.class-icon::before,.mini-icon::before,.slide-icon::before{
  content:"";position:absolute;left:7%;right:7%;top:5%;height:48%;
  border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.65),rgba(255,255,255,.05));
}
.class-icon svg,.mini-icon svg,.slide-icon svg{
  position:relative;z-index:1;stroke:#fff !important;
  filter:drop-shadow(0 2px 3px rgba(46,16,101,.5));
}
.mini-icon{background:linear-gradient(145deg,#a855f7,#6d28d9)}
.slide-icon{background:linear-gradient(145deg,#c084fc,#7c3aed);backdrop-filter:blur(10px)}
.grid-classes .class-card:nth-child(4n+1) .class-icon{background:linear-gradient(145deg,#9f6bfb,#6d28d9)}
.grid-classes .class-card:nth-child(4n+2) .class-icon{background:linear-gradient(145deg,#c084fc,#7e22ce)}
.grid-classes .class-card:nth-child(4n+3) .class-icon{background:linear-gradient(145deg,#8b5cf6,#4c1d95)}
.grid-classes .class-card:nth-child(4n) .class-icon{background:linear-gradient(145deg,#c084fc,#7c3aed)}
.class-card:hover .class-icon{transform:scale(1.1) rotate(-4deg);box-shadow:0 22px 40px -12px rgba(124,58,237,.65),0 6px 12px -4px rgba(46,16,101,.4),inset 0 -10px 16px rgba(46,16,101,.38),inset 0 2px 6px rgba(255,255,255,.75)}
.mini-card:hover .mini-icon{transform:scale(1.08) rotate(-3deg)}
.dark-band .mini-icon{background:linear-gradient(145deg,rgba(168,85,247,.7),rgba(76,29,149,.9));border-color:rgba(255,255,255,.35)}
.dark-band .mini-icon svg{stroke:#fff !important}
.info-card .mini-icon svg{stroke:#fff !important}

/* ============ v5: mentor portrait fade ============ */
.mentor-card{min-height:400px;display:flex;flex-direction:column;justify-content:flex-end}
.mentor-portrait{position:absolute;top:0;right:0;bottom:0;width:60%;
  background:url('blake.jpg') center top/cover no-repeat;
  -webkit-mask-image:linear-gradient(to left,rgba(0,0,0,.95) 30%,transparent 96%);
  mask-image:linear-gradient(to left,rgba(0,0,0,.95) 30%,transparent 96%);
  opacity:.92;pointer-events:none;border-radius:0 26px 26px 0}
.mentor-card blockquote{max-width:62%;position:relative;z-index:2}
.mentor-card .mentor-id{position:relative;z-index:2}
.mentor-id .face{background:url('blake.jpg') center 20%/cover no-repeat;font-size:0}
@media(max-width:640px){
  .mentor-portrait{width:88%;opacity:.4}
  .mentor-card blockquote{max-width:100%}
}

/* portrait fallback while blake.jpg is missing: purple glow instead of blank */
.mentor-portrait{background:url('blake.jpg') center top/cover no-repeat,radial-gradient(80% 70% at 70% 40%,rgba(168,85,247,.35),transparent 70%)}
.mentor-id .face{background:url('blake.jpg') center 20%/cover no-repeat,linear-gradient(135deg,#a855f7,#6d28d9)}

/* ============ v6: dual founder portraits ============ */
.mentor-portrait.left{left:0;right:auto;border-radius:26px 0 0 26px;
  background:url('kellie.jpg') center top/cover no-repeat,radial-gradient(80% 70% at 30% 40%,rgba(168,85,247,.3),transparent 70%);
  -webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.95) 25%,transparent 92%);
  mask-image:linear-gradient(to right,rgba(0,0,0,.95) 25%,transparent 92%);
  width:46%}
.mentor-portrait.right{width:46%;
  -webkit-mask-image:linear-gradient(to left,rgba(0,0,0,.95) 25%,transparent 92%);
  mask-image:linear-gradient(to left,rgba(0,0,0,.95) 25%,transparent 92%)}
.mentor-card blockquote{max-width:100%;text-align:center;margin-left:auto;margin-right:auto;padding:0 4%}
.mentor-card{min-height:440px;justify-content:space-between;padding-top:190px}
.mentor-ids{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;position:relative;z-index:2}
.mentor-ids .mentor-id.flip{flex-direction:row-reverse;text-align:right}
.mentor-id .face.face-k{background:url('kellie.jpg') center 20%/cover no-repeat,linear-gradient(135deg,#c084fc,#7c3aed)}
@media(max-width:640px){
  .mentor-portrait.left,.mentor-portrait.right{opacity:.35;width:70%}
  .mentor-ids{flex-direction:column;align-items:flex-start;gap:16px}
  .mentor-ids .mentor-id.flip{flex-direction:row;text-align:left}
  .mentor-card{padding-top:120px}
}

/* ============ v7: mentor quote between smaller portraits ============ */
.mentor-portrait.left,.mentor-portrait.right{width:33%}
.mentor-card blockquote{max-width:50%;font-size:clamp(19px,1.5vw,24px);margin-left:auto;margin-right:auto}
.mentor-card{padding-top:150px;min-height:430px}
@media(max-width:900px){
  .mentor-card blockquote{max-width:70%}
}

/* ============ v8: gentler fade — keep faces fully visible ============ */
.mentor-portrait.left{
  -webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.98) 58%,rgba(0,0,0,.55) 78%,transparent 100%);
  mask-image:linear-gradient(to right,rgba(0,0,0,.98) 58%,rgba(0,0,0,.55) 78%,transparent 100%);
}
.mentor-portrait.right{
  -webkit-mask-image:linear-gradient(to left,rgba(0,0,0,.98) 58%,rgba(0,0,0,.55) 78%,transparent 100%);
  mask-image:linear-gradient(to left,rgba(0,0,0,.98) 58%,rgba(0,0,0,.55) 78%,transparent 100%);
}

/* ============ v9: student outcome photo circles ============ */
.testi-id .face{overflow:hidden;font-size:0}
.testi-id .face img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}

/* ============ v10: mentor glass + adaptive nav ============ */
.mentor-card{
  background:rgba(124,58,237,.13);
  backdrop-filter:blur(30px) saturate(1.5);-webkit-backdrop-filter:blur(30px) saturate(1.5);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 50px 100px -30px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -20px 40px rgba(46,16,101,.25);
}
.m-stat{
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 16px 36px -16px rgba(0,0,0,.5);
}
.mentor-points .tick{background:rgba(255,255,255,.08);backdrop-filter:blur(8px);border-color:rgba(255,255,255,.3)}

/* nav goes purple glass over dark sections */
.nav.dark{
  background:rgba(76,29,149,.44);
  border-color:rgba(196,181,253,.3);
  box-shadow:0 10px 44px -12px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.2);
}
.nav.dark .nav-links>li>a{color:#efe9fb}
.nav.dark .nav-links>li>a:hover{background:rgba(255,255,255,.12);color:#fff}
.nav.dark .logo{color:#fff}
.nav.dark .logo .dot{color:#d8b4fe}
.nav.dark .burger span{background:#fff}
.nav.dark.scrolled{background:rgba(56,18,116,.6)}

/* mega menu goes purple glass when it's over dark sections (isolated from nav styling) */
.mega.mega-dark{
  background:rgba(76,29,149,.42);
  border-color:rgba(196,181,253,.35);
  box-shadow:0 20px 60px -16px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.25),inset 0 0 60px rgba(168,85,247,.12);
  background-image:linear-gradient(135deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.02) 45%,rgba(168,85,247,.1) 100%),
    radial-gradient(120% 60% at 0% 0%,rgba(255,255,255,.12),transparent 60%);
}
.mega.mega-dark .mega-col h5{color:#d8b4fe}
.mega.mega-dark .mega-col a:hover{background:rgba(255,255,255,.1)}
.mega.mega-dark .mega-col a b{color:#fff}
.mega.mega-dark .mega-col a span{color:#d8ccef}
.mega.mega-dark .mega-feature{background:linear-gradient(180deg,rgba(22,10,38,.15) 0%,rgba(22,10,38,.85) 100%),url("mega-feature.png");background-size:cover;background-position:top center;border:1px solid rgba(255,255,255,.18)}

/* ============ v11: seal hero -> alumni seam ============ */
.learners{padding-top:70px}

/* ============ v12: smooth section color transitions ============ */
.learners{background:linear-gradient(180deg,#f7f2ff 0%,#efe6fe 55%,#fdfcff 100%)}
.logo-band{background:linear-gradient(180deg,#fdfcff 0%,#efe6fe 50%,#fdfcff 100%)}

/* ============ v13: even padding + varied row colors ============ */
.class-card{padding:36px}
.grid-classes{gap:24px}
.classes-cta{margin-top:64px}
.grid-classes .class-card:nth-child(5) .class-icon{background:linear-gradient(145deg,#8b5cf6,#4c1d95)}
.grid-classes .class-card:nth-child(6) .class-icon{background:linear-gradient(145deg,#c084fc,#7c3aed)}
.grid-classes .class-card:nth-child(7) .class-icon{background:linear-gradient(145deg,#9f6bfb,#6d28d9)}
.grid-classes .class-card:nth-child(8) .class-icon{background:linear-gradient(145deg,#c084fc,#7e22ce)}

/* ============ v14: class card images + seam hard-fix ============ */
.learners{margin-top:-1px}
.classes{margin-top:-1px}

.class-img{
  position:relative;height:200px;margin:-36px -36px 0;
  background-size:cover;background-position:center;
  filter:grayscale(1);transition:filter .5s;
}
.class-img::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,0) 50%,rgba(255,255,255,.96) 100%)}
.class-img::after{content:"";position:absolute;inset:0;background:rgba(168,85,247,.32);opacity:0;transition:opacity .45s}
.class-card:hover .class-img::after{opacity:1}
.class-img + .class-icon{position:relative;z-index:2;margin-top:-94px;margin-left:2px;margin-bottom:28px}

/* ============ v15: duotone class images, title over fade ============ */
.class-img{height:252px;margin:-36px -36px 0;filter:none;border-radius:20px 20px 0 0}
.class-img::before{background:linear-gradient(180deg,rgba(46,16,101,.45) 0%,rgba(124,58,237,.22) 34%,rgba(255,255,255,.88) 68%,#fff 100%)}
.class-img::after{background:rgba(168,85,247,.35);mix-blend-mode:multiply}
.class-img + .class-icon{margin-top:-150px;margin-bottom:22px}

/* ============ v16: chrome light-purple duotone grade ============ */
.class-img{
  filter:grayscale(1) contrast(1.14) brightness(1.08);
  background-color:#a78bfa;
  background-blend-mode:multiply;
}
.class-img::before{background:linear-gradient(180deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.9) 70%,#fff 100%)}
.class-img::after{background:rgba(196,181,253,.4);mix-blend-mode:screen}

/* ============ v17: card text above all layers ============ */
.class-card h3,.class-card p,.class-card .class-meta{position:relative;z-index:3}

/* ============ v18: real class images — grade off, fade & hover kept ============ */
.class-img{filter:none;background-color:transparent;background-blend-mode:normal}

/* ============ v19: gemini set — no icon tile on class cards ============ */
.class-img + .class-icon{display:none}
.class-img{margin-bottom:26px}

/* ============ v20: hero image in video frame ============ */
.video-frame img{width:100%;height:560px;object-fit:cover;object-position:center top;display:block}

/* ============ v21: coursera-style class cards + editable instructor ============ */
.class-img::before{background:none}
.class-img{height:210px;margin:-36px -36px 24px;filter:none;border-radius:20px 20px 0 0}
.class-instructor{display:flex;align-items:center;gap:11px;margin-bottom:14px;position:relative;z-index:3}
.ci-avatar{width:36px;height:36px;border-radius:50%;flex:0 0 auto;background:var(--grad-soft);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;letter-spacing:.04em;box-shadow:0 4px 12px -4px rgba(124,58,237,.4)}
.ci-name{font-size:14px;font-weight:600;color:#42335c}
.class-card h3{font-size:20px}
.btn-start{display:inline-flex;align-items:center;padding:10px 24px;border-radius:100px;background:var(--grad);color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.05em;box-shadow:0 8px 20px -8px rgba(124,58,237,.5);transition:transform .3s,box-shadow .3s;cursor:pointer}
.class-card:hover .btn-start{transform:translateY(-2px);box-shadow:0 12px 26px -8px rgba(124,58,237,.6)}
[contenteditable="true"]{outline:none;border-radius:6px;padding:1px 5px;margin:-1px -5px;transition:background .25s,box-shadow .25s;cursor:text}
[contenteditable="true"]:hover{background:rgba(124,58,237,.08)}
[contenteditable="true"]:focus{background:rgba(124,58,237,.1);box-shadow:0 0 0 2px rgba(168,85,247,.4)}

/* ============ PHOTO COURSE CARDS (Popular Classes) ============ */
.class-card.cc-photo{padding:0;background:#fff;display:flex;flex-direction:column}
.cc-photo .class-img{position:relative;height:225px;margin:0;border-radius:20px 20px 0 0;background-size:cover;background-position:center right;filter:none}
.cc-photo .class-img::before{background:linear-gradient(90deg,rgba(9,4,18,.62) 0%,rgba(9,4,18,.25) 45%,transparent 70%)}
.cc-photo .class-img::after{background:rgba(124,58,237,.18);mix-blend-mode:multiply}
.ci-overlay{position:absolute;left:20px;bottom:20px;z-index:2;display:flex;flex-direction:column;gap:2px}
.ci-overlay span{font-family:var(--sans,'Manrope',sans-serif);font-weight:800;text-transform:uppercase;letter-spacing:.14em;line-height:1.2;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.ci-overlay .ci-line1{font-size:17px;background:linear-gradient(90deg,#8b5cf6,#d8b4fe);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.ci-overlay .ci-line2{font-size:21px;color:#fff}
.cc-photo .cc-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.cc-photo .class-instructor{margin-bottom:12px}
.cc-photo h3{font-family:'Manrope',sans-serif;font-weight:700;font-size:17px;letter-spacing:-.01em;margin-bottom:8px;color:#1d1430}
.cc-photo p{font-size:13.5px;line-height:1.6;color:#6b5c80;margin-bottom:18px}
.cc-photo .class-meta{margin-top:auto;display:flex;align-items:center;gap:14px;text-transform:none;letter-spacing:0;font-size:12.5px;font-weight:600;color:#6b5c80}
.cc-photo .cm-info{display:inline-flex;align-items:center;gap:5px;color:#6b5c80}
.cc-photo .cm-info svg{width:14px;height:14px;stroke:#6b5c80;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cc-photo .cm-level{color:#6b5c80}
.cc-photo .btn-start{margin-left:auto;background:#fff;color:#2a1d45;border:1px solid rgba(29,20,48,.18);box-shadow:0 2px 8px -4px rgba(60,20,120,.15);padding:8px 22px}
.class-card.cc-photo:hover .btn-start{background:var(--grad);color:#fff;border-color:transparent;transform:translateY(-2px);box-shadow:0 12px 26px -8px rgba(124,58,237,.6)}
@media(max-width:1100px){.cc-photo .class-img{height:200px}}
@media(max-width:640px){.cc-photo .class-img{height:220px;margin:0;border-radius:20px 20px 0 0}}
.grid-classes .class-card.cc-photo .class-meta span:first-child{color:#6b5c80}
