*{box-sizing:border-box;margin:0;padding:0;font-family:system-ui,sans-serif}
body{color:#0f172a;background:#fff;line-height:1.75}
.container{max-width:1120px;margin:auto;padding:0 20px}

.header{background:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0}
.nav{display:flex;justify-content:space-between;align-items:center;padding:14px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.25rem}
.logo-icon{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#10b981,#0f766e)}

.btn{display:inline-block}
.btn-primary{background:linear-gradient(135deg,#10b981,#0f766e);color:#fff;padding:13px 26px;border-radius:999px;font-weight:600}

.hero{padding:80px 0}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:50px;align-items:center}
.hero h1{font-size:2.6rem;margin-bottom:18px}
.hero h1 span{color:#0f766e}
.hero p{color:#475569;margin-bottom:16px}

.badge{display:inline-block;background:#ecfdf5;color:#047857;padding:6px 14px;border-radius:999px;font-size:.8rem;font-weight:600;margin-bottom:14px}

.card{border:1px solid #e5e7eb;border-radius:20px;padding:28px}
.card ul{padding-left:18px}
.card li{margin-bottom:10px;color:#475569}

.section{padding:90px 20px;text-align:center}
.section.light{background:#f9fafb}
.section h2{font-size:2.2rem;margin-bottom:14px}
.section p.desc{max-width:760px;margin:0 auto 50px;color:#475569}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:26px}
.box{border:1px solid #e5e7eb;border-radius:20px;padding:28px;text-align:left}
.box h3{margin-bottom:10px}

.cta{background:#ecfdf5;padding:60px;border-radius:26px}
.cta p{color:#475569;margin:14px auto 26px;max-width:720px}

footer{background:#020617;color:#cbd5e1;text-align:center;padding:28px;font-size:.9rem}

@media(max-width:768px){
.hero-grid{grid-template-columns:1fr}
.hero h1{font-size:2rem}
}