/* SelfAttested.com – site header & footer (from about-us.html, scoped) */
.site-header, .site-header *, .site-footer, .site-footer * { font-family: Arial, sans-serif; box-sizing: border-box; }

.site-header {
  width: 100%; background: #fff; color: #222;
  display: flex; align-items: center; justify-content: space-between;
  padding: 15px 20px; position: relative; z-index: 1000;
  box-shadow: 0 8px 16px rgba(0,0,0,.2);
}
.site-header .header-items { display: flex; align-items: center; }
.site-header img { height: 40px; margin-right: 20px; display: block; }
.site-header nav { display: flex; align-items: center; }
.site-header nav ul { list-style: none; display: flex; gap: 20px; margin: 0; padding: 0; }
.site-header nav ul li { display: inline-block; }
.site-header nav ul li a {
  text-decoration: none; color: #222; font-size: 18px; padding: 8px 12px; transition: .3s; border-radius: 5px;
}
.site-header nav ul li a:hover,
.site-header nav ul li a[aria-current] { background: #372049; color: #fff; }

.site-header .dropdown { position: relative; }
.site-header .dropdown-content {
  display: none; position: absolute; top: 100%; left: 0; background: #fff; min-width: 150px;
  box-shadow: 0 8px 16px rgba(0,0,0,.2); border-radius: 5px; overflow: hidden;
}
.site-header .dropdown-content a { display: block; color: #222; padding: 10px; text-decoration: none; }
.site-header .dropdown-content a:hover { background: #372049; color: #fff; }
.site-header .dropdown:hover .dropdown-content,
.site-header .dropdown:focus-within .dropdown-content { display: block; }

.site-header .menu-toggle { display: none; font-size: 26px; cursor: pointer; color: #222; background: none; border: 0; }
.site-header .closebtn, .site-header .m-logo { display: none; }

/* Mobile sidebar */
@media (max-width: 768px) {
  .site-header .menu-toggle { display: block; }
  .site-header nav {
    position: fixed; top: 0; left: -260px; height: 100%; width: 250px; background: #fafafa;
    flex-direction: column; align-items: stretch; padding-top: 60px; transition: left .4s;
    box-shadow: 4px 0 16px rgba(0,0,0,.15); overflow-y: auto; z-index: 1001;
  }
  .site-header nav ul { flex-direction: column; gap: 0; }
  .site-header nav ul li { width: 100%; }
  .site-header nav ul li a { display: block; padding: 15px; font-size: 20px; border-radius: 0; }
  .site-header nav ul li a:hover { color: #fff; background: #471085; }
  .site-header .dropdown-content { display: block; position: static; box-shadow: none; background: transparent; }
  .site-header .dropdown-content a { padding-left: 30px; font-size: 18px; }
  .site-header .m-logo { display: block; border-bottom: 1px solid #eee; margin: 0 0 8px 15px; padding-bottom: 10px; }
  .site-header .closebtn {
    display: block; position: absolute; top: 10px; right: 15px; font-size: 30px;
    color: #4956A5; cursor: pointer; background: none; border: none;
  }
}

.site-footer {
  margin-top: 40px; padding: 20px; text-align: center;
  background: #4956A5; color: #fff; width: 100%; font-size: 15px;
}
.site-footer a { color: #00AEEF; text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
