:root{--header-height:100px;--header-compact:78px}
html{scroll-padding-top:calc(var(--header-compact) + 18px)}
.header{position:fixed;height:calc(var(--header-height) + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);background:var(--red);color:var(--cream);transform:translateY(0);transition:transform .3s cubic-bezier(.2,.7,.2,1),background-color .25s,color .25s,height .25s,box-shadow .25s}
.header.is-scrolled{height:calc(var(--header-compact) + env(safe-area-inset-top,0px));background:var(--red);color:var(--cream);border-bottom-color:#f4eddf2a;box-shadow:0 4px 24px #4c292119}
.header.is-hidden{transform:translateY(-110%);pointer-events:none}
.header.is-scrolled .brand>img{width:42px;height:42px;border-color:#f4eddf40}
.header.is-scrolled .nav a:hover{border-color:var(--cream)}
.header.is-scrolled .nav-contact span{border-color:#f4eddf66}
.header.is-scrolled .nav-contact:hover span{background:var(--cream);color:var(--red)}
.skip{z-index:100}
.journey-pin{padding-top:calc(var(--header-compact) + 16px + env(safe-area-inset-top,0px))}
@media(max-width:1100px){.header{gap:22px}.nav{gap:20px}}
@media(max-width:800px){
  :root{--header-height:88px;--header-compact:74px}
  .header{gap:20px}.nav-contact{display:none}
  .menu{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:44px;height:44px;flex-shrink:0}
  .menu>span{width:23px;height:1px;background:currentColor;transition:transform .25s}
  .menu[aria-expanded=true]>span:first-child{transform:translateY(4px) rotate(45deg)}
  .menu[aria-expanded=true]>span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .header.is-scrolled .brand>img{width:38px;height:38px}
  .mobile-menu:not([hidden]){display:flex;flex-direction:column;position:fixed;left:0;right:0;top:calc(var(--header-height) + env(safe-area-inset-top,0px));max-height:calc(100dvh - var(--header-height) - env(safe-area-inset-top,0px));overflow-y:auto;overscroll-behavior:contain;background:var(--dark-red);color:var(--cream);padding:16px var(--pad) 25px;z-index:29;border-bottom:1px solid #f4eddf2a;box-shadow:0 18px 24px #4c29211a}
  .header.is-scrolled+.mobile-menu:not([hidden]){top:calc(var(--header-compact) + env(safe-area-inset-top,0px));max-height:calc(100dvh - var(--header-compact) - env(safe-area-inset-top,0px))}
  .mobile-menu>a{font:23px/1.4 var(--serif);padding:13px 0;border-bottom:1px solid #f4eddf2a}
  .mobile-menu>a:last-child{border-bottom:0}
}
@media(max-width:560px){:root{--header-height:82px;--header-compact:70px}.header.is-scrolled .brand>img{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.header{transition:none}}
