
body{margin:0;font-family:Segoe UI,Arial;background:#eef2f6;color:#222;line-height:1.6}
.container{max-width:1200px;margin:auto;padding:0 20px}

/* Header */
.header{background:#0b1c2d;position:sticky;top:0;z-index:1000}
.nav{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo img{height:70px;}
.menu a{color:#fff;margin-left:20px;text-decoration:none;font-size:14px}
.menu a:hover{text-decoration:underline}
.btn-nav{background:transparent;color:#fff;padding:0;border-radius:0}

/* Heroes */
.hero,.page-hero{
background:
linear-gradient(rgba(11,28,45,0.88),rgba(11,28,45,0.88)),
url('https://images.unsplash.com/photo-1498050108023-c5249f4df085');
background-size:cover;background-position:center;color:#fff
}
.hero{padding:120px 0}
.page-hero{padding:90px 0}
.hero h1,.page-hero h1{color:#fff}

/* Sections */
.section{padding:80px 0;background:#fff}
.section.alt{background:#f0f3f8}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:30px}
.card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 8px 22px rgba(0,0,0,0.08)}
.card img{width:100%;height:200px;object-fit:cover}
.card div{padding:22px}

/* Testimonials */
.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px}
.testimonial{background:#fff;padding:30px;border-radius:8px;font-style:italic}

/* Contact */
.form{max-width:620px;background:#fff;padding:35px;border-radius:8px}
.form input,.form textarea{width:100%;padding:12px;margin-bottom:14px;border:1px solid #bbb;color:#111}
.form textarea{min-height:140px}
.form button{background:#0b1c2d;color:#fff;border:none;padding:12px 22px;border-radius:4px}

/* Footer */
.footer{background:#0b1c2d;color:#fff;text-align:center;padding:20px;font-size:13px}

/* ===== MOBILE RESPONSIVE FIX ===== */

@media (max-width: 992px){

  .nav{
    flex-direction: column;
    align-items: flex-start;
  }

  .menu{
    margin-top: 15px;
  }

  .menu a{
    display:block;
    margin:10px 0;
  }

  .hero, .page-hero{
    padding:80px 20px;
    text-align:left;
  }

  .hero h1,
  .page-hero h1{
    font-size:26px;
  }

  .section{
    padding:60px 20px;
  }

  .cards{
    grid-template-columns:1fr !important;
  }

  .logo img{
    height:55px;
  }
}
