/* MLforSEO course pages — one stylesheet for every /courses/ page. Everything is scoped under .mlc
   so nothing leaks into the theme. Brand v2: aubergine ink, lavender accent, purple actions,
   yellow used sparingly. Flat solid buttons, no gradients on controls. */

.mlc{
	--ink:#1A0B32; --ink-r:#241140; --ink-r2:#2E1650;
	--cream:#F6EAFE; --soft:#DCCFEA; --dim:#A598BA;
	--lav:#C5A4FE; --purple:#8448EF; --purple-d:#6B36C2; --yellow:#FFDE59;
	--line:rgba(197,164,254,.18); --line-s:rgba(197,164,254,.10); --card:rgba(197,164,254,.05);
	--head:'Bricolage Grotesque','Inter',system-ui,sans-serif; --body:'Inter',system-ui,-apple-system,sans-serif;
	display:block; width:100%; background:var(--ink); color:var(--cream);
	font-family:var(--body); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
.mlc *{box-sizing:border-box}
:where(.mlc) :is(h1,h2,h3){font-family:var(--head); color:var(--cream); margin:0; letter-spacing:-.01em; line-height:1.14; text-wrap:balance}
:where(.mlc) p{margin:0}
:where(.mlc) :is(ul,ol){margin:0; padding:0; list-style:none}
:where(.mlc) a{color:inherit}
:where(.mlc) img{max-width:100%; height:auto; display:block}
.mlc .u{color:var(--lav)}
.mlc .mlc-ic{flex:none}
.mlc-wrap{max-width:1140px; margin:0 auto; padding-inline:24px}
.mlc-wrap--narrow{max-width:860px}
.mlc-center{text-align:center; margin-top:36px}

.mlc-eyebrow{display:inline-block; color:var(--lav); font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px}
.mlc-tag{display:inline-block; background:var(--yellow); color:var(--ink); font-size:11px; font-weight:700; letter-spacing:.07em; padding:4px 10px; border-radius:5px}
.mlc-tag--soft{background:rgba(197,164,254,.14); color:var(--lav)}
.mlc-chip{display:inline-block; margin-top:14px; font-size:12.5px; font-weight:600; color:var(--lav); border:1px solid var(--line); border-radius:999px; padding:4px 12px}
.mlc-fine{font-size:12.5px; color:var(--dim); margin-top:10px}
.mlc-note{margin-top:28px; text-align:center; color:var(--soft); font-size:15px}
.mlc-note b{color:var(--cream)}
.mlc-link{display:inline-flex; align-items:center; gap:6px; color:var(--lav); font-weight:600; font-size:15px; text-decoration:none; margin-top:16px}
.mlc-link:hover{text-decoration:underline}

/* buttons: solid, flat */
.mlc .mlc-btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:13px 26px; border-radius:9px; font-family:var(--body); font-size:16px; font-weight:600; line-height:1.2; text-decoration:none; border:1px solid transparent; cursor:pointer; transition:background .18s,border-color .18s}
.mlc .mlc-btn--lg{padding:16px 32px; font-size:17px}
.mlc .mlc-btn--block{display:flex; width:100%; margin-top:22px}
.mlc .mlc-btn--primary{background:var(--purple); color:#fff}
.mlc .mlc-btn--primary:hover{background:var(--purple-d); color:#fff}
.mlc .mlc-btn--yellow{background:var(--yellow); color:var(--ink)}
.mlc .mlc-btn--yellow:hover{background:#ffe985; color:var(--ink)}
.mlc .mlc-btn--ghost{background:transparent; color:var(--cream); border-color:var(--line)}
.mlc .mlc-btn--ghost:hover{border-color:var(--lav); background:var(--card); color:var(--cream)}
.mlc a:focus-visible,.mlc summary:focus-visible{outline:2px solid var(--yellow); outline-offset:3px; border-radius:6px}

/* section heads */
.mlc-sh{max-width:740px; margin:0 0 44px}
.mlc-sh--c{margin-inline:auto; text-align:center}
.mlc-sh h2{font-size:clamp(28px,3.6vw,40px); font-weight:700}
.mlc-sh p{color:var(--soft); font-size:17px; margin-top:14px}
.mlc-sec{padding-block:84px}
.mlc-sec--tight{padding-block:24px 84px}
.mlc-sec--alt{background:linear-gradient(180deg,rgba(46,22,80,.45),rgba(36,17,64,.18)),var(--ink); border-block:1px solid var(--line-s)}

/* breadcrumb */
.mlc-crumbs{display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin-bottom:34px}
.mlc-crumbs a{color:var(--lav); text-decoration:none}
.mlc-crumbs a:hover{text-decoration:underline}

/* hero */
.mlc-hero{position:relative; padding-block:40px 72px; background:radial-gradient(900px 520px at 88% -8%,rgba(132,72,239,.28),transparent 60%),radial-gradient(700px 460px at -6% 120%,rgba(197,164,254,.12),transparent 62%),var(--ink)}
.mlc-hero__in{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:56px; align-items:start}
.mlc-hero h1{font-size:clamp(36px,5vw,58px); font-weight:800; margin-bottom:22px}
.mlc-hero__sub{font-size:18.5px; color:var(--soft); max-width:600px}
.mlc-hero__sub b,.mlc-hero__sub strong{color:var(--cream)}
.mlc-hero__cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:30px}
.mlc-hero__badges{display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:32px}
.mlc-hero__badges li{display:flex; align-items:center; gap:8px; font-size:14px; color:var(--soft)}
.mlc-hero__badges .mlc-ic{color:var(--yellow)}
.mlc-hero--hub{padding-block:40px 48px; background:radial-gradient(700px 320px at 85% 0%,rgba(132,72,239,.22),transparent 70%),var(--ink)}
.mlc-hero--hub h1{max-width:820px}

.mlc-card{background:var(--ink-r); border:1px solid var(--line); border-radius:18px; padding:32px 30px; box-shadow:0 24px 60px -30px rgba(0,0,0,.6)}
.mlc-card__t{font-size:22px; line-height:1.22; margin:20px 0 18px}
.mlc-card__by{display:flex; align-items:center; gap:12px; font-size:13.5px; color:var(--soft); line-height:1.5; margin-bottom:22px; padding-bottom:20px; border-bottom:1px solid var(--line-s)}
.mlc-card__by img{width:36px; height:36px; border-radius:50%; object-fit:cover}
.mlc-card__by b{color:var(--cream)}
.mlc-card__list li{display:flex; gap:11px; padding:10px 0; border-bottom:1px solid var(--line-s); font-size:14.5px; color:var(--soft)}
.mlc-card__list li:last-child{border-bottom:0}
.mlc-card__list .mlc-ic{color:var(--lav); margin-top:3px}
.mlc-card__price{display:flex; align-items:baseline; gap:12px; margin-top:26px}
.mlc-card__price .n{font-family:var(--head); font-size:34px; font-weight:800}
.mlc-card__price s,.mlc-pricebox s,.mlc-c__price s,.mlc-bun s{color:var(--dim); font-weight:500}
.mlc-card__status{display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--soft); margin-top:16px}
.mlc-card__status .dot{width:9px; height:9px; border-radius:50%; background:var(--lav); box-shadow:0 0 0 4px rgba(197,164,254,.16)}
.mlc-card__status .dot--live{background:#7BE0A8; box-shadow:0 0 0 4px rgba(123,224,168,.16)}

/* facts strip */
.mlc-facts{border-block:1px solid var(--line-s); background:var(--ink-r)}
.mlc-facts ul{display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px 28px; padding-block:22px}
.mlc-facts li{display:flex; align-items:center; gap:12px; font-size:15px; font-weight:600}
.mlc-facts .mlc-ic{color:var(--lav)}
.mlc-facts small{display:block; font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--dim)}

/* problem */
.mlc-pain .mlc-sh h2{font-size:clamp(28px,3.4vw,38px)}
.mlc-pain__cols{display:grid; grid-template-columns:1fr 1fr; gap:40px}
.mlc-pain__cols p{color:var(--soft); margin-bottom:16px}
.mlc-pain__cols b,.mlc-pain__cols strong{color:var(--cream)}
.mlc-kicker{margin-top:28px; padding-left:20px; border-left:3px solid var(--yellow); font-family:var(--head); font-size:21px; font-weight:600; line-height:1.4; max-width:820px}

/* takeaways */
.mlc-feats{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px}
.mlc-feat{background:var(--card); border:1px solid var(--line-s); border-radius:14px; padding:24px}
.mlc-feat .mlc-ic{color:var(--lav); margin-bottom:16px}
.mlc-feat h3{font-size:18px; margin-bottom:10px}
.mlc-feat p{font-size:15px; color:var(--soft)}

/* highlights */
.mlc-his{display:grid; gap:18px; counter-reset:none}
.mlc-hi{display:grid; grid-template-columns:96px minmax(0,1fr); gap:20px; padding:28px; border:1px solid var(--line-s); border-radius:16px; background:var(--card)}
.mlc-hi__n{font-family:var(--head); font-size:56px; font-weight:800; line-height:1; color:rgba(197,164,254,.28)}
.mlc-hi h3{font-size:22px; margin-bottom:10px}
.mlc-hi p{color:var(--soft)}

/* curriculum */
.mlc-mods{display:grid; gap:12px}
.mlc-mod{border:1px solid var(--line); border-radius:12px; background:var(--ink-r); overflow:hidden}
.mlc-mod summary{list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 22px; cursor:pointer}
.mlc-mod summary::-webkit-details-marker{display:none}
.mlc-mod__t{font-family:var(--head); font-weight:700; font-size:18px}
.mlc-mod__n{display:flex; align-items:center; gap:10px; flex:none; font-size:13px; color:var(--dim)}
.mlc-mod[open] .mlc-mod__n .mlc-ic,.mlc-q[open] summary .mlc-ic{transform:rotate(180deg)}
.mlc-mod .mlc-ic,.mlc-q .mlc-ic{transition:transform .2s}
.mlc-mod__b{padding:0 22px 18px}
.mlc-mod__s{color:var(--soft); font-size:15px; margin-bottom:10px}
.mlc-les{padding:10px 0; border-top:1px solid var(--line-s)}
.mlc-les__t{display:flex; align-items:baseline; flex-wrap:wrap; gap:10px; font-size:15.5px; font-weight:500}
.mlc-les__t .mlc-ic{color:var(--lav); transform:translateY(3px)}
.mlc-les__t a{color:inherit; text-decoration:underline; text-decoration-color:color-mix(in srgb,var(--lav) 55%,transparent); text-underline-offset:3px}
.mlc-les__t a:hover{color:var(--accent,#8448ef); text-decoration-color:currentColor}
.mlc-les ul{margin:6px 0 0 26px; list-style:disc; color:var(--soft); font-size:14.5px}
.mlc-les ul li{margin:3px 0}
.mlc-free{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); background:var(--lav); border-radius:4px; padding:2px 7px}

/* fit */
.mlc-fit{display:grid; grid-template-columns:1fr 1fr; gap:22px}
.mlc-fit>div{border:1px solid var(--line-s); border-radius:16px; padding:28px; background:var(--card)}
.mlc-fit h3{font-size:20px; margin-bottom:16px}
.mlc-fit li{display:flex; gap:12px; padding:9px 0; color:var(--soft); font-size:15.5px}
.mlc-fit__y .mlc-ic{color:#7BE0A8; margin-top:4px}
.mlc-fit__n .mlc-ic{color:#FF9DB0; margin-top:4px}

/* deliverables */
.mlc-wb{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
.mlc-wb li{display:flex; gap:16px; padding:22px; border:1px solid var(--line-s); border-radius:14px; background:var(--ink-r)}
.mlc-wb .mlc-ic{color:var(--lav); margin-top:3px}
.mlc-wb h3{font-size:17px; margin-bottom:8px}
.mlc-wb p{font-size:14.5px; color:var(--soft)}
.mlc-fmt{display:inline-block; vertical-align:middle; margin-left:6px; font-family:var(--body); font-size:10.5px; font-weight:700; letter-spacing:.08em; color:var(--yellow); border:1px solid rgba(255,222,89,.35); border-radius:4px; padding:1px 6px}

/* instructors */
.mlc-inst{display:grid; grid-template-columns:300px minmax(0,1fr); gap:40px; align-items:start}
.mlc-inst+.mlc-inst{margin-top:40px; padding-top:40px; border-top:1px solid var(--line-s)}
.mlc-inst--guest{grid-template-columns:140px minmax(0,1fr)}
.mlc-inst__ph{aspect-ratio:1; max-width:100%; border-radius:16px; overflow:hidden; border:1px solid var(--line)}
.mlc-inst__ph img{width:100%; height:100%; object-fit:cover; object-position:center 22%}
.mlc-inst h3{font-size:28px; margin:12px 0 4px}
.mlc-inst h3 a{text-decoration:none}
.mlc-inst h3 a:hover{color:var(--lav)}
.mlc-inst__r{color:var(--lav); font-weight:600; font-size:15px; margin-bottom:14px}
.mlc-inst__b>p{color:var(--soft); margin-bottom:12px}
.mlc-chips{margin-top:16px}
.mlc-chips small{display:block; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin-bottom:8px}
.mlc-chips ul{display:flex; flex-wrap:wrap; gap:8px}
.mlc-chips li{font-size:13px; border:1px solid var(--line); border-radius:999px; padding:4px 12px; color:var(--soft)}

/* reviews */
.mlc-revs{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px}
.mlc-revs li{border:1px solid var(--line-s); border-radius:14px; padding:24px; background:var(--card)}
.mlc-revs blockquote{margin:0 0 14px; padding:0; border:0; font-family:var(--head); font-size:19px; font-weight:600; line-height:1.4}
.mlc-rev__who{font-size:14px; color:var(--soft)}
.mlc-rev__who b{color:var(--cream)}

/* pricing */
.mlc-pricebox{display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; border:1px solid var(--line); border-radius:18px; padding:44px 32px 40px; background:var(--ink-r)}
.mlc-pricebox__p{display:flex; justify-content:center; align-items:baseline; gap:12px; color:var(--soft)}
.mlc-pricebox__p .n{font-family:var(--head); font-size:52px; font-weight:800; color:var(--cream); line-height:1}
.mlc-pricebox__s{color:var(--soft); margin-bottom:14px}
.mlc-pricebox .mlc-fine{margin-top:10px; max-width:520px; line-height:1.55}
.mlc-kit{margin-top:18px; min-height:60px; text-align:left}
.mlc-bun{margin-top:40px}
.mlc-bun h3{font-size:18px; margin-bottom:16px; text-align:center}
.mlc-bun ul{display:grid; gap:10px}
.mlc-bun a{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 20px; border:1px solid var(--line-s); border-radius:12px; background:var(--card); text-decoration:none; transition:border-color .18s}
.mlc-bun a:hover{border-color:var(--lav)}
.mlc-bun__t{font-weight:500; font-size:15px}
.mlc-bun__p{flex:none; font-family:var(--head); font-weight:700; font-size:18px}

/* faq */
.mlc-faq{display:grid; gap:10px}
.mlc-q{border:1px solid var(--line-s); border-radius:12px; background:var(--ink-r)}
.mlc-q summary{list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 22px; cursor:pointer; font-weight:600; font-size:16.5px}
.mlc-q summary::-webkit-details-marker{display:none}
.mlc-q summary .mlc-ic{color:var(--lav)}
.mlc-q__a{padding:0 22px 20px; color:var(--soft); font-size:15.5px}
.mlc-q__a p{margin-bottom:10px}
.mlc-q__a a{color:var(--lav)}

/* course cards (hub + "more courses") */
.mlc-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px}
.mlc-c{position:relative; display:flex; flex-direction:column; gap:12px; padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--ink-r); transition:border-color .18s,transform .18s}
.mlc-c:hover{border-color:var(--lav); transform:translateY(-2px)}
.mlc-c__top{display:flex; justify-content:space-between; align-items:center; gap:10px; min-height:30px}
.mlc-c__who{display:flex; align-items:center; gap:9px; font-size:13px; font-weight:600; color:var(--soft)}
.mlc-c__who img{width:28px; height:28px; border-radius:50%; object-fit:cover}
.mlc-c__tags{display:flex; flex-wrap:wrap; gap:6px 12px}
.mlc-c__tags span{font-size:11px; font-weight:700; letter-spacing:.1em; color:var(--lav)}
.mlc-c h3{font-size:21px}
.mlc-c h3 a{text-decoration:none}
.mlc-c h3 a::after{content:""; position:absolute; inset:0; border-radius:16px}
.mlc-c__s{color:var(--soft); font-size:15px; flex:1}
.mlc-c__foot{display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding-top:12px; border-top:1px solid var(--line-s)}
.mlc-c__meta{font-size:13px; color:var(--dim)}
.mlc-c__price{font-family:var(--head); font-weight:800; font-size:20px}
.mlc-c__go{display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600; color:var(--lav)}

/* hub: how it works */
.mlc-steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; counter-reset:s}
.mlc-steps li{counter-increment:s; padding:26px; border:1px solid var(--line-s); border-radius:14px; background:var(--card)}
.mlc-steps li::before{content:counter(s); display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--purple); color:#fff; font-family:var(--head); font-weight:800; margin-bottom:14px}
.mlc-steps b{display:block; font-family:var(--head); font-size:19px; margin-bottom:8px}
.mlc-steps span{color:var(--soft); font-size:15px}

@media (max-width:960px){
	.mlc-hero__in{grid-template-columns:minmax(0,1fr); gap:36px}
	.mlc-feats{grid-template-columns:repeat(2,minmax(0,1fr))}
	.mlc-inst,.mlc-inst--guest{grid-template-columns:minmax(0,1fr)}
	.mlc-inst__ph{max-width:260px}
	.mlc-steps{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:680px){
	.mlc{font-size:16px}
	.mlc-wrap{padding-inline:18px}
	.mlc-sec{padding-block:60px}
	.mlc-feats,.mlc-pain__cols,.mlc-fit,.mlc-wb{grid-template-columns:minmax(0,1fr)}
	.mlc-hi{grid-template-columns:minmax(0,1fr); gap:6px; padding:22px}
	.mlc-hi__n{font-size:40px}
	.mlc-facts ul{justify-content:flex-start}
	.mlc-hero__cta .mlc-btn{width:100%}
	.mlc-mod summary,.mlc-q summary{padding:16px 18px}
	.mlc-mod__b,.mlc-q__a{padding-inline:18px}
	.mlc-grid{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){.mlc *{transition:none!important}}