:root{color-scheme:light;--paper:#f5f4ee;--ink:#192c37;--muted:#56656d;--line:#d5ddd9;--green:#286457;--white:#fff}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.wrap{width:min(1120px,calc(100% - 56px));margin-inline:auto}
.header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:24px;border-bottom:1px solid var(--line)}
.brand{font-size:25px;font-weight:800;letter-spacing:-.05em;text-decoration:none;color:var(--ink)}
.brand span{color:var(--green)}
a{color:var(--green);text-underline-offset:4px;overflow-wrap:anywhere}
a:focus-visible{outline:3px solid #d3a13a;outline-offset:5px;border-radius:3px}
.skip{position:absolute;top:-100px;left:20px;background:var(--white);padding:12px 16px;z-index:3}
.skip:focus{top:12px}
main{padding-block:54px 32px}
.eyebrow,.course-number{font-size:13px;font-weight:650;letter-spacing:.09em;color:var(--muted)}
h1{font-size:clamp(34px,4.7vw,58px);letter-spacing:-.045em;line-height:1.08;max-width:920px;margin:18px 0 24px}
h2{font-size:27px;letter-spacing:-.025em;line-height:1.22;margin:12px 0 18px}
.intro{font-size:20px;line-height:1.55;max-width:780px;margin:0 0 36px}
.courses{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.course{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:18px;padding:28px}
.course-number{margin:0 0 6px}
.course p:not(.course-number){color:var(--muted);margin:0 0 12px}
ol{padding-left:25px}
li{padding-left:3px;margin:8px 0}
.course ol{margin:4px 0 0}
.button{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:4px 0 14px;padding:14px 18px;border-radius:9px;background:var(--green);color:var(--white);text-decoration:none;font-weight:700;line-height:1.4}
.button:hover{background:#1d5145}
.file-type{font-size:12px;font-weight:650;letter-spacing:.06em;white-space:nowrap}
.how{padding-block:34px 22px;max-width:870px}
.how li{margin:16px 0}
code{font-size:.93em;overflow-wrap:anywhere}
.format{padding:24px 28px;border:1px solid #dacb9a;border-radius:14px;background:#fff9e9;max-width:960px}
.format h2{font-size:23px;margin-top:0}
.format p:last-child{margin-bottom:0}
footer{padding-block:24px 36px;color:var(--muted);font-size:13px}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}.header{padding-block:20px;align-items:flex-start}.header>a:last-child{font-size:14px;max-width:110px;text-align:right}main{padding-top:34px}.intro{font-size:18px}.courses{grid-template-columns:1fr;gap:20px}.course{padding:23px}.format{padding:22px}.eyebrow{letter-spacing:.055em;font-size:12px}h2{font-size:25px}}
