@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');
* { box-sizing: border-box; margin:0; padding:0; }
body { font-family: 'Poppins', sans-serif; background: #f5f7fa; color: #333; scroll-behavior: smooth; }
header { position: fixed; top:0; width:100%; padding:20px 50px; display:flex; justify-content:space-between; align-items:center; transition: 0.5s; z-index:1000; }
header.scrolled { background: rgba(11,44,95,0.95); box-shadow:0 5px 20px rgba(0,0,0,0.1); }
header h2 { color:#0b2c5f; font-weight:600; }
header.scrolled h2 { color:white; }
nav a { text-decoration:none; margin-left:25px; font-weight:500; color:#333; transition:0.3s; }
header.scrolled nav a { color:white; }
.hero { height:100vh; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; background: linear-gradient(135deg, #0b2c5f, #174ea6); color:white; position:relative; overflow:hidden; }
.hero h1 { font-size:3.5rem; margin-bottom:20px; animation: fadeIn 1s ease-out forwards; }
.hero p { font-size:1.2rem; max-width:700px; margin:auto; animation: fadeIn 1.5s ease-out forwards; }
.hero .btn { margin-top:20px; padding:15px 30px; border-radius:30px; font-weight:600; color:#0b2c5f; background:white; text-decoration:none; transition:0.3s; }
.hero .btn:hover { transform:translateY(-3px); }
@keyframes fadeIn { from{opacity:0; transform:translateY(20px);} to{opacity:1; transform:translateY(0);} }
.section { padding:100px 50px; text-align:center; }
.section h2 { margin-bottom:50px; color:#0b2c5f; font-size:2.5rem; }
.services { display:flex; flex-wrap:wrap; justify-content:center; gap:30px; }
.card { background:white; padding:40px; border-radius:15px; width:300px; box-shadow:0 10px 30px rgba(0,0,0,0.05); transition:0.5s; opacity:0; transform:translateY(50px); }
.card:hover { transform:translateY(-10px); box-shadow:0 15px 35px rgba(0,0,0,0.1); }
.card.show { opacity:1; transform:translateY(0); }
.contact-box { background:white; padding:50px; border-radius:15px; max-width:600px; margin:auto; box-shadow:0 10px 30px rgba(0,0,0,0.05); }
.contact-box input, .contact-box textarea { width:100%; padding:15px; margin:15px 0; border-radius:10px; border:1px solid #ccc; font-size:1rem; outline:none; transition:0.3s; }
.contact-box input:focus, .contact-box textarea:focus { border-color:#0b2c5f; }
.contact-box label { position:absolute; left:20px; top:20px; transition:0.3s; color:#aaa; pointer-events:none; }
.floating { position:relative; }
.floating input:focus + label, .floating input:not(:placeholder-shown) + label, .floating textarea:focus + label, .floating textarea:not(:placeholder-shown) + label { top:-10px; font-size:0.8rem; color:#0b2c5f; background:white; padding:0 5px; }
footer { background:#0b2c5f; color:white; text-align:center; padding:30px; margin-top:50px; }
@media(max-width:768px) { header { padding:15px 20px; } .hero h1 { font-size:2rem; } .section { padding:60px 20px; } .services { flex-direction:column; align-items:center; } }