/* Shared Leckerbiss header and mobile menu. This is the only header stylesheet. */
.site-header{
  position:fixed;
  inset:0 0 auto;
  z-index:100;
  width:100%;
  padding:0 30px;
  color:var(--ink);
  background:rgba(240,237,234,.92);
  border-bottom:1px solid rgba(17,16,16,.08);
  box-shadow:0 10px 30px rgba(17,16,16,.05);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:transform .45s cubic-bezier(.22,.61,.36,1),box-shadow .28s ease;
}
.site-header.is-hidden{transform:translateY(-102%)}
.site-header.is-scrolled{box-shadow:0 14px 34px rgba(17,16,16,.09)}
.site-header-inner{
  width:min(1320px,calc(100vw - 72px));
  min-height:74px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:26px;
}
.site-header .brand{width:108px;display:block;flex:0 0 auto}
.site-header .brand img{width:100%;height:auto}
.site-header .site-nav{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.site-header .nav-primary,.site-header .nav-actions{display:flex;align-items:center}
.site-header .nav-primary{gap:32px}
.site-header .nav-actions{gap:14px}
.site-header .nav-primary a,.site-header .action-text{
  white-space:nowrap;
  font-family:"Commissioner",Arial,Helvetica,sans-serif;
  font-size:13px;
  line-height:1;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.92;
  transition:color .2s ease,opacity .2s ease;
}
.site-header .nav-primary a:hover,.site-header .action-text:hover,.site-header .is-current{color:var(--accent);opacity:1}
.site-header .icon-button{
  width:42px;height:42px;display:grid;place-items:center;border-radius:12px;
  background:var(--accent);box-shadow:none;transition:transform .2s ease,background-color .2s ease;
}
.site-header .icon-button:hover{background:#868d75;transform:translateY(-1px)}
.site-header .icon-button img{width:20px;height:20px;object-fit:contain}
.site-header .header-line{width:1px;height:24px;background:rgba(17,16,16,.08)}
.site-header .mobile-toggle,.site-header .mobile-nav-contact{display:none}

.site-header .reserve-button{
  --header-button-bg:#5a2b12;
  --header-button-color:#f2efe9;
  --header-button-hover-bg:#f2efe9;
  --header-button-hover-color:#5a2b12;
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:52px;
  padding:0 8px 0 22px;
  overflow:hidden;
  border:1px solid #5a2b12;
  border-radius:14px;
  background:var(--header-button-bg);
  color:var(--header-button-color);
  box-shadow:0 12px 28px rgba(35,20,12,.14);
  font-family:"Commissioner",Arial,Helvetica,sans-serif;
  font-size:13px;
  font-weight:600;
  line-height:1;
  letter-spacing:.075em;
  text-transform:uppercase;
  transition:color .35s ease,transform .35s ease,box-shadow .35s ease;
}
.site-header .reserve-button::before{
  content:"";position:absolute;z-index:0;left:-108%;top:50%;width:100%;aspect-ratio:1;border-radius:50%;
  background:var(--header-button-hover-bg);transform:translateY(-50%);transition:left .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);
}
.site-header .reserve-button .leckerbiss-button__label{position:relative;z-index:2;color:inherit;white-space:nowrap}
.site-header .reserve-button .leckerbiss-button__icon{
  position:relative;z-index:2;width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;
  border:0;border-radius:50%;background:#f2efe9;color:#5a2b12;transition:transform .32s ease,background-color .32s ease,color .32s ease;
}
.site-header .reserve-button .leckerbiss-button__icon::before{
  content:"";width:14px;height:14px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17 17 7M9 7h8v8' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px 14px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17 17 7M9 7h8v8' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px 14px no-repeat;
}
.site-header .reserve-button:hover,.site-header .reserve-button:focus-visible,.site-header .reserve-button:active{
  color:var(--header-button-hover-color);transform:translateY(-2px);box-shadow:0 16px 34px rgba(35,20,12,.20);
}
.site-header .reserve-button:hover::before,.site-header .reserve-button:focus-visible::before,.site-header .reserve-button:active::before{left:0;transform:translateY(-50%) scale(1.75)}
.site-header .reserve-button:hover .leckerbiss-button__icon,.site-header .reserve-button:focus-visible .leckerbiss-button__icon,.site-header .reserve-button:active .leckerbiss-button__icon{background:#5a2b12;color:#f2efe9;transform:rotate(45deg)}
.site-header .reserve-button:focus-visible{outline:3px solid rgba(122,129,106,.38);outline-offset:3px}

body.menu-open{overflow:hidden}

@media(max-width:1200px){
  .site-header{padding:0 22px}
  .site-header-inner{width:min(1320px,calc(100vw - 44px))}
  .site-header .nav-primary{gap:18px}
  .site-header .nav-actions{gap:10px}
}

@media(max-width:780px){
  .site-header{
    height:92px;
    padding:0 20px;
    color:#f2efe9;
    background:rgba(17,16,16,.78);
    border-bottom:1px solid rgba(240,237,234,.10);
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .site-header-inner{width:100%;min-height:92px;justify-content:flex-start}
  .site-header .brand{position:relative;z-index:120;width:164px}
  .site-header .brand img{filter:grayscale(1) brightness(0) invert(1);opacity:.98}

  .site-header .site-nav{
    position:fixed;
    inset:0 0 calc(86px + env(safe-area-inset-bottom)) 0;
    z-index:110;
    display:block;
    padding:92px 28px 18px;
    overflow:hidden;
    color:#f2efe9;
    background:linear-gradient(180deg,rgba(17,14,12,.97),rgba(10,9,8,.97));
    opacity:0;
    visibility:hidden;
    transform:translateY(-8px);
    pointer-events:none;
    transition:opacity .25s ease,visibility .25s ease,transform .25s ease;
  }
  .site-header .site-nav.open{opacity:1;visibility:visible;transform:none;pointer-events:auto}
  .site-header .nav-primary,.site-header .nav-actions{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:0}
  .site-header .nav-primary a,.site-header .action-text{
    display:block;padding:12px 0;border-bottom:1px solid rgba(240,237,234,.11);
    color:#f2efe9;font-size:clamp(21px,3.2vh,28px);line-height:1.08;font-weight:600;letter-spacing:-.015em;text-transform:none;opacity:1;
  }
  .site-header .nav-actions{margin-top:0}
  .site-header .icon-button,.site-header .header-line{display:none}

  .site-header .reserve-button{
    --header-button-bg:#f2efe9;
    --header-button-color:#5a2b12;
    --header-button-hover-bg:#5a2b12;
    --header-button-hover-color:#f2efe9;
    width:100%;min-height:56px;margin-top:12px;padding:0 10px 0 20px;
    border-color:#f2efe9;background:#f2efe9;color:#5a2b12;font-size:16px;letter-spacing:.01em;text-transform:none;
  }
  .site-header .reserve-button .leckerbiss-button__label{display:block;color:inherit;text-align:left}
  .site-header .reserve-button .leckerbiss-button__icon{width:36px;height:36px;flex-basis:36px;background:#5a2b12;color:#f2efe9}
  .site-header .reserve-button:hover .leckerbiss-button__icon,.site-header .reserve-button:focus-visible .leckerbiss-button__icon,.site-header .reserve-button:active .leckerbiss-button__icon{background:#f2efe9;color:#5a2b12}

  .site-header .mobile-nav-contact{
    display:grid;grid-template-columns:1fr;gap:0;margin-top:14px;padding-top:10px;border-top:1px solid rgba(240,237,234,.10);
  }
  .site-header .mobile-contact-item{
    display:grid;grid-template-columns:86px minmax(0,1fr);align-items:center;gap:10px;min-height:44px;padding:6px 0;
    border-bottom:1px solid rgba(240,237,234,.08);color:#f2efe9;
  }
  .site-header .mobile-contact-item span{font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:rgba(242,239,233,.56)}
  .site-header .mobile-contact-item strong{font-size:14px;line-height:1.25;font-weight:600;color:#f2efe9;word-break:break-word}
  .site-header .mobile-nav-socials{display:flex;align-items:center;gap:12px;padding-top:14px}
  .site-header .mobile-nav-socials a{
    width:46px;height:46px;display:grid;place-items:center;border:1px solid rgba(240,237,234,.16);border-radius:50%;background:rgba(240,237,234,.06);color:#fff;
    transition:transform .22s ease,background-color .22s ease,border-color .22s ease;
  }
  .site-header .mobile-nav-socials a:hover,.site-header .mobile-nav-socials a:focus-visible,.site-header .mobile-nav-socials a:active{transform:translateY(-2px);background:var(--accent);border-color:var(--accent)}
  .site-header .mobile-nav-socials svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .site-header .mobile-nav-socials a:nth-child(2) svg,.site-header .mobile-nav-socials a:nth-child(3) svg{fill:currentColor;stroke:none}

  .site-header .mobile-toggle{
    position:fixed;top:20px;right:20px;z-index:130;width:52px;height:52px;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
    border:1px solid rgba(240,237,234,.18);border-radius:50%;background:rgba(240,237,234,.06);color:#f2efe9;
    opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s ease,visibility .22s ease,background-color .22s ease;
  }
  .site-header .mobile-toggle span{width:22px;height:1.8px;background:currentColor;transition:transform .25s ease}
  .site-header .mobile-toggle[aria-expanded="true"]{opacity:1;visibility:visible;pointer-events:auto}
  .site-header .mobile-toggle[aria-expanded="true"] span:first-child{transform:translateY(4.4px) rotate(45deg)}
  .site-header .mobile-toggle[aria-expanded="true"] span:last-child{transform:translateY(-4.4px) rotate(-45deg)}
}

@media(max-width:780px) and (max-height:700px){
  .site-header{height:82px}
  .site-header-inner{min-height:82px}
  .site-header .brand{width:138px}
  .site-header .site-nav{padding:80px 24px 12px}
  .site-header .nav-primary a,.site-header .action-text{padding:8px 0;font-size:19px}
  .site-header .reserve-button{min-height:48px;margin-top:8px}
  .site-header .mobile-nav-contact{margin-top:8px;padding-top:6px}
  .site-header .mobile-contact-item{min-height:34px;padding:3px 0}
  .site-header .mobile-nav-socials{padding-top:8px}
  .site-header .mobile-nav-socials a{width:38px;height:38px}
  .site-header .mobile-toggle{top:15px;right:16px;width:46px;height:46px}
}