*{
    margin: 0;
    padding: 0; 
    box-sizing: border-box; 
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

:root {
      --brand: #004080;
      --accent: #004080; 
      --ink: #0a0f1a;
}

html, body {
    overflow-x: hidden !important;
  }
  .container, .container-fluid {
    max-width: 100vw;
    overflow-x: hidden;
  }
  
  .feature-card, .project-card, .img-fluid, img {
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
  }
  
  .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
 
  [class*="col-"] {
    padding-left: 15px;
    padding-right: 15px;
  }
.navbar{ box-shadow: 0 4px 14px white;
        background-color: #0e2657;
        color: white;   
         overflow: hidden;    
}
.nav-link { color: white !important;
         font-weight: 500; 
}


.hero { position: relative;
         min-height: 100vh;
          color: #fff; display: flex; 
          align-items: center; 
}
    .hero::before {
      content: ""; position: absolute; inset: 0;
      background: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,.35)),
      url('../images/shutterstock_2158649217-scaled.jpg');
      background-size: cover; background-position: center; z-index: 0;
    }
    .hero .content { position: relative;
         z-index: 1; }
    .btn-accent { background: var(--accent); border-color: var(--accent); color: #142; font-weight: 600; }
    .btn-accent:hover { filter: brightness(.95); color: #142; }

    /* Sections */
    .section-title { font-weight: 800; letter-spacing: .2px; }
    .text-accent { color: var(--accent) !important; }

    .feature-card { border: 0; box-shadow: 0 10px 30px rgba(0,0,0,.06); transition: .25s ease; }
    .feature-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(0,0,0,.09); }

    .project-card { border: 0; overflow: hidden; box-shadow: 0 8px 26px rgba(0,0,0,.08); }
    .project-card img { height: 260px; object-fit: cover; }

    .stats-box { background: #fff; border-radius: 14px; box-shadow: 0 6px 20px rgba(0,0,0,.06); }

    .cta-band { background: linear-gradient(135deg, #004080 0%, #0e2657 100%); color: #fff; }

    footer { background: #17223a; color: #cbd5e1; }
    footer a { color: #cbd5e1; text-decoration: none; }
    footer a:hover { color: #fff; }

    @media (min-width: 365px) {
         .hero h1 {
             font-size: 3.2rem;
             }
           .navbar{
             overflow: hidden;
         
           }
             }
    @media (max-width: 991.98px) { 
        .hero h1 { font-size: 2.2rem; 
            
        }
        .navbar-collapse {
    background: #222;
    border-radius: 0.5rem;
    padding: 1rem;
  }
     }
