@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(../fonts/inter-latin-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  --ink:        #010101;
  --ink-raise:  #0d0d0d;
  --ink-panel:  #141414;
  --rule:       #565654;
  --rule-soft:  #2a2a28;
  --paper:      #ffffff;
  --paper-2:    #c9c9c5;
  --paper-3:    #8e9291;
  --teal:       #8e9291;          
  --teal-lift:  #c9c9c5;
  --teal-dim:   rgba(255,255,255,.06);
  --velox:      #992323;
  --velox-lift: #c2453f;
  --accent:     #c2453f;
  --bar-bg:     transparent;
  --offwhite:   #cfcdc5;   
  --grey:       #8e9291;
  --mute:       #565654;
  --shell:  1440px;
  --gutter: 32px;
  --label-col: 220px;
  --sans: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --cond: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
body[data-tone="light"] {
  --ink:        #cfcdc5;
  --ink-raise:  #c5c3bb;
  --ink-panel:  #bdbbb3;
  --rule:       #55554f;
  --rule-soft:  #b3b1a9;
  --paper:      #0e0e0d;
  --paper-2:    #33332f;
  --paper-3:    #55554f;
  --teal:       #55554f;
  --teal-lift:  #33332f;
  --teal-dim:   rgba(1,1,1,.07);
  --accent:     #992323;
  --offwhite:   #cfcdc5;
}

html { scroll-behavior: smooth; }
body {
  background: var(--ink); background-image: none;
  color: var(--paper); font-family: var(--sans);
  font-size: 15px; line-height: 1.2; letter-spacing: -.01em;
}
p { color: var(--paper); line-height: 1.45; }
a:hover { color: var(--paper); }
:focus-visible { outline-color: var(--velox-lift); }

h1, h2, h3, h4 { font-weight: 400; }
.display {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(2.6rem, 3.9vw, 3.5rem);          
  line-height: 1.1; letter-spacing: -.02em; text-transform: none;
}
.hero .display span { display: inline; color: var(--paper-3); }
.hero .display span::before { content: " "; }
.h2 {
  font-family: var(--sans); font-weight: 400;
  font-size: clamp(1.75rem, 2.8vw, 2.5rem);          
  line-height: 1.15; letter-spacing: -.02em; text-transform: none;
}
.h3 { font-family: var(--sans); font-weight: 700; font-size: 1.1rem; letter-spacing: -.01em; }
.label, .label--red, .sheet__key .label {
  font: 500 12px/1.05 var(--sans); letter-spacing: .04em; text-transform: uppercase; color: var(--paper-3);
}
.lead { font-size: 1.05rem; line-height: 1.4; color: var(--paper); max-width: 52ch; letter-spacing: -.01em; }
.sheet__key p { font-size: 12px; line-height: 1.3; letter-spacing: .04em; text-transform: uppercase; color: var(--paper-3); max-width: 28ch; }
.measure { max-width: 60ch; }

.masthead {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: transparent; backdrop-filter: none; border-bottom: 0;
  transition: transform .35s cubic-bezier(.19,1,.22,1), background-color .3s ease;
}
.masthead.is-hidden { transform: translateY(-100%); }
.masthead.is-solid { background: rgba(1,1,1,.72); backdrop-filter: blur(10px); }
body[data-tone="light"] .masthead.is-solid { background: rgba(207,205,197,.86); }
.masthead__bar { height: 72px; }
.brand img { height: 40px; }
.nav { gap: 28px; }
.nav a { font: 400 15px/1 var(--sans); letter-spacing: -.01em; text-transform: none; color: var(--paper); border-bottom: 0; padding: 4px 0; position: relative; }
.nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -2px; height: 1px; background: var(--grey); transition: right .25s ease; }
.nav a:hover::after, .nav a[aria-current="page"]::after { right: 0; }
.nav a[aria-current="page"] { color: var(--paper); border-bottom: 0; }
.nav .nav__cta, .nav .nav__cta[aria-current="page"] {
  background: transparent; border: 1px solid var(--paper); color: var(--paper);
  padding: 10px 18px; border-radius: 100px; font-size: 14px; margin-left: 10px;
}
.nav .nav__cta::after { display: none; }
.nav .nav__cta:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.nav a { white-space: nowrap; }
@media (min-width: 901px) and (max-width: 1100px) {
  .nav { gap: 17px; }
  .nav a { font-size: 14px; }
  .nav .nav__cta, .nav .nav__cta[aria-current="page"] { padding: 9px 15px; margin-left: 4px; font-size: 13.5px; }
}
.navtoggle { font: 500 13px/1 var(--sans); letter-spacing: 0; text-transform: none; border-radius: 100px; padding: 9px 14px; border-color: var(--paper); }
main { padding-top: 0; }
.hero:not(.hero--video):not(.hero--orbit) { padding-top: calc(72px + clamp(64px, 9vw, 140px)); }

.hero::before, .hero--home::before { display: none; }   
.hero { padding-bottom: clamp(48px, 6vw, 88px); }
.hero__grid > div { max-width: 760px; }
.hero .label { margin-bottom: 22px; }
.hero .display { margin-bottom: 22px; }

.hero--video {
  --scrim: 1, 1, 1;
  min-height: 0; display: block;
  padding: calc(72px + 24px) var(--gutter) 0;
  background: var(--ink) !important;
}
.hero--video .hero__grid { width: auto; }
.hero__video {
  position: relative; inset: auto; display: block;
  width: 100%; height: min(78vh, 760px); object-fit: cover; object-position: 62% center;
  border-radius: 2px; background: #000 url("../img/track-demo-v4-poster.jpg") 62% center / cover no-repeat;
}
.hero__video::-webkit-media-controls,
.hero__video::-webkit-media-controls-start-playback-button,
.hero__video::-webkit-media-controls-overlay-play-button { display: none !important; -webkit-appearance: none; }
.hero__scrim {
  top: calc(72px + 24px); bottom: 0; left: var(--gutter); right: var(--gutter);
  border-radius: 2px;
  background:
    radial-gradient(ellipse 60% 70% at 0% 100%, rgba(1,1,1,.5) 0%, rgba(1,1,1,0) 100%),
    linear-gradient(180deg, rgba(1,1,1,0) 40%, rgba(1,1,1,.78) 100%);
}
.hero--video .hero__grid { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 0; padding: 0 40px 40px; z-index: 2; }
.hero--video .display, .hero--video .lead, .hero--video .label { text-shadow: none; }
.hero--video .lead { color: var(--paper-2); }
.hero__credit { position: static; margin: 10px 0 0; padding: 0; padding-right: 0; opacity: 1; max-width: none; font: 400 11px/1.4 var(--sans); letter-spacing: 0; color: var(--mute); }
.hero__credit a { color: var(--paper-3); }
@media (max-width: 900px) {
  .hero__video { display: block; height: auto; aspect-ratio: 16 / 9; }
  .hero--video { background-image: none !important; padding-inline: 16px; }
  .hero__scrim { display: none; }
  .hero--video .hero__grid { position: static; padding: 26px 0 0; }
  .hero .display span { display: block; color: var(--paper-3); }
  .hero .display span::before { content: none; }
  .hero__credit { margin-top: 14px; }
}
.actions { margin-top: 24px; }

.hero--orbit { padding-top: calc(72px + 40px); min-height: clamp(520px, 50vw, 720px); }
.hero--orbit .display, .hero--orbit .lead, .hero--orbit .label { text-shadow: none; }
.hero--orbit .hero__grid > div { max-width: 640px; }
.hero__credit--orbit { position: absolute; left: 0; right: 0; bottom: 16px; padding-inline: var(--gutter); font: 400 11px/1.4 var(--sans); color: var(--mute); }

.btn {
  font: 400 14px/1 var(--sans); letter-spacing: -.01em; text-transform: none;
  padding: 13px 22px; border: 1px solid var(--paper); color: var(--paper); border-radius: 100px;
  position: relative;
}
.btn::after { content: " \2192"; }
.btn:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.btn--solid { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.btn--solid:hover { background: var(--velox-lift); border-color: var(--velox-lift); color: #fff; }
body[data-tone="light"] .btn--solid { background: #010101; color: #fff; border-color: #010101; }

.band { border-top: 1px solid var(--rule-soft); }
.sheet { padding-block: clamp(56px, 7vw, 100px); gap: 0 clamp(24px, 4vw, 64px); }
.sheet__key .label { margin-bottom: 8px; }
.ticks li { font-size: 15px; color: var(--paper-2); padding-left: 0; border-top: 1px solid var(--rule-soft); padding-block: 10px; }
.ticks li::before { display: none; }
.ticks li:last-child { border-bottom: 1px solid var(--rule-soft); }
.rows { border-top: 1px solid var(--rule-soft); }
.row { border-bottom-color: var(--rule-soft); }
.row__idx { font: 500 12px/1.8 var(--sans); letter-spacing: .04em; color: var(--paper-3); }
.row__body p { color: var(--paper-2); font-size: 15px; }
.row__meta { font: 400 12px/1.5 var(--sans); letter-spacing: .02em; text-transform: uppercase; color: var(--paper-3); }
.strip { padding-block: clamp(56px, 7vw, 100px); }
.strip__text p { color: var(--paper-2); }

.photo, .collage__tile, .tile, .fig, .fig--bare video { border: 0; border-radius: 2px; background: #000; }
.photocap, figure.figblock figcaption, .fig__foot {
  font: 400 12px/1.5 var(--sans); letter-spacing: 0; color: var(--paper-3); margin-top: 10px;
}
.photocap b, figure.figblock figcaption b { color: var(--paper-2); font-weight: 500; }
.diagram { border: 0; border-radius: 2px; background: #0a0a0a; }
.bandsel { border: 0; border-radius: 2px; background: #0a0a0a; }
.bandsel__title, .bandsel__range, .bandsel__k, .bandsel__uses, .bandseg__name, .bandseg__wl { font-family: var(--sans); }
.bandsel__desc { color: var(--paper); }
.fig__head { font-family: var(--sans); }
.fig--bare .fig__head span { font: 400 12px/1.4 var(--sans); letter-spacing: 0; text-transform: none; color: var(--paper-3); }
.fig__btn { font: 500 11px/1 var(--sans); letter-spacing: .02em; text-transform: none; border-radius: 100px; padding: 6px 11px; }
.split__fig .photocap { margin-top: 10px; }
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 1s cubic-bezier(.19,1,.22,1), transform 1s cubic-bezier(.19,1,.22,1); }
.reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }

.proofband { border-block: 1px solid var(--rule-soft); }
.proofband .shell { padding-block: clamp(40px, 5vw, 72px); }
.proof { gap: 18px; }
.proof__cell { border-top: 1px solid var(--rule); padding-top: 18px; }
.proof__v { font: 400 clamp(22px, 2.2vw, 32px)/1.1 var(--sans); text-transform: none; letter-spacing: -.02em; color: var(--paper); }
.proof__k { font: 500 12px/1.4 var(--sans); letter-spacing: .04em; text-transform: uppercase; color: var(--paper-3); margin-top: 12px; }
.band__head .h2 { max-width: 20ch; }
.tiles { gap: 18px; margin-top: 36px; }
.tile { aspect-ratio: 4 / 3; border-radius: 2px; }
.tile img { transition: none; }
.tile:hover img { transform: none; }
.tile__body { padding: 80px 24px 22px; background: linear-gradient(to top, rgba(1,1,1,.55) 0%, rgba(1,1,1,0) 100%); }
.tile__name { font: 700 24px/1.15 var(--sans); text-transform: none; letter-spacing: -.01em; color: #fff; }
.tile__line {
  font: 400 15px/1.3 var(--sans); letter-spacing: -.01em; text-transform: none; color: #fff;
  margin-top: 8px; opacity: 0; transform: translateY(6px); transition: opacity .25s ease, transform .25s ease;
}
.tile__line::after { content: " \2192"; }
.tile:hover .tile__line, .tile:focus-visible .tile__line { opacity: 1; transform: none; }
.tiles__more { font-size: 15px; color: var(--paper-2); margin-top: 24px; }
.tiles__more a { color: var(--paper); text-decoration: none; border-bottom: 1px solid var(--grey); }
.specs { gap: 18px; margin-top: 36px; }
.spec {
  background: var(--offwhite); border: 0; border-radius: 2px; padding: 32px;
  clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 40px, 100% 100%, 0 100%);
  --paper: #010101; --paper-2: #3a3a38; --paper-3: #565654;
}
.spec__kicker { font: 500 12px/1 var(--sans); letter-spacing: .04em; color: #565654; }
.spec__name { font: 700 24px/1.15 var(--sans); text-transform: none; letter-spacing: -.01em; color: #010101; margin-top: 14px; }
.spec__rows { margin-top: 22px; }
.spec__row { grid-template-columns: 96px minmax(0, 1fr); border-top: 1px solid #565654; padding: 10px 0; }
.spec__row dt { font: 700 12px/1.4 var(--sans); letter-spacing: .04em; color: #010101; }
.spec__row dd { font-size: 15px; color: #565654; line-height: 1.35; }
.spec__link { font: 400 14px/1 var(--sans); letter-spacing: 0; text-transform: none; color: #010101; padding-top: 22px; }
.regband { background: var(--offwhite); --ink: #cfcdc5; --ink-raise: #cfcdc5; --paper: #0e0e0d; --paper-2: #33332f; --paper-3: #55554f; --rule: #55554f; --rule-soft: #b3b1a9; --velox-lift: #55554f; border: 0; }
.regband .label { color: #55554f; }
.regband__grid { gap: 18px; }
.regcell { background: transparent; border: 0; border-top: 1px solid var(--rule); border-radius: 0; padding: 16px 0 0; }
.regcell__k { font: 700 12px/1 var(--sans); letter-spacing: .04em; color: var(--paper); }
.regcell__v { font-family: var(--sans); font-size: 15px; color: var(--paper-3); letter-spacing: 0; }
.regcell__v small { color: var(--paper-3); }
.regband__note { font: 400 12px/1.5 var(--sans); letter-spacing: 0; color: var(--paper-3); }
.regband__note a { color: var(--paper); }

.chip, .idgrid__k, .tl__type, .prog__type, .req__status, .cred__use, .capcard__tag, .subhead, .degree, .degree--ug {
  font-family: var(--sans); letter-spacing: .04em;
}
.idgrid__v, .regcell__v, .prog__code, .tl__yr, .tl__year { font-family: var(--sans); }
.person__name { font-family: var(--sans); font-weight: 700; text-transform: none; letter-spacing: -.01em; }
.person__role { font-family: var(--sans); letter-spacing: .04em; }
.field label { font-family: var(--sans); letter-spacing: .04em; font-size: 12px; }
.field input, .field select, .field textarea { font-family: var(--sans); border-radius: 2px; background: transparent; border-color: var(--rule); color: var(--paper); }
.form__note { font-family: var(--sans); }
.sheet__key a { color: var(--paper); text-decoration-color: var(--grey); }

.foot { background: #010101; border-top: 1px solid var(--rule-soft); color: #fff; --paper: #fff; --paper-2: #c9c9c5; --paper-3: #8e9291; }
.foot .shell { padding-block: 56px 40px; }
.foot__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
.foot__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.foot__h { font: 500 12px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; color: #8e9291; margin: 0 0 16px; }
.foot__cols a { display: block; font: 400 18px/1.3 var(--sans); letter-spacing: -.01em; color: #fff; margin-bottom: 10px; }
.foot__cols a:hover { color: #c9c9c5; }
.foot__legal { font: 400 12px/1.6 var(--sans); letter-spacing: .04em; text-transform: uppercase; color: #8e9291; margin-top: 56px; }
.foot__legal a { text-transform: none; letter-spacing: 0; }
.foot__links { display: none; }
@media (max-width: 760px) { .foot__grid { grid-template-columns: 1fr; } .foot__cols { grid-template-columns: 1fr 1fr; } }

.scrolltrack { top: 72px; height: calc(100vh - 72px); right: 6px; }
.masthead__bar { padding-right: 36px; }
.scrolltrack__sat { color: var(--grey); filter: none; }
.scrolltrack__pct { background: transparent; font-family: var(--sans); }
.st-trail { stroke: var(--grey); }
.skip { font-family: var(--sans); letter-spacing: 0; text-transform: none; }

@media (max-width: 900px) {
  .masthead__bar { padding-right: var(--gutter); }
  .masthead__right { display: contents; }
  .navtoggle { margin-left: auto; flex-shrink: 0; }
  .nav { top: 100%; }
}

@media (max-width: 640px) {
  :root { --gutter: 16px; }
  .hero__video {
    aspect-ratio: 4 / 5; max-height: 62vh; object-position: center;
    background-image: url("../img/track-demo-v4-tall-poster.jpg"); background-position: center;
  }
  .masthead__bar { height: 64px; }
  .display { font-size: 2.2rem; }
  .tile { aspect-ratio: 3 / 2; }
  .tile__line { opacity: 1; transform: none; }
  .spec { padding: 24px; clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 0 100%); }
}

body[data-tone="light"] .logo--dark { display: none; }
body[data-tone="light"] .logo--light { display: inline-block; }
.foot .logo--dark { display: inline-block !important; }
.foot .logo--light { display: none !important; }

.irpair__stage { border: 0; border-radius: 2px; }
.irpair__tag { font: 500 11px/1 var(--sans); letter-spacing: .04em; border-radius: 2px; background: rgba(1,1,1,.6); border: 0; }
.irpair__modes { border-radius: 100px; border-color: var(--paper); overflow: hidden; }
.irpair__modes button { font: 400 13px/1 var(--sans); letter-spacing: 0; text-transform: none; border-right-color: var(--rule-soft); padding: 8px 14px; color: var(--paper); }
.irpair__modes button[aria-pressed="true"] { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.irpair__hint { font: 400 12px/1.4 var(--sans); letter-spacing: 0; color: var(--paper-3); }
.works { gap: 18px; margin-top: 36px; }
.work__img { border: 0; border-radius: 2px; }
.work__img img { transition: none; } .work:hover .work__img img { transform: none; }
.work__name { font: 700 24px/1.15 var(--sans); text-transform: none; letter-spacing: -.01em; margin-top: 16px; }
.work__line { font-size: 15px; color: var(--paper-2); line-height: 1.4; }
.duo .fig--bare .fig__head { padding-left: 0; }

body[data-tone="light"] .usmap__wrap { background: #141a21; border-color: #141a21; }
body[data-tone="light"] .usmap__states path { fill: #26323c; stroke: #5f8c8a; stroke-opacity: .75; stroke-width: .7; }
body[data-tone="light"] .usmap__link { stroke: #c2453f; opacity: .95; }
body[data-tone="light"] .usmap__halo { fill: #c2453f; opacity: .28; }
body[data-tone="light"] .usmap__dot { fill: #e0514a; stroke: #141a21; }
body[data-tone="light"] .usmap__leader { stroke: #8fb5b2; }
body[data-tone="light"] .usmap__k, body[data-tone="light"] .usmap__k2 { fill: #f0eee9; }
body[data-tone="light"] .usmap__v { fill: #c4c0b8; }

body[data-tone="light"] .idgrid__cell { background: #1b2733; border: 1px solid #2f4252; border-radius: 4px; }
body[data-tone="light"] .idgrid__k { color: #8fb5b2; }
body[data-tone="light"] .idgrid__v { color: #f0eee9; }
body[data-tone="light"] .idgrid__v small, body[data-tone="light"] .idgrid__cell p small { color: #c4c0b8; }