* { box-sizing: border-box; }
html,body { height:100%; }
body{
  margin:0;
  font-family: "Segoe UI", Roboto, Arial, sans-serif;
  font-size:16px;
  color:#1a1b1b;
  background:#f3be8b;
  line-height:1.5;
}

.container{
  width:90%;
  max-width:1100px;
  margin:0 auto;
}


.site-header{
  background:#9ef3d0;
  border-bottom:1px solid #f00d0d;
  position:sticky;
  top:0;
  z-index:50;
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 0;
}
.brand{ display:flex; align-items:center; gap:12px; }
.logo-thumb{ width:56px; height:56px; object-fit:cover; border-radius:6px; }
.site-title{ margin:0; font-size:18px; color:#1b078f; }
.slogan{ margin:0; font-size:13px; color:#6157eb; }

/* Menu */
.menu{ list-style:none; display:flex; gap:18px; margin:0; padding:0; align-items:center; }
.menu a{ text-decoration:none; color:#374151; padding:8px 10px; border-radius:6px; font-weight:600; font-size:15px; }
.menu a:hover{ background:#eef6ff; color:#0b3d91; }
.menu a.active{ background:#0b3d91; color:#fff; }


.hero{
  background: linear-gradient(90deg, rgba(224, 12, 12, 0.06), rgba(11,61,145,0.03));
  padding:48px 0;
  border-bottom:1px solid #f6eef1;
}
.hero-inner{ text-align:center; padding:20px 0; }
.hero h2{ font-size:28px; margin:0 0 10px; color:#0b3d91; }
.hero p{ margin:0 0 16px; color:#475569; }
.btn{
  display:inline-block;
  background:#0b3d91;
  color:#fff;
  padding:10px 16px;
  text-decoration:none;
  border-radius:8px;
  font-weight:700;
}
.btn.outline{ background:transparent; border:2px solid #0b3d91; color:#0b3d91; }


.quick-overview{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px; padding:28px 0; }
.card{ background:#e7dddd; border-radius:10px; padding:16px; box-shadow:0 6px 18px rgba(15,23,42,0.04); text-align:center; }
.card img{ width:100%; height:140px; object-fit:cover; border-radius:8px 8px 6px 6px; }
.card h3{ margin:12px 0 6px; color:#0b3d91; }


.lead{ color:#475569; margin-bottom:10px; }
.services-list{ display:grid; gap:18px; grid-template-columns:1fr; margin:18px 0 30px; }
.service-item{ background:#e5dde9; padding:16px; border-radius:8px; box-shadow:0 6px 16px rgba(15,23,42,0.03); }
.pricing table{ width:100%; border-collapse:collapse; background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 6px 18px rgba(15,23,42,0.03); }
.pricing th, .pricing td{ padding:12px 14px; text-align:left; border-bottom:1px solid #eef2f6; }


.timeline{ display:flex; flex-direction:column; gap:12px; margin:16px 0 30px; }
.timeline-item{ background:#f3d7d7; padding:12px; border-radius:8px; box-shadow:0 6px 12px rgba(15,23,42,0.03); }
.team-grid{ display:flex; gap:12px; flex-wrap:wrap; }
.team-card{ background:#fff; padding:10px; border-radius:8px; width:180px; text-align:center; box-shadow:0 6px 12px rgba(15,23,42,0.03); }
.team-card img{ width:100%; height:110px; object-fit:cover; border-radius:6px; }


.projects-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin:18px 0; }
.project-card{ background:#c3d84b; padding:12px; border-radius:8px; box-shadow:0 6px 12px rgba(15,23,42,0.03); }
.project-card img{ width:100%; height:140px; object-fit:cover; border-radius:6px; }
.testimonials blockquote{ background:#a5c9d4; padding:16px; border-radius:8px; box-shadow:0 6px 12px rgba(15,23,42,0.03); margin:10px 0; }
.partners{ width:100%; border-collapse:collapse; margin-top:12px; }
.partners th, .partners td{ padding:10px; border-bottom:1px solid #eef2f6; }


.contact-grid{ display:grid; grid-template-columns:1fr 320px; gap:20px; align-items:start; }
.contact-form{ background:#cc9c9c; padding:16px; border-radius:8px; box-shadow:0 6px 12px rgba(15,23,42,0.03); display:flex; flex-direction:column; gap:10px; }
.contact-form label{ display:flex; flex-direction:column; font-weight:600; font-size:14px; color:#374151; }
.contact-form input, .contact-form textarea{ margin-top:6px; padding:10px; border:1px solid #d1dbe6; border-radius:6px; font-size:14px; }
.contact-info{ background:#c99797; padding:16px; border-radius:8px; box-shadow:0 6px 12px rgba(15,23,42,0.03); }


.site-footer{ background:#100dbb; border-top:1px solid #eef2f6; padding:18px 0; margin-top:40px; }
.footer-inner{ display:flex; justify-content:space-between; align-items:center; gap:12px; color:#e7e9ee; }


@media (max-width:900px){
  .header-inner{ flex-direction:column; align-items:flex-start; gap:12px; }
  .contact-grid{ grid-template-columns:1fr; }
  .menu{ gap:10px; flex-wrap:wrap; }
}