/* Safa Soch V12.3.5 — iOS Safari mobile navigation reliability fix
   Keeps the mobile menu in the viewport instead of allowing Safari to
   resolve position:fixed against a backdrop-filtered sticky header. */

@media (max-width:1060px){
  /* iOS/WebKit can use a filtered ancestor as the containing block for
     position:fixed descendants. The primary nav lives inside the header,
     so remove the header filter on mobile and use an opaque brand surface. */
  body.ss-brand-system .ss-header,
  body.hi-body .ss-header{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    filter:none!important;
    transform:none!important;
    background:#032c23!important;
    overflow:visible!important;
  }

  /* The backdrop should dim the page, not blur the actual site. Heavy
     backdrop blur was also contributing to the 'everything is blurred'
     appearance in Safari. */
  body.ss-brand-system .ss-menu-backdrop,
  body.hi-body .ss-menu-backdrop{
    display:block!important;
    position:fixed!important;
    inset:0!important;
    z-index:880!important;
    background:rgba(1,23,18,.68)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity .18s ease,visibility 0s linear .18s!important;
  }
  body.ss-brand-system .ss-menu-backdrop.show,
  body.hi-body .ss-menu-backdrop.show{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition-delay:0s!important;
  }

  /* A true viewport sheet: it starts directly under the header and owns
     the remaining screen. This is more reliable than max-height alone on
     iOS Safari's changing browser chrome. */
  body.ss-brand-system .ss-nav,
  body.hi-body .ss-nav{
    position:fixed!important;
    top:76px!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    margin:0!important;
    padding:14px 20px calc(24px + env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    z-index:940!important;
    border:0!important;
    border-radius:0!important;
    background:#021f19!important;
    box-shadow:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(0,-8px,0)!important;
    transition:opacity .18s ease,transform .2s ease,visibility 0s linear .2s!important;
    align-content:start!important;
  }
  body.ss-brand-system .ss-nav.open,
  body.hi-body .ss-nav.open{
    display:grid!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(0,0,0)!important;
    transition-delay:0s!important;
  }

  body.ss-brand-system .ss-nav-main,
  body.hi-body .ss-nav-main{
    display:grid!important;
    width:100%!important;
    gap:0!important;
    margin:0!important;
    border-top:1px solid rgba(255,255,255,.12)!important;
  }
  body.ss-brand-system .ss-nav-main a,
  body.hi-body .ss-nav-main a{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:56px!important;
    padding:0 2px!important;
    border-bottom:1px solid rgba(255,255,255,.11)!important;
    border-radius:0!important;
    color:#fcf9f2!important;
    background:transparent!important;
    font-family:var(--ss-serif,Georgia,serif)!important;
    font-size:clamp(28px,7.5vw,38px)!important;
    line-height:1.05!important;
    font-weight:500!important;
  }
  body.ss-brand-system .ss-nav-main a:after,
  body.hi-body .ss-nav-main a:after{display:none!important;}

  body.ss-brand-system .ss-nav-end,
  body.hi-body .ss-nav-end{
    display:grid!important;
    grid-template-columns:1fr 52px 52px!important;
    gap:9px!important;
    width:100%!important;
    padding:18px 0 0!important;
    border-left:0!important;
  }
  body.ss-brand-system .ss-nav-end .ss-lang,
  body.hi-body .ss-nav-end .ss-lang{
    display:flex!important;
    align-items:center!important;
    min-height:50px!important;
    padding:0 14px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.045)!important;
  }
  body.ss-brand-system .ss-nav-end .ss-search-btn,
  body.ss-brand-system .ss-nav-end .ss-a11y-btn,
  body.hi-body .ss-nav-end .ss-search-btn,
  body.hi-body .ss-nav-end .ss-a11y-btn{
    width:52px!important;
    height:50px!important;
    border-radius:14px!important;
  }
  body.ss-brand-system .ss-nav-end .ss-join,
  body.hi-body .ss-nav-end .ss-join{
    grid-column:1/-1!important;
    width:100%!important;
    min-height:54px!important;
    margin:2px 0 0!important;
    justify-content:space-between!important;
    padding:0 18px!important;
  }

  body.ss-menu-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
}

@media (max-width:760px){
  body.ss-brand-system .ss-nav,
  body.hi-body .ss-nav{
    top:72px!important;
    padding:12px 18px calc(22px + env(safe-area-inset-bottom))!important;
  }
  body.ss-brand-system .ss-nav-main a,
  body.hi-body .ss-nav-main a{
    min-height:54px!important;
    font-size:clamp(27px,8vw,35px)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  body.ss-brand-system .ss-nav,
  body.hi-body .ss-nav,
  body.ss-brand-system .ss-menu-backdrop,
  body.hi-body .ss-menu-backdrop{transition:none!important;}
}