/* untrod.app site header (build.py NAV). Static HTML outside the design runtime, so it is the same
   with JavaScript off. Design tokens from /ds/tokens; the button matches the design system Button. */
.site-nav { position: relative; z-index: 20; font-family: var(--font-body); box-sizing: border-box; width: 100%; }
.site-nav__bar { max-width: 1080px; margin: 0 auto; padding: 0 20px; height: 72px; display: flex; align-items: center; gap: 28px; }
.site-nav__logo { font: 700 24px/1 var(--font-display); letter-spacing: -0.01em; color: var(--text-primary); text-decoration: none; margin-right: auto; }
.site-nav__logo:hover { color: var(--text-primary); text-decoration: none; }
.site-nav__links { display: flex; align-items: center; gap: 24px; margin: 0; padding: 0; list-style: none; }
.site-nav a.site-nav__link { font: 600 15px/20px var(--font-display); color: var(--text-secondary); text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.site-nav a.site-nav__link:hover { color: var(--text-primary); text-decoration: none; }
.site-nav a.site-nav__link[aria-current="page"] { color: var(--text-primary); border-bottom-color: var(--accent); }
.site-nav a.site-nav__cta { display: inline-flex; align-items: center; justify-content: center; height: 44px; padding: 0 20px; border-radius: var(--radius-pill); background: var(--accent); box-shadow: 0 4px 0 var(--lip-accent); color: var(--text-on-accent); font: 600 15px/1 var(--font-display); text-decoration: none; white-space: nowrap; }
.site-nav a.site-nav__cta:hover { background: var(--accent-pressed); color: var(--text-on-accent); text-decoration: none; }
.site-nav a.site-nav__cta:active { transform: translateY(2px); box-shadow: 0 2px 0 var(--lip-accent); }
.site-nav a:focus-visible, .site-nav button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 8px; }
.site-nav a.site-nav__cta:focus-visible { border-radius: var(--radius-pill); }
.site-nav__toggle, .site-nav__close { display: none; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0 -10px 0 0; padding: 0; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--text-primary); cursor: pointer; }
.site-nav__toggle:hover, .site-nav__close:hover { background: var(--accent-wash); }
.site-nav svg { width: 24px; height: 24px; }
.site-nav__sheet[hidden], .site-nav__scrim[hidden] { display: none; }

@media (max-width: 760px) {
  .site-nav__bar { height: 64px; gap: 8px 16px; }
  /* Without JavaScript the links simply wrap onto a second row. */
  html:not(.js) .site-nav__bar { height: auto; min-height: 64px; flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
  html:not(.js) .site-nav__links { gap: 20px; }
  .js .site-nav__bar > .site-nav__links, .js .site-nav__bar > .site-nav__cta { display: none; }
  .js .site-nav__toggle { display: inline-flex; }
  .site-nav__scrim { position: fixed; inset: 0; z-index: 40; background: rgba(22, 22, 34, .32); }
  .site-nav__sheet { position: fixed; z-index: 41; top: 8px; left: 8px; right: 8px; max-height: calc(100vh - 16px); overflow-y: auto; padding: 8px 20px 24px; border-radius: var(--radius-l); background: var(--surface-raised); box-shadow: var(--shadow-float); }
  .site-nav__sheet-head { height: 56px; display: flex; align-items: center; justify-content: space-between; }
  .site-nav__close { display: inline-flex; }
  .site-nav__sheet .site-nav__links { flex-direction: column; align-items: stretch; gap: 0; margin: 4px 0 20px; }
  .site-nav__sheet a.site-nav__link { display: block; padding: 14px 0; font-size: 20px; line-height: 24px; border-bottom: 1px solid var(--line-hairline); }
  .site-nav__sheet a.site-nav__link[aria-current="page"] { border-bottom-color: var(--line-hairline); box-shadow: inset 3px 0 0 var(--accent); padding-left: 12px; }
  .site-nav__sheet a.site-nav__cta { display: flex; width: 100%; height: 52px; font-size: 17px; }
}
@media (prefers-reduced-motion: no-preference) {
  .site-nav__sheet:not([hidden]) { animation: site-nav-in 180ms var(--ease-standard, ease-out); }
  @keyframes site-nav-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
}

/* Site footer (build.py footer_html): the home page's footer card, identical on every page. */
html body #dc-root, html body #dc-root > .sc-host { height: auto; }
.site-footer { position: relative; z-index: 1; font-family: var(--font-body); text-align: left; box-sizing: border-box; width: 100%; max-width: 1080px; margin: 0 auto; padding: 72px 8px 48px; }
.site-footer__card { border-radius: var(--radius-l); background: var(--surface-card); box-shadow: var(--shadow-card); padding: clamp(24px, 4vw, 40px); display: flex; flex-direction: column; gap: 32px; }
.site-footer__top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px 48px; }
.site-footer__brand { display: flex; flex-direction: column; gap: 10px; max-width: 300px; }
.site-footer a.site-footer__logo { font: 700 28px/1 var(--font-display); letter-spacing: -0.01em; color: var(--text-primary); text-decoration: none; }
.site-footer__brand p { margin: 0; font-size: 15px; line-height: 1.45; color: var(--text-secondary); text-wrap: pretty; }
.site-footer__cols { display: flex; flex-wrap: wrap; gap: 32px 56px; }
.site-footer__col { display: flex; flex-direction: column; gap: 12px; min-width: 140px; }
.site-footer__head { font: 700 12px/16px var(--font-display); letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-tertiary); }
.site-footer__col a { font-size: 15px; line-height: 20px; color: var(--text-secondary); text-decoration: none; }
.site-footer__col a:hover { color: var(--text-primary); text-decoration: underline; }
.site-footer__col a[aria-current="page"] { color: var(--text-primary); }
.site-footer a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
.site-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding-top: 20px; border-top: 1px solid var(--line-hairline); font-size: 13px; line-height: 18px; color: var(--text-secondary); }
/* Home: the design's spacing, and room for the fixed walk progress bar and the pinned sign-up button on phones. */
.site-footer--home { padding: 120px 8px 140px; }
@media (max-width: 760px) {
  .site-footer--home { padding-bottom: 168px; }
}

