:root { color-scheme: dark; }
body { background: radial-gradient(circle at 14% -8%, #24355d 0, transparent 30rem), radial-gradient(circle at 88% 12%, #173d39 0, transparent 28rem), #080b12; color: #edf2ff; }
body header { background: #0b0f18cc; border-bottom: 1px solid #ffffff14; backdrop-filter: blur(16px); }
body header a, body footer a { color: #edf2ff; } body header nav a { color: #aeb9cf; } body header nav a:hover { color: #72e6c7; } body .brand span { background: #7c5cff; color: white; }
.learn { max-width: 1180px; margin: auto; padding: 0 1rem 5rem; display: flex; flex-direction: column; }
.learn-hero { padding: 6rem 0 3rem; max-width: 850px; order: 0; }.learn-hero h1 { font-size: clamp(3.2rem, 8vw, 6.5rem); line-height: .96; margin: .2em 0; letter-spacing: -.065em; }.learn-hero em { color: #76e7c8; font-style: normal; }.learn-hero > p:last-child { color: #b6c0d4; font-size: 1.08rem; max-width: 42rem; }.learn .eyebrow { color: #9f8cff; letter-spacing: .15em; font-weight: 800; }
.notice { position: relative; overflow: hidden; background: linear-gradient(135deg, #191d31, #101725); color: #eef3ff; border: 1px solid #ffffff18; border-radius: 22px; padding: 2rem; margin-top: 2rem; box-shadow: 0 20px 70px #00000042; order: 1; }.notice::before { content: "START HERE"; color: #72e6c7; font-size: .67rem; font-weight: 800; letter-spacing: .16em; }.notice h2 { margin: .65rem 0 .75rem; font-size: clamp(1.7rem, 3vw, 2.25rem); }.notice p { max-width: 70rem; color: #bfc9dc; }.notice b, .notice strong { color: #f1f5ff; }
.lesson-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 2rem 0 0; }.lesson { position: relative; min-height: 13.5rem; background: linear-gradient(145deg, #151a29, #0d121d); border: 1px solid #ffffff14; border-radius: 18px; padding: 1.5rem; box-shadow: 0 12px 35px #0000002b; scroll-margin-top: 80px; transition: transform .18s ease, border-color .18s ease; }.lesson:hover { transform: translateY(-3px); border-color: #72e6c755; }.lesson h2 { color: #f3f6ff; font-size: 1.4rem; margin: .15rem 0 .85rem; letter-spacing: -.025em; }.lesson h2::before { content: "LEARN"; display: block; margin-bottom: .55rem; color: #9f8cff; font-size: .63rem; font-weight: 800; letter-spacing: .13em; }.lesson p { color: #b6c0d4; line-height: 1.6; }.lesson b { color: #ecf3ff; }.lesson.featured { grid-column: span 2; background: linear-gradient(135deg, #26344f, #14272a); border-color: #72e6c744; }.lesson.featured h2::before { color: #72e6c7; }.caveat { border-left: 3px solid #72e6c7; padding-left: 1rem; color: #d7e0ef !important; }
#business { order: 2; } #balance { order: 3; } #valuation { order: 4; } #listing-basics { order: 5; } #technical { order: 6; }.learn aside.notice { order: 7; margin-top: 2rem; }.learn aside.notice::before { content: "REMEMBER"; }.lesson-grid#listing-basics #peer-pe { order: -3; }.lesson-grid#listing-basics #book-value { order: -2; }.lesson-grid#listing-basics #face-value { order: -1; } body footer { border-top-color: #ffffff14; color: #95a3bc; }
@media (max-width: 760px) { .learn-hero { padding-top: 4rem; }.lesson-grid { grid-template-columns: 1fr; }.lesson.featured { grid-column: auto; }.lesson { min-height: auto; } }