* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; line-height: 1.55; color: #1c2430; background: #f6f8fb; }
.hero { background: #12355b; color: #fff; padding: 3rem 1.25rem; text-align: center; }
.hero h1 { margin: 0 0 .75rem; font-size: 2.2rem; }
.hero .lead { max-width: 42rem; margin: 0 auto 1rem; font-size: 1.25rem; }
.hero p { max-width: 42rem; margin-left: auto; margin-right: auto; }
main, footer { max-width: 60rem; margin: 0 auto; padding: 1rem 1.25rem; }
section { margin: 2rem 0; }
h2 { color: #12355b; }
a { color: #0b5cad; }
.btn { display: inline-block; background: #f2a900; color: #1c2430; font-weight: 700; padding: .7rem 1.2rem; border-radius: 6px; text-decoration: none; }
.tiers { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; }
.tier { background: #fff; border: 1px solid #d5dde8; border-radius: 8px; padding: 1.25rem; }
.tier h3 { margin-top: 0; }
.price { font-size: 2rem; font-weight: 700; margin: .25rem 0; }
.note { font-size: .95rem; color: #46515f; }
.q { background: #fff; border: 1px solid #d5dde8; border-radius: 8px; padding: 1rem 1.25rem; margin: 1rem 0; }
.q h3 { margin: 0 0 .5rem; font-size: 1rem; color: #46515f; }
.stem { font-weight: 600; }
footer { border-top: 1px solid #d5dde8; font-size: .92rem; color: #333d4a; margin-top: 2rem; }
footer h2 { font-size: 1.1rem; }