/* ========== GLOBAL BODY ========== */
body {
  background-color: #f9f9f9; /* sama seperti header */
  color: #333333; /* dark gray untuk text */
  font-family: 'Arial', sans-serif;
  line-height: 1.6;
}

/* ========== HEADER (Light Gray) ========== */
.header-top, 
.header-nav, 
#header {
  background-color: #f9f9f9; /* very light gray */
  border-bottom: 1px solid #e0e0e0;
}

#header .header-nav .menu > li > a {
  color: #333333; /* dark gray */
  font-weight: 600;
  padding: 12px 18px;
  transition: color 0.3s ease, border-bottom 0.3s ease;
}

#header .header-nav .menu > li > a:hover {
  color: #ff6600; /* oren */
  border-bottom: 2px solid #ff6600;
}

#header a:hover {
  color: #ff6600;
}


/* ========== FOOTER (Hitam) ========== */
#footer {
  background-color: #000000;
  color: #ffffff;
  padding: 40px 20px;
}

#footer a {
  color: #ffffff;
  transition: color 0.3s ease;
}

#footer a:hover {
  color: #ff6600;
}