

.nav__sentinel{
  position:absolute;
  top:0;
  left:0;
  width:var(--hair);
  height:var(--sp-3);
  pointer-events:none;
  visibility:hidden;
}

.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:var(--z-nav);
  height:var(--nav-h);
  display:flex;
  align-items:center;
  gap:var(--sp-6);
  padding:0 var(--page-x) var(--hair);
  color:var(--fg);
  transition:color var(--dur-2) var(--ease-swap);
}

.nav::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:var(--z-under);
  background:var(--nav-ground);
  opacity:0;
  transition:
    opacity    var(--dur-2) var(--ease-swap),
    background-color var(--dur-2) var(--ease-swap);
}
.nav.is-stuck::before{
  opacity:var(--state-scrim-alpha);
  backdrop-filter:blur(14px);          
  -webkit-backdrop-filter:blur(14px);
}

.nav::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:var(--hair);
  background:var(--line);
  opacity:0;
  pointer-events:none;
  transition:
    opacity          var(--dur-2) var(--ease-swap),
    background-color var(--dur-2) var(--ease-swap);
}
.nav.is-stuck::after{ opacity:1; }

.nav[data-tone="light"]{
  --fg         : var(--ink-900);
  --fg-mut     : var(--ink-500);
  --line       : var(--line-on-paper);
  --line-strong: var(--line-on-paper-strong);
  --focus      : var(--signal-on-paper);
  --nav-ground : var(--paper-200);
  --nav-inv-bg : var(--ink-1000);
  --nav-inv-fg : var(--paper-100);
}
.nav[data-tone="dark"]{
  --fg         : var(--paper-100);
  --fg-mut     : var(--paper-500);
  --line       : var(--line-on-ink);
  --line-strong: var(--line-on-ink-strong);
  --focus      : var(--signal-on-ink);
  --nav-ground : var(--ink-1000);
  --nav-inv-bg : var(--paper-100);
  --nav-inv-fg : var(--ink-1000);
}

.brand{
  display:inline-flex;
  align-items:center;
  gap:var(--sp-3);
  color:inherit;
  flex:0 0 auto;
}
.brand__mark{ width:15px; height:15px; flex:0 0 auto; }  
.brand__word{
  font-family:var(--ff-display);
  font-weight:var(--wt-display);
  font-stretch:var(--wd-mark);
  font-size:var(--fs-body);
  line-height:1;
  letter-spacing:var(--ls-mark);
  text-transform:uppercase;
}

.nav__links{
  display:flex;
  align-items:center;
  gap:var(--sp-7);
  margin-left:calc(var(--rail) + var(--sp-8));
}
.nav__link{
  position:relative;
  display:inline-block;
  padding:var(--sp-2) 0;
  color:var(--fg);
  font-family:var(--ff-display);
  font-weight:var(--wt-body-strong);
  font-stretch:var(--wd-row);
  font-size:var(--fs-small);
  letter-spacing:.01em;
  opacity:.80;
  transition:opacity var(--dur-1) var(--ease-out);
}
.nav__link::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:var(--hair);
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform var(--dur-2) var(--ease-out);
}
.nav__link:hover{ opacity:1; }
.nav__link:hover::after{ transform:none; }
.nav__link[aria-current="page"]{ opacity:1; }
.nav__link[aria-current="page"]::after{ transform:none; }

.nav__end{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:var(--sp-5);
}

.nav__note{
  color:var(--fg-mut);
  font-size:var(--fs-small);
  letter-spacing:.005em;
  white-space:nowrap;
  border-bottom:var(--hair) solid transparent;
  padding-bottom:2px;
  transition:
    color        var(--dur-1) var(--ease-out),
    border-color var(--dur-1) var(--ease-out);
}
.nav__note:hover{ color:var(--fg); border-bottom-color:currentColor; }

.nav__cta{
  display:inline-flex;
  align-items:center;
  padding:var(--sp-2) var(--sp-4);
  border:var(--hair) solid var(--line-strong);
  border-radius:var(--radius);
  color:var(--fg);
  font-family:var(--ff-display);
  font-weight:var(--wt-body-strong);
  font-stretch:var(--wd-row);
  font-size:var(--fs-small);
  letter-spacing:.01em;
  white-space:nowrap;
  transition:
    background-color var(--dur-2) var(--ease-swap),
    color            var(--dur-2) var(--ease-swap),
    border-color     var(--dur-2) var(--ease-swap);
}
.nav__cta:hover{
  background:var(--nav-inv-bg);
  color:var(--nav-inv-fg);
  border-color:var(--nav-inv-bg);
}

.nav__toggle{
  display:none;
  align-items:center;
  gap:var(--sp-3);
  padding:var(--sp-4) var(--sp-2);
  margin-right:calc(var(--sp-2) * -1);
  color:var(--fg);
  font-family:var(--ff-mono);
  font-size:var(--fs-micro);
  font-weight:var(--wt-mono);
  letter-spacing:var(--ls-mono);
  text-transform:uppercase;
}
.nav__bars{ display:block; width:18px; height:9px; position:relative; }  
.nav__bars::before,
.nav__bars::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height:var(--hair);
  background:currentColor;
}
.nav__bars::before{ top:0; }
.nav__bars::after { bottom:0; }

html.is-locked,
html.is-locked body{ overflow:hidden; }

html.no-js .nav{
  position:relative;                   
  height:auto;
  flex-wrap:wrap;
  gap:var(--sp-4) var(--sp-5);
  padding-top:var(--sp-4);
  padding-bottom:var(--sp-4);
}
html.no-js .nav::after{ opacity:1; }
html.no-js .nav__links{
  display:flex;
  flex-wrap:wrap;
  gap:var(--sp-4) var(--sp-5);
  margin-left:0;
}
html.no-js .nav__note{ display:inline; }
html.no-js .nav__toggle{ display:none; }
html.no-js .nav__sentinel,
html.no-js .sheet{ display:none; }

.sheet{
  position:fixed;
  inset:0;
  z-index:var(--z-sheet);
  display:flex;
  flex-direction:column;
  padding:0 var(--page-x) var(--sp-8);
  background:var(--ink-1000);
  color:var(--paper-100);
  --fg         : var(--paper-100);
  --fg-mut     : var(--paper-500);
  --line       : var(--line-on-ink);
  --line-strong: var(--line-on-ink-strong);
  --signal     : var(--signal-on-ink);
  --focus      : var(--signal-on-ink);
  --btn-bg     : var(--paper-100);
  --btn-fg     : var(--ink-1000);
  --btn-bg-hov : var(--white);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity var(--dur-2) var(--ease-out), visibility 0s linear var(--dur-2);
}
.sheet.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity var(--dur-2) var(--ease-out), visibility 0s;
}

.sheet__rail{
  position:absolute;
  left:var(--page-x);
  top:0; bottom:0;
  width:var(--rail);
  border-right:var(--hair-2) solid var(--line);
  pointer-events:none;
}

.sheet__head{
  flex:0 0 auto;
  height:var(--nav-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--sp-5);
}
.sheet__close{
  display:inline-flex;
  align-items:center;
  gap:var(--sp-3);
  padding:var(--sp-4) var(--sp-2);
  margin-right:calc(var(--sp-2) * -1);
  color:var(--fg);
  font-family:var(--ff-mono);
  font-size:var(--fs-micro);
  font-weight:var(--wt-mono);
  letter-spacing:var(--ls-mono);
  text-transform:uppercase;
}
.sheet__x{ position:relative; display:block; width:14px; height:14px; }  
.sheet__x::before,
.sheet__x::after{
  content:"";
  position:absolute;
  top:50%; left:0; right:0;
  height:var(--hair);
  background:currentColor;
}
.sheet__x::before{ transform:rotate(45deg); }
.sheet__x::after { transform:rotate(-45deg); }

.sheet__inner{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  margin-left:var(--rail);
  padding-top:var(--sp-7);
  display:flex;
  flex-direction:column;
}

.sheet__list{ display:flex; flex-direction:column; margin-top:auto; }
.sheet__item{ border-top:var(--hair) solid var(--line); }
.sheet__item:last-child{ border-bottom:var(--hair) solid var(--line); }

.sheet__link{
  display:flex;
  align-items:flex-start;
  gap:var(--sp-5);
  padding:var(--sp-5) 0;
  color:var(--fg);
}
.sheet__word{
  font-family:var(--ff-display);
  font-weight:var(--wt-display);
  font-stretch:var(--wd-display);
  font-size:var(--fs-chapter);
  line-height:var(--lh-display);
  letter-spacing:var(--ls-display);
  word-spacing:var(--ws-display);
}
.sheet__idx{
  flex:0 0 auto;
  padding-top:.32em;
  font-family:var(--ff-mono);
  font-size:var(--fs-micro);
  font-weight:var(--wt-mono-lt);
  letter-spacing:var(--ls-mono);
  color:var(--fg-mut);
}
.sheet__link[aria-current="page"] .sheet__idx{ color:var(--fg); }

.sheet__foot{
  margin-top:auto;
  padding-top:var(--sp-8);
  display:flex;
  flex-direction:column;
  gap:var(--sp-5);
  align-items:flex-start;
}
.sheet__cta{ align-self:flex-start; }
.sheet__note{
  color:var(--fg-mut);
  font-size:var(--fs-small);
  border-bottom:var(--hair) solid var(--line-strong);
  padding-bottom:2px;
  transition:color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out);
}
.sheet__note:hover{ color:var(--fg); border-bottom-color:currentColor; }
.sheet__meta{
  margin-top:var(--sp-3);
  display:inline-flex;
  align-items:center;
  gap:var(--sp-3);
  color:var(--fg-mut);
}

.sheet__item,
.sheet__foot{
  opacity:0;
  transform:translateY(var(--sp-5));
  transition:
    opacity   var(--dur-3) var(--ease-out),
    transform var(--dur-3) var(--ease-out);
}
.sheet.is-open .sheet__item,
.sheet.is-open .sheet__foot{
  opacity:1;
  transform:none;
  transition-delay:calc(var(--i, 0) * var(--stagger));
}

@media (max-width:1100px){
  .nav__links,
  .nav__note{ display:none; }
  .nav__toggle{ display:inline-flex; }

  
  .nav__cta{
    padding:0 0 2px;
    border:0;
    border-bottom:var(--hair) solid var(--line-strong);
  }
  .nav__cta:hover{
    background:none;
    color:var(--fg);
    border-bottom-color:currentColor;
  }
}
@media (max-width:760px){
  .nav{ gap:var(--sp-4); }
  .nav__end{ gap:var(--sp-5); }
  .nav__cta{ font-size:var(--fs-fine); }

  
  .page-index .nav__cta,
  .page-access .nav__cta{ display:none; }
  html.no-js .page-index .nav__cta,
  html.no-js .page-access .nav__cta{ display:inline-flex; }
  .nav__toggle{ gap:var(--sp-2); }
  .sheet__close{ gap:var(--sp-2); }
  .sheet__inner{ padding-top:var(--sp-6); }
  .sheet__link{ padding:var(--sp-4) 0; }
  
  .sheet__cta{ align-self:stretch; justify-content:center; }
}
@media (max-width:420px){
  .nav__toggle-label,
  .sheet__close-label{
    position:absolute;
    width:1px;height:1px;
    margin:-1px;padding:0;border:0;
    clip-path:inset(50%);
    overflow:hidden;
    white-space:nowrap;
  }
}

.foot{
  position:relative;
  background:var(--bg);
  color:var(--fg);
  padding:var(--pad-ch-y-lg) var(--page-x) var(--sp-7);
  overflow:hidden;
}
.foot__inner{
  position:relative;
  z-index:var(--z-content);
  margin-left:var(--rail);
  max-width:var(--shell);
}

.foot__brand{ grid-column:1 / span 5; }
.foot__word{
  display:inline-flex;
  align-items:center;
  gap:var(--sp-3);
  font-family:var(--ff-display);
  font-weight:var(--wt-display);
  font-stretch:var(--wd-mark);
  font-size:var(--fs-chapter);
  line-height:1;
  letter-spacing:var(--ls-mark);
  text-transform:uppercase;
  color:var(--fg);
}
.foot__mark{ width:.58em; height:.58em; flex:0 0 auto; }
.foot__tag{
  margin-top:var(--sp-5);
  max-width:var(--measure-tight);
  color:var(--fg-mut);
  font-size:var(--fs-small);
}

.foot__col--a{ grid-column:6 / span 2; }
.foot__col--b{ grid-column:8 / span 2; }
.foot__col--c{ grid-column:10 / span 3; }

.foot__k{
  margin:0 0 var(--sp-4);
  display:flex;
  align-items:center;
  gap:var(--sp-3);
  font-family:var(--ff-mono);
  font-weight:var(--wt-mono);
  font-size:var(--fs-micro);
  font-stretch:normal;
  line-height:var(--lh-mono);
  letter-spacing:var(--ls-mono);
  word-spacing:normal;
  text-transform:uppercase;
  color:var(--fg-mut);
}
.foot__k--status{ color:var(--fg); }

.foot__list li{ border-top:var(--hair) solid var(--line); }
.foot__list a{
  display:block;
  padding:var(--sp-3) 0;
  font-size:var(--fs-small);
  color:var(--fg-mut);
  overflow-wrap:anywhere;
  transition:color var(--dur-1) var(--ease-out);
}
.foot__list a:hover{ color:var(--fg); }

.foot__status{
  margin:0;
  padding-top:var(--sp-3);
  border-top:var(--hair) solid var(--line);
  font-size:var(--fs-small);
  line-height:1.5;
  color:var(--fg-mut);
}

.foot__bottom{
  margin-top:var(--sp-10);
  padding-top:var(--sp-5);
  border-top:var(--hair) solid var(--line);
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:var(--sp-5) var(--sp-7);
  color:var(--fg-mut);
}
.foot__standing{ margin:0; color:var(--fg); }
.foot__legal{
  margin-left:auto;
  font-family:var(--ff-mono);
  font-size:var(--fs-fine);
  font-weight:var(--wt-mono-lt);
  letter-spacing:.015em;
  text-transform:none;
  color:var(--fg-mut);
}

@media (max-width:1100px){
  .foot__brand{ grid-column:1 / span 12; }
  .foot__col--a{ grid-column:1 / span 4; margin-top:var(--sp-8); }
  .foot__col--b{ grid-column:5 / span 4; margin-top:var(--sp-8); }
  .foot__col--c{ grid-column:9 / span 4; margin-top:var(--sp-8); }

  
  .foot__bottom{ flex-direction:column; align-items:flex-start; gap:var(--sp-3); }
  .foot__legal{ margin-left:0; }
}
@media (max-width:760px){
  .foot{ padding:var(--pad-ch-y) var(--page-x) var(--sp-6); }
  .foot__col--a,
  .foot__col--b,
  .foot__col--c{ grid-column:1 / -1; margin-top:var(--sp-7); }
  .foot__bottom{ margin-top:var(--sp-9); }
}

@media (prefers-reduced-motion: reduce){
  .sheet__item,
  .sheet__foot{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .nav__link::after{ transform:none; }
  .nav__link:not([aria-current="page"])::after{ opacity:0; }
  .nav__link:not([aria-current="page"]):hover::after{ opacity:1; }
}
