/* Basic reset */
* {box-sizing: border-box; margin:0; padding:0;}
html,body {height:100%;}
body {font-family: 'Open Sans', Arial, sans-serif; color:#212529; background:#F9FAFB; line-height:1.6;}

/* Container */
.container {max-width:1100px; margin:0 auto; padding:1rem;}

/* Header */
.site-header {background:#0A2540; color:#fff; position:sticky; top:0; z-index:50;}
.header-inner {display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0.8rem 0;}
.brand {font-family:'Montserrat',sans-serif; font-weight:700; color:#fff; text-decoration:none; font-size:1.1rem;}
.main-nav a {color:#fff; margin-left:1rem; text-decoration:none; font-weight:600;}
.main-nav .cta {background:#FFB400; color:#0A2540; padding:0.45rem 0.8rem; border-radius:6px; margin-left:1rem;}
.mobile-menu-toggle {display:none; background:none; border:none; color:#fff; font-size:1.2rem;}

/* Hero */
.hero {padding:3rem 0; background:linear-gradient(135deg,#007BFF 0%,#00C6A7 100%); color:#fff;}
.hero-inner {display:flex; gap:2rem; align-items:center; justify-content:space-between;}
.hero-copy {flex:1;}
.hero h1 {font-family:'Montserrat',sans-serif; font-size:2rem; margin-bottom:0.5rem;}
.lead {opacity:0.95; margin-bottom:1rem;}
.hero-cta .btn {margin-right:0.8rem;}
.hero-visual {flex:0 0 360px; text-align:center;}
.card-visual img {max-width:100%; height:auto; border-radius:10px; background:#fff; padding:1rem;}

/* Buttons */
.btn {display:inline-block; text-decoration:none; padding:0.6rem 1rem; border-radius:8px; font-weight:600;}
.btn.primary {background:#007BFF; color:#fff;}
.btn.outline {background:transparent; color:#fff; border:2px solid rgba(255,255,255,0.85);}
.btn.highlight {background:#FFB400; color:#0A2540;}

/* Sections */
.section-title {font-family:'Montserrat',sans-serif; font-size:1.4rem; margin-bottom:0.2rem;}
.section-sub {color:#495057; margin-bottom:1rem;}
.services-preview {padding:2.2rem 0;}
.grid {display:grid; gap:1.2rem;}
.grid-4 {grid-template-columns:repeat(4,1fr);}
.grid-2 {grid-template-columns:repeat(2,1fr);}

.service-card {background:#fff; padding:1rem; border-radius:8px; box-shadow:0 6px 18px rgba(10,37,64,0.06);}
.service-card .icon {font-size:1.6rem; margin-bottom:0.6rem;}

/* Why choose */
.why-choose {padding:2rem 0;}
.two-col {display:grid; grid-template-columns:1fr 1fr; gap:1.6rem;}
.image-responsive {width:100%; border-radius:8px;}

/* Contact banner */
.contact-banner {background:#0A2540; color:#fff; padding:1.2rem 0; margin-top:1.6rem; border-radius:8px;}
.banner-inner {display:flex; align-items:center; justify-content:space-between; gap:1rem;}

/* Content area */
.content-section {padding:2rem 0; background:transparent;}
.service-detail {background:#fff; padding:1rem; border-radius:8px; box-shadow:0 6px 18px rgba(10,37,64,0.04);}

/* Forms */
form label {display:block; margin-top:0.8rem; font-weight:600;}
input[type="text"], input[type="email"], textarea {
  width:100%; padding:0.7rem; margin-top:0.3rem; border:1px solid #dbe5ea; border-radius:6px; background:#fff;
}
.form-note {font-size:0.9rem; color:#6c757d; margin-top:0.6rem;}

/* Footer */
.site-footer {background:#0A2540; color:#fff; padding:1.2rem 0; margin-top:2rem;}
.footer-inner {display:flex; justify-content:space-between; align-items:center; gap:1rem;}
.footer-nav a {color:#fff; text-decoration:none; opacity:0.9;}

/* Responsive */
@media (max-width: 900px) {
  .grid-4 {grid-template-columns:repeat(2,1fr);}
  .hero-inner {flex-direction:column; text-align:center;}
  .two-col {grid-template-columns:1fr;}
  .grid-2 {grid-template-columns:1fr;}
  .mobile-menu-toggle {display:block;}
  .main-nav {display:none;}
}














