@import url("/quiet-type.css?v=scene-restored-20261007");
/* One desktop navigation scale for the homepage, pages, and case studies.
   Keep page colors, eye interactions, and randomized underlines in their owners. */
.desktop-nav-arrow { display: none; }
@media (min-width: 769px) {
  html:root {
    --desktop-nav-logo: 34px;
    --desktop-nav-label: 16px;
    --desktop-nav-icon: 22px;
    --desktop-nav-height: 104px;
    --desktop-nav-bar-height: 76px;
    --desktop-nav-gutter: clamp(24px, 5.3vw, 88px);
    --desktop-nav-gap: clamp(24px, 2.64vw, 38px);
    --header-height: var(--desktop-nav-height);
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) {
    box-sizing: border-box;
    top: 0; left: 0; right: 0;
    width: auto; height: var(--desktop-nav-bar-height); min-height: var(--desktop-nav-bar-height);
    /* Margins inset fixed, absolute, and in-flow headers without shifting them. */
    margin: 16px var(--desktop-nav-gutter); padding: 0 clamp(16px, 2vw, 28px);
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: nowrap; gap: 32px;
  }
  /* The homepage starts open, then settles into the compact floating bar. */
  html:root body:has(.journey) header.site-header {
    transition: top .25s, height .25s, min-height .25s, margin .25s, padding .25s, background-color .25s;
  }
  html:root body:has(.journey) header.site-header:not(.is-scrolled) {
    height: var(--desktop-nav-height); min-height: var(--desktop-nav-height);
    margin-block: 0; padding-inline: 0;
  }
  html:root.studio-preview body header.masthead::after { left: 0; right: 0; }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(.wordmark, .nav-logo) {
    display: inline-flex; align-items: baseline; flex: none; gap: 0;
    margin: 0; padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: var(--desktop-nav-logo); font-weight: 800; line-height: 1;
    letter-spacing: -2.3px; text-transform: uppercase; white-space: nowrap;
    text-decoration: none;
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(.wordmark, .nav-logo) strong {
    font-weight: 800; letter-spacing: -2.6px;
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(.wordmark, .nav-logo) > span {
    font-weight: 400; margin-left: 0;
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(nav, .nav-links) {
    display: flex; flex-direction: row; align-items: center; flex: none;
    gap: var(--desktop-nav-gap); margin: 0 0 0 auto; padding: 0;
    list-style: none;
    font: 400 var(--desktop-nav-label)/1.2 "Helvetica Neue", Helvetica, Arial, sans-serif;
    letter-spacing: 0; text-transform: uppercase;
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(nav, .nav-links) a {
    display: inline-flex; align-items: center; justify-content: center; gap: 20px;
    min-height: 44px; padding: 0; margin: 0;
    font: inherit; letter-spacing: inherit; text-transform: inherit; white-space: nowrap;
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(nav, .nav-links) :is(.pixel-arrow, .px-arrow, .desktop-nav-arrow) {
    display: inline-block; flex: 0 0 var(--desktop-nav-icon);
    width: var(--desktop-nav-icon); height: var(--desktop-nav-icon);
    margin: 0; vertical-align: middle;
  }
  html:root body nav.nav[aria-label="Main navigation"] .desktop-nav-arrow {
    background: currentColor;
    clip-path: polygon(28.57% 0,100% 0,100% 71.43%,85.71% 71.43%,85.71% 28.57%,71.43% 28.57%,71.43% 42.86%,57.14% 42.86%,57.14% 57.14%,42.86% 57.14%,42.86% 71.43%,28.57% 71.43%,28.57% 85.71%,14.29% 85.71%,14.29% 100%,0 100%,0 85.71%,14.29% 85.71%,14.29% 71.43%,28.57% 71.43%,28.57% 57.14%,42.86% 57.14%,42.86% 42.86%,57.14% 42.86%,57.14% 28.57%,71.43% 28.57%,71.43% 14.29%,28.57% 14.29%);
  }
  html:root body :is(header.site-header, header.masthead, nav.nav[aria-label="Main navigation"]) > :is(.menu-toggle, .menu-button, .nav-toggle) { display: none; }
}
@media (min-width: 769px) and (pointer: coarse) {
  html:root { --desktop-nav-label: 16px; }
}

