/* Masterclass style: black, cinematic, large type, tall cards in a row, a chapter list and plan cards.
   MSDP red only on the main buttons and the highlighted plan. */
body:has(.mc-page){background:#000;font-family:var(--msdp-font)}
.wrap:has(.mc-page){max-width:none;padding:0}
.wrap:has(.mc-page) .marketing-nav{padding-inline:32px;color:#fff;border-bottom-color:#1a1a1d;background:#000}
.wrap:has(.mc-page) .nav .brand small,.wrap:has(.mc-page) .nav .brand .brand-company{color:#8a8a90}
.wrap:has(.mc-page) .feature-dropdown{color:#111}
.wrap:has(.mc-page)>footer{padding-inline:32px;border-top-color:#1a1a1d;color:#8a8a90}

.mc-page{--mc-red:var(--msdp-action);--mc-line:#232327;--mc-muted:#a1a1a8;--mc-card:#111114;color:#fff;line-height:1.45;overflow-x:clip}
.mc-page :is(h1,h2,h3,p,ul,ol,figure){margin:0}
.mc-page ul,.mc-page ol{list-style:none;padding:0}
.mc-page a{color:inherit}
.mc-page a:focus-visible,.mc-page summary:focus-visible{outline:2px solid #fff;outline-offset:3px}
.mc-trial{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:#8a8a90;padding:8px 32px;border-bottom:1px solid var(--mc-line)}
.mc-trial a{text-decoration:none}
.mc-kicker{font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--mc-muted);margin-bottom:14px}

.mc-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 28px;border-radius:6px;background:var(--mc-red);color:#fff!important;font-weight:700;font-size:16px;text-decoration:none;border:1px solid var(--mc-red);transition:background .2s}
.mc-btn:hover{background:var(--msdp-action-hover)}
.mc-btn.ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28)}
.mc-btn.ghost:hover{background:rgba(255,255,255,.16)}
.mc-btn svg{width:18px;height:18px;fill:currentColor}
.mc-actions{display:flex;flex-wrap:wrap;gap:12px}
.mc-actions.center{justify-content:center}

/* Hero: the product as the backdrop, the copy over a dark fade. */
.mc-hero{position:relative;min-height:min(92svh,860px);display:flex;align-items:flex-end;padding:0 32px 9vh;overflow:hidden;isolation:isolate}
.mc-hero-art{position:absolute;inset:0;z-index:-1}
.mc-hero-back{position:absolute;right:-4%;top:6%;width:min(78vw,1180px);height:auto;border-radius:14px;opacity:.55;transform:perspective(1600px) rotateY(-14deg);transform-origin:right center}
.mc-hero-phone{position:absolute;right:8%;top:16%;width:min(19vw,260px);height:auto;border-radius:30px;border:6px solid #1c1c20;box-shadow:0 40px 80px rgba(0,0,0,.7)}
.mc-hero-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#000 22%,rgba(0,0,0,.75) 48%,rgba(0,0,0,.1) 80%),linear-gradient(0deg,#000 0,transparent 40%)}
.mc-hero-copy{max-width:660px}
.mc-hero h1{font-size:clamp(44px,6.4vw,92px);line-height:.98;letter-spacing:-.035em;font-weight:800}
.mc-lead{font-size:clamp(18px,1.7vw,22px);color:#d4d4d8;margin:22px 0 30px;max-width:540px}
.mc-small{font-size:14px;color:var(--mc-muted);margin-top:16px}

.mc-facts{display:flex;justify-content:center;flex-wrap:wrap;border-block:1px solid var(--mc-line);padding:22px 32px;gap:0}
.mc-facts li{font-size:15px;color:var(--mc-muted);padding:4px 28px}
.mc-facts li+li{border-left:1px solid var(--mc-line)}
.mc-facts b{color:#fff}

.mc-section{padding:120px 32px 0;max-width:1320px;margin:0 auto}
.mc-head{margin-bottom:44px;max-width:820px}
.mc-head h2{font-size:clamp(32px,4vw,56px);line-height:1.04;letter-spacing:-.03em;font-weight:800}
.mc-head.center{text-align:center;margin-inline:auto}
.mc-head.row{display:flex;justify-content:space-between;align-items:end;gap:40px;max-width:none}
.mc-head.row>p{max-width:380px;color:var(--mc-muted);font-size:17px}

/* Line-up: tall cards, like a row of classes. */
.mc-lineup{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.mc-lineup a{position:relative;display:block;aspect-ratio:3/4.4;border-radius:10px;overflow:hidden;background:var(--mc-card);text-decoration:none;isolation:isolate}
.mc-lineup img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease;filter:saturate(.9)}
.mc-lineup a:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#000 18%,rgba(0,0,0,.55) 52%,rgba(0,0,0,.05) 80%)}
.mc-lineup a:hover img{transform:scale(1.05)}
.mc-card-copy{position:absolute;left:22px;right:22px;bottom:22px;display:grid;gap:6px}
.mc-card-copy small{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mc-muted)}
.mc-card-copy strong{font-size:clamp(24px,2.3vw,32px);font-weight:800;letter-spacing:.04em;text-transform:uppercase;line-height:1.05}
.mc-card-copy>span{font-size:15px;color:#d4d4d8}
.mc-card-copy em{font-style:normal;font-weight:700;font-size:14px;margin-top:8px}

.mc-gets{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--mc-line)}
.mc-gets li{padding:32px 28px 0 0}
.mc-gets li+li{padding-left:28px;border-left:1px solid var(--mc-line)}
.mc-gets b{display:block;font:700 14px var(--msdp-font-mono);color:var(--mc-red);margin-bottom:18px}
.mc-gets strong{display:block;font-size:26px;letter-spacing:-.02em;margin-bottom:8px}
.mc-gets span{color:var(--mc-muted);font-size:17px}

/* Chapters: a lesson list with thumbnails. */
.mc-chapters{display:grid;gap:2px;border-radius:12px;overflow:hidden}
.mc-chapters li{display:grid;grid-template-columns:240px 1fr auto;gap:28px;align-items:center;background:var(--mc-card);padding:18px 26px 18px 18px;transition:background .2s}
.mc-chapters li:hover{background:#18181c}
.mc-thumb{position:relative;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:#222}
.mc-thumb img{width:100%;height:100%;object-fit:cover}
.mc-thumb span{position:absolute;left:10px;bottom:8px;font-size:28px;font-weight:800;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.mc-chapters h3{font-size:22px;letter-spacing:-.02em;margin-bottom:6px}
.mc-chapters p{color:var(--mc-muted);font-size:16px;max-width:640px}
.mc-chapters small{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mc-muted);border:1px solid var(--mc-line);border-radius:999px;padding:6px 12px;white-space:nowrap}

/* Every device. */
.mc-device-stage{position:relative;max-width:1060px;margin:0 auto;padding-bottom:40px}
.mc-laptop{width:84%;border:10px solid #1c1c20;border-bottom-width:18px;border-radius:16px 16px 6px 6px;overflow:hidden;background:#1c1c20;box-shadow:0 60px 120px rgba(200,30,43,.18)}
.mc-laptop img{display:block;width:100%;height:auto}
.mc-phones{position:absolute;right:0;bottom:0;display:flex;gap:14px;align-items:flex-end;width:44%}
.mc-phones img{width:calc((100% - 28px)/3);height:auto;aspect-ratio:390/844;object-fit:cover;object-position:top;border:5px solid #1c1c20;border-radius:20px;box-shadow:0 30px 60px rgba(0,0,0,.7)}
.mc-phones img:nth-child(2){transform:translateY(-28px)}
.mc-device-list{display:flex;justify-content:center;gap:48px;margin-top:36px;color:var(--mc-muted);font-size:16px}
.mc-device-list b{display:block;color:#fff;font-size:13px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:4px}

.mc-roles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.mc-roles li{background:var(--mc-card);border:1px solid var(--mc-line);border-radius:12px;padding:28px 24px;min-height:200px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.mc-roles small{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mc-muted)}
.mc-roles strong{font-size:22px;letter-spacing:-.02em;line-height:1.25}
.mc-note{margin-top:22px;color:var(--mc-muted);font-size:16px}

/* Plans. */
.mc-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.mc-plans>li{position:relative;display:flex;flex-direction:column;background:var(--mc-card);border:1px solid var(--mc-line);border-radius:14px;padding:34px 28px 28px}
.mc-plans>li.top{border:2px solid var(--mc-red);background:linear-gradient(180deg,rgba(200,30,43,.16),var(--mc-card) 45%)}
.mc-tag{position:absolute;top:-13px;left:28px;background:var(--mc-red);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.mc-plans h3{font-size:26px;letter-spacing:-.02em}
.mc-plans h3+p{color:var(--mc-muted);margin:6px 0 22px}
.mc-plans ul{display:grid;gap:12px;margin-bottom:28px;flex:1}
.mc-plans ul li{position:relative;padding-left:26px;font-size:16px}
.mc-plans ul li:before{content:'';position:absolute;left:2px;top:6px;width:12px;height:7px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.mc-plans .mc-btn{justify-content:center}

.mc-faq{max-width:860px;margin:0 auto;border-top:1px solid var(--mc-line)}
.mc-faq details{border-bottom:1px solid var(--mc-line)}
.mc-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:26px 0;font-size:20px;font-weight:700}
.mc-faq summary::-webkit-details-marker{display:none}
.mc-faq summary:after{content:'+';font-size:28px;font-weight:300;line-height:1;transition:transform .2s}
.mc-faq details[open] summary:after{transform:rotate(45deg)}
.mc-faq details p{color:var(--mc-muted);font-size:17px;padding:0 40px 26px 0}

.mc-close{position:relative;margin:140px 32px 0;border-radius:18px;overflow:hidden;min-height:480px;display:grid;place-items:center;text-align:center;isolation:isolate;padding:80px 24px}
.mc-close img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.35;filter:blur(2px)}
.mc-close:after{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 60%,rgba(200,30,43,.35),#000 75%)}
.mc-close h2{font-size:clamp(40px,6vw,84px);letter-spacing:-.035em;line-height:1;font-weight:800}
.mc-close p{color:#d4d4d8;font-size:19px;margin:18px 0 30px}
.mc-fine{text-align:center;font-size:12px;color:#6f6f76;padding:24px 32px 60px}

/* Meeting mode, shared script. */
.mc-page .tx-rail{position:fixed;right:12px;top:50%;transform:translateY(-50%);z-index:30;display:grid;gap:4px}
.mc-page .tx-rail button{display:flex;align-items:center;justify-content:end;gap:8px;border:0;background:none;padding:6px 0;color:#fff;cursor:pointer;font-size:10px}
.mc-page .tx-rail span{opacity:0}
.mc-page .tx-rail button:is(:hover,:focus-visible) span{opacity:1}
.mc-page .tx-rail i{width:7px;height:7px;border:1.5px solid #fff;border-radius:50%}
.mc-page .tx-rail .on i{background:#fff}
.mc-page .tx-bar{position:fixed;bottom:14px;left:14px;z-index:30;display:flex;gap:12px;align-items:center;color:#fff;font:600 10px var(--msdp-font-mono)}
.mc-page .tx-bar span{opacity:.6}
.mc-page .tx-bar button{border:1px solid #fff;border-radius:4px;background:#000;color:#fff;padding:7px 12px;font-size:11px;font-weight:600;cursor:pointer}
.tx-presenting:has(.mc-page) .marketing-nav,.tx-presenting:has(.mc-page) .wrap>footer,.tx-presenting .mc-page :is(.mc-trial,.tx-bar span){display:none}
.tx-presenting .mc-page [data-panel]{min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.tx-presenting .mc-page .mc-hero{justify-content:flex-end}

@media(prefers-reduced-motion:reduce){.mc-lineup img,.mc-faq summary:after{transition:none}}
@media(max-width:1000px){
.mc-lineup{grid-template-columns:repeat(4,72%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
.mc-lineup li{scroll-snap-align:start}
.mc-roles{grid-template-columns:1fr 1fr}
.mc-plans{grid-template-columns:1fr;max-width:560px;margin:0 auto}
.mc-chapters li{grid-template-columns:180px 1fr}
.mc-chapters small{display:none}
.mc-hero-back{opacity:.35}
}
@media(max-width:700px){
.wrap:has(.mc-page) .marketing-nav,.wrap:has(.mc-page)>footer{padding-inline:16px}
.mc-trial{padding:8px 16px}
.mc-hero{padding:0 16px 56px;min-height:auto;padding-top:300px}
.mc-hero-back{width:150%;right:-70%;top:20px;opacity:.4}
.mc-hero-phone{width:150px;right:16px;top:40px;border-width:4px;border-radius:22px}
.mc-hero-art:after{background:linear-gradient(0deg,#000 45%,rgba(0,0,0,.4) 75%,rgba(0,0,0,.1))}
.mc-btn{width:100%;justify-content:center}
.mc-facts{flex-direction:column;align-items:center;padding:18px 16px}
.mc-facts li+li{border-left:0}
.mc-section{padding:80px 16px 0}
.mc-head.row{display:block}
.mc-head.row>p{margin-top:12px}
.mc-lineup{grid-template-columns:repeat(4,80%)}
.mc-gets{grid-template-columns:1fr}
.mc-gets li,.mc-gets li+li{padding:26px 0;border-left:0;border-bottom:1px solid var(--mc-line)}
.mc-chapters li{grid-template-columns:1fr;gap:14px;padding:14px}
.mc-laptop{width:100%;border-width:6px}
.mc-phones{position:static;width:100%;margin-top:18px;justify-content:center}
.mc-phones img{max-width:110px}
.mc-device-list{gap:24px;flex-wrap:wrap}
.mc-roles{grid-template-columns:1fr}
.mc-roles li{min-height:0}
.mc-close{margin:90px 16px 0;min-height:380px}
.mc-page .tx-rail{display:none}
}

/* Fixes after the first look. */
.mc-hero{padding-bottom:13vh}
.mc-hero-copy{max-width:880px}
.mc-hero h1{font-size:clamp(40px,5.2vw,80px)}
.mc-lineup a:after{background:linear-gradient(0deg,#000 46%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.1) 82%)}
.mc-thumb:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.75),transparent 55%)}
.mc-thumb span{z-index:1}
@media(max-width:700px){
.mc-hero{padding-bottom:48px}
.mc-hero h1{font-size:38px}
.mc-page .tx-bar{display:none}
.mc-device-list{flex-direction:column;align-items:center;text-align:center;gap:16px}
}
.mc-page .mc-kicker{margin-bottom:14px}
.mc-page .mc-lead{margin:22px 0 30px}
.mc-page .mc-small{margin-top:16px}
.mc-page .mc-close p{margin:18px 0 30px}
.mc-page .mc-note{margin-top:22px}