:root {
	--primary:#1a4f72;
	--secondary:#3a7bb8;
	--accent:#00b894;
	--light:#f5f7fa; 
	--dark:#2d3436; 
	--text:#2d3436; 
	--text-light:#878787;
	--border:#e1e8ed;
	--header-height: 60px;
	--mega-menu-height: 50px;
	--highlight: #e8f4ff;
	
  --light-bg: #f5f7fa;
  --card-bg: #fff;
  --search-bg: #038860;
}


* { margin:0; padding:0; box-sizing:border-box; }


html, body {
  height: 100%;
  display: flex;
  flex-direction: column;
  background:var(--light);
  color:var(--text);
  line-height:1.6;
}

main {
  flex: 1; /* push footer down */
  display:flex;
  flex-direction:column;
}

/* Header */
header {
  background:linear-gradient(to right,var(--primary),var(--secondary));
  color:white; padding:1rem; position:sticky; top:0; z-index:1000;
  box-shadow:0 2px 10px rgba(0,0,0,.1);
}
.header-container {
  display:flex; justify-content:space-between; align-items:center;
  max-width:1200px; margin:0 auto; flex-wrap:wrap;
}
.logo { display:flex; align-items:center; gap:.5rem; font-weight:700; font-size:1.5rem; }
.logo i { color:var(--accent); }
.nav-toggle { display:none; background:none; border:none; color:white; font-size:1.5rem; cursor:pointer; }
nav ul { display:flex; list-style:none; gap:1.5rem; }
nav a { color:white; text-decoration:none; font-weight:500; display:flex; gap:.3rem; align-items:center; }
nav a:hover { color:var(--accent); }


    /* Page Title - Centered and Different Style */
    .pageTitle {
      background: #f8f9fa;
      color: #495057;
      text-align: center;
      width: 100%;
      margin: 0.5rem auto;
      border-left: 4px solid var(--accent);
      border-radius: 4px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }

    .pageTitle h1 {
      font-size: 1.5rem;
      font-weight: 600;
      margin: 0;
      color: var(--primary);
      letter-spacing: 0.5px;
    }


/* Footer */
footer { background:var(--primary); color:white; padding:2rem 1rem; margin-top:auto; }
.footer-container {
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:2rem;
}
.footer-section h3 { margin-bottom:1rem; font-size:1.2rem; }
.footer-section a { color:rgba(255,255,255,.8); text-decoration:none; }
.footer-section a:hover { color:white; text-decoration:underline; }
.footer-bottom { text-align:center; padding-top:2rem; border-top:1px solid rgba(255,255,255,.1); font-size:.9rem; }

/* Responsive */
@media (max-width:768px) {
  .nav-toggle{display:block;}
  nav{display:none;width:100%;margin-top:1rem;}
  nav.active{display:block;}
  nav ul{flex-direction:column;gap:.5rem;}
  
      .pageTitle {
        margin: 1.5rem auto;
        padding: 1.2rem 1rem;
      }
      
      .pageTitle h1 {
        font-size: 1.6rem;
      }
}

@media (max-width:576px) {
      .pageTitle h1 {
        font-size: 1.4rem;
      }

}