:root { font: 16px system-ui, sans-serif; color: #17191c; background: #fff; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; }
header { display: flex; align-items: center; justify-content: space-between; max-width: 1100px; margin: 0 auto; padding: 25px 28px; }
a { text-decoration: none; }
.brand { display: inline-flex; align-items: center; gap: 9px; color: #17191c; font-size: 19px; font-weight: 650; }
.brand img { display: block; border-radius: 8px; }
nav { display: flex; gap: 18px; }
nav a { color: #6d737a; font-size: 14px; }
main { max-width: 1100px; margin: 0 auto; padding: clamp(100px, 19vh, 190px) 28px 80px; }
.eyebrow { margin: 0 0 18px; color: #697079; font-size: 14px; }
h1 { margin: 0; font-size: clamp(60px, 11vw, 112px); font-weight: 650; letter-spacing: -0.085em; line-height: .96; }
.intro { margin: 26px 0 28px; color: #62676e; font-size: 18px; line-height: 1.55; }
.start { display: inline-flex; align-items: center; min-height: 48px; padding: 0 19px; border-radius: 6px; background: #178447; color: #fff; font-size: 15px; font-weight: 550; }
.start:hover { background: #116d39; }
.number { margin: 13px 0 0; color: #777d83; font-size: 13px; }
.pricing { display: grid; grid-template-columns: repeat(2, minmax(0, 260px)); gap: 12px; margin-top: 32px; }
.pricing a { display: grid; gap: 5px; padding: 13px 14px; border: 1px solid #e5e7e9; border-radius: 6px; }
.pricing strong { color: #17191c; font-size: 13px; font-weight: 600; }
.pricing span { color: #697079; font-size: 12px; }
.legal-link { display: inline-block; margin-top: 18px; color: #777d83; font-size: 13px; }
@media (max-width: 600px) { header { padding: 20px 20px; } main { padding: 100px 20px 72px; } .intro { max-width: 310px; } .pricing { grid-template-columns: 1fr; max-width: 310px; } }