@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--ink:#142530;--paper:#fbfaf7;--muted:#64737b;--accent:#0c807a;--line:#e7e9e6}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.7 'DM Sans',system-ui,sans-serif}a{color:var(--accent)}a:focus-visible{outline:3px solid #ffac46;outline-offset:4px}.skip{position:absolute;top:0;left:-999px;padding:12px;background:white;z-index:50}.skip:focus{left:12px}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;line-height:1.12;letter-spacing:-.045em}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(20px,5vw,80px);border-bottom:1px solid var(--line);background:#fbfaf7}.brand{color:var(--ink);text-decoration:none;font:600 20px 'Space Grotesk',sans-serif}.brand-mark{color:var(--accent)}.topbar nav{display:flex;gap:24px;align-items:center}.topbar nav a{text-decoration:none;color:#34434a;font-size:14px;font-weight:700}.topbar nav .nav-cta{padding:9px 16px;border:1px solid #bedbd6;border-radius:30px;color:var(--accent)}
.hero{background:#081d2b;color:white;min-height:640px;position:relative;overflow:hidden;display:grid;align-items:center}.hero-inner{padding:80px max(7vw,25px);position:relative;z-index:3;max-width:1000px}.eyebrow,.section-marker{color:#37af9f;font-size:12px;letter-spacing:.2em;font-weight:800}.hero .eyebrow{color:#6ce0cc}.hero h1{font-size:clamp(63px,9vw,134px);letter-spacing:-.065em;margin:26px 0 22px}.hero h1 em,.content-section h2 em{font-style:normal;color:#73ead0}.hero-lead{font-size:clamp(21px,2.4vw,31px);line-height:1.35;font-weight:500;margin:0 0 20px}.hero-copy{color:#c6dad9;font-size:17px;max-width:640px;line-height:1.75}.hero-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:33px}.button{display:inline-flex;align-items:center;gap:14px;padding:12px 22px;border-radius:7px;text-decoration:none;font-weight:800;font-size:15px}.button.primary{background:#72e3c7;color:#082934}.button.ghost{color:#fff;border:1px solid #7c9c9a}.hero-meta{display:flex;gap:26px;flex-wrap:wrap;margin-top:34px;color:#a4c7c5;font-size:12px;font-weight:700}
.hero-art{position:absolute;inset:0 0 0 49%;opacity:.75;background:radial-gradient(circle at 65% 52%,#12535a 0,transparent 55%)}.hero-art:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#081d2b 2%,transparent 75%);z-index:2}.orbit{position:absolute;border:1px solid #63b6aa59;border-radius:50%;width:480px;height:480px;top:19%;left:20%;transform:rotate(-25deg)}.orbit-two{width:650px;height:650px;left:8%;top:7%;border-color:#4f9c9650}.node{position:absolute;z-index:1;border-radius:50%;display:grid;place-items:center;background:#71e3c5;color:#062936;font:800 18px 'Space Grotesk';width:65px;height:65px}.node-one{left:13%;top:23%}.node-two{left:73%;top:18%;width:86px;height:86px}.node-three{left:71%;top:73%}.hero-code{position:absolute;left:20%;top:29%;z-index:1;transform:rotate(-5deg);white-space:nowrap;font:500 clamp(15px,1.5vw,21px)/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;color:#ebfff9;background:#122e38b8;border:1px solid #6de2c047;padding:26px 30px;border-radius:12px;box-shadow:0 20px 80px #001a2650}.hero-code span{color:#7bddbe}.hero-code b{color:#85f5cb;font-weight:500}
.content-layout{max-width:1280px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:min(8vw,110px);margin:auto;padding:54px 30px}.sidebar{font-size:13px}.sticky{position:sticky;top:28px;display:flex;flex-direction:column;gap:8px}.sticky small{font-size:11px;letter-spacing:.17em;font-weight:800;color:#88959a;margin-bottom:15px}.sticky a{text-decoration:none;color:#52636b;padding:5px 0}.sticky a:hover{color:#047c72}.side-note{margin-top:25px;padding:20px;background:#eff4ef;color:#3d766b;border-left:3px solid #6dbfb0;font-weight:700;line-height:1.7}.content{min-width:0}.content-section{padding:30px 0 74px;scroll-margin-top:22px}.content-section+.content-section{border-top:1px solid var(--line)}.content-section h2{font-size:clamp(41px,5vw,67px);margin:19px 0 23px}.content-section h2 em{color:#008f81}.section-intro{font-size:19px;color:#4d6168;max-width:690px;margin:0 0 38px}
.chapter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.chapter-card{min-height:306px;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);border:1px solid #e1e7e3;border-radius:10px;background:#fff;padding:25px 25px 22px;transition:transform .2s,box-shadow .2s,border-color .2s}.chapter-card:hover,.chapter-card:focus-visible{transform:translateY(-3px);border-color:#8fcab9;box-shadow:0 12px 32px #11282a0e}.card-top{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:11px;letter-spacing:.13em;font-weight:800;color:#50897d}.card-tag{color:#61777d;background:#f1f5f1;border-radius:20px;padding:4px 8px;font-size:10px;letter-spacing:.04em;white-space:normal;text-align:right}.card-icon{font:700 42px 'Space Grotesk';height:65px;color:#0b897b;padding-top:12px}.chapter-card h3{font-size:27px;margin:12px 0}.chapter-card p{font-size:15px;line-height:1.65;color:#52636b;margin:0 0 20px}.card-footer{margin-top:auto;border-top:1px solid #e9efeb;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:#698078}.card-footer strong{font-size:13px;color:#087d73}.chapter-card.interactive{background:#eaf5f0;border-color:#bfddd0}.chapter-card.sudoku{background:#e8f2f2}.sudoku-symbol{padding-top:7px;display:grid;grid-template-columns:repeat(3,17px);grid-template-rows:repeat(3,17px);gap:1px;height:65px;width:55px}.sudoku-symbol span{display:grid;place-items:center;font:700 12px 'Space Grotesk';background:#fff;color:#087a75;border:1px solid #99c6c0}.chapter-note{font-size:13px;color:#6b7e80;margin-top:19px}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:35px}.steps>div{border-top:3px solid #8bcebf;padding-top:20px}.step-number{font-size:13px;letter-spacing:.16em;font-weight:800;color:#078477}.steps h3{font-size:25px;margin:14px 0 12px}.steps p{font-size:15px;color:#52636b;margin:0}.about{background:#eaf4ef;border:0!important;padding:44px;border-radius:12px;margin-bottom:65px}.about h2{margin-top:15px}.about p{color:#344f51;max-width:660px}.about-link{font-weight:800;font-size:15px}.footer{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding:30px clamp(20px,5vw,80px);color:#60757c;font-size:13px}.footer span:first-child{font-weight:800;color:var(--ink)}
@media(max-width:1050px){.hero-art{opacity:.35;left:40%}.content-layout{gap:45px;grid-template-columns:180px minmax(0,1fr)}}@media(max-width:780px){.topbar nav{gap:12px}.topbar nav a{font-size:12px}.topbar nav a:nth-child(2){display:none}.hero{min-height:630px}.hero-inner{padding:85px 26px}.hero-art{inset:0;opacity:.19}.hero-code{left:24%;top:26%}.content-layout{display:block;padding:30px 22px}.sidebar{display:none}.chapter-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.about{padding:27px}.content-section{padding-bottom:55px}}@media(max-width:430px){.brand{font-size:16px}.topbar nav a:first-child{display:none}.hero h1{font-size:62px}.hero-meta{gap:12px}.hero-copy{font-size:16px}.button{width:100%;justify-content:center}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
