body {margin:0; font-family:Arial, sans-serif; background:#f5f7fa; color:#333;}
.header {background:#1e293b; color:#fff; padding:1em 0; text-align:center;}
.header .logo {width:60px; border-radius:50%; vertical-align:middle;}
.header nav a {color:#fff; text-decoration:none; margin:0 10px; font-weight:bold;}
.header nav a:hover {color:#93c5fd;}
.hero {background:linear-gradient(90deg,#1e3a8a,#2563eb,#3b82f6); color:#fff; text-align:center; padding:5em 1em;}
.btn {display:inline-block; background:#fff; color:#1e3a8a; padding:0.75em 1.5em; border-radius:0.5em; text-decoration:none; font-weight:bold;}
.intro, .page-section {padding:3em 1em; text-align:center; max-width:900px; margin:auto;}
.grid {display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1em; margin-top:2em;}
.card {background:#fff; border-radius:1em; padding:1.5em; box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.footer {background:#1e293b; color:#ccc; text-align:center; padding:1em; font-size:0.9em;}
.contact-form {display:flex; flex-direction:column; gap:1em; max-width:400px; margin:2em auto;}
.contact-form input, .contact-form textarea {padding:0.75em; border-radius:0.5em; border:1px solid #ccc; font-size:1em;}
.contact-form .btn {background:#2563eb; color:#fff; border:none;}
.contact-form .btn:hover {background:#1d4ed8;}
@media (max-width:600px){.hero h2{font-size:1.8em;} .header nav a{display:inline-block; margin:5px;}}