*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f8fb;color:#123}
.topbar{height:72px;background:#073b4c;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 35px;position:sticky;top:0;z-index:99}
.brand{font-size:22px;font-weight:800}
nav a{color:white;text-decoration:none;margin:0 10px;font-weight:600}
.erp-btn{background:#ffd166;color:#073b4c!important;padding:10px 16px;border-radius:8px}
.hero{min-height:520px;background:linear-gradient(120deg,#006d77,#118ab2);display:flex;align-items:center;padding:60px 8%;color:white}
.hero-content{max-width:700px}
.hero h1{font-size:52px;margin:0 0 15px;font-weight:900}
.hero p{font-size:20px;line-height:1.6}
.btn{display:inline-block;background:#ef476f;color:white;padding:13px 22px;border-radius:8px;text-decoration:none;font-weight:700;margin:8px 8px 8px 0}
.btn.light{background:white;color:#073b4c}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:30px 8%;margin-top:-55px}
.stats div{background:white;border-radius:14px;padding:25px;text-align:center;box-shadow:0 10px 25px #0002}
.stats h2{color:#118ab2;margin:0}
.section{padding:65px 8%;text-align:center}
.section h2{font-size:36px;margin-bottom:20px;color:#073b4c}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;text-align:left}
.card{background:white;padding:25px;border-radius:14px;box-shadow:0 8px 22px #0001;border-top:5px solid #118ab2}
.card h3{color:#073b4c}
.blue{background:#e8f6fb}
.contact{background:white}
footer{background:#073b4c;color:white;text-align:center;padding:22px}

@media(max-width:800px){
.topbar{height:auto;display:block;padding:18px}
nav{margin-top:12px}
nav a{display:inline-block;margin:6px}
.hero h1{font-size:34px}
.stats,.cards{grid-template-columns:1fr}
}