*{margin:0;padding:0;box-sizing:border-box}
body{
font-family:Inter,system-ui,Arial;
background:#f4f7fb;
color:#0f172a;
line-height:1.6;
}
.container{width:90%;max-width:1200px;margin:auto}
header{background:#0b2a45;padding:18px 0;position:sticky;top:0;z-index:100}
.nav{display:flex;align-items:center;justify-content:space-between}
.logo{color:#fff;font-weight:700;font-size:20px;display:flex;align-items:center;gap:10px}
.logo-box{width:34px;height:34px;background:#1f4f73;display:flex;align-items:center;justify-content:center;border-radius:8px;color:white;font-weight:700}
nav ul{display:flex;gap:30px;list-style:none}
nav a{color:white;text-decoration:none;font-size:14px;opacity:.9}
.btn-primary{background:#2ea6ff;color:white;padding:10px 18px;border-radius:8px;text-decoration:none;font-size:14px;border:none}
.hero{background:linear-gradient(120deg,#0b2a45,#0c3c63);color:white;padding:120px 0 80px}
.hero h1{font-size:52px;font-weight:700;margin-bottom:20px}
.hero span{color:#38bdf8}
.hero p{max-width:600px;opacity:.85;margin-bottom:30px}
.hero-buttons{display:flex;gap:15px}
.btn-outline{background:#e5e7eb;color:#0f172a;padding:10px 18px;border-radius:8px;text-decoration:none}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:60px;border-top:1px solid rgba(255,255,255,0.2);padding-top:40px}
.stat h3{font-size:28px;color:#38bdf8}
.section{padding:90px 0}
.section-title{text-align:center;margin-bottom:50px}
.section-title h2{font-size:38px;margin-bottom:10px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px}
.card{background:white;padding:30px;border-radius:14px;box-shadow:0 8px 25px rgba(0,0,0,0.05)}
.card h3{margin-bottom:10px}
.about{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.about img{width:100%;border-radius:14px}
.projects{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px}
.project{background:white;border-radius:14px;overflow:hidden;box-shadow:0 8px 25px rgba(0,0,0,0.05)}
.project img{width:100%;height:200px;object-fit:cover}
.project-content{padding:20px}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.contact-card{background:white;padding:25px;border-radius:12px;margin-bottom:15px}
form{background:white;padding:30px;border-radius:14px;display:grid;gap:15px}
input,textarea,select{padding:12px;border-radius:8px;border:1px solid #e2e8f0}
textarea{min-height:120px}
footer{background:#081427;color:white;text-align:center;padding:30px;margin-top:80px}
@media(max-width:900px){
.hero h1{font-size:36px}
.about{grid-template-columns:1fr}
.contact{grid-template-columns:1fr}
.stats{grid-template-columns:repeat(2,1fr)}
nav ul{display:none}
}

.hero{
min-height:100vh;

display:flex;
align-items:center;
justify-content:center;

text-align:center;
color:white;
padding:40px 20px;

background:
linear-gradient(rgba(15,35,55,0.92), rgba(15,35,55,0.95)),
url("../img/world-map.png");

background-size:cover;
background-position:center;
background-repeat:no-repeat;
}

.hero-image{
margin-bottom:30px;
}

.hero-image img{
width:420px;
max-width:90%;
filter:drop-shadow(0 30px 40px rgba(0,0,0,0.35));
}

.hero-image img{
width:720px;
max-width:90%;
filter:drop-shadow(0 20px 40px rgba(0,0,0,0.35));
transition:transform .4s ease;
}

.hero-image img:hover{
transform:scale(1.05);
}

.hero-text{
max-width:650px;
margin:20px auto;
font-size:18px;
opacity:0.9;
}

.hero-center{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
max-width:850px;
margin:auto;
}
.stats{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:40px;
margin-top:50px;
width:100%;
max-width:700px;
}

.stat{
text-align:center;
}

.stat h3{
color:#38bdf8;
font-size:28px;
}

.logo img{
height:40px;
width:auto;
display:block;
}