
*{box-sizing:border-box;font-family:Arial,sans-serif}
body{margin:0;color:#222}
header{display:flex;justify-content:space-between;align-items:center;padding:20px 8%;background:#fff;position:sticky;top:0}
.logo{font-size:28px;font-weight:900;color:#12604c}
nav a{margin-left:20px;text-decoration:none;color:#222}
.hero{min-height:550px;padding:100px 8%;display:flex;align-items:center;color:#fff;background:linear-gradient(#0008,#0008),url('https://images.unsplash.com/photo-1504307651254-35680f356dfd') center/cover}
.hero h1{font-size:52px;max-width:700px}
.hero p{font-size:20px}
.btn,.card a{background:#12604c;color:white;padding:14px 22px;border-radius:8px;text-decoration:none;display:inline-block}
section{padding:70px 8%}
h2{text-align:center;font-size:34px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}
.card{box-shadow:0 5px 20px #ddd;border-radius:15px;overflow:hidden;padding-bottom:25px}
.card img{width:100%;height:220px;object-fit:cover}
.card h3,.card p{padding:0 20px}
.card a{margin-left:20px}
.dark{background:#102a2b;color:white}
.features{display:flex;justify-content:center;gap:30px;flex-wrap:wrap}
footer{background:#0b1e1d;color:white;padding:30px;text-align:center}
.wa{position:fixed;right:20px;bottom:20px;background:#25d366;color:white;padding:15px 25px;border-radius:30px;text-decoration:none}
@media(max-width:800px){.grid{grid-template-columns:1fr}.hero h1{font-size:34px}}
