/* ===== Top Header Bar ===== */
.site-header{
  position: sticky; top:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:10px 14px;
  background:#fff; border-bottom:1px solid #eee;
}

/* Brand (left) */
.site-header .brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.site-header .brand img{width:36px; height:auto; display:block;}
.site-header .brand span{color:#17562F; font-weight:700}

/* Menu (right) */
.site-nav ul{list-style:none; margin:0; padding:0; display:flex; gap:16px;}
.site-nav a{color:#17562F; text-decoration:none; font-weight:600;}
.site-nav a.active{padding-bottom:2px; border-bottom:3px solid #17562F;}

/* Hamburger (mobile) */
.menu-toggle{
  font-size:22px; background:#17562F; color:#fff;
  border:0; border-radius:6px; padding:6px 10px; cursor:pointer;
}
@media (min-width:800px){ .menu-toggle{display:none;} }

/* Mobile dropdown panel */
@media (max-width:799px){
  .site-nav{
    position:absolute; right:10px; top:56px; display:none;
    background:#fff; border:1px solid #eee; border-radius:8px;
    box-shadow:0 8px 24px rgba(0,0,0,.08);
  }
  .site-nav.open{display:block;}
  .site-nav ul{flex-direction:column; padding:10px;}
}

/* ===== Pager (bottom prev/home/next) ===== */
.pager{
  display:flex; justify-content:center; gap:10px;
  padding:18px 12px; margin:12px auto; max-width:1100px;
}
.nav-button{
  display:inline-block; padding:10px 14px; border-radius:8px;
  text-decoration:none; font-weight:700;
  background:#17562F; color:#fff;
}
.nav-button.ghost{
  background:#fff; color:#17562F; border:2px solid #17562F;
}
.nav-button:focus{outline:3px solid #FFEB3B; outline-offset:2px;}