body{background:#f3eee4;color:#203532}.topbar{max-width:1240px;height:84px;padding:0 30px}.brand{color:#203532}.brand b{color:#d96e4d;font-weight:400}.brand-mark{width:37px;height:37px;display:grid;place-items:center;color:white;background:#e87751;border-radius:10px;transform:rotate(-10deg);font-size:26px}.top-note{font-size:12px}main{max-width:1240px;padding:0 30px 55px}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:540px;background:#153b39;border-radius:24px;overflow:hidden;color:#fff}.intro{max-width:none;margin:0;padding:73px 55px 55px 25px;position:relative;z-index:2}.eyebrow{background:transparent;border:0;padding:0;color:#bad5c7;border-radius:0}.dot{background:#f1ba83}.intro h1{font-size:clamp(48px,5.6vw,75px);line-height:1.43;margin:22px 0;letter-spacing:-2px}.intro h1 em{color:#f4bd87;white-space:nowrap}.intro p{color:#d0dfd9;font-size:16px;line-height:2.2;max-width:450px}.hero-cta{display:inline-flex;gap:35px;align-items:center;margin-top:27px;background:#f6d991;color:#1d3933;border-radius:10px;padding:15px 21px;font-size:14px;font-weight:800;box-shadow:5px 5px 0 #0d2b28}.hero-cta:hover{transform:translateY(-2px)}.lesson-art{position:relative;min-height:540px;background:#1b4642}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff0c 1px,transparent 1px),linear-gradient(90deg,#ffffff0c 1px,transparent 1px);background-size:35px 35px}.art-caption{position:absolute;top:34px;right:45px;color:#c1d9ca;font-size:12px}.art-star{position:absolute;top:73px;left:22%;color:#f1b98a;font-size:40px}.note{position:absolute;display:flex;flex-direction:column;gap:13px;padding:20px 22px;color:#254038;border-radius:10px;box-shadow:14px 16px 0 #092c2966}.note small{font-weight:800;font-size:11px}.note strong{font-size:24px}.note span{font-size:11px}.note-math{background:#f7dfac;width:265px;top:105px;right:14%;transform:rotate(7deg);z-index:3}.note-math strong{font-family:Georgia,serif;direction:ltr;text-align:left;font-size:29px}.note-chem{background:#e7a790;width:220px;top:252px;left:6%;transform:rotate(-9deg);z-index:4}.note-chem strong{font-family:Georgia,serif;direction:ltr;text-align:left}.note-literature{background:#e5e8ce;width:260px;bottom:65px;right:11%;transform:rotate(5deg);z-index:5}.note-literature strong{font-size:17px}.workspace{background:#fffcf6;border:1px solid #e7dfd1;box-shadow:0 14px 35px #4a38210c;margin-top:75px}.step{color:#d97753}.badge{background:#f2eee1;color:#667c6c}.subject-strip{display:flex;align-items:center;flex-wrap:wrap;gap:9px;border-bottom:1px solid #eae4d9;padding:25px 0;margin-top:4px}.subject-strip>span{color:#7e8d80;font-size:12px;margin-left:7px}.subject-strip button{min-width:0;padding:8px 13px;border:1px solid #d9e3da;border-radius:50px;background:#eef5ee;color:#4a715d;font-size:12px;font-weight:700;cursor:pointer}.subject-strip button:hover,.subject-strip button.active{background:#d8eada;border-color:#91b69e}select,textarea{background:#fff;border-color:#dddcd0}select:focus,textarea:focus{border-color:#4d9974;box-shadow:0 0 0 3px #6aad9129}button#submit{background:#e77751;border-radius:10px}button#submit:hover{background:#ce6545}.result{border-color:#dfdfd1}.footnote span{color:#e77751}footer{border-color:#ded8ca}@media(max-width:900px){.hero{grid-template-columns:1fr}.intro{padding:55px 45px 42px}.lesson-art{min-height:350px}.note-math{top:45px;right:16%}.note-chem{top:135px;left:12%}.note-literature{bottom:25px;right:18%}}@media(max-width:600px){.topbar{height:68px;padding:0 18px}.brand{font-size:16px}.brand-mark{width:30px;height:30px;font-size:21px}.top-note{display:none}main{padding:0 12px 40px}.hero{border-radius:17px}.intro{padding:39px 24px 31px}.intro h1{font-size:45px;letter-spacing:-1px}.intro h1 em{white-space:normal}.intro p{font-size:14px}.hero-cta{padding:13px 16px}.lesson-art{min-height:310px}.note{padding:12px 15px;gap:8px}.note-math{width:200px;top:34px;right:8%}.note-math strong{font-size:22px}.note-chem{width:174px;top:127px;left:3%}.note-chem strong{font-size:18px}.note-literature{width:210px;right:8%;bottom:18px}.note-literature strong{font-size:14px}.art-caption{top:12px;right:16px;font-size:10px}.workspace{margin-top:47px}.subject-strip>span{width:100%;margin-bottom:3px}}
