body {margin:0;font-family:Arial, sans-serif;background:#f9f9f9;color:#222;}


/* HEADER */
.header{
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}

  .header-inner{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    
  }

  /* LOGO FIX */
  .logo img{
    height: 45px; /* control size */
  }  

/* MENU TOGGLE */
.menu-toggle{
  display: none;
  font-size: 28px;
  cursor: pointer;
  color: #fff;
}

/* NAV */

.nav{
  display:flex; 
  gap: 30px;
  align-items:center;
}

/* NAV LINKS */
.nav-links{
  display: flex;
  gap: 25px;
  list-style:none;
  margin: 0;
  padding: 0;
}

.nav-links a{
  color:#fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

.nav-links a:hover{
  color: #f4b400;
}

/* BUTTON */

.nav-btn{
  background:#f4b400;
  color:#000;
  padding:8px 18px;
  border-radius:20px;
  text-decoration: none;
  font-size: 14px;
}

/* HERO */
.hero {
  background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)), url('../images/hero-bethel.jpg');
  background-size: cover;
  background-position: center;
  color:#fff;

  text-align:center;
  padding:180px 20px 120px;
}
.hero h1 {font-size:36px;margin-bottom:10px;}
.hero p {max-width:600px;margin:auto;color:#ddd;}

/* SECTION TITLE */
.section-title {text-align:center;margin:50px 0 30px;}
.section-title h2 {font-size:28px;}

/* PROJECT GRID */
.projects {display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.card {background:#fff;border-radius:15px;overflow:hidden;box-shadow:0 5px 15px rgba(0,0,0,0.05);} 
.card img {width:100%;height:220px;object-fit:cover;}
.card-content {padding:15px;}
.card h3 {margin:10px 0;}
.card p {font-size:14px;color:#666;}

.highlights {margin-top:10px;}
.highlights li {list-style:none;font-size:13px;margin-bottom:5px;}
.highlights i {color:#f4b400;margin-right:5px;}

.type {margin-top:10px;font-size:12px;color:#999;}

.btn {
  display:inline-block;
  margin-top:10px;
  padding:10px 15px;
  background:#25D366;
  color:#fff;
  text-decoration:none;
  border-radius:4px;
  font-size:13px;
}

.container{
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

/* FOOTER */
.footer {
  background:#0e2a1f;
  color:#fff;
  padding:50px 0px;
  margin-top:50px;
}

.footer-grid{
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 30px;
}

.footer ul{
  list-style: none;
  padding: 0;
}

.footer li{
  margin-bottom: 8px;
  color: #ccc;
}

.footer-bottom{
  text-align: center;
  margin-top: 30px;
  font-size: 13px;
  color: #aaa;
}

.footer-columns {display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;}
.footer h4 {margin-bottom:10px;}
.footer p, .footer a {font-size:13px;color:#bbb;text-decoration:none;}

.footer-social {display:flex;gap:10px;margin-top:10px;}
.footer-social a {
  width:35px;height:35px;background:#f2f2f2;color:#555;
  display:flex;align-items:center;justify-content:center;border-radius:4px;
}
.footer-social a:hover {background:#f4b400;color:#fff;}