:root { --navy:#0d2340; --gold:#b8922a; --ivory:#f9f6ef; --ink:#1c1a16; --mist:#e9e4d8; --line:#d8d0c0; --sans:"Jost", sans-serif; --serif:"Cormorant Garamond", Georgia, serif; --mono:"JetBrains Mono", monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ivory); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.55; }
a { color:inherit; text-decoration:none; }
.topbar { min-height:72px; padding:0 clamp(22px, 5vw, 80px); display:flex; align-items:center; gap:26px; border-bottom:1px solid var(--line); background:var(--ivory); }
.brand { color:var(--navy); font-family:var(--mono); font-size:20px; font-weight:500; letter-spacing:0; }
.brand span { color:var(--gold); }
.topbar-meta { color:#655f55; font-size:13px; letter-spacing:0; margin-right:auto; }
.topbar-meta span { display:inline-block; height:4px; width:4px; margin:0 9px 2px; background:var(--gold); border-radius:50%; }
.text-link { color:var(--navy); font-size:14px; font-weight:600; }
.text-link span { color:var(--gold); margin-left:5px; }
.intro-band { min-height:440px; display:grid; grid-template-columns:minmax(0, 1.2fr) minmax(280px, .8fr); grid-template-rows:1fr auto; background:var(--navy); color:var(--ivory); }
.intro-copy { padding:clamp(48px, 8vw, 112px) clamp(22px, 8vw, 128px); padding-right:clamp(22px, 4vw, 72px); }
.eyebrow { margin:0 0 12px; color:var(--gold); font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:0; text-transform:uppercase; }
h1,h2,h3 { margin:0; font-family:var(--serif); font-weight:600; line-height:.98; letter-spacing:0; }
h1 { font-size:clamp(48px, 6vw, 84px); max-width:690px; }
.intro-text { max-width:560px; color:#e1dfd8; margin:26px 0 31px; font-size:17px; }
.intro-actions { display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.primary-action { background:var(--gold); color:var(--navy); padding:12px 17px; font-weight:700; font-size:14px; }
.primary-action span { padding-left:14px; }
.secondary-action { border-bottom:1px solid #9b988f; padding:8px 0; font-weight:500; font-size:14px; }
.intro-image { grid-column:2; grid-row:1 / span 2; min-height:440px; background:linear-gradient(0deg, rgba(13,35,64,.28), rgba(13,35,64,.08)),url("https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=1100&q=85") center/cover; }
.outcome-note { grid-column:1; grid-row:2; padding:25px clamp(22px, 8vw, 128px); max-width:800px; border-top:1px solid rgba(249,246,239,.18); }
.outcome-note p:not(.eyebrow) { margin:0 0 10px; max-width:560px; font-size:14px; color:#e1dfd8; }.outcome-note strong { color:var(--gold); }.outcome-note a { font-size:13px; font-weight:600; }.outcome-note a span { color:var(--gold); }
.curriculum-section,.resource-section { padding:clamp(55px, 7vw, 104px) clamp(22px, 8vw, 128px); }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:35px; }.section-heading h2,.resource-section h2 { color:var(--navy); font-size:clamp(38px, 4vw, 58px); }.section-heading > p { max-width:320px; margin:0; color:#655f55; font-size:14px; }
.week-grid { display:grid; grid-template-columns:repeat(2, 1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }.week-card { min-height:240px; padding:26px; display:grid; grid-template-columns:43px 1fr auto; gap:14px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .2s,color .2s; }.week-card:hover { background:var(--navy); color:var(--ivory); }.week-number { color:var(--gold); font-family:var(--mono); font-size:12px; }.card-label { margin:0 0 21px; font-size:12px; font-weight:600; text-transform:uppercase; }.card-label span { margin-left:10px; color:#817b70; font-family:var(--mono); font-size:10px; }.week-card h3 { color:var(--navy); font-size:31px; transition:color .2s; }.week-card:hover h3 { color:var(--ivory); }.week-card p:not(.card-label) { margin:13px 0 0; font-size:14px; color:#655f55; }.week-card:hover p:not(.card-label) { color:#ddd9d0; }.card-arrow { align-self:end; color:var(--gold); font-size:20px; }
.resource-section { display:grid; grid-template-columns:minmax(220px, .7fr) minmax(350px, 1.3fr); gap:60px; background:var(--mist); }.resource-list { border-top:1px solid #cfc6b5; }.resource-row { padding:18px 0; display:grid; grid-template-columns:110px 1fr 20px; gap:16px; align-items:center; border-bottom:1px solid #cfc6b5; }.resource-row:hover strong { color:var(--gold); }.resource-label { color:#655f55; font-family:var(--mono); font-size:10px; text-transform:uppercase; }.resource-row strong { display:block; color:var(--navy); font-family:var(--serif); font-size:25px; line-height:1; transition:color .2s; }.resource-row small { display:block; color:#655f55; font-size:12px; margin-top:5px; }.resource-row > span:last-child { color:var(--gold); font-size:20px; } footer { display:flex; justify-content:space-between; padding:20px clamp(22px, 8vw, 128px); background:var(--navy); color:#d7d4cc; font-family:var(--mono); font-size:10px; text-transform:uppercase; }
.lesson-layout { display:grid; grid-template-columns:255px minmax(0, 1fr); max-width:1500px; margin:0 auto; }.lesson-nav { padding:44px 27px; border-right:1px solid var(--line); min-height:calc(100vh - 72px); }.lesson-nav nav { border-top:1px solid var(--line); }.lesson-nav nav a { display:grid; grid-template-columns:20px 1fr; gap:9px; padding:11px 0; border-bottom:1px solid var(--line); color:#534e45; font-size:12px; line-height:1.25; }.lesson-nav nav a span { color:var(--gold); font-family:var(--mono); font-size:10px; }.lesson-nav nav a.active { color:var(--navy); font-weight:700; }.nav-note { margin-top:42px; padding-top:20px; border-top:3px solid var(--gold); }.nav-note p:not(.eyebrow) { margin:0; color:#655f55; font-size:12px; }
.lesson-main { max-width:910px; padding:clamp(38px, 6vw, 85px) clamp(22px, 7vw, 112px); }.lesson-status { margin-bottom:22px; color:var(--gold); font-family:var(--mono); font-size:11px; text-transform:uppercase; }.markdown-content > h1 { color:var(--navy); font-size:clamp(46px, 5.5vw, 72px); margin-bottom:13px; }.markdown-content > h1 + p { font-size:18px; color:#655f55; margin-top:0; }.markdown-content h2 { color:var(--navy); font-size:39px; margin:62px 0 17px; padding-top:13px; border-top:1px solid var(--line); }.markdown-content h3 { color:#382f22; font-size:28px; margin:37px 0 13px; line-height:1.1; }.markdown-content h4 { color:var(--navy); font-family:var(--sans); font-size:17px; margin:27px 0 10px; }.markdown-content p,.markdown-content li { max-width:750px; }.markdown-content p { margin:12px 0; }.markdown-content ul,.markdown-content ol { padding-left:23px; }.markdown-content li { margin:6px 0; }.markdown-content hr { border:0; border-top:1px solid var(--line); margin:38px 0; }.markdown-content blockquote { margin:25px 0; padding:11px 20px; border-left:3px solid var(--gold); color:#655f55; }.markdown-content table { width:100%; margin:24px 0; border-collapse:collapse; font-size:14px; }.markdown-content th { background:var(--navy); color:var(--ivory); font-weight:600; }.markdown-content th,.markdown-content td { border:1px solid var(--line); padding:9px 11px; text-align:left; vertical-align:top; }.markdown-content tr:nth-child(even) { background:#f0ece2; }.markdown-content pre { overflow:auto; margin:22px 0; padding:20px; background:var(--navy); color:#f1ede4; border-left:3px solid var(--gold); font-family:var(--mono); font-size:12px; line-height:1.65; }.markdown-content code { font-family:var(--mono); font-size:.86em; background:#ebe5d9; padding:2px 4px; color:#332c20; }.markdown-content pre code { padding:0; background:transparent; color:inherit; }.markdown-content a { color:#7e5e0b; text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:3px; }.lesson-pager { display:flex; justify-content:space-between; gap:20px; margin-top:70px; padding-top:25px; border-top:1px solid var(--line); }.lesson-pager a { width:48%; color:var(--navy); font-family:var(--serif); font-size:24px; line-height:1; }.lesson-pager a.next { text-align:right; }.lesson-pager small { display:block; margin-bottom:7px; color:#655f55; font-family:var(--mono); font-size:10px; text-transform:uppercase; }.lesson-pager b { color:var(--gold); font-family:var(--sans); }
@media (max-width:760px) { .topbar { min-height:63px; padding:0 19px; }.topbar-meta { display:none; }.topbar .text-link { margin-left:auto; }.intro-band { display:block; }.intro-copy { padding:57px 25px 45px; }.intro-image { min-height:230px; }.outcome-note { padding:23px 25px; }.section-heading,.resource-section { display:block; }.section-heading > p { margin-top:18px; }.week-grid { grid-template-columns:1fr; }.week-card { min-height:200px; }.resource-section { padding:55px 25px; }.resource-list { margin-top:30px; }.resource-row { grid-template-columns:90px 1fr 16px; }.lesson-layout { display:block; }.lesson-nav { min-height:auto; padding:27px 22px; border-right:0; border-bottom:1px solid var(--line); }.lesson-nav nav { display:grid; grid-template-columns:1fr 1fr; }.lesson-nav nav a { padding-right:9px; }.nav-note { display:none; }.lesson-main { padding:42px 22px; }.markdown-content h2 { font-size:34px; }.markdown-content h3 { font-size:25px; }.markdown-content table { display:block; overflow:auto; }.markdown-content pre { font-size:11px; }.lesson-pager a { font-size:20px; } footer { padding:18px 22px; } }