:root{
  --bg:#f8fafc; --card:#ffffff; --text:#1f2937; --muted:#6b7280; --primary:#22c55e; --primary-dark:#16a34a; --ring:#d1fae5;
  --radius:20px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; background:var(--bg); color:var(--text); line-height:1.6; letter-spacing: 0.3px}
a{color:inherit; text-decoration:none}
.container{max-width:1100px; margin:0 auto; padding: 20px 0}
.flex-between{display:flex; align-items:center; justify-content:space-between; gap:12px}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:20px}
.grid-3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px}
@media (max-width:900px){.grid-2,.grid-3{grid-template-columns:1fr} .nav{display:flex; gap:12px; flex-wrap:wrap} .hero{grid-template-columns:1fr}}
.site-header{background:var(--card); border-bottom:1px solid #e5e7eb; position:sticky; top:0; z-index:50}
.brand{font-weight:800; font-size:22px}
.accent{color:var(--primary)}
.nav a{padding:10px 12px; border-radius:999px}
.nav a:hover{background:#f1f5f9}
.site-footer{margin-top:40px; background:var(--card); border-top:1px solid #e5e7eb}
.card{background:var(--card); border-radius:var(--radius); box-shadow:0 4px 14px rgba(0,0,0,.06); padding:20px; margin: 20px auto}
.center{text-align:center}
.btn{display:inline-block; padding:12px 18px; border-radius:999px; font-weight:700; border:1px solid #e5e7eb}
.btn-primary{background:var(--primary); color:#fff; border-color:transparent}
.btn-primary:hover{background:var(--primary-dark)}
.btn-ghost{background:transparent}
.hero{display:grid; grid-template-columns:1.2fr .8fr; align-items:center; gap:20px}
.hero-icons{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.ico, .icon-circle svg{width:60px; height:60px; stroke:none; fill:var(--primary);}
.icon-circle{width:64px; height:64px; border-radius:999px; background:var(--ring); display:grid; place-items:center; margin:0 auto 10px}
.icon-circle svg{width:32px; height:32px}
h1{font-size:2rem; line-height:1.2; margin:0 0 8px}
h2{font-size:1.5rem; margin:0 0 8px; color:var(--primary-dark)}
h3{margin:.2rem 0 .5rem 0}
ul.bullets{padding-left:18px}
ul.bullets li{margin:.25rem 0}
.pricing{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
.price-card{border:1px solid #e5e7eb; border-radius:var(--radius); padding:18px; background:var(--card)}
.price-card.featured{outline:3px solid var(--ring)}
.price{font-size:1.6rem; font-weight:800}
.mt-16{margin-top:16px}
.right{text-align:right}
.sep{opacity:.5; margin:0 8px}
.post-list{list-style:none; padding:0; margin:0}
.post-list li{padding:10px 0; border-bottom:1px dashed #e5e7eb}
.badges{display:flex; gap:12px; flex-wrap:wrap}
.badge{background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; padding:6px 10px; border-radius:999px; font-weight:600; font-size:.9rem}
.kv{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.kv div{background:#f1f5f9; border-radius:12px; padding:12px}
.faq dt{font-weight:700; margin-top:10px}
.faq dd{margin:0 0 10px 0; color:var(--muted)}
img{max-width:100%; height:auto; border-radius:16px}