:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--deck-fg); background: var(--deck-bg); -webkit-font-smoothing: antialiased; }
a { color: inherit; }
a:focus-visible { outline: 3px solid var(--deck-accent-dark); outline-offset: 4px; }
.container { width: min(1160px, calc(100% - 64px)); margin: 0 auto; }
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 29px 0; border-bottom: 1px solid var(--deck-line); }
.brand { display: inline-flex; align-items: center; gap: 12px; font-size: 16px; font-weight: 800; letter-spacing: -.025em; text-decoration: none; }
.mark { width: 34px; height: 34px; background: var(--deck-fg); color: var(--deck-accent); display:grid;place-items:center; border-radius: 10px; font-weight: 900; transform: rotate(-7deg); }
.toplink { font-size: 14px; color: var(--deck-muted); text-decoration: none; border-bottom: 1px solid var(--deck-line); padding-bottom: 3px; }
.hero { padding: clamp(72px, 11vw, 142px) 0 88px; max-width: 920px; }
.eyebrow { text-transform: uppercase; letter-spacing: .19em; color: var(--deck-muted); font-weight: 800; font-size: 12px; }
h1 { font-size: clamp(56px, 8vw, 110px); line-height: .98; letter-spacing: -.072em; margin: 24px 0 28px; font-weight: 800; }
.highlight { position: relative; white-space: nowrap; }
.highlight::after { content:""; position:absolute;left:0;right:-3px;bottom: .015em;height:.15em;background: var(--deck-accent); z-index:-1; border-radius: 3px; }
.lead { font-size: clamp(18px, 2.3vw, 25px); line-height: 1.52; max-width: 700px; color: var(--deck-muted); margin: 0; }
.section-head { display:flex;align-items:baseline;justify-content:space-between;gap:20px; padding-bottom: 20px; border-bottom: 1px solid var(--deck-line); }
h2 { font-size: 24px; letter-spacing:-.04em;margin:0; }
.count { font-size: 13px; color: var(--deck-muted); }
.courses { margin: 26px 0 120px; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,350px),1fr)); gap:22px; }
.course { background:var(--deck-surface);border: 1px solid var(--deck-line);text-decoration:none;display:flex;flex-direction:column;border-radius:20px;padding:29px;min-height:365px;position:relative;transition: transform .2s ease,box-shadow .2s ease; overflow:hidden; }
.course:hover { transform:translateY(-4px);box-shadow:0 18px 44px rgba(32,41,35,.08); }
.course::before { content:"";position:absolute;right:-57px;top:-70px;width:190px;height:190px;border:27px solid var(--deck-accent);border-radius:100%;opacity:.85;pointer-events:none; }
.course__top { color:var(--deck-muted);font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:850;display:flex;gap:9px;align-items:center;position:relative; }
.course__top .dot { width:7px;height:7px;border-radius:100%;background:var(--deck-accent-dark); }
.course h3 { font-size:clamp(32px,4vw,43px);letter-spacing:-.055em;line-height:1.1;margin:62px 0 10px;position:relative; }
.course__sub { font-size:17px;line-height:1.35;font-weight:620;margin:0 0 15px;max-width:350px; }
.course__desc { margin:0;color:var(--deck-muted);font-size:15px;line-height:1.6;max-width:400px; }
.course__bottom { display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:26px; }
.chips { display:flex; flex-wrap:wrap;gap:7px; }
.chip { background:#fff; border:1px solid var(--deck-line);border-radius:20px;padding:6px 11px;font-size:11px;font-weight:700;color:var(--deck-muted); }
.arrow {display:grid;place-items:center;border-radius:50%;width:42px;height:42px;background:var(--deck-fg);color:white;font-size:24px;flex-shrink:0;}
footer { border-top:1px solid var(--deck-line);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:28px 0 42px;color:var(--deck-muted);font-size:13px; }
footer a { color:var(--deck-fg);text-decoration:none; }
@media(max-width:600px){.container{width:calc(100% - 36px)} .topbar{padding:20px 0}.hero{padding:75px 0 64px}.courses{margin-bottom:65px}.course{min-height:345px;padding:22px}.course h3{margin-top:55px}footer{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.course{transition:none}.course:hover{transform:none}}