:root { color-scheme: light; --haldi: #FFC21A; --baingan: #2A0E3D; --malai: #FFF7E8; --raakh: #6E6475; }
* { box-sizing: border-box; margin: 0; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--malai); color: var(--baingan); font-family: "Bricolage Grotesque", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
header { background: var(--haldi); padding: calc(16px + env(safe-area-inset-top)) 20px 22px; }
header .home { display: block; width: max-content; padding: 4px 0 10px; }
header .logo { display: block; height: 28px; aspect-ratio: 800 / 288; background: var(--baingan); -webkit-mask: url(/brand/wordmark.svg) no-repeat center / contain; mask: url(/brand/wordmark.svg) no-repeat center / contain; }
header a { display: inline-block; font-size: 15px; font-weight: 800; color: var(--baingan); text-decoration: none; padding: 6px 0; }
h1 { margin-top: 14px; font-size: 34px; font-weight: 800; letter-spacing: -0.045em; line-height: 1.02; }
header p { margin-top: 8px; font-size: 14px; font-weight: 600; }
main { max-width: 680px; margin: 0 auto; padding: 8px 20px calc(40px + env(safe-area-inset-bottom)); }
h2 { margin-top: 28px; font-size: 20px; font-weight: 800; letter-spacing: -0.03em; }
p, li { margin-top: 10px; font-size: 16px; line-height: 1.55; font-weight: 500; }
ul { padding-left: 20px; }
strong { font-weight: 800; }
.note { margin-top: 18px; padding: 12px 14px; border-radius: 14px; background: #FFF0C7; font-size: 14.5px; font-weight: 600; }