:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #102a43; background: #f4f8fa; }
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(circle at 0% 0%, #d9f2ed 0, transparent 34rem), linear-gradient(180deg, #f7fbfc, #edf4f7); }
a { color: #12685b; text-underline-offset: .16em; }
a:hover { color: #074c43; }
.shell { width: min(100% - 2rem, 920px); margin: 0 auto; }
header { display: flex; gap: 1rem; align-items: center; justify-content: space-between; padding: 1.15rem 0; border-bottom: 1px solid #d6e3e5; }
.brand { color: #102a43; font-weight: 800; text-decoration: none; letter-spacing: -.02em; }
.brand::before { content: ""; display: inline-block; width: .8rem; height: .8rem; margin-right: .5rem; border-radius: 50%; background: #16816f; }
nav { display: flex; gap: 1rem; flex-wrap: wrap; font-size: .94rem; }
main { padding: 3.25rem 0 4rem; }
.card { background: rgba(255,255,255,.92); border: 1px solid #d6e3e5; border-radius: 1rem; padding: clamp(1.4rem, 4vw, 3rem); box-shadow: 0 12px 36px rgba(16,42,67,.08); }
.eyebrow { color: #16816f; font-weight: 800; text-transform: uppercase; letter-spacing: .11em; font-size: .74rem; margin: 0 0 .8rem; }
h1 { font-size: clamp(2rem, 6vw, 3.7rem); line-height: 1.03; letter-spacing: -.045em; margin: 0 0 1rem; }
h2 { font-size: 1.35rem; margin: 2rem 0 .65rem; letter-spacing: -.02em; }
p, li { color: #345269; font-size: 1.02rem; line-height: 1.65; }
.lead { font-size: 1.2rem; max-width: 48rem; }
.actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.6rem; }
.button { display: inline-block; background: #12685b; color: white; font-weight: 700; text-decoration: none; padding: .74rem 1rem; border-radius: .6rem; }
.button.secondary { background: transparent; color: #12685b; border: 1px solid #86b8af; }
.notice { border-left: 4px solid #16816f; background: #f0faf7; padding: .9rem 1rem; margin: 1.3rem 0; color: #23485a; }
footer { padding: 1.4rem 0 2.5rem; color: #567; font-size: .88rem; }
footer p { font-size: .88rem; }
@media (max-width: 620px) { .shell { width: min(100% - 1.25rem, 920px); } header { align-items: flex-start; flex-direction: column; } nav { gap: .7rem; } main { padding-top: 1.5rem; } .card { border-radius: .75rem; } }