/* Shared geometry for every interior-page navigation bar. The homepage keeps
   its independent orange ticker offset and is intentionally excluded. */
@media(min-width:901px){
  .about-nav,
  .works-page .nav{
    top:0;
    height:72px;
    padding:0 4.8vw;
    display:flex;
    align-items:center;
    justify-content:space-between;
  }

  .about-nav nav,
  .works-page .nav nav{
    display:flex!important;
    align-items:center;
    align-self:center;
    justify-content:flex-end;
    gap:28px;
    padding:0;
    font-family:"Noto Sans SC","Helvetica Neue",Arial,sans-serif;
    font-size:14px;
    font-weight:700;
    line-height:1;
    text-transform:none;
  }

  .about-nav nav a,
  .works-page .nav nav a{
    position:relative;
    width:max-content;
    white-space:nowrap;
  }

  .about-nav nav a:after,
  .works-page .nav nav a:after{
    content:"";
    position:absolute;
    left:0;
    right:100%;
    bottom:-10px;
    height:2px;
    background:#ff5a18;
    transition:right .25s ease;
  }

  .about-nav nav a:hover:after,
  .about-nav nav a.is-current:after,
  .works-page .nav nav a:hover:after,
  .works-page .nav nav a.is-current:after{
    right:0;
  }

  .about-menu-button,
  .works-page .menu-button{
    display:none!important;
  }

  .works-page .nav{
    background:rgba(244,244,240,.92)!important;
    border-bottom:1px solid rgba(0,0,0,.1)!important;
    backdrop-filter:blur(18px)!important;
  }
}

@media(max-width:900px){
  .about-nav,
  .works-page .nav{
    top:0;
    height:60px;
    padding:0 20px;
  }

  .about-nav nav,
  .works-page .nav nav{
    display:none!important;
  }

  .about-menu-button,
  .works-page .menu-button{
    display:grid!important;
  }
}
