@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#172820;background:#fafbf8;font-synthesis:none;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}header,main,footer{max-width:1240px;margin:auto}header{height:108px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dde3dc;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-family:Manrope,sans-serif;font-weight:800;font-size:23px}.brand .light{font-weight:500;margin-left:5px}.mark{display:grid;place-items:center;background:#214d3d;color:#dcf38a;border-radius:13px;width:44px;height:44px;font-size:35px;padding-bottom:5px}nav{display:flex;gap:30px;font-size:15px}.toplink{font-weight:600;border:1px solid #b5c0b6;padding:11px 20px;border-radius:30px}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:85px;padding:76px 0 80px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;margin:0 0 20px;color:#526b59}h1,h2,h3,p{margin-top:0}h1{font-family:Manrope,sans-serif;font-size:61px;line-height:1.13;letter-spacing:-2.7px;margin-bottom:25px;font-weight:800}h1 em{font-style:normal;color:#4c7851}.intro{font-size:17px;line-height:1.8;color:#637169;margin-bottom:28px}.primary{background:#234e3d;color:white;padding:17px 24px;border-radius:7px;display:inline-flex;gap:42px}.lesson{background:#dff093;border-radius:16px;padding:30px 33px 20px;position:relative;align-self:center;box-shadow:10px 10px 0 #ecf1df;transform:rotate(1deg)}.lesson-top{display:flex;justify-content:space-between;font-size:12px;font-weight:700;letter-spacing:1px;border-bottom:1px solid #b8cf74;padding-bottom:21px;margin-bottom:30px}.code-label{font-size:11px;letter-spacing:1px}.lesson h2{font:800 31px/1.25 Manrope,sans-serif;letter-spacing:-1px;margin-bottom:23px}.steps{display:grid;gap:9px;margin-bottom:25px}.steps div{padding:11px;background:#f8fbe0;border:1px solid #cfdf93;border-radius:6px;font-size:15px}.steps b{color:#658445;margin-right:20px;font-family:monospace}.lesson-button{width:100%;display:flex;justify-content:space-between;background:#224e3b;color:white;border:0;border-radius:6px;padding:14px 17px}.lesson-note{font-size:12px;text-align:center;margin:12px 0 0;color:#536338}.subjects{padding:45px 0 55px;border-top:1px solid #dce3d9}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:27px}.section-head .eyebrow{margin-bottom:13px}h2{font:800 32px/1.3 Manrope,sans-serif;letter-spacing:-1px;margin-bottom:0}.section-head>p{font-size:14px;color:#68766a;margin-bottom:6px}.subject-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}.subject-grid button{background:transparent;text-align:left;padding:23px 20px;border:1px solid #dce3d9;border-radius:9px;display:grid;gap:12px;color:inherit;transition:.2s}.subject-grid button:hover{background:#edf3df;transform:translateY(-4px)}.subject-icon{font:700 25px Manrope,sans-serif;color:#3c6650;margin-bottom:8px}.subject-grid strong{font-size:17px}.subject-grid button>span:last-child{font-size:13px;color:#657362}.resources{padding:55px 0 65px;border-top:1px solid #dce3d9}.search{display:flex;align-items:center;gap:10px;border:1px solid #d2dace;background:#fff;padding:13px 17px;border-radius:7px}.search input{border:0;outline:none;background:transparent;min-width:220px;font-size:14px}.search:focus-within{outline:2px solid #477951}.search>span{font-size:23px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:30px 0 25px}.filters button{border:1px solid #d7dfd4;padding:9px 16px;border-radius:30px;background:transparent;color:#536553;font-size:14px}.filters button.active{background:#244d3c;color:#fff;border-color:#244d3c}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{border:1px solid #dbe2d6;background:white;border-radius:10px;overflow:hidden;text-align:left;padding:0;color:inherit}.card:hover h3{text-decoration:underline}.card-art{height:150px;display:flex;align-items:center;justify-content:center;background:#e9efd8;gap:16px;font:600 22px monospace;color:#446643}.card:nth-child(2n) .card-art{background:#e2eaf3;color:#4d6381}.card:nth-child(3n) .card-art{background:#f1e7dc;color:#896e53}.card-art span{padding:15px;border:1px solid currentColor;border-radius:7px}.card-body{padding:23px}.meta{font-size:12px;color:#648064;display:flex;justify-content:space-between;margin-bottom:15px}.card h3{font:800 21px/1.4 Manrope,sans-serif;letter-spacing:-.5px;margin-bottom:12px}.card p{font-size:15px;line-height:1.6;color:#6c776b;margin-bottom:19px}.card-bottom{font-size:13px;color:#4e6e51;display:flex;justify-content:space-between}.teacher{margin-bottom:65px;border-radius:12px;background:#244d3c;color:#fff;padding:45px 50px;display:flex;justify-content:space-between;gap:30px}.teacher .eyebrow{color:#c5df87}.teacher p:last-child{font-size:16px;line-height:1.7;color:#cad7cc;margin:17px 0 0}.teacher button{background:#365c4b;border:1px solid #66806f;color:white;border-radius:8px;text-align:left;padding:25px 30px;display:grid;gap:20px;min-width:340px}.teacher button span{font-size:12px;letter-spacing:.7px}.teacher strong{font-size:23px;line-height:1.4}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:30px 0;border-top:1px solid #dce3d9}footer .brand{font-size:18px}footer p,footer>span{font-size:12px;color:#6d796b;margin:0}dialog{border:1px solid #d3ddce;border-radius:15px;padding:40px;max-width:700px;width:90%;max-height:85vh;color:#243c2b;line-height:1.8}dialog::backdrop{background:#142c25aa;backdrop-filter:blur(4px)}dialog h2{padding-right:30px;margin-bottom:20px}dialog h3{margin:24px 0 8px}dialog li{margin-bottom:9px}#close{position:absolute;right:15px;top:12px;background:transparent;border:0;font-size:24px}.answers{display:grid;gap:10px}.answers button{padding:12px;border:1px solid #adbfa4;border-radius:6px;background:#f0f5e8;text-align:left}.feedback{font-weight:700;margin-top:16px}button:focus-visible,a:focus-visible{outline:3px solid #8aab4b;outline-offset:4px}[hidden]{display:none!important}@media(max-width:1300px){header,main,footer{margin-left:40px;margin-right:40px}}@media(max-width:900px){nav{gap:15px}h1{font-size:46px}.hero{gap:35px}.subject-grid{grid-template-columns:repeat(3,1fr)}.cards{grid-template-columns:repeat(2,1fr)}.teacher{padding:30px}.teacher button{min-width:280px}footer p{display:none}}@media(max-width:600px){header,main,footer{margin-left:20px;margin-right:20px}header{height:90px;flex-wrap:wrap;gap:0;padding:12px 0}.brand{font-size:19px}.mark{width:34px;height:34px;font-size:28px}nav{order:3;width:100%;justify-content:space-between;font-size:12px;margin-top:8px}.toplink{padding:7px 13px;font-size:13px}.hero{grid-template-columns:1fr;padding:40px 0;gap:35px}h1{font-size:46px;letter-spacing:-2px}.intro{font-size:16px}.lesson{padding:24px;transform:none}.subjects,.resources{padding:35px 0}.section-head{display:block}.section-head>p{margin-top:15px}h2{font-size:27px}.subject-grid{grid-template-columns:repeat(2,1fr);gap:10px}.subject-grid button{padding:17px}.subject-grid button:last-child{grid-column:span 2}.subject-icon{margin-bottom:0}.search{margin-top:22px}.cards{grid-template-columns:1fr}.card-art{height:140px}.teacher{flex-direction:column;padding:25px;margin-bottom:35px}.teacher button{min-width:0;padding:23px}footer{flex-direction:column;align-items:start;padding:25px 0;gap:15px}dialog{padding:28px 22px}.filters{gap:6px}.filters button{padding:8px 12px}}
