body {
margin: 0;
font-family: Poppins, sans-serif;

/* BACKGROUND IMAGE FOR ALL PAGES */
background: url('../images/background.jpg') no-repeat center center fixed;
background-size: cover;
}

/* ADD A SOFT WHITE LAYER FOR READABILITY */
body::before {
content: "";
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255,255,255,0.85);
z-index: -1;
}

/* NAVBAR CENTERED */
.navbar {
display: flex;
justify-content: center;
align-items: center;
gap: 50px;
padding: 20px;
background: white;
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* NAVBAR LINKS */
.navbar a {
text-decoration: none;
color: #1e3a5f;
font-size: 22px;
font-weight: 600;
transition: 0.3s;
}

.navbar a:hover {
color: #0077b6;
}
/* WHY SECTION */

.why-section {
padding: 20px 40px;   /* reduced top space (moves it up) */
text-align: center;   /* centers the heading */
margin-top: -20px;    /* pulls section slightly upward */
}

.why-section h2 {
text-align: center;
margin-bottom: 10px;
}

.why {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 20px;
margin-top: 10px;     /* less gap between heading and grid */
}

.why div {
background: #ffffff;
padding: 20px;
border-radius: 10px;
text-align: center;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
font-weight: bold;
}


/* HEADER (if used) */
header {
text-align: center;
background: white;
padding: 15px;
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.logo {
width: 350px;
}

/* HERO */
.hero {
height: 350px;
position: relative;
}

/* OVERLAY */
.overlay {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
text-align: center;
}

/* BIGGER MAIN TITLE */
.overlay h1 {
font-size: 50px;
font-weight: bold;
color: #1e3a5f;
}

/* SUBTEXT */
.overlay p {
font-size: 30px;
margin-top: 10px;
}

/* GRID */
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
gap: 20px;
padding: 40px;
}

/* CARD */
.card {
background: white;
border-radius: 10px;
overflow: hidden;
text-decoration: none;
color: black;
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
transition: 0.3s;
}

.card:hover {
transform: translateY(-6px);
}

.card img {
width: 100%;
height: 180px;
object-fit: cover;
}

.card h3 {
padding: 15px;
}
/* REMOVE BULLETS + FIX ALIGNMENT */

.section ul {
list-style: none;      /* removes bullets */
padding-left: 0;       /* removes left indentation */
margin: 0;
}

.section li {
text-align: center;    /* keeps text centered */
}


/* SECTIONS */
.section {
padding: 40px;
text-align: center;   /* LEFT ALIGN FIX */
background: white;
margin: 30px;
border-radius: 10px;
}

/* MAKE TEXT INSIDE SECTION CLEAN */
.section p,
.section ul,
.section li,
.section h2,
.section h3 {
text-align: center;
}

/* OPTIONAL: CENTER ONLY TITLES IF NEEDED */
.section h2 {
text-align: center;
margin-bottom: 20px;
}