:root{
  --bg:#f4f0e8;
  --white:#ffffff;
  --ink:#111111;
  --red:#d43822;
}

.site-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:2000;
  background:rgba(244,240,232,.94);
  border-bottom:1px solid rgba(17,17,17,.06);
  backdrop-filter:blur(10px);
  transition:background .28s ease, box-shadow .28s ease, border-color .28s ease;
}

body.is-scrolled .site-header{
  background:rgba(244,240,232,.985);
  box-shadow:0 12px 28px rgba(0,0,0,.05);
  border-bottom-color:rgba(17,17,17,.08);
}

.header-shell{
  width:min(1620px, calc(100% - 28px));
  margin:0 auto;
  padding:8px 0 10px;
}

.header-brandRow{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:72px;
}

.brand{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.brand__logo{
  width:auto;
  height:98px;
  object-fit:contain;
  transition:transform .35s ease;
}

.brand:hover .brand__logo{
  transform:translateY(-1px) scale(1.012);
}

.header-line{
  width:min(1300px, calc(100% - 120px));
  height:1px;
  margin:4px auto 10px;
  background:rgba(17,17,17,.24);
}

.header-navRow{
  display:flex;
  justify-content:center;
  align-items:center;
}

.nav{
  position:relative;
}

.nav__toggle{
  display:none;
  width:46px;
  height:46px;
  border:1px solid rgba(17,17,17,.18);
  background:#fff;
  cursor:pointer;
}

.nav__burger,
.nav__burger::before,
.nav__burger::after{
  display:block;
  width:18px;
  height:2px;
  background:#111;
  margin:0 auto;
  position:relative;
}

.nav__burger::before,
.nav__burger::after{
  content:"";
  position:absolute;
  left:0;
}

.nav__burger::before{
  top:-6px;
}

.nav__burger::after{
  top:6px;
}

.nav__panel{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
}

.nav__link{
  font-size:14px;
  font-weight:500;
  color:#1a1a1a;
  transition:color .25s ease, transform .25s ease;
}

.nav__link:hover,
.nav__link[aria-current="page"]{
  color:var(--red);
}

.nav__link:hover{
  transform:translateY(-1px);
}

@media (max-width: 980px){
  .header-shell{
    padding:8px 0 10px;
  }

  .brand__logo{
    height:84px;
  }

  .header-line{
    width:calc(100% - 12px);
    margin:4px auto 8px;
  }

  .header-navRow{
    justify-content:flex-end;
  }

  .nav__toggle{
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .nav__panel{
    position:fixed;
    top:100px;
    left:14px;
    right:14px;
    display:none;
    flex-direction:column;
    gap:16px;
    padding:22px 18px;
    background:rgba(250,247,242,.98);
    border:1px solid rgba(17,17,17,.10);
    box-shadow:0 18px 46px rgba(0,0,0,.12);
  }

  .nav__panel.is-open{
    display:flex;
  }
}

@media (max-width: 640px){
  .brand__logo{
    height:78px;
  }

  .nav__panel{
    top:96px;
  }
}