/* hangul.name */
/* Colors: #F4F1EB, #1E1E1E, #2B2B2B, #C8BFA8, #3D6B50, #7A8B6F, #E8E3D9, #B85C38 */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Noto Sans KR', sans-serif; font-weight: 300; font-size: 16px; line-height: 1.85; background: #F4F1EB; color: #1E1E1E; overflow-x: hidden; }
.site-header { position: fixed; top: 0; left: 0; padding: 20px 32px; z-index: 10; }
.header-name { font-family: 'DM Sans', sans-serif; font-weight: 500; font-size: 14px; color: #7A8B6F; letter-spacing: 0.04em; }
.chapter { display: grid; grid-template-columns: 38% 62%; min-height: 80vh; padding: 80px 40px; }
.chapter-left { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.jamo { font-family: 'Black Han Sans', sans-serif; font-size: clamp(6rem, 15vw, 14rem); color: #2B2B2B; line-height: 1; }
.jamo-label { font-family: 'DM Mono', monospace; font-size: 12px; color: #7A8B6F; letter-spacing: 0.06em; margin-top: 16px; }
.chapter-right { display: grid; grid-template-columns: 1fr; gap: 32px; align-content: center; padding: 40px; }
.module { max-width: 520px; }
.module-title { font-family: 'DM Sans', sans-serif; font-weight: 500; font-size: clamp(1.2rem, 2.5vw, 1.8rem); color: #1E1E1E; margin-bottom: 12px; }
.module-text { color: #1E1E1E; font-weight: 300; }
.module-text em { font-weight: 500; color: #3D6B50; }
.breath { height: 80px; background: #E8E3D9; }
.site-footer { text-align: center; padding: 60px 40px; background: #F4F1EB; }
.site-footer p { font-family: 'DM Sans', sans-serif; font-size: 14px; color: #C8BFA8; }
@media (max-width: 768px) { .chapter { grid-template-columns: 1fr; text-align: center; } .jamo { font-size: 50vw; } .chapter-right { padding: 20px; } }