/* AI Video Masterclass (/masterclass, PR-820). The standalone page's design, scoped to main.mc so the
   shared nav and footer keep their own look. Apple whites, greys, silver; blue only for the primary action. */
.mc,.mc-bar,.mc-top,.mc-foot{
  --bg:#ffffff; --band:#f5f5f7; --card:#ffffff; --fg:#1d1d1f; --muted:#6e6e73; --line:#d2d2d7;
  --accent:#0071e3; --accent-ink:#ffffff; --accent-soft:#e8f1fc; --good:#1f8a4c; --bad:#c9302c; --phone:#1d1d1f;
  --display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Helvetica,Arial,sans-serif;
  --text:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r:18px;
}
body{margin:0;background:#fff}
html{scroll-behavior:smooth;scroll-padding-top:90px}
.mc{display:block;background:var(--bg);color:var(--fg);font-family:var(--text);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
.mc *{box-sizing:border-box}
.mc [hidden]{display:none!important}
.mc a{color:var(--accent);text-decoration:none}
.mc a:hover{text-decoration:underline}
.mc :focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:8px}
.mc h1,.mc h2,.mc h3{font-family:var(--display);text-wrap:balance;margin:0;letter-spacing:-.022em}
.mc h1{font-size:clamp(2.4rem,6vw,4.1rem);line-height:1.04;font-weight:700}
.mc h2{font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.08;font-weight:700}
.mc h3{font-size:1.2rem;line-height:1.25;font-weight:600;letter-spacing:-.01em}
.mc p{margin:0}
.mc figure{margin:0}
.mc .wrap{max-width:1080px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.mc .band{background:var(--band)}
.mc section{padding-block:clamp(56px,9vw,104px)}
.mc .eyebrow{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mc .lead{font-size:clamp(1.1rem,2vw,1.3rem);color:var(--muted);max-width:40ch}
.mc .head{display:grid;gap:14px;margin-bottom:40px;max-width:720px}
.mc .head.flush{margin:0}
.mc .center{text-align:center;margin-inline:auto;justify-items:center}

/* buttons */
.mc .btn,.mc-bar .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border-radius:999px;border:0;background:var(--accent);color:var(--accent-ink);font:600 1.02rem var(--text);cursor:pointer;text-decoration:none;transition:transform .15s,filter .15s}
.mc .btn:hover,.mc-bar .btn:hover{filter:brightness(1.08);text-decoration:none}
.mc .btn:active{transform:scale(.98)}
.mc .btn:disabled{background:var(--line);color:var(--muted);cursor:not-allowed;filter:none;transform:none}
.mc .btn s{opacity:.7;font-weight:400}
.mc .btn.ghost{background:transparent;color:var(--accent);padding:0 4px}

/* hero */
.mc .hero{padding-block:clamp(40px,7vw,88px) clamp(48px,8vw,96px)}
.mc .hero .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,6vw,72px);align-items:center}
.mc .hero-copy{display:grid;gap:22px;min-width:0}
.mc .live{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;font-weight:600;color:var(--fg);background:var(--band);border:1px solid var(--line);border-radius:999px;padding:6px 14px;width:max-content;max-width:100%}
.mc .live i{width:8px;height:8px;border-radius:50%;background:#ff3b30;box-shadow:0 0 0 0 rgba(255,59,48,.5);animation:mc-pulse 2s infinite}
@keyframes mc-pulse{70%{box-shadow:0 0 0 8px rgba(255,59,48,0)}100%{box-shadow:0 0 0 0 rgba(255,59,48,0)}}
.mc .hero h1 em{font-style:normal;color:var(--muted)}
.mc .cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.mc .facts{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.92rem;color:var(--muted)}
.mc .facts span::before{content:"✓ ";color:var(--good);font-weight:700}
.mc .phone{position:relative;justify-self:center;width:min(100%,320px);aspect-ratio:9/16;max-width:100%;border-radius:44px;background:var(--phone);padding:10px;box-shadow:0 30px 60px -20px rgba(0,0,0,.35)}
.mc .phone video{width:100%;height:100%;object-fit:cover;border-radius:34px;background:#000;display:block}
.mc .tag{position:absolute;left:24px;right:24px;bottom:24px;background:rgba(0,0,0,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;border-radius:14px;padding:10px 14px;font-size:.85rem;line-height:1.35}
.mc .tag b{display:block;font-size:.95rem}
.mc .sound{position:absolute;top:24px;right:24px;border:0;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font:600 .8rem var(--text);padding:8px 12px;cursor:pointer}

/* wall */
.mc .wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.mc .clip{display:grid;gap:10px;min-width:0}
.mc .why{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px);gap:clamp(28px,6vw,64px);align-items:center;margin-bottom:40px}
.mc .why .head{margin:0}
@media (max-width:760px){.mc .why{grid-template-columns:1fr}.mc .why .clip{max-width:280px;width:100%;justify-self:center}}
.mc .clip .media{position:relative;aspect-ratio:9/16;max-width:100%;border-radius:var(--r);overflow:hidden;background:#000}
.mc .clip video{width:100%;height:100%;object-fit:cover;display:block}
.mc .clip .ai{position:absolute;top:10px;left:10px;font:600 .7rem var(--text);letter-spacing:.04em;color:#fff;background:rgba(0,0,0,.55);padding:4px 8px;border-radius:999px}
.mc .clip p{font-size:.88rem;color:var(--muted)}
.mc .clip p b{display:block;color:var(--fg);font-weight:600}
.mc .note{margin-top:24px;font-size:.85rem;color:var(--muted);text-align:center}

/* instructor */
.mc .who{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,6vw,64px);align-items:center}
.mc .who>img{width:100%;height:auto;max-width:380px;aspect-ratio:298/390;object-fit:cover;object-position:top;border-radius:var(--r);justify-self:center}
.mc .who-copy{display:grid;gap:18px;min-width:0}
.mc .stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:8px}
.mc .stats div{background:var(--band);padding:18px 20px}
.mc .stats b{display:block;font:700 1.6rem/1.1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.mc .stats span{font-size:.88rem;color:var(--muted)}
.mc .creds{font-size:.92rem;color:var(--muted)}
.mc .edu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mc .edu div{display:grid;justify-items:center;align-content:center;gap:8px;text-align:center;padding:18px 12px;border:1px solid var(--line);border-radius:14px;background:var(--bg);min-height:120px}
.mc .edu img{display:block;width:100%;max-width:220px;height:96px;object-fit:contain;background:#fff;border-radius:10px;padding:6px}
.mc .edu div:first-child img{padding:0;background:transparent}
.mc .edu b{font:600 .95rem/1.2 var(--display)}
.mc .edu span{font-size:.78rem;color:var(--muted)}
@media (max-width:480px){.mc .edu{grid-template-columns:1fr}}

/* three ideas */
.mc .trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mc .trio article{background:var(--band);border-radius:var(--r);padding:28px;display:grid;gap:10px;align-content:start}
.mc .trio article p{color:var(--muted);font-size:.98rem}
.mc .trio .k{font:600 .78rem var(--mono);color:var(--accent);letter-spacing:.02em}

/* agenda */
.mc .agenda{border-top:1px solid var(--line)}
.mc .agenda ol{margin:0;padding:0}
.mc .agenda li{display:grid;grid-template-columns:84px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--line);list-style:none}
.mc .agenda time{font:600 .95rem var(--mono);color:var(--muted);font-variant-numeric:tabular-nums;padding-top:2px}
.mc .agenda p{color:var(--muted);font-size:.98rem;margin-top:4px}

/* tools */
.mc .tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.mc .tools div{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:grid;gap:6px;align-content:start}
.mc .tools div.main{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.mc .tools small{font:600 .72rem var(--text);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mc .tools p{font-size:.92rem;color:var(--muted)}

/* audience */
.mc .aud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 32px}
.mc .aud div{display:grid;gap:6px;min-width:0}
.mc .aud p{color:var(--muted);font-size:.96rem}
.mc .notfor{margin-top:40px;padding:22px 24px;border-radius:var(--r);background:var(--band);font-size:.95rem;color:var(--muted)}
.mc .notfor b{color:var(--fg)}

/* offer */
.mc .offer{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,56px);align-items:start}
.mc .list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:14px}
.mc .list li{display:grid;grid-template-columns:22px 1fr;gap:10px}
.mc .list li::before{content:"✓";color:var(--good);font-weight:700}
.mc .list span{color:var(--muted);display:block;font-size:.92rem}
.mc .buy{background:var(--card);border-radius:24px;padding:clamp(22px,4vw,34px);display:grid;gap:18px;box-shadow:0 20px 50px -24px rgba(0,0,0,.25);border:1px solid var(--line);min-width:0}
.mc .price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.mc .price b{font:700 3rem/1 var(--display);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.mc .price s{color:var(--muted);font-size:1.2rem}
.mc .price em{font-style:normal;font-size:.8rem;font-weight:600;color:var(--good);background:color-mix(in srgb,var(--good) 14%,transparent);padding:4px 10px;border-radius:999px}
.mc .when{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:.92rem;margin:0}
.mc .when dt{color:var(--muted)}
.mc .when dd{margin:0;font-weight:500}
.mc .count{display:flex;gap:8px;font-variant-numeric:tabular-nums}
.mc .count div{flex:1;background:var(--band);border-radius:12px;padding:10px 0;text-align:center}
.mc .count b{display:block;font:700 1.35rem/1 var(--display)}
.mc .count span{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.mc form{display:grid;gap:12px}
.mc label{display:grid;gap:6px;font-size:.85rem;font-weight:500}
.mc input,.mc select{font:inherit;font-size:1rem;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);width:100%;min-width:0}
.mc select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.mc input:focus,.mc select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.mc input[aria-invalid="true"]{border-color:var(--bad)}
.mc .hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.mc .notice{font-size:.8rem;line-height:1.45;color:var(--muted);background:var(--band);border-radius:12px;padding:12px 14px}
.mc .notice b{color:var(--fg)}
.mc label.tick{display:grid;grid-template-columns:20px 1fr;align-items:start;gap:10px;font-weight:400;font-size:.88rem;line-height:1.4}
.mc label.tick input{width:18px;height:18px;margin:1px 0 0;padding:0;accent-color:var(--accent)}
.mc label.tick small{color:var(--muted)}
.mc .status{font-size:.88rem;min-height:1.2em}
.mc .status[data-state="error"]{color:var(--bad)}
.mc .fine{font-size:.8rem;color:var(--muted);text-align:center}
.mc .withdraw{font-size:.8rem;text-align:center}
.mc .done{display:grid;gap:12px;text-align:center;padding:8px 0}
.mc .done b{font:700 1.4rem var(--display)}

/* faq */
.mc .faq{max-width:760px;margin:0 auto;border-top:1px solid var(--line)}
.mc .faq details{border-bottom:1px solid var(--line);padding:18px 0}
.mc .faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
.mc .faq summary::-webkit-details-marker{display:none}
.mc .faq summary::after{content:"+";color:var(--muted);font-weight:400;font-size:1.3rem;line-height:1}
.mc .faq details[open] summary::after{content:"–"}
.mc .faq p{color:var(--muted);margin-top:10px;max-width:65ch}
.mc form.inline{margin-top:14px;max-width:420px}

/* close */
.mc .close{text-align:center;display:grid;gap:22px;justify-items:center}
.mc .small{font-size:.8rem;color:var(--muted);max-width:80ch}

/* mobile bar */
.mc-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:none;align-items:center;justify-content:space-between;gap:12px;padding:12px max(16px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:color-mix(in srgb,#fff 88%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--line);font-family:var(--text);color:var(--fg)}
.mc-bar div{font-size:.85rem;line-height:1.3}
.mc-bar b{font-size:1.05rem}
.mc-bar s,.mc-bar span{color:var(--muted)}
.mc-bar .btn{min-height:44px}

@media (max-width:900px){
  .mc .hero .wrap,.mc .who,.mc .offer{grid-template-columns:1fr}
  .mc .wall,.mc .tools{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mc .trio,.mc .aud{grid-template-columns:1fr}
  .mc .phone{width:min(100%,280px)}
  .mc-bar{display:flex}
  .cwi-footer{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
}
@media (prefers-reduced-motion:reduce){.mc *{animation:none!important;transition:none!important}}

/* D2111: the page's own header and footer — no way off the page but the Explore button. */
.mc-top{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);font-family:var(--text)}
.mc-top-in{max-width:1200px;margin:0 auto;padding:12px max(20px,env(safe-area-inset-left,0px));display:flex;align-items:center;justify-content:space-between;gap:16px}
.mc-mark{display:inline-flex;align-items:center;gap:9px;font:700 1.15rem var(--display);letter-spacing:-.03em;color:var(--fg)}
.mc-explore{display:inline-flex;align-items:center;min-height:42px;padding:0 18px;border-radius:999px;border:0;background:var(--fg);color:#fff;font:600 .95rem var(--text);cursor:pointer;white-space:nowrap;text-decoration:none}
.mc-explore:hover{filter:brightness(1.2)}
.mc-explore:focus-visible,.mc-foot a:focus-visible,.mc-foot button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.mc-foot{background:var(--band);border-top:1px solid var(--line);font:400 .85rem/1.5 var(--text);color:var(--muted);padding-bottom:84px}
.mc-foot-in{max-width:1200px;margin:0 auto;padding:22px max(20px,env(safe-area-inset-left,0px));display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px}
.mc-foot p{margin:0}
.mc-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px}
.mc-foot a,.mc-foot button{color:var(--muted);font:inherit;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
@media (min-width:901px){.mc-foot{padding-bottom:0}}
@media (max-width:420px){.mc-mark{font-size:1rem}.mc-mark img{width:24px;height:24px}.mc-explore{padding:0 14px;font-size:.88rem}}

/* After class: five ways to earn (D2112). */
.mc .earn{background:#0b0b0d;color:#f5f5f7}
.mc .earn .eyebrow,.mc .earn .lead,.mc .earn .fine{color:#a1a1a6}
.mc .ways{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;counter-reset:way}
.mc .ways li{counter-increment:way;display:grid;align-content:start;gap:8px;padding:20px 18px;border-radius:var(--r);background:#1c1c1f;border:1px solid #2c2c30}
.mc .ways li::before{content:counter(way);font:700 2rem/1 var(--display);color:#4da3ff;letter-spacing:-.03em}
.mc .ways h3{margin:0;font:600 1.02rem/1.25 var(--display)}
.mc .ways p{margin:0;font-size:.88rem;color:#a1a1a6}
.mc .portfolio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,56px);align-items:center;margin-top:40px;padding-top:36px;border-top:1px solid #2c2c30}
.mc .portfolio h3{margin:6px 0 10px;font:700 clamp(1.4rem,3vw,1.9rem)/1.1 var(--display);letter-spacing:-.025em}
.mc .portfolio p{margin:0;color:#a1a1a6}
.mc .plan{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mc .plan li{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;align-items:center;padding:14px 16px;border-radius:14px;background:#1c1c1f;border:1px solid #2c2c30}
.mc .plan b{font-weight:600}
.mc .plan span{font-size:.9rem;color:#c7c7cc}
.mc .earn .fine{margin-top:24px;font-size:.82rem}
@media (max-width:1000px){.mc .ways{grid-template-columns:repeat(2,minmax(0,1fr))}.mc .ways li:last-child{grid-column:1/-1}}
@media (max-width:760px){.mc .portfolio{grid-template-columns:1fr}}
@media (max-width:480px){.mc .ways{grid-template-columns:1fr}.mc .plan li{grid-template-columns:1fr;gap:2px}}

/* The Explore form (D2110). */
.mc .explore{width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:0;border-radius:22px;padding:0;background:var(--bg);color:var(--fg);box-shadow:0 24px 80px rgba(0,0,0,.3)}
.mc .explore::backdrop{background:rgba(10,10,12,.55);backdrop-filter:blur(4px)}
.mc .explore form{position:relative;padding:28px 24px 22px}
.mc .explore h2{margin:0;font:700 1.5rem var(--display);letter-spacing:-.03em}
.mc .explore .sub{margin:-4px 0 4px;color:var(--muted);font-size:.95rem}
.mc .explore .x{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;border:0;background:var(--band);color:var(--fg);font-size:1.3rem;line-height:1;cursor:pointer}
.mc .explore .btn{width:100%}

/* Why this class, not another (D2115). */
.mc .reasons{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;counter-reset:reason}
.mc .reasons li{counter-increment:reason;display:grid;align-content:start;gap:6px;padding:20px;border-radius:var(--r);background:var(--band);border:1px solid var(--line)}
.mc .reasons li::before{content:counter(reason);font:700 1.1rem/1 var(--display);color:var(--accent)}
.mc .reasons h3{margin:0;font:600 1.05rem/1.25 var(--display)}
.mc .reasons p{margin:0;font-size:.92rem;color:var(--muted)}

/* Free with your seat (D2114–D2117). */
.mc .bonus{background:var(--band)}
.mc .extras{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.mc .extras li{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr) auto;gap:6px 18px;align-items:center;padding:16px 20px;border-radius:14px;background:var(--bg);border:1px solid var(--line)}
.mc .extras b{font-weight:600}
.mc .extras span{color:var(--muted);font-size:.92rem}
.mc .extras em{font-style:normal;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.mc .bonus .plans-h{margin:28px 0 10px;font-size:1.05rem;font-weight:600}
.mc .bonus .fine{margin-top:18px;font-size:.82rem;color:var(--muted)}
@media (max-width:760px){.mc .extras li{grid-template-columns:minmax(0,1fr) auto}.mc .extras span{grid-column:1/-1;grid-row:2}}

/* Age choice and the guardian's fields (PR-827, D2121). */
.mc .age{border:0;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mc .age legend{font-size:.85rem;font-weight:500;margin-bottom:6px;padding:0}
.mc .age .opt{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font-size:.95rem;font-weight:500;cursor:pointer}
.mc .age .opt:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.mc .age .opt input{width:18px;height:18px;margin:0;padding:0;accent-color:var(--accent)}
.mc .fields{display:grid;gap:12px}
.mc .minor-lead{font-size:.9rem;color:var(--fg);background:var(--accent-soft);border-radius:12px;padding:12px 14px}

/* "Everything here is AI" as a moving wall (PR-828, D2127). */
.mc .vwall{position:relative;margin-top:8px}
.mc .vwall.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;height:clamp(520px,70vh,720px);overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent)}
.mc .vwall.rows{display:grid;gap:10px;margin-inline:-16px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mc .vlane{overflow:hidden;min-width:0}
.mc .vtrack{display:flex;animation:mc-up linear infinite}
.mc .vwall.cols .vtrack{flex-direction:column}
.mc .vwall.cols .vlane:nth-child(even) .vtrack{animation-name:mc-down}
.mc .vwall.rows .vtrack{width:max-content;animation-name:mc-left}
.mc .vwall.rows .vlane:nth-child(2) .vtrack{animation-name:mc-right}
.mc .vwall.still .vtrack,.mc .vwall:hover .vtrack{animation-play-state:paused}
.mc .vwall.still .vtrack{animation:none}
@keyframes mc-up{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes mc-down{from{transform:translateY(-50%)}to{transform:translateY(0)}}
@keyframes mc-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mc-right{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.mc .wtile{position:relative;flex:none;display:block;width:100%;margin:0 0 12px;padding:0;border:0;border-radius:14px;overflow:hidden;background:#111;cursor:pointer;font:inherit;color:#fff;text-align:left}
.mc .vwall.rows .wtile{margin:0 10px 0 0}
.mc .wtile video{display:block;width:100%;height:100%;object-fit:cover}
.mc .wtile::after{content:"";position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(transparent,rgba(0,0,0,.72));pointer-events:none}
.mc .wtile .ai{position:absolute;top:8px;left:8px;z-index:1;font:600 .66rem var(--text);background:rgba(0,0,0,.55);border-radius:999px;padding:3px 8px}
.mc .wtile .cap{position:absolute;left:10px;right:10px;bottom:9px;z-index:1;display:grid;gap:3px}
.mc .wtile .cap i{justify-self:start;font:700 .6rem var(--text);font-style:normal;letter-spacing:.06em;text-transform:uppercase;background:rgba(0,0,0,.55);border-radius:5px;padding:2px 6px}
.mc .wtile .cap b{font:600 .8rem var(--text)}
.mc .vwall.rows .wtile .cap b{display:none}
.mc .wtile:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.mc .vtrack{animation:none}}
.vview{border:0;padding:0;border-radius:18px;background:#000;max-width:min(420px,calc(100% - 32px));width:100%}
.vview::backdrop{background:rgba(0,0,0,.75)}
.vview-in{position:relative;display:grid}
.vview video{display:block;width:100%;max-height:78vh;background:#000}
.vview p{margin:0;padding:12px 16px;color:#f5f5f7;font:400 .85rem/1.4 -apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;display:grid;gap:2px}
.vview p span{color:#a1a1a6}
.vview .x{position:absolute;top:10px;right:10px;z-index:2;width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:1.3rem;cursor:pointer}

/* The free lesson (PR-828, D2126). */
.mc .fl{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,56px);align-items:center;padding:clamp(24px,4vw,40px);border-radius:24px;background:#0b0b0d;color:#f5f5f7}
.mc .fl .eyebrow,.mc .fl .lead{color:#a1a1a6}
.mc .fl-copy{display:grid;gap:16px;justify-items:start}
.mc .fl h2{color:#f5f5f7}
.mc .fl-reel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mc .fl-reel img{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:12px;box-shadow:0 0 0 2px #ff453a}
.mc .explore .lesson-in{position:relative;padding:28px 24px 22px;display:grid;gap:12px}
.mc .explore .lesson-in h2{margin:0;font:700 1.5rem var(--display);letter-spacing:-.03em}
.mc .lesson-form .btn{width:100%}
@media (max-width:760px){.mc .fl{grid-template-columns:1fr}}


/* The stack: platforms and models (PR-830, D2129). */
.mc .labs{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px;color:var(--muted);font-size:.9rem;font-weight:500}
.mc .labs li{display:inline-flex;align-items:center;gap:8px}
.mc .lg{display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:8px;background:var(--bg);border:1px solid var(--line);color:var(--fg)}
.mc .lg svg{width:16px;height:16px;fill:currentColor}
.mc .lg .mono{font:700 .7rem var(--text);letter-spacing:-.02em}
.mc .stack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mc .stack .hub{grid-column:1/-1;display:flex;gap:16px;align-items:center;padding:20px 22px;border-radius:var(--r);background:var(--bg);border:2px solid var(--accent)}
.mc .stack .hub .lg{width:44px;height:44px;border:0}
.mc .stack .hub .lg img{width:30px;height:30px}
.mc .stack .hub small{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.mc .stack .hub h3{margin:2px 0}
.mc .stack .hub p{color:var(--muted);font-size:.95rem}
.mc .cat{display:grid;align-content:start;gap:6px;padding:20px;border-radius:var(--r);background:var(--bg);border:1px solid var(--line)}
.mc .cat h3{margin:0;font:600 1.1rem var(--display)}
.mc .cat>p{font-size:.88rem;color:var(--muted);margin-bottom:6px}
.mc .cat ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mc .cat li.m{display:flex;gap:10px;align-items:center}
.mc .cat li.m b{display:block;font-size:.92rem;font-weight:600;line-height:1.25}
.mc .cat li.m small{display:block;font-size:.76rem;color:var(--muted)}
.mc .cat li.inapp small{color:var(--accent)}
.mc .cat li.inapp .lg{border-color:var(--accent)}
@media (max-width:900px){.mc .stack{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.mc .stack{grid-template-columns:1fr}}
.mc .stack + .fine{margin-top:14px;text-align:left}


/* Free downloads: the guidebook and its eight parts (PR-831, D2130). Shared by /masterclass and the lesson. */
.gd{--gd-bg:#fff;--gd-band:#f5f5f7;--gd-fg:#1d1d1f;--gd-muted:#6e6e73;--gd-line:#d2d2d7;--gd-accent:#0071e3;background:var(--gd-band);color:var(--gd-fg);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;padding-block:clamp(48px,8vw,88px)}
.gd-wrap{max-width:1080px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:grid;gap:28px}
.gd-head{display:grid;gap:10px;max-width:720px}
.gd-eyebrow{margin:0;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gd-muted)}
.gd h2{margin:0;font:700 clamp(1.7rem,4vw,2.6rem)/1.1 -apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;letter-spacing:-.022em}
.gd-lead{margin:0;font-size:clamp(1.05rem,2vw,1.2rem);color:var(--gd-muted)}
.gd-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px;align-items:start}
.gd-book{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:20px;padding:22px;border-radius:20px;background:var(--gd-bg);border:1px solid var(--gd-line)}
.gd-book img{width:100%;height:auto;border-radius:10px;box-shadow:0 12px 30px -12px rgba(0,0,0,.35);border:1px solid var(--gd-line)}
.gd-book>div{display:grid;gap:10px;align-content:start}
.gd-book h3{margin:0;font-size:1.25rem;letter-spacing:-.02em}
.gd-book p{margin:0;font-size:.92rem;color:var(--gd-muted)}
.gd-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border-radius:999px;background:var(--gd-accent);color:#fff;font-weight:600;text-decoration:none}
.gd-btn:hover{filter:brightness(1.08)}
.gd-all{color:var(--gd-accent);font-size:.92rem;font-weight:600}
.gd-note{font-size:.8rem !important}
.gd-parts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.gd-part{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--gd-bg);border:1px solid var(--gd-line)}
.gd-part img{width:52px;height:auto;border-radius:6px;border:1px solid var(--gd-line)}
.gd-part div{display:grid;gap:1px;min-width:0}
.gd-part b{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gd-muted)}
.gd-part span{font-size:.92rem;font-weight:600}
.gd-part small{font-size:.75rem;color:var(--gd-muted)}
.gd-dl{font-size:.85rem;font-weight:600;color:var(--gd-accent);white-space:nowrap}
.gd a:focus-visible{outline:3px solid var(--gd-accent);outline-offset:3px;border-radius:8px}
@media (max-width:900px){.gd-grid{grid-template-columns:1fr}}
@media (max-width:520px){.gd-book{grid-template-columns:1fr}.gd-book img{max-width:200px}.gd-parts{grid-template-columns:1fr}}
.gd a.gd-btn,.gd a.gd-btn:hover{color:#fff;text-decoration:none}
.gd a.gd-all,.gd a.gd-dl{color:var(--gd-accent)}

/* PR-833 (D2132): the header's "For you" menu (/masterclass and its persona pages) and the persona pages'
   own sections (tools/masterclass_personas.py). Same tokens; red/green only for the mistake marks. */
.mc-acts{display:flex;align-items:center;gap:14px}
.mc-for{position:relative;font-family:var(--text)}
.mc-for summary{cursor:pointer;list-style:none;font:500 .95rem var(--text);color:var(--fg);padding:8px 4px;border-radius:8px;white-space:nowrap}
.mc-for summary::-webkit-details-marker{display:none}
.mc-for summary::after{content:" ▾";color:var(--muted)}
.mc-for summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.mc-for-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:90;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:8px;display:grid;min-width:240px;box-shadow:0 18px 40px -20px rgba(0,0,0,.35)}
.mc-for-menu a{padding:8px 10px;border-radius:8px;color:var(--fg);font-size:.92rem;text-decoration:none}
.mc-for-menu a:hover,.mc-for-menu a[aria-current="page"]{background:var(--band)}
.mc-for-menu a:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.mc-for-menu small{display:block;color:var(--muted);font-size:.78rem}
@media (max-width:480px){.mc-acts{gap:6px}.mc-top-in:has(.mc-acts){gap:8px;padding-inline:max(16px,env(safe-area-inset-left,0px))}.mc-top-in:has(.mc-acts) .mc-mark{font-size:.95rem;gap:6px}.mc-top-in:has(.mc-acts) .mc-mark img{width:22px;height:22px}.mc-for summary{font-size:.85rem;padding-inline:2px}.mc-acts .mc-explore{padding:0 12px;font-size:.82rem;min-height:38px}.mc-for-menu{position:fixed;left:16px;right:16px;top:64px;min-width:0}}
.mc .pill{display:inline-flex;width:max-content;max-width:100%;align-items:center;background:var(--accent-soft);color:var(--accent);font-weight:600;font-size:.85rem;padding:6px 14px;border-radius:999px}
.mc .stats.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.mc .stats.three b{font-size:2.2rem}
.mc .pains{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.mc .pains article{background:var(--bg);border-radius:var(--r);padding:22px;display:grid;gap:8px;align-content:start}
.mc .pains .lo{font:600 .75rem var(--text);letter-spacing:.06em;text-transform:uppercase;color:var(--bad)}
.mc .pains .hi{font:600 .92rem var(--text);color:var(--good)}
.mc .pains p{color:var(--muted);font-size:.96rem}
.mc .samples{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.mc .clip.more .media{display:grid;place-items:center;text-align:center;padding:20px;background:var(--band);border:1px dashed var(--line)}
.mc .clip.more .media p{color:var(--muted)}
.mc .mk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.mc .mk article{background:var(--band);border-radius:var(--r);padding:20px;display:grid;gap:14px;align-content:start}
.mc .mk .pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mc .mk figure{display:grid;gap:6px}
.mc .mk img{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:12px;display:block}
.mc .mk .x img{outline:3px solid var(--bad);outline-offset:-3px}
.mc .mk .ok img{outline:3px solid var(--good);outline-offset:-3px}
.mc .mk figcaption{font:600 .72rem var(--text);letter-spacing:.06em;text-transform:uppercase}
.mc .mk .x figcaption{color:var(--bad)}
.mc .mk .ok figcaption{color:var(--good)}
.mc .mk p{color:var(--muted);font-size:.95rem}
.mc .after{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;background:var(--band);border-radius:24px;padding:clamp(22px,4vw,36px)}
.mc .after>div:first-child{display:grid;gap:10px}
.mc .after .lead{max-width:none}
@media (max-width:900px){.mc .stats.three,.mc .pains,.mc .mk,.mc .after{grid-template-columns:1fr}.mc .samples{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* PR-835 (D2137): a persona film's build log, the "How I made this film" section and /masterclass/<persona>/build-log
   (content/marketing/masterclass-film/; marks drawn by masterclass-film.js). Red and green carry meaning only. */
.mc .fl-log{display:grid;gap:clamp(44px,7vw,72px)}
.mc .fl-e{display:grid;gap:20px}
.mc .fl-head{display:grid;gap:8px;max-width:760px}
.mc .fl-head>p:not(.fl-num){color:var(--muted)}
.mc .fl-num{font:600 .8rem var(--mono);letter-spacing:.04em;color:var(--bad)}
.mc .fl-num .k{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;background:var(--accent-soft);color:var(--accent)}
.mc .fl-head h3{font-size:clamp(1.35rem,3vw,1.8rem);line-height:1.15;font-weight:700}
.mc .fl-status{display:inline-flex;align-items:center;font:600 .78rem var(--text);padding:4px 10px;border-radius:999px;width:max-content;max-width:100%}
.mc .fl-status.ok{background:color-mix(in srgb,var(--good) 12%,transparent);color:var(--good)}
.mc .fl-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:24px;align-items:start}
.mc .fl-body.wide{grid-template-columns:1fr}
.mc .fl-sides{display:grid;gap:22px;min-width:0}
.mc .fl-shot{display:grid;gap:10px;min-width:0;align-content:start}
.mc .fl-shot.one{max-width:300px}
.mc .fl-tag{font:600 .75rem var(--text);letter-spacing:.06em;text-transform:uppercase}
.mc .fl-tag.bad{color:var(--bad)}.mc .fl-tag.good{color:var(--good)}
.mc .fl-frames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mc .fl-frames.three{grid-template-columns:repeat(3,minmax(0,1fr));max-width:760px}
.mc .fl-frame{position:relative;aspect-ratio:9/16;border-radius:var(--r);overflow:hidden;background:#000}
.mc .fl-frame.bad{box-shadow:0 0 0 3px var(--bad)}.mc .fl-frame.good{box-shadow:0 0 0 3px var(--good)}
.mc .fl-frame img,.mc .fl-frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mc .fl-frame svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.mc .fl-note-mark{position:absolute;transform:translate(-50%,-50%);max-width:84%;width:max-content;padding:5px 9px;border-radius:9px;font:600 .74rem/1.25 var(--text);color:#fff;text-align:center;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.mc .fl-note-mark.bad{background:var(--bad)}.mc .fl-note-mark.good{background:var(--good)}
.mc .fl-frame.playing svg,.mc .fl-frame.playing .fl-note-mark{display:none}
.mc .fl-play{justify-self:start;border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:999px;padding:7px 14px;font:600 .82rem var(--text);cursor:pointer}
.mc .fl-why{display:grid;gap:14px;min-width:0}
.mc .fl-why h4,.mc .fl-pair h4{margin:0 0 6px;font:600 .75rem var(--text);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mc .fl-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.mc .fl-e pre{margin:0;background:var(--band);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font:13px/1.5 var(--mono);white-space:pre-wrap;word-break:break-word}
.mc .band .fl-e pre{background:var(--bg)}
.mc .fl-e pre.said{border-left:4px solid var(--bad)}.mc .fl-e pre.fix{border-left:4px solid var(--good)}
.mc .fl-e pre mark{background:color-mix(in srgb,var(--bad) 20%,transparent);color:inherit;border-radius:3px;padding:0 2px}
.mc .fl-e pre.fix mark{background:color-mix(in srgb,var(--good) 22%,transparent)}
.mc .fl-rule{font:600 1rem/1.4 var(--display);padding-top:8px;border-top:1px solid var(--line);max-width:760px}
.mc .fl-rule::before{content:"Rule · ";color:var(--muted);font-weight:500}
.mc .fl-script{display:grid;gap:10px}
.mc .fl-line{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:baseline;padding:16px 18px;border-radius:14px;background:var(--band);font:600 clamp(1.05rem,2.4vw,1.4rem)/1.3 var(--display)}
.mc .band .fl-line{background:var(--bg)}
.mc .fl-line span{font:600 .72rem var(--text);letter-spacing:.06em;text-transform:uppercase}
.mc .fl-line.bad span{color:var(--bad)}.mc .fl-line.good span{color:var(--good)}
.mc .fl-line.bad q{text-decoration:line-through;text-decoration-color:var(--bad);color:var(--muted)}
.mc .fl-tl{background:var(--band);border-radius:var(--r);padding:16px;overflow-x:auto}
.mc .band .fl-tl{background:var(--bg)}
.mc .fl-tl svg{display:block;width:100%;min-width:560px;height:auto}
.mc .fl-table{overflow-x:auto;background:var(--bg);border-radius:var(--r);padding:6px 14px}
.mc .fl-table table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:620px}
.mc .fl-table th,.mc .fl-table td{text-align:left;vertical-align:top;padding:10px;border-bottom:1px solid var(--line)}
.mc .fl-table thead th{font:600 .72rem var(--text);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mc .fl-table td.b{color:var(--bad)}.mc .fl-table td.g{color:var(--good)}
.mc .fl-rules-wrap{display:grid;gap:16px}
.mc .fl-rules-wrap h3{font-size:clamp(1.35rem,3vw,1.8rem);font-weight:700}
.mc .fl-rules{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 28px;counter-reset:r}
.mc .fl-rules li{counter-increment:r;display:grid;grid-template-columns:30px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.mc .fl-rules li::before{content:counter(r);font:700 1rem var(--display);color:var(--accent)}
.mc .fl-more{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:clamp(36px,6vw,56px)}
.mc .fl-more .fl-note{flex-basis:100%;order:3;color:var(--muted);font-size:.85rem}
.mc .fl-tally{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:8px}
.mc .fl-tally div{background:var(--bg);padding:14px 16px}
.mc .fl-tally b{display:block;font:700 1.8rem/1 var(--display);font-variant-numeric:tabular-nums}
.mc .fl-tally span{font-size:.82rem;color:var(--muted)}
.mc .fl-tally .bad b{color:var(--bad)}.mc .fl-tally .good b{color:var(--good)}
.mc-log .hero-copy{display:grid;gap:16px}
@media (max-width:860px){.mc .fl-body,.mc .fl-pair,.mc .fl-rules{grid-template-columns:1fr}.mc .fl-tally{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.mc .fl-frames.three{grid-template-columns:repeat(2,minmax(0,1fr))}.mc .fl-note-mark{font-size:.66rem;padding:4px 7px}}