/* PH 320 course site — shared header, hamburger menu, and footer.
   Every page links this file and pastes the same <header class="site-header"> block. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(246,247,245,.94);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);
  backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid #D8DCD7;
  font-family:"Archivo",system-ui,-apple-system,sans-serif;
  line-height:1.4;
}
.site-header__inner{
  max-width:68rem;margin:0 auto;
  padding-inline:clamp(1rem,4vw,2.5rem);
  min-height:3.75rem;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
}
.brand{display:flex;align-items:baseline;gap:.65rem;text-decoration:none;min-width:0;}
.brand__code{font-weight:800;font-size:1.05rem;letter-spacing:.01em;color:#14202A;white-space:nowrap;}
.brand__name{font-size:.85rem;color:#5E6B72;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (max-width:26rem){ .brand__name{display:none;} }

.site-nav{display:flex;align-items:center;gap:.25rem;}
.site-nav a{
  font-size:.92rem;font-weight:600;color:#3C4856;text-decoration:none;
  padding:.5rem .8rem;border-radius:3px;
}
.site-nav a:hover{color:#14202A;background:#EDEFEC;}
.site-nav a[aria-current="page"]{color:#0B6E6E;}

.menu-toggle{
  display:none;
  width:2.75rem;height:2.75rem;
  border:1px solid #D8DCD7;border-radius:3px;background:transparent;
  cursor:pointer;align-items:center;justify-content:center;
  color:#14202A;
}
.menu-toggle__bars,.menu-toggle__bars::before,.menu-toggle__bars::after{
  display:block;width:1.15rem;height:2px;background:currentColor;border-radius:1px;
  transition:transform .2s ease,opacity .2s ease;
}
.menu-toggle__bars{position:relative;}
.menu-toggle__bars::before,.menu-toggle__bars::after{content:"";position:absolute;left:0;}
.menu-toggle__bars::before{top:-6px;}
.menu-toggle__bars::after{top:6px;}
.site-header.is-open .menu-toggle__bars{background:transparent;}
.site-header.is-open .menu-toggle__bars::before{transform:translateY(6px) rotate(45deg);}
.site-header.is-open .menu-toggle__bars::after{transform:translateY(-6px) rotate(-45deg);}
@media (prefers-reduced-motion: reduce){ .menu-toggle__bars,.menu-toggle__bars::before,.menu-toggle__bars::after{transition:none;} }

@media (max-width:44rem){
  .js .menu-toggle{display:inline-flex;}
  .site-header__inner{flex-wrap:wrap;}
  .site-nav{flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;padding-bottom:.75rem;}
  .site-nav a{padding:.8rem .25rem;border-top:1px solid #EDEFEC;border-radius:0;font-size:1rem;}
  .js .site-nav{display:none;}
  .js .site-header.is-open .site-nav{display:flex;}
}

.site-footer{
  border-top:1px solid #D8DCD7;
  margin-top:clamp(3rem,7vw,5rem);
  font-family:"Archivo",system-ui,-apple-system,sans-serif;
}
.site-footer__inner{
  max-width:68rem;margin:0 auto;
  padding:1.75rem clamp(1rem,4vw,2.5rem) 2.5rem;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem 2rem;
  font-size:.82rem;color:#5E6B72;line-height:1.5;
}
.site-footer a{color:#5E6B72;}

@media print{ .site-header,.site-footer{display:none !important;} }