[hidden]{display:none!important}
.wrap.wide-l{max-width:1120px}
.lnav{gap:18px}
.lnav a:not(.btn){text-decoration:none;font-weight:700;font-size:.95rem;color:var(--muted)}
.lnav a:not(.btn):hover{color:var(--ink)}
.eyebrow{font:700 .8rem var(--body-font),sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--seminar);margin:0 0 6px}
.l-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding:44px 0 36px}
.l-hero h1{font-size:clamp(2.3rem,5.4vw,4rem)}
/* demo card */
.demo{margin:0;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;box-shadow:12px 12px 0 var(--ink);overflow:hidden;transform:rotate(1deg)}
.demo-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:var(--ink);color:var(--bg)}
.demo-bar span{width:9px;height:9px;border-radius:50%;background:color-mix(in srgb,var(--bg) 40%,transparent)}
.demo-bar b{margin-inline-start:8px;font:700 .9rem var(--head-font),sans-serif}
.demo-body{padding:14px 16px 16px}
.demo-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.demo .pill{font-size:.75rem;font-weight:700;border-radius:99px;padding:3px 9px}
.pill.field{background:color-mix(in srgb,var(--lecture) 18%,var(--surface));color:var(--lecture)}
.pill.grp{background:color-mix(in srgb,var(--seminar) 16%,var(--surface));color:var(--seminar)}
.pill.cl{background:color-mix(in srgb,var(--clash) 14%,var(--surface));color:var(--clash)}
.demo-day{font:700 .78rem var(--body-font),sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:12px 0 6px}
.demo-s{border:1.5px solid var(--line);border-inline-start:5px solid var(--other);border-radius:9px;padding:8px 10px;margin-top:6px;display:flex;flex-direction:column}
.demo-s b{font-size:.93rem}
.demo-s span{font-size:.8rem;color:var(--muted)}
.demo-s[data-type=lecture]{border-inline-start-color:var(--lecture)}
.demo-s[data-type=seminar]{border-inline-start-color:var(--seminar)}
.demo-s[data-type=practical]{border-inline-start-color:var(--practical)}
.demo-s.clash{background:color-mix(in srgb,var(--clash) 9%,var(--surface));border-color:color-mix(in srgb,var(--clash) 45%,var(--line))}
.demo-s em{font-style:normal;font-weight:700;color:var(--clash)}
.demo-sync{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-size:.8rem;color:var(--muted)}
.demo-sync b{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:2px 8px;color:var(--ink)}
/* before / after */
.l-problem{padding:20px 0}
.ba{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:stretch}
.ba-card{border-radius:16px;padding:22px}
.ba-card ul{margin:0;padding-inline-start:20px}
.ba-card li+li{margin-top:8px}
.ba-label{font:800 1.3rem var(--head-font),sans-serif;margin:0 0 10px}
.before{background:color-mix(in srgb,var(--clash) 8%,var(--surface));border:1.5px dashed color-mix(in srgb,var(--clash) 40%,var(--line))}
.after{background:color-mix(in srgb,var(--ok) 10%,var(--surface));border:1.5px solid color-mix(in srgb,var(--ok) 40%,var(--line))}
.ba-arrow{align-self:center;font:800 2rem var(--head-font),sans-serif;color:var(--muted)}
[dir=rtl] .ba-arrow{transform:scaleX(-1)}
/* sections */
.l-section{padding:56px 0 8px}
.l-section>h2{font-size:clamp(1.7rem,3.6vw,2.4rem);max-width:24ch}
.l-steps{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.l-steps li{border-top:4px solid var(--ink);padding-top:12px}
.l-steps b{font:800 2rem var(--head-font),sans-serif;display:block;color:var(--seminar)}
.l-steps h3{margin:2px 0 4px}
.l-steps p{color:var(--muted)}
.l-features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.feat{background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:20px}
.feat p{color:var(--muted)}
.feat h3{margin:10px 0 4px}
.ic{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:10px;font-weight:800;font-size:1.2rem;color:#fff;background:var(--other)}
.ic[data-c=lecture]{background:var(--lecture)}.ic[data-c=seminar]{background:var(--seminar)}.ic[data-c=practical]{background:var(--practical)}
.ic[data-c=placement]{background:var(--placement)}.ic[data-c=clash]{background:var(--clash)}
@media (prefers-color-scheme:dark){.ic{color:var(--bg)}}
.l-price{display:flex;justify-content:center}
.price-card{max-width:520px;width:100%;padding:28px;box-shadow:10px 10px 0 var(--mark)}
.price-card .price strong{font-size:3.4rem}
.price-card .btn{width:100%}
.faq{margin-top:24px;display:grid;gap:10px;max-width:780px}
.faq details{background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:0 18px}
.faq summary{cursor:pointer;font-weight:700;padding:16px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:800 1.3rem var(--head-font),sans-serif;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:0 0 16px;color:var(--muted)}
.l-final{margin:64px 0 20px;background:var(--ink);color:var(--bg);border-radius:20px;padding:44px 24px;text-align:center}
.l-final h2{font-size:clamp(1.8rem,4vw,2.6rem)}
.l-final p{color:color-mix(in srgb,var(--bg) 78%,var(--ink));margin:10px 0 20px}
.l-final a:not(.btn){color:var(--bg)}
.l-final .small{margin:14px 0 0}
footer{display:flex;flex-wrap:wrap;gap:16px;padding-top:24px;font-size:.88rem;color:var(--muted)}
@media (max-width:900px){
  .l-hero{grid-template-columns:1fr;gap:34px;padding-top:24px}
  .demo{transform:none;box-shadow:8px 8px 0 var(--ink)}
  .l-steps{grid-template-columns:repeat(2,1fr)}
  .l-features{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .hide-sm{display:none}
  .ba{grid-template-columns:1fr}
  .ba-arrow,[dir=rtl] .ba-arrow{transform:rotate(90deg);justify-self:center}
  .l-steps,.l-features{grid-template-columns:1fr}
  .l-hero .row .btn{flex:1 1 100%}
  .l-section{padding-top:44px}
}
.btn.disabled{opacity:.55;pointer-events:none}
/* student reviews */
.l-reviews{background:var(--surface);border:1.5px solid var(--line);border-radius:20px;padding:30px;box-shadow:10px 10px 0 var(--mark);margin:8px 0 36px}
.l-reviews>*+*{margin-top:18px}
.rev-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}
.rev-head h2{font-size:clamp(1.6rem,3.4vw,2.2rem)}
.rev-score{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.rev-score .e{font-size:2rem;align-self:center;margin-inline-end:4px}
.rev-score b{font:800 2.6rem var(--head-font),sans-serif;line-height:1}
.rev-score .of{font:800 1.2rem var(--head-font),sans-serif;color:var(--muted)}
.rev-score .n{color:var(--muted);font-size:.92rem;margin-inline-start:6px}
.rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.rev{margin:0;background:var(--bg);border:1.5px solid var(--line);border-inline-start:5px solid var(--seminar);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:10px}
.rev-top{display:flex;align-items:center;gap:8px}
.rev-top .e{font-size:1.6rem;line-height:1}
.rev-top b{font:800 1.1rem var(--head-font),sans-serif}
.rev-top .w{color:var(--muted);font-size:.9rem}
.rev blockquote{margin:0;font-size:1.02rem;white-space:pre-wrap;word-break:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;overflow:hidden}
.rev blockquote::before{content:"“"}.rev blockquote::after{content:"”"}
.rev blockquote.open{display:block;-webkit-line-clamp:unset}
.rev .link{align-self:flex-start}
.rev figcaption{margin-top:auto;color:var(--muted);font-size:.88rem;font-weight:700}
.rev-score .e,.rev-top .e{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji","Twemoji Mozilla",sans-serif}
@media (max-width:640px){.l-reviews{padding:20px;box-shadow:6px 6px 0 var(--mark)}.rev-grid{grid-template-columns:1fr}}
.rev-empty{grid-column:1/-1;margin:0;background:var(--bg);border:1.5px dashed var(--line);border-radius:14px;padding:18px;color:var(--muted)}
.rev-viewport{overflow:hidden;margin-inline-start:-4px;padding-inline-start:4px}
.rev-track{display:flex;gap:16px;align-items:stretch;will-change:transform}
.rev-track>.rev{flex:0 0 calc((100% - (var(--per,3) - 1) * 16px) / var(--per,3))}
.rev-ctl{display:flex;gap:8px;justify-content:flex-end}
/* demo video */
.l-video>p.muted{max-width:62ch}
.video-frame{margin-top:24px;background:var(--ink);border-radius:18px;overflow:hidden;box-shadow:12px 12px 0 var(--mark);border:1.5px solid var(--ink);line-height:0}
.video-frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:var(--ink)}
.video-frame.tall{max-width:420px;margin-left:auto;margin-right:auto}
.video-frame.tall video{aspect-ratio:9/16;max-height:78vh}
@media (max-width:640px){.video-frame{box-shadow:6px 6px 0 var(--mark)}}
.video-frame{position:relative}
.video-play{position:absolute;left:50%;top:74%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:12px;padding:16px 26px 16px 20px;border:0;border-radius:999px;background:var(--mark);color:var(--mark-ink);font:800 1.15rem var(--head-font),sans-serif;cursor:pointer;box-shadow:0 10px 30px rgba(22,33,58,.35);line-height:1;white-space:nowrap}
.video-play svg{width:28px;height:28px;fill:currentColor}
.video-play:hover{transform:translate(-50%,-50%) scale(1.04)}
.video-play:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.l-video{padding-bottom:40px}
.video-frame.tall .video-play{top:76%}
.feat.wide{grid-column:1/-1;display:flex;gap:16px;align-items:flex-start;border-color:var(--placement);border-width:2px}
.feat.wide .ic{flex:none}.feat.wide h3{margin:2px 0 4px}.feat.wide .eyebrow{color:var(--placement);margin:0}