
:root{
  --blue:#0F3D91;
  --orange:#F57C00;
  --green:#2E7D32;
  --light:#F8FAFC;
  --dark:#1F2937;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Arial,sans-serif;background:var(--light);color:var(--dark);line-height:1.6}
header{background:var(--blue);color:#fff;padding:15px 0;position:sticky;top:0;z-index:1000}
.container{width:90%;max-width:1200px;margin:auto}
nav{display:flex;justify-content:space-between;align-items:center}
.logo{font-size:2rem;font-weight:bold;color:#fff}
.logo span{color:var(--orange)}
nav ul{display:flex;list-style:none;gap:20px}
nav a{color:#fff;text-decoration:none;font-weight:bold}
.hero{height:80vh;background:url('../images/hero.jpg') center/cover no-repeat;display:flex;align-items:center;color:#fff}
.hero-content{background:rgba(0,0,0,.55);padding:40px;border-radius:12px;max-width:600px}
.btn{display:inline-block;background:var(--orange);color:#fff;padding:12px 24px;border-radius:30px;text-decoration:none;margin-top:20px}
.section{padding:80px 0}
.section-title{text-align:center;margin-bottom:50px}
.section-title h2{font-size:2.4rem;color:var(--blue)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:25px}
.card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 10px 25px rgba(0,0,0,.08);transition:.3s}
.card:hover{transform:translateY(-8px)}
.card img{width:100%;height:200px;object-fit:cover}
.card-body{padding:20px}
.stats{background:var(--blue);color:#fff}
.stats .grid{text-align:center}
.stat h3{font-size:3rem;color:var(--orange)}
footer{background:#111827;color:#fff;padding:60px 0}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:30px}
.footer-links{list-style:none}
.footer-links li{margin:10px 0}
.footer-links a{color:#fff;text-decoration:none}
.page-banner{background:linear-gradient(135deg,var(--blue),var(--green));color:#fff;padding:100px 0;text-align:center}
.page-banner h1{font-size:3rem}
.content{padding:60px 0}
table{width:100%;border-collapse:collapse;background:#fff}
table th,table td{padding:15px;border:1px solid #ddd}
table th{background:var(--blue);color:#fff}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.gallery img{width:100%;height:220px;object-fit:cover;border-radius:12px}
form{display:grid;gap:15px}
input,textarea,select{padding:14px;border:1px solid #ccc;border-radius:8px;width:100%}
button{padding:14px;background:var(--orange);color:#fff;border:none;border-radius:30px;font-size:1rem;cursor:pointer}
.faq-item{background:#fff;border-radius:10px;padding:20px;margin-bottom:15px;box-shadow:0 4px 10px rgba(0,0,0,.05)}
@media(max-width:768px){
  nav{flex-direction:column;gap:15px}
  nav ul{flex-wrap:wrap;justify-content:center}
  .hero{height:auto;padding:100px 0}
}
