:root {
  /* Brand anchors */
  --brand-green: #59FFB4;
  --brand-yellow: #DBFF78;
  --brand-blue: #598BFF;
  --brand-black: #000000;
  --brand-off-white: #F5F5F5;
  --brand-white: #ffffff;
  --active-section-accent: var(--brand-green);
  --brand-icon-mask: url("../assets/brand/ScaleUp-Icon-Mark.svg");
  --brand-wordmark-mask: url("../assets/brand/ScaleUp-Wordmark-Text.svg");

  /* Colour, type, and grid tokens */
  --wire-white: #ffffff;
  --wire-light: #f1f1f1;
  --wire-mid: #b7b7b7;
  --wire-dark: #323232;
  --wire-line: #d5d5d5;
  --wire-gap: clamp(1rem, 2vw, 2rem);
  --page-margin: clamp(1rem, 2.35vw, 3rem);
  --grid-columns: 12;
  --grid-gap: clamp(1rem, 2vw, 2rem);
  --grid-margin: var(--page-margin);
  --type-display: "Neue Haas Unica Pro", Arial, Helvetica, sans-serif;
  --type-body: Arial, Helvetica, sans-serif;
  --type-weight-regular: 400;
  --type-weight-bold: 700;
  --type-display-leading: 0.91;
  --type-compact-leading: 0.91;
  --type-copy-leading: 1.08;
  --type-display-tracking: -0.04em;
  --type-meta-tracking: 0;
  --type-story-title: clamp(3rem, 3.25vw, 4.1rem);
  --type-story-heading: clamp(2.55rem, 3.1vw, 3.9rem);
  --type-story-subtitle: clamp(1.35rem, 1.9vw, 2.15rem);
  --type-story-copy: clamp(1.05rem, 1.18vw, 1.34rem);
  --type-visual-title: clamp(2.9rem, 5.8vw, 7rem);
  --type-block-pad-inline: clamp(0.38rem, 0.72vw, 0.9rem);
  --type-block-pad-block: clamp(0.28rem, 0.48vw, 0.56rem);
  --type-frame-block-start: var(--type-block-pad-block);
  --type-frame-block-end: var(--type-block-pad-block);

  /* Type-stack grammar */
  --stack-frame-border: 0 solid transparent;
  --stack-frame-height: auto;
  --stack-frame-inset: 0.08em;
  --stack-frame-inset-end: 0.1em;
  --stack-frame-inline: 0px;
  --stack-frame-radius: 0;
  --stack-frame-gap: 0px;
  --stack-depth-step: var(--stack-frame-height);
  --stack-stage-min-height: clamp(22rem, 43vw, 36rem);
  --stack-tone-green: var(--brand-green);
  --stack-tone-black: var(--brand-black);
  --stack-tone-grey: #D8D9D2;

  /* Lenis-driven scroll motion */
  --motion-scene-height: 210svh;
  --preset-scroll-height: 220svh;
  --motion-ease-duration: 420ms;
  --motion-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --snap-scroll-duration: 780ms;
  --snap-scroll-lockout: 920ms;
  --motion-scale-origin: 0% 0%;
  --visual-plate-reveal-distance: 0.42em;
  --load-line-stagger: 65ms;
  --load-line-duration: 280ms;
  --load-line-delay: 120ms;
  --load-item-duration: 180ms;
  --load-item-delay: 420ms;
  --cursor-size: 14px;

  /* Accessibility and QA */
  --focus-ring: 2px solid var(--brand-green);
  --reduced-motion-step: 1;
  color: var(--wire-dark);
  background: var(--wire-white);
  font-family: var(--type-body);
  font-kerning: normal;
  font-feature-settings: "kern" 1;
}

@font-face {
  font-family: "Neue Haas Unica Pro";
  src: url("../assets/fonts/neue-haas-unica-pro-bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Neue Haas Unica Pro";
  src: url("../assets/fonts/neue-haas-unica-pro-bold-italic.otf") format("opentype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Neue Haas Unica Pro";
  src: url("../assets/fonts/neue-haas-unica-pro-italic.otf") format("opentype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Neue Haas Unica Pro";
  src: url("../assets/fonts/neue-haas-unica-pro-ultralight.otf") format("opentype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Neue Haas Unica Pro";
  src: url("../assets/fonts/neue-haas-unica-pro-regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 320px;
  background: var(--brand-off-white);
  overflow-x: clip;
}

a {
  color: inherit;
}

a:focus-visible,
button:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 0.2rem;
}

.skip-link {
  position: absolute;
  left: 1rem;
  top: 1rem;
  transform: translateY(-160%);
  background: var(--wire-dark);
  color: var(--wire-white);
  padding: 0.5rem 0.75rem;
}

.skip-link:focus {
  transform: translateY(0);
}

@media (hover: hover) and (pointer: fine) {
  html.has-custom-cursor,
  html.has-custom-cursor * {
    cursor: none;
  }

  .custom-cursor {
    --cursor-x: -100px;
    --cursor-y: -100px;
    --cursor-scale: 1;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 2147483647;
    width: var(--cursor-size);
    height: var(--cursor-size);
    border-radius: 999px;
    background: var(--brand-white);
    pointer-events: none;
    opacity: 0;
    mix-blend-mode: difference;
    transform:
      translate3d(calc(var(--cursor-x) - 50%), calc(var(--cursor-y) - 50%), 0)
      scale(var(--cursor-scale));
    transform-origin: 50% 50%;
    will-change: transform, opacity;
    transition: opacity 160ms var(--motion-ease-out);
  }

  .custom-cursor.is-active {
    opacity: 1;
  }

  .custom-cursor.is-over-interactive {
    --cursor-scale: 1.1;
    border-radius: 0;
  }
}

.page-shell {
  display: block;
  padding: 0;
}

.page-shell--landing {
  --intro-lockup-width: 60vw;
  --intro-copy-column: minmax(18rem, 31.6vw);
  --brand-lockup-icon-scale: 1;
  --brand-lockup-scale: 1;
  --brand-lockup-icon-size: clamp(17rem, 29.75vw, 38rem);
  --brand-lockup-icon-column: calc(var(--brand-lockup-icon-size) * var(--brand-lockup-icon-scale));
  --brand-lockup-final-scale: 0.28;
  --hero-motion-height: 200svh;
  --hero-panel-height: max(var(--brand-lockup-icon-size), 28rem);
  min-height: calc(var(--hero-motion-height) + 100svh - (var(--hero-motion-height) - var(--hero-panel-height)));
  background: var(--brand-black);
  color: var(--brand-black);
}

.page-intro {
  --brand-lockup-progress-offset: 0;
  --brand-lockup-icon-column: calc(var(--brand-lockup-icon-size) * var(--brand-lockup-icon-scale));
  position: relative;
  min-height: var(--hero-motion-height);
  display: grid;
  grid-template-columns:
    [bleed-start] 0
    [content-start] repeat(var(--grid-columns), minmax(0, 1fr))
    [content-end] 0 [bleed-end];
  column-gap: var(--grid-gap);
  padding-inline: var(--page-margin);
  align-items: start;
  background: transparent;
  color: var(--brand-black);
}

.page-intro::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: var(--hero-panel-height);
  background: var(--brand-off-white);
  pointer-events: none;
}

.page-intro__brand {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 1000;
  width: var(--intro-lockup-width);
  pointer-events: none;
}

.page-intro__copy {
  grid-column: 10 / content-end;
  position: relative;
  z-index: 2;
  min-height: var(--brand-lockup-icon-size);
  padding-block: clamp(1.45rem, 1.8vw, 2.1rem) var(--page-margin);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7rem, auto);
  grid-template-rows: auto 1fr auto;
  column-gap: clamp(1.25rem, 2vw, 2.5rem);
  align-items: start;
}

.subtitle-hero {
  grid-column: 1 / -1;
  max-width: 14.4em;
  font-family: var(--type-display);
  font-size: clamp(1.85rem, 2.15vw, 2.75rem);
  font-weight: 700;
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
}

.load-line {
  display: block;
}

.load-line__inner {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.42em);
  transition:
    opacity var(--load-line-duration) var(--motion-ease-out),
    transform var(--load-line-duration) var(--motion-ease-out);
  transition-delay: calc(var(--load-line-delay) + var(--load-line-offset, 0ms));
  will-change: opacity, transform;
}

.load-line__word {
  display: inline-block;
  white-space: pre;
}

.is-load-ready [data-load-lines].is-line-load-visible .load-line__inner {
  opacity: 1;
  transform: translateY(0);
}

[data-load-item] {
  opacity: 0;
  transform: translateY(0.45em);
  transition:
    opacity var(--load-item-duration) var(--motion-ease-out),
    transform var(--load-item-duration) var(--motion-ease-out);
  will-change: opacity, transform;
}

.is-load-ready [data-load-item] {
  opacity: 1;
  transform: translateY(0);
  transition-delay: var(--load-item-delay);
}

.is-load-ready.is-load-rebuilding .load-line__inner,
.is-load-ready.is-load-rebuilding [data-load-item] {
  transition-delay: 0ms !important;
  transition-duration: 0ms !important;
}

.body-text {
  grid-column: 1;
  grid-row: 3;
  align-self: end;
  max-width: 14em;
  font-family: var(--type-display);
  font-size: clamp(0.95rem, 1.08vw, 1.32rem);
  font-weight: 700;
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
}

.apply-cta {
  grid-column: 2;
  grid-row: 3;
  align-self: end;
  justify-self: end;
  position: sticky;
  top: var(--page-margin);
  right: var(--page-margin);
  z-index: 1001;
  width: max-content;
  font-family: var(--type-display);
  font-size: clamp(0.95rem, 1.08vw, 1.32rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: var(--type-display-tracking);
  color: var(--brand-black);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.08em;
  transform-origin: 50% 50%;
  transition:
    background-color 160ms var(--motion-ease-out),
    color 160ms var(--motion-ease-out),
    transform 160ms cubic-bezier(0.23, 1, 0.32, 1);
}

.apply-cta.is-sticky-locked {
  position: fixed;
  top: var(--page-margin);
  right: var(--page-margin);
}

.apply-cta.is-over-media {
  color: var(--brand-off-white);
}

.apply-cta:hover {
  background: var(--brand-white);
  color: var(--brand-black);
}

.apply-cta[data-load-item] {
  transition:
    opacity var(--load-item-duration) var(--motion-ease-out),
    background-color 160ms var(--motion-ease-out),
    color 160ms var(--motion-ease-out),
    transform var(--load-item-duration) var(--motion-ease-out);
}

.apply-cta:active {
  transform: scale(0.97);
}

.page-intro .brand-lockup {
  position: fixed;
  inset: 0 auto auto 0;
  width: var(--intro-lockup-width);
  z-index: 1000;
}

.page-intro .brand-lockup__type {
  width: calc(var(--intro-lockup-width) - var(--brand-lockup-icon-size));
}

.brand-lockup__wordmark-image {
  display: block;
  width: 100%;
  height: auto;
}

.video-placeholder-section {
  position: relative;
  z-index: 0;
  margin-top: calc(-1 * (var(--hero-motion-height) - var(--hero-panel-height)));
  min-height: 100svh;
  background: #d8d9d2;
  overflow: hidden;
  isolation: isolate;
}

.video-placeholder-section__media {
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100svh;
  object-fit: cover;
  pointer-events: none;
}

.page-shell--landing {
  --split-nav-inset: 0px;
  --split-content-pad: clamp(1.15rem, 1.55vw, 1.75rem);
  --split-cta-font-size: clamp(1.08rem, 1.3vw, 1.6rem);
  --split-nav-clearance: calc((var(--split-cta-font-size) * 2.3) + var(--split-content-pad));
  --split-copy-max: 44rem;
  --split-secondary-max: 24rem;
  --split-logo-width: clamp(9rem, 12vw, 14.5rem);
  --split-panel-count: 6;
  min-height: auto;
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.split-nav {
  position: fixed;
  inset: var(--split-nav-inset) var(--split-nav-inset) auto var(--split-nav-inset);
  z-index: 2000;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  pointer-events: none;
}

.split-brand,
.split-nav__actions {
  pointer-events: auto;
}

.split-brand {
  display: grid;
  grid-template-columns: clamp(2.9rem, 5.9vw, 6.4rem) clamp(8.8rem, 17vw, 18rem);
  align-items: start;
  width: max-content;
  color: var(--active-section-accent);
  text-decoration: none;
  overflow: hidden;
  transition: color 220ms var(--motion-ease-out);
}

.split-brand__icon,
.split-brand__wordmark {
  display: block;
  position: relative;
}

.split-brand__icon {
  aspect-ratio: 1 / 1;
  background: currentColor;
  overflow: hidden;
  transition: background-color 220ms var(--motion-ease-out), color 220ms var(--motion-ease-out);
}

.split-brand__wordmark {
  width: 100%;
  aspect-ratio: 441 / 125;
  padding: 0.13em 0.16em 0.18em;
  background: var(--brand-black);
}

.split-brand__icon::after,
.split-brand__wordmark::after {
  content: "";
  position: absolute;
  display: block;
  pointer-events: none;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
}

.split-brand__icon::after {
  inset: 0;
  background: var(--brand-black);
  mask-image: var(--brand-icon-mask);
  -webkit-mask-image: var(--brand-icon-mask);
}

.split-brand__wordmark::after {
  inset: 0.13em 0.16em 0.18em;
  background: currentColor;
  mask-image: var(--brand-wordmark-mask);
  -webkit-mask-image: var(--brand-wordmark-mask);
}

.split-nav__actions {
  position: fixed;
  top: var(--split-nav-inset);
  right: var(--split-nav-inset);
  left: 50%;
  z-index: 2001;
  display: flex;
  align-items: stretch;
  gap: 0;
}

.split-nav__contact-bar {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.62em 0.72em 0.68em;
  background: var(--split-contact-bar-bg, var(--brand-white));
  color: var(--brand-black);
  font-family: var(--type-display);
  font-size: var(--split-cta-font-size);
  font-weight: var(--type-weight-bold);
  line-height: 1;
  letter-spacing: var(--type-display-tracking);
  white-space: nowrap;
  pointer-events: none;
  transition: background-color 220ms var(--motion-ease-out);
}

:root[data-active-section-style="b"] {
  --split-contact-bar-bg: var(--brand-off-white);
}

.split-nav__actions .apply-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.split-nav__apply.apply-cta {
  position: static;
  width: auto;
  padding: 0.62em 0.72em 0.68em;
  background: var(--active-section-accent);
  color: var(--brand-black);
  font-size: var(--split-cta-font-size);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.12em;
  box-shadow: none;
  transition: background-color 220ms var(--motion-ease-out), color 220ms var(--motion-ease-out);
}

.split-nav__interest.apply-cta {
  position: static;
  width: auto;
  padding: 0.62em 0.72em 0.68em;
  background: var(--brand-black);
  color: var(--active-section-accent);
  font-size: var(--split-cta-font-size);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.12em;
  box-shadow: none;
  transition: background-color 220ms var(--motion-ease-out), color 220ms var(--motion-ease-out);
}

.split-nav__apply.apply-cta:hover,
.split-nav__interest.apply-cta:hover {
  background: var(--brand-white);
  color: var(--brand-black);
}

.split-story {
  min-height: calc(var(--split-panel-count) * 100svh);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  background: var(--brand-off-white);
  isolation: isolate;
}

.story-progress {
  position: fixed;
  top: 50%;
  right: clamp(0.55rem, 1.15vw, 1.1rem);
  z-index: 1900;
  display: grid;
  gap: clamp(0.5rem, 0.78vw, 0.72rem);
  translate: 0 -50%;
  pointer-events: none;
}

.story-progress__dot {
  width: clamp(0.48rem, 0.72vw, 0.7rem);
  aspect-ratio: 1;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #d9d9d9;
  appearance: none;
  cursor: pointer;
  opacity: 0.9;
  transform: scale(0.82);
  transform-origin: center;
  pointer-events: auto;
  transition:
    transform 180ms var(--motion-ease-out),
    opacity 180ms var(--motion-ease-out),
    background-color 220ms var(--motion-ease-out);
}

.story-progress__dot.is-active {
  background: var(--active-section-accent);
  opacity: 1;
  transform: scale(1);
}

.story-progress__dot:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 0.28rem;
}

@media (hover: hover) and (pointer: fine) {
  .story-progress__dot:hover {
    opacity: 1;
    transform: scale(1);
  }
}

.split-story__visual-rail {
  position: sticky;
  top: 0;
  grid-column: 1;
  align-self: start;
  height: 100svh;
  overflow: hidden;
  background: var(--brand-black);
}

.split-story__visual-stage {
  position: relative;
  height: 100%;
  overflow: hidden;
}

.story-visual {
  --panel-accent: var(--brand-green);
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: var(--brand-black);
  opacity: 0;
  transform: translate3d(0, 100%, 0);
  will-change: transform, opacity;
}

.story-visual:first-child {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.story-visual img,
.story-visual video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.story-visual[data-panel-tone="green"] {
  --panel-accent: var(--brand-green);
}

.story-chapter__mobile-visual[data-panel-tone="green"] {
  --panel-accent: var(--brand-green);
}

.story-visual[data-panel-tone="yellow"] {
  --panel-accent: var(--brand-yellow);
}

.story-chapter__mobile-visual[data-panel-tone="yellow"] {
  --panel-accent: var(--brand-yellow);
}

.story-visual[data-panel-tone="blue"] {
  --panel-accent: var(--brand-blue);
}

.story-chapter__mobile-visual[data-panel-tone="blue"] {
  --panel-accent: var(--brand-blue);
}

.story-visual[data-panel-treatment="flood"] {
  display: grid;
  align-items: end;
  background: var(--panel-accent);
}

.story-visual[data-panel-treatment="media"] {
  display: grid;
}

.story-visual[data-panel-treatment="flood"] .story-visual__type {
  left: var(--page-margin);
  right: var(--page-margin);
  bottom: var(--page-margin);
  color: var(--brand-black);
  line-height: 0.94;
}

.story-visual[data-panel-treatment="flood"] .story-visual__type > span {
  background: transparent;
}

.story-visual[data-panel-treatment="flood"] .visual-type-line {
  min-height: auto;
  padding: 0;
  background: transparent;
}

.story-visual__shade {
  position: absolute;
  inset: auto 0 0;
  height: 0;
  background: var(--brand-black);
  pointer-events: none;
}

.story-visual__type {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: grid;
  justify-items: start;
  gap: 0;
  font-family: var(--type-display);
  font-weight: var(--type-weight-bold);
  font-size: var(--type-visual-title);
  line-height: var(--type-compact-leading);
  letter-spacing: var(--type-display-tracking);
  color: var(--brand-black);
}

.story-visual[data-panel-treatment="media"] .story-visual__type {
  align-content: end;
}

.story-visual__type > span {
  --visual-type-scale: 1;
  --visual-type-y: 0em;
  --visual-type-opacity: 1;
  display: block;
  width: fit-content;
  max-width: 100%;
  padding: 0;
  background: transparent;
  transform: translate3d(0, var(--visual-type-y), 0) scale(var(--visual-type-scale));
  transform-origin: 0% 100%;
  will-change: transform;
}

.visual-type-measure-word {
  display: inline-block;
  white-space: pre;
}

.visual-type-line {
  display: block;
  width: fit-content;
  min-height: var(--visual-type-line-height, 1lh);
  padding: var(--type-block-pad-block) var(--type-block-pad-inline);
  background: var(--visual-type-line-bg, var(--panel-accent));
}

.story-visual[data-panel-treatment="media"] .visual-type-line {
  padding-block: max(0px, calc(var(--type-block-pad-block) - 0.075em))
    calc(var(--type-block-pad-block) + 0.075em);
}

.visual-type-line + .visual-type-line {
  margin-top: -1px;
}

.story-visual__type-main,
.story-visual__type-subtitle,
.story-visual__type-caption {
  color: var(--brand-black);
  font-family: var(--type-display);
  font-weight: var(--type-weight-bold);
  line-height: var(--type-compact-leading);
}

.story-visual__type-main {
  --visual-type-line-bg: var(--panel-accent);
  font-size: clamp(3.2rem, 5.85vw, 7.05rem);
}

.story-visual__type-subtitle {
  font-size: clamp(1.55rem, 2.3vw, 2.8rem);
}

.story-visual__type-caption {
  font-size: clamp(0.95rem, 1.35vw, 1.45rem);
  line-height: 1;
}

.story-visual__type-subtitle,
.story-visual__type-caption {
  letter-spacing: var(--type-meta-tracking);
}

.story-visual[data-panel-treatment="media"] .story-visual__type > span:nth-child(odd) {
  --visual-type-line-bg: var(--panel-accent);
}

.story-visual[data-panel-treatment="media"] .story-visual__type > span:nth-child(even) {
  --visual-type-line-bg: var(--brand-off-white);
}

.story-visual__type--hero {
  top: auto;
  bottom: 0;
  padding: var(--type-block-pad-block) var(--type-block-pad-inline);
  background: var(--panel-accent);
  font-size: clamp(3.2rem, 5.85vw, 7.05rem);
}

.story-visual__type--hero span {
  width: auto;
  padding: 0;
  background: transparent;
}

.story-visual--cta {
  background: var(--panel-accent);
}

.story-visual__cta-grid {
  height: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.story-visual__cta-card {
  position: relative;
  display: grid;
  align-content: end;
  min-width: 0;
  overflow: hidden;
  color: var(--brand-black);
}

.story-visual__cta-card img {
  position: absolute;
  inset: 0;
  height: 62%;
  object-fit: cover;
}

.story-visual__cta-card span {
  --visual-type-scale: 1;
  --visual-type-y: 0em;
  --visual-type-opacity: 1;
  position: relative;
  z-index: 1;
  min-height: 38%;
  padding: clamp(0.9rem, 2vw, 1.5rem);
  display: flex;
  align-items: flex-start;
  background: transparent;
  font-family: var(--type-display);
  font-size: clamp(1.35rem, 2.8vw, 3.25rem);
  font-weight: var(--type-weight-bold);
  line-height: var(--type-compact-leading);
  opacity: var(--visual-type-opacity);
  transform: translate3d(0, var(--visual-type-y), 0) scale(var(--visual-type-scale));
  transform-origin: 0% 100%;
  will-change: transform, opacity;
}

.split-story__content {
  grid-column: 2;
  position: relative;
  z-index: 1;
  background: var(--brand-off-white);
}

.story-chapter {
  min-height: 100svh;
  padding: var(--split-content-pad);
  display: grid;
  grid-template-rows: auto 1fr auto;
  align-items: stretch;
  background: var(--brand-off-white);
  border-bottom: 1px solid var(--wire-line);
}

.story-chapter[data-section-style="b"] {
  background: var(--brand-white);
}

.story-chapter__inner {
  width: min(100%, var(--split-copy-max));
  min-height: calc(100svh - (var(--split-content-pad) * 2));
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 0;
}

.story-chapter--hero .story-chapter__inner {
  gap: 0;
}

.story-chapter__primary {
  align-self: start;
  padding-top: var(--split-nav-clearance);
}

.story-chapter__secondary {
  grid-row: 3;
  width: min(60%, var(--split-secondary-max));
  align-self: end;
  padding-bottom: 0;
  display: grid;
  gap: clamp(0.65rem, 0.9vw, 0.95rem);
  font-family: var(--type-display);
  font-size: var(--type-story-copy);
  font-weight: var(--type-weight-bold);
  line-height: var(--type-copy-leading);
  letter-spacing: var(--type-display-tracking);
}

.story-kicker {
  width: fit-content;
  max-width: 100%;
  padding: 0.23em 0.32em 0.29em;
  background: var(--brand-black);
  color: var(--brand-green);
  font-family: var(--type-display);
  font-size: clamp(1rem, 1.2vw, 1.25rem);
  font-weight: var(--type-weight-bold);
  line-height: 0.98;
}

.story-title,
.story-heading,
.story-subtitle {
  font-family: var(--type-display);
  font-weight: var(--type-weight-bold);
  letter-spacing: var(--type-display-tracking);
}

.story-title {
  max-width: none;
  font-size: var(--type-story-title);
  line-height: var(--type-compact-leading);
}

.story-title .load-line,
.story-subtitle .load-line {
  display: contents;
}

.story-title .load-line__inner,
.story-subtitle .load-line__inner {
  opacity: 1;
  transform: none;
  transition-duration: 0ms;
}

.story-heading {
  max-width: none;
  font-size: var(--type-story-heading);
  line-height: var(--type-compact-leading);
}

.story-chapter__cta {
  width: fit-content;
  max-width: 100%;
  margin-top: clamp(1.1rem, 1.8vw, 1.8rem);
  padding: 0.2em 0.28em 0.25em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--brand-blue);
  color: var(--brand-black);
  font-family: var(--type-display);
  font-size: clamp(1.35rem, 2.1vw, 2.45rem);
  font-weight: var(--type-weight-bold);
  line-height: 0.98;
  letter-spacing: var(--type-display-tracking);
  text-decoration: none;
  transition:
    background-color 160ms var(--motion-ease-out),
    color 160ms var(--motion-ease-out);
}

.story-chapter__cta:hover {
  background: var(--brand-black);
  color: var(--brand-blue);
}

.story-chapter__cta:focus-visible {
  outline: var(--focus-ring);
  outline-offset: 0.16em;
}

.story-subtitle {
  max-width: 10.6em;
  font-size: var(--type-story-subtitle);
  line-height: var(--type-display-leading);
}

.story-lede,
.story-chapter p:not(.story-kicker):not(.story-subtitle),
.story-action-list,
.story-contact {
  font-family: var(--type-display);
  font-size: var(--type-story-copy);
  font-weight: var(--type-weight-regular);
  line-height: var(--type-copy-leading);
  letter-spacing: var(--type-display-tracking);
}

.story-chapter p:not(.story-kicker):not(.story-subtitle) {
  max-width: 21em;
}

.story-chapter__secondary p:not(.story-kicker):not(.story-subtitle) {
  font-weight: var(--type-weight-bold);
}

.story-action-list {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
  list-style: none;
}

.story-action-list li {
  display: grid;
  grid-template-columns: 1.5em minmax(0, 1fr);
  gap: 0.4rem;
}

.story-action-list__copy {
  min-width: 0;
}

.story-contact {
  margin-top: clamp(1rem, 2vw, 2rem);
  display: grid;
  gap: 0.35rem;
}

.story-contact p {
  font-size: clamp(1.25rem, 1.85vw, 2.1rem) !important;
}

.story-contact a {
  width: fit-content;
  font-family: var(--type-display);
  font-size: clamp(1rem, 1.22vw, 1.35rem);
  font-weight: var(--type-weight-bold);
  line-height: 1;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.12em;
}

.story-school-logo {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 20;
  width: min(100%, var(--split-logo-width));
  height: auto;
  display: block;
  mix-blend-mode: multiply;
}

.story-school-logo__image {
  display: block;
  width: 100%;
  height: auto;
}

.story-school-logo-slot {
  grid-row: 3;
  align-self: end;
  justify-self: end;
  width: min(100%, var(--split-logo-width));
  aspect-ratio: 480 / 151;
}

.story-chapter__mobile-visual {
  display: none;
}

.story-mobile-type {
  display: none;
}

.page-shell--token-reference {
  min-height: 100svh;
  padding: var(--page-margin);
  display: grid;
  gap: clamp(1rem, 2vw, 2rem);
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.token-hero {
  min-height: min(76svh, 44rem);
  display: grid;
  grid-template-columns: minmax(12rem, 0.28fr) minmax(0, 0.5fr) minmax(15rem, 0.22fr);
  gap: clamp(1rem, 2vw, 2rem);
  align-items: stretch;
}

.token-hero__brand,
.token-hero__copy,
.token-hero__meta,
.token-section,
.token-card,
.token-specimen,
.token-component-sample,
.token-motion-card,
.token-nav-sample,
.token-media-card,
.token-stack-sample {
  border: 1px solid var(--wire-line);
  background: var(--wire-white);
}

.token-hero__brand {
  display: grid;
  place-items: start;
  overflow: hidden;
  background: var(--brand-black);
}

.token-hero__brand img {
  width: min(100%, 26rem);
  display: block;
}

.token-hero__copy {
  padding: clamp(1rem, 2vw, 2.25rem);
  display: grid;
  align-content: space-between;
  gap: clamp(2rem, 8vw, 7rem);
}

.token-hero__copy h1 {
  max-width: 10.5em;
  font-family: var(--type-display);
  font-size: clamp(3rem, 7.8vw, 8.6rem);
  font-weight: 700;
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
}

.token-hero__meta {
  padding: 1px;
  display: grid;
  align-content: end;
  gap: 1px;
  background: var(--wire-line);
}

.token-hero__meta p {
  min-height: 6rem;
  padding: clamp(0.75rem, 1.1vw, 1.1rem);
  display: grid;
  align-content: space-between;
  background: var(--wire-white);
}

.token-hero__meta span,
.token-hero__meta strong {
  display: block;
  font-size: clamp(0.7rem, 0.76vw, 0.82rem);
  line-height: 1;
}

.token-hero__meta span {
  text-transform: uppercase;
  letter-spacing: var(--type-meta-tracking);
  color: #747474;
}

.token-hero__meta strong {
  font-family: var(--type-display);
  font-size: clamp(1rem, 1.2vw, 1.35rem);
  line-height: 0.95;
  letter-spacing: var(--type-display-tracking);
}

.token-kicker {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: var(--type-meta-tracking);
  color: #747474;
}

.token-section {
  display: grid;
  grid-template-columns: minmax(11rem, 0.18fr) minmax(0, 0.82fr);
  gap: clamp(1rem, 2vw, 2rem);
  padding: clamp(0.85rem, 1.35vw, 1.5rem);
}

.token-section__header {
  display: grid;
  align-content: start;
  gap: 0.6rem;
}

.token-section__header h2 {
  max-width: 8em;
  font-family: var(--type-display);
  font-size: clamp(1.75rem, 2.8vw, 3.4rem);
  font-weight: 700;
  line-height: 0.95;
  letter-spacing: var(--type-display-tracking);
}

.token-color-grid,
.token-type-grid,
.token-component-grid,
.token-element-grid,
.token-motion-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.7rem, 1.1vw, 1rem);
}

.token-color-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.token-card,
.token-specimen,
.token-component-sample,
.token-motion-card {
  min-height: 14rem;
  padding: clamp(0.85rem, 1.2vw, 1.25rem);
  display: grid;
  align-content: space-between;
  gap: 1rem;
}

.token-card h3,
.token-specimen h3,
.token-component-sample h3,
.token-motion-card h3 {
  max-width: 14em;
  font-family: var(--type-display);
  font-size: clamp(1.1rem, 1.45vw, 1.7rem);
  font-weight: 700;
  line-height: 0.98;
  letter-spacing: var(--type-display-tracking);
}

.token-card p,
.token-component-sample p,
.token-motion-card p,
.token-specimen p:not(.token-kicker):not(.story-kicker) {
  max-width: 18em;
  color: #4c4c4c;
  font-size: clamp(0.84rem, 0.9vw, 1rem);
  line-height: 1.22;
}

.token-card > span {
  width: fit-content;
  padding: 0.36rem 0.48rem;
  border: 1px solid var(--wire-line);
  background: var(--brand-off-white);
  font-size: 0.76rem;
  line-height: 1;
  color: #555;
}

.token-swatch {
  width: 100%;
  min-height: clamp(7rem, 12vw, 13rem);
  border: 1px solid var(--wire-line);
}

.token-specimen--display {
  grid-column: span 2;
  min-height: 24rem;
  background: var(--brand-black);
  color: var(--brand-green);
}

.token-specimen--display .token-kicker,
.token-specimen--display dl {
  color: var(--brand-off-white);
}

.token-specimen--display h3 {
  max-width: 9em;
  font-size: clamp(3rem, 6.1vw, 7.5rem);
  line-height: var(--type-display-leading);
}

.token-specimen--heading h3 {
  max-width: 9em;
  font-size: clamp(2.2rem, 4.2vw, 5.2rem);
  line-height: 0.98;
}

.token-specimen--body h3 {
  font-size: clamp(1.4rem, 2vw, 2.2rem);
}

.token-specimen--kicker {
  background: var(--brand-green);
}

.token-specimen dl,
.token-motion-card dl {
  margin: 0;
  display: grid;
  gap: 0.5rem;
}

.token-specimen dl div,
.token-motion-card dl div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-top: 0.5rem;
  border-top: 1px solid currentColor;
}

.token-specimen dt,
.token-specimen dd,
.token-motion-card dt,
.token-motion-card dd {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.1;
}

.token-specimen dd,
.token-motion-card dd {
  text-align: right;
}

.token-sample-button {
  width: fit-content;
  padding: 0.52em 0.58em 0.58em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--brand-black);
  background: var(--brand-black);
  color: var(--brand-off-white);
  font-family: var(--type-display);
  font-size: clamp(1.1rem, 1.6vw, 1.8rem);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: var(--type-display-tracking);
  text-decoration: none;
  transition: transform 160ms var(--motion-ease-out), background 160ms ease, color 160ms ease;
}

.token-sample-button:hover {
  background: var(--brand-white);
  color: var(--brand-black);
}

.token-sample-button:active {
  transform: scale(0.97);
}

.token-sample-button--inverse {
  border-color: var(--brand-off-white);
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.token-sample-button--green {
  border-color: var(--brand-green);
  background: var(--brand-green);
  color: var(--brand-black);
}

.token-component-sample--inverse {
  background: var(--brand-black);
  color: var(--brand-off-white);
}

.token-component-sample--inverse p {
  color: #d8d8d8;
}

.token-component-sample--green {
  background: var(--brand-green);
}

.token-nav-sample,
.token-media-card,
.token-stack-sample {
  min-height: clamp(18rem, 29vw, 28rem);
  overflow: hidden;
}

.token-nav-sample {
  padding: clamp(0.75rem, 1.1vw, 1rem);
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1rem;
  background: var(--brand-off-white);
}

.token-nav-sample__brand {
  display: grid;
  grid-template-columns: 4rem minmax(7rem, 10rem);
  align-items: start;
  background: var(--brand-black);
}

.token-nav-sample__brand span,
.token-nav-sample__brand img {
  display: block;
}

.token-nav-sample__brand span {
  width: 4rem;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.token-nav-sample__brand span img,
.token-nav-sample__brand > img {
  width: 100%;
}

.token-media-card {
  position: relative;
  background: var(--brand-black);
}

.token-media-card img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.token-media-card .story-visual__type {
  transform: scale(0.56);
  transform-origin: 0 100%;
}

.token-stack-sample {
  display: grid;
  place-items: start;
  background: var(--brand-off-white);
}

.token-stack-sample .type-stack {
  width: 100%;
  min-height: auto;
}

.token-stack-sample .type-stack__item span {
  font-size: calc(clamp(2.5rem, 9vw, 7rem) * var(--stack-size, 1));
}

.token-motion-card {
  background: var(--wire-light);
}

.page-shell--design-system {
  background: var(--brand-off-white);
}

.section,
.footer {
  border: 1px solid var(--wire-line);
  background: var(--wire-light);
  margin: var(--wire-gap);
}

.section {
  min-height: 70vh;
  padding: var(--grid-gap);
  display: grid;
  grid-template-columns: minmax(14rem, 0.42fr) minmax(0, 0.58fr);
  gap: var(--grid-gap);
  align-items: stretch;
}

.section--hero {
  position: relative;
  height: clamp(560px, 32vw, 614.5px);
  min-height: 560px;
  max-height: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 54.37fr) minmax(0, 45.63fr);
  gap: 0;
  align-items: stretch;
  overflow: hidden;
  border: 0;
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.hero-brand-panel,
.hero-copy-panel {
  position: relative;
  min-height: 100%;
}

.hero-brand-panel {
  background: var(--brand-black);
  overflow: hidden;
}

.hero-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: min(32vw, 614.5px);
  max-width: none;
  aspect-ratio: 1 / 1;
  display: block;
}

.hero-lockup {
  position: absolute;
  top: 0;
  right: 0;
  width: min(22.37vw, 429.5px);
  transform: translateX(0.5%);
}

.hero-wordmark {
  display: block;
  width: 100%;
  height: auto;
}

.hero-year {
  display: block;
  width: 65.3%;
  background: var(--brand-green);
  color: var(--brand-black);
  font-family: var(--type-display);
  font-size: clamp(3.8rem, 5.1vw, 6.15rem);
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
  padding: 0.22em 0.22em 0.24em;
}

.section--type-stack {
  margin-left: 0;
  margin-right: 0;
  min-height: var(--preset-scroll-height, var(--motion-scene-height));
  padding: 0;
  grid-template-columns: 1fr;
  grid-auto-rows: max-content;
  gap: 0;
  align-items: start;
  align-content: start;
  border-color: var(--wire-line);
  background: var(--brand-off-white);
  color: var(--wire-dark);
}

.design-system-hero {
  min-height: auto;
  grid-template-columns: 1fr;
  background: var(--brand-off-white);
}

.design-system-hero .section__content {
  border-color: var(--brand-black);
}

.design-system-hero h1 {
  max-width: none;
  font-size: clamp(2.1rem, 4.2vw, 5rem);
}

.motion-repository-intro {
  margin: var(--wire-gap) 0;
  padding: clamp(0.85rem, 1.25vw, 1.4rem);
  display: grid;
  grid-template-columns: minmax(9rem, 0.22fr) minmax(0, 1fr);
  gap: clamp(0.75rem, 1.25vw, 1.5rem);
  align-items: start;
  border-block: 1px solid var(--wire-line);
  background: var(--wire-light);
  color: var(--wire-dark);
}

.motion-repository-intro h2 {
  max-width: 18em;
  font-family: var(--type-display);
  font-size: clamp(1.05rem, 1.45vw, 1.55rem);
  line-height: 0.96;
  letter-spacing: var(--type-display-tracking);
}

.motion-repository-intro p:not(.eyebrow) {
  max-width: 28rem;
  font-size: clamp(0.8rem, 0.9vw, 0.95rem);
  line-height: 1.15;
}

.motion-repository-intro__note {
  grid-column: 2;
}

.motion-archive-divider {
  margin: calc(var(--wire-gap) * 1.4) 0 0;
  padding: clamp(0.85rem, 1.25vw, 1.4rem);
  display: grid;
  grid-template-columns: minmax(9rem, 0.22fr) minmax(0, 1fr);
  gap: clamp(0.75rem, 1.25vw, 1.5rem);
  align-items: start;
  border-block: 1px solid var(--wire-line);
  background: var(--brand-black);
  color: var(--brand-green);
}

.motion-archive-divider h2 {
  max-width: 18em;
  font-family: var(--type-display);
  font-size: clamp(1.05rem, 1.45vw, 1.55rem);
  line-height: 0.96;
  letter-spacing: var(--type-display-tracking);
}

.type-stack-copy {
  position: relative;
  top: 0;
  min-height: 0;
  padding: clamp(0.85rem, 1.25vw, 1.4rem);
  display: grid;
  grid-template-columns: minmax(9rem, 0.22fr) minmax(0, 0.5fr) minmax(14rem, 0.28fr);
  align-items: start;
  gap: clamp(0.75rem, 1.25vw, 1.5rem);
  background: var(--wire-light);
  color: var(--wire-dark);
  border-bottom: 1px solid var(--wire-line);
}

.preset-meta {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  background: var(--wire-line);
  border: 1px solid var(--wire-line);
}

.preset-meta p {
  min-height: 3.7rem;
  padding: 0.55rem;
  display: grid;
  align-content: space-between;
  gap: 0.45rem;
  background: var(--wire-white);
}

.preset-meta span,
.preset-meta strong {
  display: block;
  font-size: clamp(0.68rem, 0.72vw, 0.78rem);
  line-height: 1;
}

.preset-meta span {
  color: #747474;
  text-transform: uppercase;
  letter-spacing: var(--type-meta-tracking);
}

.preset-meta strong {
  font-family: var(--type-display);
  font-weight: 700;
  letter-spacing: var(--type-display-tracking);
}

.type-stack-copy h2 {
  max-width: 18em;
  font-family: var(--type-display);
  font-size: clamp(1.05rem, 1.45vw, 1.55rem);
  line-height: 0.96;
  letter-spacing: var(--type-display-tracking);
}

.type-stack-copy p:not(.eyebrow) {
  max-width: 28rem;
  font-family: var(--type-body);
  font-size: clamp(0.8rem, 0.9vw, 0.95rem);
  line-height: 1.15;
  color: var(--wire-dark);
}

.type-stack-stage {
  position: sticky;
  top: 0;
  width: 100%;
  min-height: 100svh;
  display: grid;
  justify-items: start;
  align-items: start;
  padding-top: 0;
  overflow: hidden;
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.section--type-stack[data-pin-duration="short"] {
  --preset-scroll-height: 170svh;
}

.section--type-stack[data-pin-duration="medium"] {
  --preset-scroll-height: 220svh;
}

.section--type-stack[data-pin-duration="long"] {
  --preset-scroll-height: 285svh;
}

.section--type-stack[data-stack-format="long-form-cta"] {
  --long-stack-start-scale: 1;
  --long-stack-end-scale: 0.42;
  --long-stack-scale: var(--long-stack-start-scale);
  --long-stack-inline-pad: clamp(1.21rem, 3.08vw, 3.74rem);
}

.section--brand-lockup {
  --brand-lockup-icon-scale: 1;
  --brand-lockup-scale: 1;
  --brand-lockup-icon-size: clamp(18rem, 31vw, 39rem);
  --brand-lockup-icon-column: calc(var(--brand-lockup-icon-size) * var(--brand-lockup-icon-scale));
  --brand-lockup-final-scale: 0.28;
  margin-left: 0;
  margin-right: 0;
  min-height: 285svh;
  padding: 0;
  grid-template-columns: 1fr;
  grid-auto-rows: max-content;
  gap: 0;
  align-items: start;
  align-content: start;
  border-color: var(--wire-line);
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.brand-lockup-stage {
  position: sticky;
  top: 0;
  width: 100%;
  min-height: 100svh;
  display: grid;
  justify-items: start;
  align-items: start;
  overflow: hidden;
  background: var(--brand-off-white);
  color: var(--brand-black);
}

.brand-lockup {
  display: grid;
  grid-template-columns: var(--brand-lockup-icon-column) auto;
  align-items: start;
  justify-items: start;
  transform: scale(var(--brand-lockup-scale));
  transform-origin: 0% 0%;
  will-change: transform;
}

.brand-lockup__icon-frame {
  position: relative;
  width: var(--brand-lockup-icon-column);
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.brand-lockup__icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 1 / 1;
  display: block;
}

.brand-lockup__type {
  margin-left: -1px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.brand-lockup__type .type-stack__item {
  transform: none;
}

.brand-lockup__type .type-stack__item span {
  font-size: calc(clamp(1.5rem, 12vw, 13.5rem) * var(--stack-size, 1));
}

.brand-lockup__wordmark {
  --stack-size: 1;
  z-index: 2;
}

.brand-lockup__year {
  --stack-size: 0.58;
  z-index: 1;
}

.type-stack {
  position: relative;
  width: 100%;
  min-height: var(--stack-stage-min-height);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  isolation: isolate;
}

.type-stack__item {
  position: relative;
  left: 0;
  top: 0;
  width: fit-content;
  min-width: 0;
  padding-block: var(--stack-frame-inset) var(--stack-frame-inset-end);
  padding-inline: var(--stack-frame-inline);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border: var(--stack-frame-border);
  border-radius: var(--stack-frame-radius);
  background: var(--brand-green);
  color: var(--brand-black);
  transform-origin: var(--motion-scale-origin);
  transform: translate3d(0, 0, 0);
  opacity: var(--stack-opacity, 1);
  z-index: 1;
  will-change: transform, opacity;
}

.type-stack[data-stack-format="long-form-cta"] {
  width: 100%;
  min-height: auto;
  align-items: stretch;
  transform: scale(var(--long-stack-scale, 1));
  transform-origin: var(--motion-scale-origin);
  transition: transform var(--motion-ease-duration) ease;
}

.type-stack__item[data-stack-role="statement"] {
  width: 100%;
  min-height: calc(100svh - clamp(3.8rem, 6vw, 6.6rem));
  padding: clamp(1.65rem, 3.41vw, 3.96rem) var(--long-stack-inline-pad) clamp(1.98rem, 4.4vw, 4.84rem);
  align-items: flex-start;
}

.type-stack__item[data-stack-role="cta"] {
  width: fit-content;
  max-width: 100%;
  padding: clamp(0.528rem, 0.88vw, 0.935rem) var(--long-stack-inline-pad) clamp(0.605rem, 1.045vw, 0.99rem);
  transform: scale(var(--stack-motion-scale, 1));
}

.type-stack__item span {
  display: block;
  font-family: var(--type-display);
  font-weight: 700;
  font-size: calc(clamp(1.5rem, 12vw, 13.5rem) * var(--stack-size, 1) * var(--stack-motion-scale, 1));
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
  white-space: nowrap;
}

.type-stack__item[data-stack-role="statement"] span {
  max-width: 11.8em;
  font-weight: 700;
  font-size: clamp(3rem, 7.2vw, 7.3rem);
  line-height: 0.91;
  white-space: normal;
}

.type-stack__item[data-stack-role="cta"] span {
  font-size: calc(clamp(1rem, 2.4vw, 2.55rem));
  line-height: 0.95;
}

.type-stack__item[data-stack-tone="black-green"] {
  background: var(--stack-tone-black);
  color: var(--stack-tone-green);
}

.type-stack__item[data-stack-tone="green-black"] {
  background: var(--stack-tone-green);
  color: var(--stack-tone-black);
}

.type-stack__item[data-stack-tone="grey-black"] {
  background: var(--stack-tone-grey);
  color: var(--stack-tone-black);
}

.type-stack-shadow {
  position: absolute;
  right: clamp(1rem, 2vw, 2.5rem);
  bottom: clamp(1rem, 2vw, 2.5rem);
  max-width: 8.5em;
  font-family: var(--type-display);
  font-size: clamp(1.5rem, 3.8vw, 4.9rem);
  line-height: 0.82;
  color: var(--brand-off-white);
  mix-blend-mode: difference;
  transform-origin: 100% 100%;
  transform: scale(var(--stack-shadow-scale, 1));
}

.hero-copy-panel {
  background: var(--brand-off-white);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(1.35rem, 1.76vw, 2.2rem) clamp(2rem, 2.65vw, 3.2rem) clamp(1.5rem, 2.12vw, 2.6rem) clamp(8rem, 15.98vw, 19.2rem);
}

.hero-copy-panel h1 {
  max-width: 13.25em;
  font-family: var(--type-display);
  font-size: clamp(2rem, 2.074vw, 2.5rem);
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
}

.hero-meta {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: end;
}

.hero-meta p {
  margin: 0;
  max-width: 12em;
  font-family: var(--type-display);
  font-size: clamp(1rem, 1.178vw, 1.42rem);
  line-height: var(--type-display-leading);
  letter-spacing: var(--type-display-tracking);
}

.section--stack {
  grid-template-columns: 1fr;
}

.section__media,
.section__content,
.wire-card,
.footer {
  background: var(--wire-white);
  border: 1px solid var(--wire-line);
}

.section__media {
  padding: var(--wire-gap);
  display: grid;
  place-items: center;
}

.section__content {
  padding: var(--wire-gap);
  display: grid;
  align-content: start;
  gap: 1rem;
}

.section__content--wide {
  max-width: 68rem;
}

.logo-placeholder {
  width: min(100%, 24rem);
  aspect-ratio: 1 / 1;
  background: var(--wire-mid);
  border: 1px solid var(--wire-dark);
}

.media-placeholder {
  width: 100%;
  min-height: clamp(14rem, 28vw, 28rem);
  background: var(--wire-mid);
  border: 1px solid var(--wire-dark);
}

.eyebrow {
  margin: 0;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: var(--type-meta-tracking);
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  max-width: 20ch;
  font-size: clamp(2rem, 4vw, 4.5rem);
  line-height: 1;
}

h2 {
  max-width: 22ch;
  font-size: clamp(1.75rem, 3vw, 3.5rem);
  line-height: 1.02;
}

h3 {
  font-size: clamp(1.1rem, 1.6vw, 1.6rem);
  line-height: 1.08;
}

p,
dt,
dd,
a {
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  line-height: 1.25;
}

.card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--wire-gap);
}

.wire-card {
  padding: var(--wire-gap);
  display: grid;
  gap: 1rem;
  align-content: start;
  min-height: 16rem;
}

.wire-card--link {
  text-decoration: none;
  align-content: center;
}

.info-list {
  margin: 0;
  display: grid;
  gap: 1rem;
}

.info-list div {
  display: grid;
  gap: 0.35rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--wire-line);
}

.info-list dt,
.info-list dd {
  margin: 0;
}

.info-list dt {
  font-weight: 700;
}

.footer {
  min-height: 12rem;
  padding: var(--wire-gap);
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--wire-gap);
}

.footer__links {
  display: grid;
  gap: 0.4rem;
}

@media (max-width: 800px) {
  .page-shell--token-reference {
    padding: 0.75rem;
    gap: 0.75rem;
  }

  .token-hero,
  .token-section {
    grid-template-columns: 1fr;
  }

  .token-hero {
    min-height: auto;
  }

  .token-hero__brand {
    min-height: 22rem;
  }

  .token-hero__copy h1 {
    font-size: clamp(3.2rem, 15vw, 5.2rem);
    overflow-wrap: anywhere;
  }

  .token-color-grid,
  .token-type-grid,
  .token-component-grid,
  .token-element-grid,
  .token-motion-grid {
    grid-template-columns: 1fr;
  }

  .token-specimen--display {
    grid-column: auto;
    min-height: 20rem;
  }

  .token-specimen--display h3 {
    font-size: clamp(3rem, 15vw, 5.8rem);
  }

  .token-nav-sample {
    min-height: 15rem;
    display: grid;
    align-content: space-between;
  }

  .token-media-card,
  .token-stack-sample {
    min-height: 22rem;
  }

  .page-shell--landing {
    --intro-lockup-width: 92vw;
    --brand-lockup-icon-size: 38vw;
    --brand-lockup-final-scale: 0.42;
    --split-content-pad: clamp(1rem, 4.8vw, 1.45rem);
    --split-cta-font-size: clamp(1rem, 4.25vw, 1.22rem);
    --split-nav-clearance: clamp(5.7rem, 22vw, 7.2rem);
    --split-mobile-column-b-pad-top: calc(var(--split-nav-clearance) + var(--split-content-pad));
  }

  .page-intro {
    min-height: 160svh;
    display: block;
    padding-inline: var(--page-margin);
  }

  .page-intro__copy {
    min-height: 100svh;
    padding-top: clamp(42svh, 52vw, 58svh);
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr auto auto;
    gap: clamp(1rem, 4vw, 1.5rem);
  }

  .subtitle-hero {
    max-width: 12.5em;
    font-size: clamp(2rem, 8.6vw, 4rem);
  }

  .body-text {
    grid-column: 1;
    max-width: 14em;
  }

  .apply-cta {
    grid-column: 1;
    justify-self: end;
  }

  .split-nav {
    inset: 0 0 auto;
  }

  .split-brand {
    grid-template-columns: 2.55rem 8.4rem;
  }

  .split-nav__actions {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    z-index: 2001;
    width: max-content;
    max-width: calc(100vw - var(--split-content-pad));
    margin-left: auto;
    flex-direction: column-reverse;
    align-items: flex-end;
  }

  .split-nav__contact-bar {
    display: none;
  }

  .split-nav__apply.apply-cta,
  .split-nav__interest.apply-cta {
    width: max-content;
    max-width: 100%;
    min-width: 0;
    justify-content: flex-end;
    padding: 0.48em 0.54em 0.54em;
    font-size: var(--split-cta-font-size);
    text-align: right;
    overflow: hidden;
  }

  .split-nav::after {
    content: none;
  }

  .split-story {
    min-height: auto;
    display: block;
  }

  .split-story__visual-rail {
    display: none;
  }

  .story-progress {
    display: none;
  }

  .split-story__content {
    display: block;
  }

  .story-chapter {
    min-height: auto;
    padding: 0;
    display: block;
  }

  .story-chapter__mobile-visual {
    position: relative;
    display: block;
    width: 100%;
    min-height: 100svh;
    height: 100svh;
    margin: 0;
    overflow: hidden;
    background: var(--brand-black);
  }

  .story-chapter__mobile-visual img,
  .story-chapter__mobile-visual video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .story-mobile-type {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    display: grid;
    justify-items: start;
    margin: 0;
    font-family: var(--type-display);
    font-weight: var(--type-weight-bold);
    line-height: var(--type-compact-leading);
    letter-spacing: var(--type-display-tracking);
    color: var(--brand-black);
  }

  .story-mobile-type span {
    display: block;
    width: fit-content;
    max-width: 100%;
    padding: clamp(0.22rem, 0.9vw, 0.36rem) clamp(0.34rem, 1.55vw, 0.62rem);
    overflow-wrap: anywhere;
  }

  .story-mobile-type__main {
    width: min(100%, 11.8ch) !important;
    font-size: clamp(2.55rem, 10.8vw, 4.35rem);
  }

  .story-mobile-type__subtitle {
    font-size: clamp(1.42rem, 6.4vw, 2.35rem);
  }

  .story-mobile-type__caption {
    width: min(100%, 25ch) !important;
    font-size: clamp(0.86rem, 3.45vw, 1.12rem);
    line-height: 1;
    letter-spacing: var(--type-meta-tracking);
  }

  .story-mobile-type > span:nth-child(odd) {
    background: var(--panel-accent);
  }

  .story-mobile-type > span:nth-child(even) {
    background: var(--brand-off-white);
  }

  .story-chapter__mobile-visual--flood,
  .story-chapter__mobile-visual--tiles {
    display: grid;
    align-content: end;
    background: var(--panel-accent);
    color: var(--brand-black);
    font-family: var(--type-display);
    font-size: clamp(3rem, 15.2vw, 5.6rem);
    font-weight: var(--type-weight-bold);
    line-height: var(--type-compact-leading);
    letter-spacing: var(--type-display-tracking);
  }

  .story-chapter__mobile-visual--flood span,
  .story-chapter__mobile-visual--tiles span {
    display: block;
    padding: var(--type-block-pad-block) var(--type-block-pad-inline);
  }

  .story-chapter__mobile-visual--tiles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    height: 100svh;
    align-content: stretch;
    font-size: clamp(1.55rem, 7.8vw, 3.35rem);
  }

  .story-chapter__mobile-visual--tiles span {
    display: flex;
    align-items: flex-end;
    min-width: 0;
  }

  .story-chapter__inner {
    width: 100%;
    max-width: none;
    min-height: 100svh;
    padding: var(--split-mobile-column-b-pad-top) var(--split-content-pad) var(--split-content-pad);
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
  }

  .story-chapter__primary {
    padding-top: 0;
    width: 100%;
    min-width: 0;
    grid-column: 1;
  }

  .story-chapter__secondary {
    grid-column: 1;
    width: 100%;
    max-width: none;
    padding-bottom: 0;
    font-size: clamp(1.12rem, 4.85vw, 1.5rem);
  }

  .story-school-logo {
    display: none;
    right: auto;
    left: clamp(1.25rem, 5vw, 2rem);
    bottom: clamp(1.25rem, 5vw, 2rem);
    width: min(58vw, 12rem);
  }

  .story-school-logo-slot {
    display: none;
    justify-self: start;
    width: min(58vw, 12rem);
  }

  .story-chapter--hero .story-chapter__inner {
    padding-top: var(--split-mobile-column-b-pad-top);
  }

  .story-title {
    width: 100%;
    max-width: none;
    font-size: clamp(1.95rem, 8.2vw, 2.7rem);
  }

  .story-heading {
    width: 100%;
    font-size: clamp(1.86rem, 7.7vw, 2.52rem);
  }

  .story-subtitle {
    font-size: clamp(1.15rem, 4.8vw, 1.72rem);
  }

  .story-lede,
  .story-chapter p:not(.story-kicker):not(.story-subtitle),
  .story-action-list,
  .story-contact {
    max-width: none;
    font-size: clamp(1.04rem, 4.15vw, 1.32rem);
  }

  .story-contact p {
    font-size: clamp(1.1rem, 5vw, 1.55rem) !important;
  }

  .story-contact a {
    font-size: clamp(0.94rem, 3.35vw, 1.08rem);
  }

  .section,
  .card-grid,
  .footer {
    grid-template-columns: 1fr;
  }

  .footer {
    display: grid;
    align-content: end;
  }

  .section--hero {
    grid-template-columns: 1fr;
    height: auto;
    min-height: auto;
    max-height: none;
  }

  .hero-brand-panel {
    min-height: 58svh;
  }

  .hero-copy-panel {
    min-height: 48svh;
    padding: clamp(1.25rem, 6vw, 2rem);
  }

  .hero-meta {
    position: static;
    margin-top: clamp(3rem, 12vw, 5rem);
  }

  .hero-icon {
    left: -18%;
    top: auto;
    bottom: -32vw;
    width: 94vw;
  }

  .hero-lockup {
    width: min(68vw, 28rem);
  }

  .hero-copy-panel h1 {
    max-width: 17ch;
    font-size: clamp(2.2rem, 9.8vw, 4rem);
  }

  .hero-meta {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .section--type-stack {
    min-height: auto;
    grid-template-columns: 1fr;
  }

  .section--brand-lockup {
    min-height: auto;
  }

  .brand-lockup-stage {
    position: relative;
    min-height: clamp(34rem, 118vw, 46rem);
  }

  .brand-lockup {
    grid-template-columns: minmax(8rem, 31vw) auto;
  }

  .brand-lockup__icon-frame {
    width: min(31vw, 12rem);
  }

  .brand-lockup__type .type-stack__item span {
    font-size: calc(clamp(2.5rem, 23vw, 7.4rem) * var(--stack-size, 1));
  }

  .type-stack-copy,
  .type-stack-stage {
    position: relative;
    min-height: auto;
  }

  .type-stack-copy {
    min-height: 58svh;
  }

  .type-stack-stage {
    min-height: clamp(34rem, 118vw, 46rem);
  }

  .type-stack {
    width: min(92vw, 34rem);
    min-height: clamp(28rem, 100vw, 38rem);
  }

  .type-stack__item span {
    font-size: calc(clamp(2.5rem, 23vw, 7.4rem) * var(--stack-size, 1) * var(--stack-motion-scale, 1));
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
  }

  .section--type-stack {
    min-height: auto;
  }

  .section--brand-lockup {
    min-height: auto;
    --brand-lockup-icon-scale: var(--brand-lockup-icon-match-scale, 0.34);
    --brand-lockup-scale: var(--brand-lockup-final-scale);
  }

  .brand-lockup-stage {
    position: relative;
  }

  .type-stack-copy,
  .type-stack-stage {
    position: relative;
  }

  .type-stack__item {
    transform: translate3d(0, 0, 0);
    --stack-motion-scale: calc(var(--stack-min) + ((var(--stack-max) - var(--stack-min)) * var(--reduced-motion-step)));
  }

  .story-visual {
    position: absolute;
    opacity: 0;
    transform: translate3d(0, 0, 0);
    will-change: auto;
  }

  .story-visual:first-child,
  .story-visual.is-active {
    opacity: 1;
  }

  .story-visual__type span,
  .story-visual__cta-card span {
    opacity: 1;
    transform: none;
    will-change: auto;
  }

  .load-line__inner {
    opacity: 1;
    transform: none;
    transition-duration: 180ms !important;
    will-change: auto;
  }

  [data-load-item] {
    transform: none;
    transition-duration: 180ms !important;
    will-change: auto;
  }

  .custom-cursor {
    display: none;
  }
}
