:root{--night:#141018;--plum:#221c28;--plum2:#2e2638;--sky:#3d9ebf;--gold:#e0b84e;--fg:#f7f4ec;--dim:#9a91a3}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 80% -10%,#2a2038 0,var(--night) 55%);color:var(--fg);font:16px/1.65 "IBM Plex Sans",system-ui,sans-serif;min-height:100vh}
a{color:var(--sky)}main,.top,.bottom{max-width:920px;margin:0 auto;padding:0 20px}
.top{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px}
.mark{font:800 1.6rem/1 "Syne","Trebuchet MS",sans-serif;color:var(--fg);text-decoration:none;letter-spacing:-.02em}.mark span{color:var(--gold)}
.menu a{color:var(--dim);margin-right:12px;text-decoration:none}.switch{margin-left:auto;display:flex;gap:4px}
.switch a{padding:4px 10px;border-radius:999px;color:var(--dim);text-decoration:none;font-size:.8rem;font-weight:700}
.switch a[aria-current]{background:rgba(61,158,191,.18);color:var(--sky)}.menu a[aria-current]{color:var(--gold)}
.hero{background:linear-gradient(135deg,var(--sky),var(--plum2));border-radius:32px;padding:34px;margin-top:10px}
.hero img{border-radius:24px}.hero h1{font:800 3rem/1 "Syne","Trebuchet MS",sans-serif;margin:16px 0 6px}.hero p{font-size:1.2rem;margin:0;max-width:34em}
.intro{font-size:1.1rem;color:var(--dim);margin:26px 4px}
.courses{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.courses article,.duo article,.policy{background:var(--plum);border:1px solid rgba(61,158,191,.3);border-radius:28px;padding:22px}
.courses h2{color:var(--gold);margin:0 0 6px;font-family:"Syne","Trebuchet MS",sans-serif}
section{margin:42px 0}h2,h3{font-family:"Syne","Trebuchet MS",sans-serif}
.how ol{counter-reset:s;list-style:none;padding:0}.how li{counter-increment:s;padding:10px 0 10px 54px;position:relative}
.how li:before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:6px;color:var(--gold);font:800 1.4rem/1.2 "Syne",sans-serif}
.fine{color:var(--dim);font-size:.9rem}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.duo .hot{border:2px solid var(--gold)}
.big{font:800 2.2rem/1.1 "Syne",sans-serif;margin:.2em 0}.big small{font:400 1rem "IBM Plex Sans",sans-serif;color:var(--dim)}
.badge{display:inline-block;background:var(--gold);color:var(--night);border-radius:999px;padding:2px 12px;font-weight:700;font-size:.85rem;margin:0}
.go{display:block;text-align:center;margin-top:16px;padding:12px;border-radius:999px;background:var(--sky);color:#071018;font-weight:700;text-decoration:none}
.perks{padding-left:1.2em}.policy{margin:20px 0}.policy h2{color:var(--gold);font-size:1.2rem;margin-top:1.6em}.policy h3{font-size:1rem}.meta{color:var(--dim)}
code{background:rgba(255,255,255,.08);padding:1px 6px;border-radius:6px}
.bottom{color:var(--dim);font-size:.85rem;padding-top:24px;padding-bottom:36px;border-top:1px solid rgba(255,255,255,.08);margin-top:40px}
