:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #17211b; background: #f4f7f4; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: inherit; }
header, main, footer { width: min(1040px, calc(100% - 40px)); margin: 0 auto; }
header { display: flex; align-items: center; justify-content: space-between; padding: 28px 0; }
.brand { font-size: 1.25rem; font-weight: 800; text-decoration: none; }
nav { display: flex; gap: 20px; font-size: .94rem; }
main { min-height: calc(100vh - 170px); }
.hero { padding: 110px 0 90px; max-width: 760px; }
.eyebrow { color: #39714f; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .78rem; }
h1 { margin: 12px 0 20px; font-size: clamp(2.8rem, 8vw, 5.6rem); line-height: .98; letter-spacing: -.055em; }
h2 { margin-top: 42px; }
.lead { font-size: clamp(1.15rem, 2vw, 1.45rem); line-height: 1.55; color: #435148; }
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 44px; }
.card, .legal { background: white; border: 1px solid #dce5de; border-radius: 18px; padding: 24px; box-shadow: 0 12px 35px rgba(36, 63, 45, .06); }
.card p, .legal p, .legal li { color: #526057; line-height: 1.65; }
.legal { max-width: 800px; margin: 54px auto; }
.button { display: inline-block; margin-top: 20px; border-radius: 10px; padding: 12px 18px; background: #17211b; color: white; text-decoration: none; font-weight: 700; }
footer { border-top: 1px solid #dce5de; padding: 24px 0 36px; color: #69756d; font-size: .9rem; }
@media (max-width: 720px) { header { align-items: flex-start; gap: 20px; } nav { flex-wrap: wrap; justify-content: flex-end; } .hero { padding-top: 70px; } .features { grid-template-columns: 1fr; } }