*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Inter,Arial,sans-serif;color:#333;line-height:1.6;background:#fff}
header{background:#12355B;position:sticky;top:0;z-index:1000}
.wrap{max-width:1100px;margin:auto;padding:20px}
header .wrap{display:flex;justify-content:space-between;align-items:center}
header h2{color:#fff;font-family:Poppins,sans-serif}
nav a{color:#fff;text-decoration:none;margin-left:24px}
nav a:hover{color:#9fe3e3}

.hero{
background:linear-gradient(rgba(18,53,91,.65),rgba(18,53,91,.65)),url("images/hero.jpg");
background-size:cover;
background-position:center;
background-repeat:no-repeat;
min-height:80vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#fff;
padding:40px;
}
.hero h1{font-family:Poppins,sans-serif;font-size:3rem;margin-bottom:20px}
.hero p{max-width:700px;margin:0 auto 30px}

.btn{
display:inline-block;
background:#00A6A6;
color:#fff;
padding:14px 28px;
border-radius:30px;
text-decoration:none;
font-weight:600;
}
.btn:hover{background:#008b8b}

section{padding:70px 20px}
h2{font-family:Poppins,sans-serif;color:#12355B;margin-bottom:25px}

.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:24px;
margin-top:30px;
}
article{
background:#fff;
padding:24px;
border-radius:12px;
box-shadow:0 6px 18px rgba(0,0,0,.1);
}
article h3{color:#12355B;margin-bottom:10px}

.section-image{
width:100%;
max-width:900px;
display:block;
margin:25px auto;
border-radius:12px;
box-shadow:0 8px 20px rgba(0,0,0,.15);
}

.contact{
background:#f4f7fb;
text-align:center;
}
.contact a{color:#12355B;font-weight:600;text-decoration:none}

footer{
background:#12355B;
color:#fff;
text-align:center;
padding:20px;
}

@media(max-width:768px){
header .wrap{flex-direction:column;gap:12px}
nav a{margin:0 10px}
.hero h1{font-size:2.2rem}
}