@font-face {
  font-family: "InterVariable";
  src: url("/assets/fonts/inter/Inter-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Updated industries mosaic — Figma node 2220:6854 */
.industries-updated-section {
  width: 100%;
  height: 1624px;
  padding: 160px;
  overflow: hidden;
  background: #f6f6f6;
}

.industries-updated-wrap {
  display: flex;
  width: 1600px;
  height: 1304px;
  flex-direction: column;
  align-items: flex-start;
  gap: 160px;
}

.industries-updated-copy {
  display: flex;
  width: 960px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
}

.industries-updated-copy h2,
.industries-updated-copy p,
.industries-mosaic-card h3 {
  margin: 0;
  font-family: "InterVariable", Arial, sans-serif;
  font-style: normal;
}

.industries-updated-copy h2 {
  width: 960px;
  color: #2e2e2e;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.industries-updated-copy p {
  width: 960px;
  color: #4e4e4e;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.industries-mosaic {
  position: relative;
  width: 1600px;
  height: 800px;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 16px;
}

.industries-mosaic-card {
  position: absolute;
  isolation: isolate;
  overflow: hidden;
  border-radius: 8px;
}

.industries-mosaic-card img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.industries-card-bg {
  z-index: 0;
}

.industries-card-art {
  z-index: 1;
  transition: transform 700ms cubic-bezier(0.2, 0.7, 0.2, 1);
  transform-origin: center;
}

.industries-mosaic-card:hover .industries-card-art {
  transform: scale(1.045);
}

.industries-mosaic-card h3 {
  position: absolute;
  z-index: 2;
  top: 32px;
  color: #2e2e2e;
  font-size: 32px;
  font-weight: 500;
  line-height: 40px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

@media (prefers-reduced-motion: reduce) {
  .industries-card-art {
    transition: none;
  }

  .industries-mosaic-card:hover .industries-card-art {
    transform: none;
  }
}

.industries-retail { left: 0; top: 0; width: 640px; height: 552px; }
.industries-healthcare { left: 648px; top: 0; width: 952px; height: 400px; }
.industries-education { left: 0; top: 560px; width: 640px; height: 240px; }
.industries-ai { left: 648px; top: 408px; width: 232px; height: 392px; }
.industries-food { left: 888px; top: 408px; width: 232px; height: 392px; }
.industries-shipping { left: 1128px; top: 408px; width: 472px; height: 392px; }

.industries-retail h3,
.industries-education h3 { left: 30px; width: 580px; }
.industries-healthcare h3 { left: 40px; width: 872px; }
.industries-ai h3,
.industries-food h3 { left: 20px; width: 192px; }
.industries-shipping h3 { left: 40px; width: 392px; }

@media (min-width: 1400px) and (max-width: 1599px) {
  .industries-updated-section { height: 1218px; padding: 120px; }
  .industries-updated-wrap { width: 1200px; height: 978px; gap: 120px; }
  .industries-updated-copy { width: 720px; gap: 24px; }
  .industries-updated-copy h2 { width: 720px; font-size: 45px; line-height: 52.5px; }
  .industries-updated-copy p { width: 720px; font-size: 18px; line-height: 25.5px; }
  .industries-mosaic { transform: scale(0.75); transform-origin: top left; }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .industries-updated-section { height: 1056px; padding: 104px; }
  .industries-updated-wrap { width: 1040px; height: 848px; gap: 104px; }
  .industries-updated-copy { width: 624px; gap: 21px; }
  .industries-updated-copy h2 { width: 624px; font-size: 39px; line-height: 45.5px; }
  .industries-updated-copy p { width: 624px; font-size: 15.6px; line-height: 22.1px; }
  .industries-mosaic { transform: scale(0.65); transform-origin: top left; }
}

@media (max-width: 1199px) {
  .industries-updated-section { height: auto; padding: 96px var(--gutter); }
  .industries-updated-wrap { width: 100%; height: auto; gap: 80px; }
  .industries-updated-copy,
  .industries-updated-copy h2,
  .industries-updated-copy p { width: min(100%, 960px); }
  .industries-updated-copy h2 { font-size: clamp(42px, 6vw, 60px); line-height: 1.16; }
  .industries-mosaic { width: 100%; height: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; overflow: visible; }
  .industries-mosaic-card { position: relative; inset: auto; width: 100%; height: auto; aspect-ratio: 1 / .72; }
  .industries-mosaic-card img { object-fit: cover; }
  .industries-mosaic-card h3 { top: 24px; left: 24px; width: calc(100% - 48px); font-size: clamp(24px, 3vw, 32px); line-height: 1.25; }
}

@media (max-width: 760px) {
  .industries-updated-section { padding-top: 72px; padding-bottom: 72px; }
  .industries-updated-wrap { gap: 56px; }
  .industries-updated-copy { gap: 20px; }
  .industries-updated-copy h2 { font-size: 38px; }
  .industries-updated-copy p { font-size: 20px; line-height: 30px; }
  .industries-mosaic { grid-template-columns: 1fr; }
}

@font-face {
  font-family: "InterVariable";
  src: url("/assets/fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --black: #050605;
  --ink: #111313;
  --muted: #707070;
  --stroke-color: #c6c6c6;
  --line: var(--stroke-color);
  --soft: #f4f4f2;
  --paper: #fbfbfa;
  --green: #087356;
  --green-soft: #8fc3b1;
  --max: 1600px;
  --gutter: clamp(24px, 8vw, 160px);
}

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  scroll-behavior: auto;
}

html.lenis,
html.lenis body {
  height: auto;
}

html.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

html.lenis.lenis-stopped {
  overflow: hidden;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--soft);
  color: var(--ink);
  font-family: "InterVariable", Arial, sans-serif;
  font-optical-sizing: auto;
  font-variation-settings: "slnt" 0;
  letter-spacing: 0;
}

body::before {
  position: fixed;
  inset: 0;
  z-index: 119;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.35' numOctaves='4' stitchTiles='stitch' result='grain'/%3E%3CfeColorMatrix in='grain' type='matrix' values='0 0 0 0 0.0392 0 0 0 0 0.0392 0 0 0 0 0.0392 0.08 0 0 0 0'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23noise)'/%3E%3C/svg%3E");
  background-size: 64px 64px;
  background-repeat: repeat;
  mix-blend-mode: multiply;
}

a {
  color: inherit;
  text-decoration: none;
}

.container {
  width: min(calc(100% - (var(--gutter) * 2)), var(--max));
  margin: 0 auto;
}

.section {
  padding: clamp(96px, 9vw, 170px) 0;
}

.section-light {
  background: var(--paper);
}

.section-dark {
  background: var(--black);
  color: #f4f4f1;
}

.hero {
  --hero-auto-x: 0px;
  --hero-auto-y: 0px;
  --hero-stage-x: 0px;
  --hero-stage-y: 0px;
  --hero-stage-rotate-x: 0deg;
  --hero-stage-rotate-y: 0deg;
  --hero-pointer-scale: 1;
  --hero-stage-base-scale: 1.2;
  --hero-focus-x: 50%;
  --hero-focus-y: 50%;
  --hero-focus-opacity: 0;
  --hero-focus-size: 340px;
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 860px;
  overflow: hidden;
  isolation: isolate;
}

.hero::before,
.hero::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
}

.hero::before {
  display: none;
}

.hero::after {
  display: none;
}

.hero-media {
  position: absolute;
  inset: -24svh -16vw;
  z-index: -3;
  min-height: calc(100% + 48svh);
  overflow: hidden;
  background: #020504;
  transform-origin: center;
}

.hero-parallax-layer,
.hero-image-layer,
.hero-background-picture,
.hero-background-image,
.hero-image-layer img {
  width: 100%;
  height: 100%;
  display: block;
}

.hero-parallax-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  transform-origin: center;
  transform-style: preserve-3d;
  perspective: 1200px;
  perspective-origin: 50% 50%;
  transform:
    translate3d(var(--hero-stage-x), var(--hero-stage-y), 0)
    rotateX(var(--hero-stage-rotate-x))
    rotateY(var(--hero-stage-rotate-y))
    scale(calc(var(--hero-stage-base-scale) * var(--hero-pointer-scale)));
}

.hero-image-layer,
.hero-dark-overlay {
  position: absolute;
  inset: 0;
}

.hero-image-layer img,
.hero-background-image,
.hero-dark-overlay img {
  object-fit: cover;
  object-position: 50% 48%;
  width: 100%;
  height: 100%;
  display: block;
}

.hero-base-layer {
  z-index: 0;
  opacity: 1;
  transform: translateZ(0) scale(1.08);
  transform-origin: center;
}

.hero-base-layer img {
  filter: none;
}

.hero-blur-layer,
.hero-forward-movement-layer {
  pointer-events: none;
  will-change: transform;
}

.hero-blur-layer {
  inset: -18%;
  z-index: 1;
  opacity: 0;
  transform: translateZ(68px) scale(1.12);
  transform-origin: center;
}

.hero-blur-layer img {
  filter: blur(24px);
  transform: scale(1.18);
  transform-origin: center;
}

.hero-forward-movement-layer {
  z-index: 2;
  opacity: 0;
  filter: blur(0);
  animation: continuousZoomSevenLayer 10s linear infinite;
  animation-delay: calc(var(--layer-phase) * -1.4286s);
  transform-origin: 50% 50%;
  will-change: transform, opacity, filter;
}

.hero-forward-movement-layer img {
  filter: none;
}

.hero-focus-layer {
  z-index: 3;
  opacity: var(--hero-focus-opacity);
  transform: translateZ(220px) scale(1.015);
  transform-origin: center;
  transition: opacity 140ms ease;
  will-change: opacity, mask-image, -webkit-mask-image;
  -webkit-mask-image:
    radial-gradient(
      circle var(--hero-focus-size) at var(--hero-focus-x) var(--hero-focus-y),
      rgba(0, 0, 0, 1) 0%,
      rgba(0, 0, 0, 0.88) 36%,
      rgba(0, 0, 0, 0.32) 70%,
      rgba(0, 0, 0, 0) 100%
    );
  mask-image:
    radial-gradient(
      circle var(--hero-focus-size) at var(--hero-focus-x) var(--hero-focus-y),
      rgba(0, 0, 0, 1) 0%,
      rgba(0, 0, 0, 0.88) 36%,
      rgba(0, 0, 0, 0.32) 70%,
      rgba(0, 0, 0, 0) 100%
    );
}

.hero-focus-layer img {
  filter: none;
}

@keyframes continuousZoomSevenLayer {
  0% {
    visibility: visible;
    opacity: 0;
    filter: blur(0);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1);
  }

  14.285% {
    visibility: visible;
    opacity: 0.2;
    filter: blur(0.4px);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1.058);
  }

  28.571% {
    visibility: visible;
    opacity: 0.4;
    filter: blur(0.8px);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1.117);
  }

  42.857% {
    visibility: visible;
    opacity: 0.6;
    filter: blur(1.2px);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1.175);
  }

  57.143% {
    visibility: visible;
    opacity: 0.8;
    filter: blur(1.6px);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1.233);
  }

  71.429% {
    visibility: visible;
    opacity: 1;
    filter: blur(2px);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1.292);
  }

  85.714% {
    visibility: visible;
    opacity: 0;
    filter: blur(2.5px);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1.35);
  }

  100% {
    visibility: visible;
    opacity: 0;
    filter: blur(0);
    transform:
      translate3d(var(--hero-auto-x), var(--hero-auto-y), 136px)
      scale(1);
  }
}

.hero-dark-overlay {
  z-index: 4;
  pointer-events: none;
}

.hero-dark-overlay::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(ellipse at 62% 53%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.08) 34%, rgba(0, 0, 0, 0.28) 76%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.26) 34%, rgba(0, 0, 0, 0.2) 62%, rgba(0, 0, 0, 0.52)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.46), rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.2) 66%, rgba(0, 0, 0, 0.58));
}

.hero-dark-overlay img {
  object-position: 50% 50%;
}

@media (min-width: 1920px) {
  .hero {
    --hero-stage-base-scale: 1.34;
  }

  .hero-media {
    inset: -30svh -22vw;
    min-height: calc(100% + 60svh);
  }

  .hero-base-layer {
    transform: translateZ(0) scale(1.14);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-media {
    inset: 0;
    min-height: 100%;
    transform: none !important;
    will-change: auto;
  }

  .hero-forward-movement-layer,
  .hero-blur-layer {
    transform: none !important;
    will-change: auto;
    transition: none;
  }

  .hero-blur-layer,
  .hero-forward-movement-layer,
  .hero-focus-layer {
    display: none;
  }

  .bottom-nav-shell,
  .site-bottom-blur,
  .bottom-nav-menu,
  .bottom-nav-link {
    transition: none;
  }
}

.side-nav {
  position: absolute;
  top: clamp(180px, 13.645833vw, 262px);
  left: var(--gutter);
  z-index: 2;
  display: grid;
  gap: 24px;
  color: #fff;
  width: 192px;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.brand {
  display: flex;
  align-items: center;
  width: 160px;
  height: 40.173px;
}

.brand img {
  display: block;
  width: 160px;
  height: 40.173px;
}

.side-nav a:not(.brand) {
  display: flex;
  width: 192px;
  height: 30px;
  gap: 16px;
  align-items: center;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.nav-icon {
  width: 24px;
  height: 24px;
  display: block;
}

.bottom-nav-shell {
  position: fixed;
  bottom: max(28px, env(safe-area-inset-bottom));
  left: 50%;
  z-index: 80;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, 28px, 0);
  transition: opacity 260ms ease, transform 260ms ease;
}

.site-bottom-blur {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 70;
  width: 100vw;
  height: 12vh;
  min-height: 72px;
  max-height: 130px;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transition: opacity 260ms ease;
}

.site-bottom-blur.is-visible {
  opacity: 1;
}

.site-bottom-blur-layer {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
}

.site-bottom-blur-layer-soft {
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 33.3333%,
    #000 66.6667%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 33.3333%,
    #000 66.6667%,
    transparent 100%
  );
}

.site-bottom-blur-layer-medium {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 33.3333%,
    #000 66.6667%,
    #000 100%,
    transparent 133.3333%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 33.3333%,
    #000 66.6667%,
    #000 100%,
    transparent 133.3333%
  );
}

.site-bottom-blur-layer-strong {
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 66.6667%,
    #000 100%,
    #000 133.3333%,
    transparent 166.6667%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 66.6667%,
    #000 100%,
    #000 133.3333%,
    transparent 166.6667%
  );
}

.bottom-nav-shell.is-after-hero {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0);
}

.bottom-nav-shell.is-over-footer {
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, 34px, 0);
}

.bottom-nav-shell.is-scrolling:not(:hover):not(:focus-within) {
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, 34px, 0);
}

.bottom-nav-shell::before {
  position: absolute;
  bottom: 34px;
  left: 50%;
  width: 190px;
  height: 18px;
  content: "";
  transform: translateX(-50%);
}

.bottom-nav-trigger {
  display: block;
  width: 190px;
  height: 36px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  transition: opacity 160ms ease, transform 160ms ease;
}

.bottom-nav-trigger img {
  display: block;
  width: 190px;
  height: 36px;
}

.bottom-nav-trigger:focus-visible {
  outline: 2px solid #00694e;
  outline-offset: 5px;
  border-radius: 22px;
}

.bottom-nav-shell:hover .bottom-nav-trigger,
.bottom-nav-shell:focus-within .bottom-nav-trigger,
.bottom-nav-shell.is-expanded .bottom-nav-trigger {
  opacity: 0;
  transform: translate3d(0, 4px, 0) scale(0.98);
}

.bottom-nav-menu {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 190px;
  height: 174px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 0 0 1px var(--stroke-color), 0 18px 50px rgba(10, 10, 10, 0.16);
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transform: translate3d(-50%, 8px, 0) scale(0.98);
  transform-origin: 50% 100%;
  transition: opacity 220ms ease, transform 220ms ease;
}

.bottom-nav-shell:hover .bottom-nav-menu,
.bottom-nav-shell:focus-within .bottom-nav-menu,
.bottom-nav-shell.is-expanded .bottom-nav-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0) scale(1);
}

.bottom-nav-link {
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  width: 100%;
  height: 30px;
  padding: 0 16px;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
  transition: background-color 160ms ease, color 160ms ease;
}

.bottom-nav-home {
  top: 11px;
}

.bottom-nav-system {
  top: 41px;
}

.bottom-nav-work {
  top: 71px;
}

.bottom-nav-about {
  top: 101px;
}

.bottom-nav-contact {
  top: 131px;
}

.bottom-nav-link:hover,
.bottom-nav-link:focus-visible {
  background: #f2f2f2;
}

.bottom-nav-link:focus-visible {
  outline: none;
}

.bottom-nav-link.is-active {
  color: #00694e;
  font-weight: 500;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.hero-inner {
  position: absolute;
  z-index: 1;
  top: clamp(180px, 13.645833vw, 262px);
  left: clamp(420px, 33.333vw, 640px);
  display: flex;
  width: min(1120px, calc(100vw - clamp(420px, 33.333vw, 640px) - var(--gutter)));
  height: 556px;
  min-height: 0;
  flex-direction: column;
  justify-content: flex-start;
  gap: 32px;
  padding: 0;
}

.eyebrow {
  display: flex;
  width: 422px;
  height: 46px;
  align-items: center;
  justify-content: center;
  margin-bottom: 0;
  padding: 8px 24px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.24);
  color: #fff;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
  white-space: nowrap;
}

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

h1 {
  width: min(1120px, calc(100vw - clamp(420px, 33.333vw, 640px) - var(--gutter)));
  height: auto;
  max-width: none;
  background: linear-gradient(90deg, #ffffff 0%, #f2f2f0 18%, #d7d7d4 42%, #a9a9a9 72%, #747474 100%);
  color: transparent;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: clamp(86px, 6.25vw, 120px);
  font-weight: 600;
  line-height: 1.083;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
  -webkit-background-clip: text;
  background-clip: text;
}

.hero p {
  width: min(1120px, calc(100vw - clamp(420px, 33.333vw, 640px) - var(--gutter)));
  max-width: none;
  height: 92px;
  margin-top: 0;
  background: linear-gradient(90deg, #ffffff 0%, #676767 100%);
  color: transparent;
  font-size: 36px;
  font-weight: 400;
  line-height: 46px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
  -webkit-background-clip: text;
  background-clip: text;
}

.button {
  display: inline-flex;
  width: 207px;
  height: 62px;
  min-height: 62px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 0;
  padding: 16px 32px;
  border: 1px solid var(--stroke-color);
  border-radius: 8px;
  background: #fff;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.button img {
  width: 24px;
  height: 24px;
  display: block;
  flex: 0 0 24px;
}

.reality-section {
  width: 100%;
  min-height: 2136px;
  padding: 320px 160px;
  background: #fff;
  color: #0a0a0a;
}

.reality-wrap {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 320px;
  margin: 0 auto;
}

.reality-intro {
  display: flex;
  width: 100%;
  height: 380px;
  flex-direction: column;
  gap: 48px;
}

.reality-tagline {
  position: relative;
  display: flex;
  width: 100%;
  height: 58px;
  flex-direction: column;
  justify-content: flex-start;
  gap: 24px;
}

.reality-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.reality-tagline p {
  width: 100%;
  height: 34px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.reality-heading {
  display: flex;
  width: 640px;
  height: 274px;
  flex-direction: column;
  gap: 32px;
}

.reality-heading h2 {
  width: 640px;
  height: 140px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.reality-heading p {
  width: 640px;
  height: 102px;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.reality-body {
  display: flex;
  width: 1600px;
  height: 796px;
  flex-direction: column;
  gap: 32px;
}

.reality-grid {
  display: grid;
  width: 1600px;
  grid-template-columns: 720px 720px;
  grid-template-rows: 132px 480px;
  gap: 32px 160px;
}

.reality-note {
  display: flex;
  width: 720px;
  height: 132px;
  align-items: flex-start;
  gap: 5px;
  padding: 32px;
  border-radius: 16px;
  background: linear-gradient(90deg, #fff 0%, #f2f2f2 100%);
}

.note-dot {
  display: block;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  position: relative;
}

.note-dot::after {
  position: absolute;
  top: 11px;
  left: 11px;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #0a0a0a;
  content: "";
}

.reality-note div {
  display: flex;
  width: 617px;
  flex-direction: column;
  gap: 8px;
}

.reality-note h3 {
  width: 617px;
  height: 34px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.reality-note p {
  width: 617px;
  height: 26px;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.reality-visual {
  position: relative;
  width: 720px;
  height: 480px;
  overflow: hidden;
  border-radius: 16px;
}

.visual-bg {
  position: absolute;
  inset: 0;
  width: 720px;
  height: 480px;
  will-change: transform;
}

.visual-independent {
  position: absolute;
  top: 76px;
  left: 76px;
  width: 568px;
  height: 328px;
}

.visual-together {
  position: absolute;
  top: 35px;
  left: 105px;
  width: 490px;
  height: 411px;
}

.reality-strip {
  position: relative;
  display: flex;
  width: 1600px;
  height: 120px;
  align-items: center;
  gap: 16px;
  padding: 24px;
  border-radius: 16px;
  background: linear-gradient(90deg, #fff 0%, #f2f2f2 100%);
  will-change: transform;
}

.reality-strip::before {
  position: absolute;
  inset: 0;
  padding: 0.5px;
  border-radius: 16px;
  background: linear-gradient(90deg, #676767 0%, #f2f2f2 100%);
  content: "";
  pointer-events: none;
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.strip-left-icon {
  display: flex;
  width: 68px;
  height: 68px;
  flex: 0 0 68px;
  align-items: center;
  justify-content: center;
  border-radius: 34px;
  background: #f2f2f2;
}

.strip-left-icon img,
.strip-arrow {
  width: 24px;
  height: 24px;
  display: block;
}

.strip-copy {
  display: flex;
  width: 228px;
  height: 68px;
  flex-direction: column;
  gap: 8px;
  white-space: nowrap;
}

.strip-copy small,
.strip-right-copy {
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.strip-copy strong {
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.strip-spacer {
  flex: 1 1 auto;
}

.strip-right-copy {
  width: 178px;
  height: 52px;
}

.strip-arrow {
  flex: 0 0 24px;
}

.system-section {
  --system-scale: 1;
  --system-frame-width: 1600px;
  --system-sequence-render-height: 900px;
  width: 100%;
  min-height: 100vh;
  padding: 320px var(--gutter);
  background: #0a0a0a;
  color: #fff;
  position: relative;
  z-index: 1;
}

.system-scale-frame {
  width: min(100%, var(--system-frame-width));
  margin: 0 auto;
}

.system-wrap {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 240px;
  margin: 0;
}

.system-intro {
  display: flex;
  width: 1600px;
  height: 380px;
  flex-direction: column;
  gap: 48px;
}

.system-tagline {
  position: relative;
  display: flex;
  width: 1600px;
  height: 58px;
  flex-direction: column;
  gap: 24px;
}

.system-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.system-tagline p,
.system-heading h2,
.system-heading p,
.dt-card-copy h3,
.dt-card-copy p,
.dt-tags span,
.dt-center-copy strong,
.dt-center-copy span {
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.system-tagline p {
  width: 1600px;
  height: 34px;
  background-image: linear-gradient(108deg, #fff 0%, #676767 100%);
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.system-heading {
  display: flex;
  width: 800px;
  height: 274px;
  flex-direction: column;
  gap: 32px;
}

.system-heading h2 {
  width: 800px;
  height: 140px;
  background-image: linear-gradient(112deg, #fff 0%, #676767 134%);
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.system-heading p {
  width: 640px;
  height: 102px;
  background-image: linear-gradient(92deg, #fff 0%, #676767 100%);
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.system-sequence {
  position: relative;
  width: 1600px;
  height: 660vh;
}

.system-sequence-sticky {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  width: 1600px;
  height: 900px;
  overflow: hidden;
  transform: scale(var(--system-scale, 1));
  transform-origin: top left;
}

.system-sequence-sticky.is-pinned {
  position: fixed;
  top: var(--system-pin-top, 72px);
  left: var(--system-pin-left, 0px);
  width: 1600px;
  height: 900px;
}

.system-sequence-sticky.is-complete {
  position: absolute;
  top: calc(100% - var(--system-sequence-render-height));
  left: 0;
}

.dt-system-diagram {
  position: relative;
  width: 1600px;
  height: 900px;
}

.dt-structure-placeholder {
  position: absolute;
  inset: 0;
  width: 1600px;
  height: 900px;
  display: block;
  opacity: 0;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}

.dt-card {
  position: absolute;
  margin: 0;
  opacity: var(--card-progress, 1);
  transform:
    translate(
      calc(var(--card-from-x, 0px) * (1 - var(--card-progress, 1))),
      calc(var(--card-from-y, 0px) * (1 - var(--card-progress, 1)))
    )
    scale(calc(0.25 + (0.75 * var(--card-progress, 1))));
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  z-index: 2;
}

.dt-card-wide {
  width: 788px;
  height: 284px;
}

.dt-card-small {
  width: 600px;
  height: 284px;
}

.dt-strategy {
  top: 0;
  left: 0;
  --card-from-x: 406px;
  --card-from-y: 308px;
}

.dt-experience {
  top: 0;
  left: 812px;
  --card-from-x: -406px;
  --card-from-y: 308px;
}

.dt-communication {
  top: 308px;
  left: 0;
  --card-from-x: 500px;
  --card-from-y: 0px;
}

.dt-technology {
  top: 308px;
  left: 1000px;
  --card-from-x: -500px;
  --card-from-y: 0px;
}

.dt-growth {
  top: 616px;
  left: 0;
  --card-from-x: 406px;
  --card-from-y: -308px;
}

.dt-ai {
  top: 616px;
  left: 812px;
  --card-from-x: -406px;
  --card-from-y: -308px;
}

.dt-card-asset {
  display: block;
  width: 100%;
  height: 100%;
}

.dt-center-card {
  position: absolute;
  top: 225px;
  left: 584px;
  width: 432px;
  height: 448px;
  opacity: var(--center-progress, 1);
  transform:
    scale(calc(0.25 + (0.75 * var(--center-progress, 1))));
  transform-origin: 50% 50%;
  will-change: transform, opacity;
  z-index: 4;
}

.dt-center-card-asset {
  width: 432px;
  height: 448px;
  display: block;
}

.dt-dots {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 5;
}

.dt-dot {
  position: absolute;
  width: 28px;
  height: 28px;
  opacity: var(--dots-progress, 0);
  transform: scale(calc(0.65 + (0.35 * var(--dots-progress, 0))));
  transform-origin: 50% 50%;
  will-change: transform, opacity;
}

.dt-dot-top {
  top: 236px;
  left: 787px;
}

.dt-dot-left {
  top: 436px;
  left: 587px;
}

.dt-dot-right {
  top: 437px;
  left: 987px;
}

.dt-dot-bottom {
  top: 637px;
  left: 787px;
}

.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity 700ms ease,
    transform 700ms ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.section-kicker {
  display: flex;
  gap: 10px;
  align-items: baseline;
  border-bottom: 1px solid var(--line);
  padding-bottom: 28px;
  color: #202020;
  font-size: 17px;
}

.section-kicker.dark {
  border-color: var(--stroke-color);
  color: rgba(255, 255, 255, 0.68);
}

.section-kicker strong {
  font-weight: 800;
}

.section-heading {
  margin-top: 58px;
}

.section-heading h2 {
  max-width: 660px;
  font-size: clamp(42px, 4vw, 62px);
  font-weight: 800;
  line-height: 1.05;
}

.section-heading p {
  max-width: 560px;
  margin-top: 42px;
  color: var(--muted);
  font-size: 20px;
  line-height: 1.42;
}

.section-dark .section-heading p {
  color: rgba(255, 255, 255, 0.62);
}

.systems-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(44px, 6vw, 160px);
  margin-top: 150px;
}

.insight-card {
  min-width: 0;
}

.card-copy {
  min-height: 132px;
  padding: 32px 40px;
  border-radius: 9px;
  background: linear-gradient(90deg, #fff, #f1f1f1);
}

.card-copy h3 {
  display: flex;
  gap: 13px;
  align-items: center;
  font-size: 19px;
}

.card-copy h3 span {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #080808;
}

.card-copy p {
  margin-top: 14px;
  color: #898989;
  font-size: 14px;
}

.silo-map,
.radar-card {
  position: relative;
  display: grid;
  min-height: 410px;
  margin-top: 32px;
  place-items: center;
  overflow: hidden;
  border-radius: 9px;
  background:
    radial-gradient(circle, rgba(0, 0, 0, 0.05) 1px, transparent 1px) 0 0 / 12px 12px,
    #f2f2f1;
}

.silo-map {
  grid-template-columns: repeat(3, 112px);
  gap: 52px 100px;
}

.silo-map span {
  display: grid;
  width: 112px;
  height: 112px;
  place-items: center;
  border-radius: 10px;
  background: #666;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  overflow-wrap: anywhere;
  padding: 8px;
  text-align: center;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.radar {
  position: relative;
  width: 245px;
  height: 245px;
}

.radar span {
  position: absolute;
  inset: 0;
  border: 2px dashed var(--stroke-color);
  clip-path: polygon(50% 0, 94% 25%, 94% 75%, 50% 100%, 6% 75%, 6% 25%);
}

.radar span:nth-child(2) {
  inset: 38px;
}

.radar span:nth-child(3) {
  inset: 76px;
}

.cube {
  position: absolute;
  inset: 74px;
  background: linear-gradient(135deg, #dcece6 0 33%, #7fb9a8 33% 66%, #4e9d88 66%);
  clip-path: polygon(50% 0, 90% 25%, 90% 75%, 50% 100%, 10% 75%, 10% 25%);
}

.radar-label {
  position: absolute;
  color: #141414;
  font-size: 13px;
  font-weight: 800;
}

.radar-label.top { top: 46px; left: 50%; transform: translateX(-50%); }
.radar-label.right { top: 135px; right: 75px; }
.radar-label.lower-right { right: 115px; bottom: 96px; }
.radar-label.bottom { bottom: 46px; left: 50%; transform: translateX(-50%); }
.radar-label.lower-left { bottom: 96px; left: 115px; }
.radar-label.left { top: 135px; left: 75px; }

.wide-callout {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 24px;
  align-items: center;
  min-height: 118px;
  margin-top: 32px;
  padding: 0 34px;
  border: 1px solid var(--stroke-color);
  border-radius: 10px;
  background: linear-gradient(90deg, #fff, #f6f6f4);
}

.callout-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 50%;
  background: #f1f1f1;
}

.wide-callout small,
.wide-callout em {
  display: block;
  color: #858585;
  font-size: 14px;
  font-style: normal;
}

.wide-callout strong {
  display: block;
  margin-top: 8px;
  font-size: 22px;
}

.wide-callout em {
  max-width: 250px;
}

.section-system {
  position: relative;
  overflow: hidden;
  padding-top: 1120px;
}

.system-arc {
  position: absolute;
  top: -20px;
  left: 50%;
  width: min(1920px, 112vw);
  height: 1120px;
  border-radius: 50% 50% 0 0;
  background: #030303;
  transform: translateX(-50%);
}

.system-content {
  position: relative;
  z-index: 1;
}

.system-diagram {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 24px;
  margin-top: 170px;
}

.system-tile {
  display: flex;
  min-height: 220px;
  justify-content: space-between;
  gap: 24px;
  padding: 34px;
  border: 1px solid var(--stroke-color);
  border-radius: 18px;
  background: radial-gradient(circle at 80% 25%, rgba(255, 255, 255, 0.08), transparent 35%), #080808;
}

.system-tile h3 {
  color: #d8d8d8;
  font-size: 30px;
}

.system-tile p {
  margin-top: 8px;
  color: #9a9a9a;
  font-size: 15px;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.tags span {
  padding: 7px 10px;
  border: 1px solid var(--stroke-color);
  border-radius: 5px;
  color: #d7d7d7;
  font-size: 12px;
  font-weight: 600;
}

.tags.light span {
  border-color: var(--stroke-color);
  color: #777;
}

.strategy,
.communication,
.growth {
  grid-column: span 3;
}

.experience,
.technology,
.ai {
  grid-column: span 3;
}

.system-core {
  display: grid;
  grid-column: 3 / span 2;
  grid-row: 2 / span 1;
  min-height: 250px;
  place-items: center;
  align-content: center;
  padding: 34px;
  border: 17px solid var(--stroke-color);
  border-radius: 58px;
  background: var(--green);
  text-align: center;
  box-shadow: 0 0 45px rgba(143, 195, 177, 0.75);
}

.system-core span {
  font-size: 35px;
  font-weight: 800;
  line-height: 1.08;
}

.system-core small {
  max-width: 250px;
  margin-top: 28px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  line-height: 1.45;
}

.communication {
  grid-column: 1 / span 2;
}

.technology {
  grid-column: 5 / span 2;
}

.growth {
  grid-column: 1 / span 3;
}

.ai {
  grid-column: 4 / span 3;
}

.orb-visual,
.screen-visual,
.chart-visual,
.panel-visual,
.wave-visual,
.ai-visual {
  flex: 0 0 180px;
  min-height: 120px;
  border-radius: 14px;
  opacity: 0.88;
}

@media (max-width: 1919px) {
  :root {
    --gutter: clamp(48px, 6.667vw, 160px);
  }

  .reality-section,
  .system-section {
    padding: clamp(220px, 16.667vw, 320px) var(--gutter);
  }

  .system-wrap {
    transform: none;
  }

  .system-intro {
    transform: scale(var(--system-scale, 1));
    transform-origin: top left;
  }

  .human-ai-section {
    padding: clamp(220px, 16.667vw, 320px) var(--gutter);
  }

  .section-work,
  .process-section,
  .industries-section,
  .why-section {
    padding: clamp(220px, 16.667vw, 320px) var(--gutter);
  }

  .reality-section {
    min-height: auto;
  }

  .reality-wrap,
  .work-wrap,
  .process-wrap,
  .industries-wrap,
  .reality-intro,
  .reality-body,
  .reality-grid,
  .reality-strip,
  .system-wrap,
  .system-sequence,
  .work-intro,
  .work-tagline,
  .work-tagline p,
  .work-project-row,
  .process-intro,
  .process-tagline,
  .process-tagline p,
  .process-scroll,
  .process-sticky,
  .industries-intro,
  .industries-tagline,
  .industries-tagline p,
  .industries-grid {
    width: 100%;
  }

  .reality-wrap,
  .human-ai-wrap,
  .work-wrap,
  .process-wrap,
  .industries-wrap {
    max-width: 1600px;
    gap: clamp(220px, 16.667vw, 320px);
  }

  .reality-tagline::after,
  .work-tagline::after,
  .process-tagline::after,
  .industries-tagline::after {
    width: 100%;
  }

  .reality-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: clamp(48px, 6.667vw, 160px);
  }

  .reality-note,
  .reality-note div,
  .reality-note h3,
  .reality-note p,
  .reality-visual {
    width: 100%;
  }

  .reality-visual {
    height: auto;
    aspect-ratio: 720 / 480;
  }

  .visual-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .visual-independent {
    top: 15.833%;
    left: 10.556%;
    width: 78.889%;
    height: auto;
  }

  .visual-together {
    top: 7.292%;
    left: 14.583%;
    width: 68.056%;
    height: auto;
  }

  .work-project-row {
    height: auto;
    align-items: stretch;
  }

  .work-hero-card {
    flex: 1 1 50%;
    width: auto;
    min-width: 0;
  }

  .work-summary-card {
    flex: 1 1 24%;
    width: auto;
    min-width: 0;
  }

  .work-detail-card {
    flex: 1 1 25.5%;
    width: auto;
    min-width: 0;
  }

  .work-summary-top,
  .work-summary-card h3,
  .work-summary-description,
  .work-quote-block,
  .work-detail-list,
  .work-detail-item,
  .work-detail-item div,
  .work-detail-item h4,
  .work-detail-item p {
    width: 100%;
  }

  .work-hero-copy {
    width: min(416px, calc(100% - 64px));
  }

  .work-hero-copy h3,
  .work-hero-copy p {
    width: 100%;
  }

  .human-ai-copy-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: clamp(96px, 16.667vw, 320px);
    row-gap: clamp(96px, 8.333vw, 160px);
  }

  .human-ai-copy-card,
  .human-ai-copy-card h3,
  .human-ai-copy-card p {
    width: 100%;
  }

  .process-sticky {
    gap: clamp(40px, 4.167vw, 80px);
  }

  .process-stage-list {
    width: clamp(500px, 37.188vw, 595px);
    flex-basis: clamp(500px, 37.188vw, 595px);
    gap: clamp(32px, 2.604vw, 50px);
  }

  .process-steps,
  .process-step,
  .process-step-divider {
    width: 100%;
  }

  .process-step-copy,
  .process-step-title,
  .process-step-description {
    width: calc(100% - 60px);
  }

  .process-visual {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  .industries-grid {
    height: auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, auto);
  }

  .industry-card,
  .industry-card-image {
    width: 100%;
    height: auto;
    aspect-ratio: 528 / 264;
  }

  .industry-card-copy {
    width: calc(100% - 64px);
  }

  .industry-card-copy h3,
  .industry-card-copy p {
    width: 100%;
  }
}

@media (max-width: 1500px) {
  .system-tile {
    gap: 18px;
    padding: 24px;
  }

  .system-tile h3 {
    font-size: 25px;
  }

  .system-tile p {
    font-size: 13px;
  }

  .tags span {
    padding: 6px 8px;
    font-size: 11px;
  }

}

.orb-visual {
  border-radius: 50%;
  background: repeating-radial-gradient(circle, #6d7771 0 14px, #29302d 15px 26px, transparent 27px 38px);
}

.screen-visual,
.panel-visual,
.ai-visual {
  background:
    linear-gradient(#7ba697 0 0) 28px 42px / 58px 42px no-repeat,
    linear-gradient(#202020 0 0) 106px 42px / 120px 42px no-repeat,
    repeating-linear-gradient(90deg, #525252 0 16px, transparent 16px 28px) 26px 110px / 210px 18px no-repeat,
    #333;
  border: 1px solid var(--stroke-color);
}

.chart-visual {
  background:
    linear-gradient(to top, #b5e7d8 0 62%, transparent 62%) 26px 60px / 18px 80px no-repeat,
    linear-gradient(to top, #777 0 44%, transparent 44%) 58px 60px / 18px 80px no-repeat,
    linear-gradient(to top, #e8e8e8 0 84%, transparent 84%) 90px 60px / 18px 80px no-repeat,
    linear-gradient(to top, #58a990 0 70%, transparent 70%) 122px 60px / 18px 80px no-repeat,
    #202020;
  border: 1px solid var(--stroke-color);
}

.wave-visual {
  background:
    radial-gradient(ellipse at 24% 70%, transparent 20%, #81c8b2 21%, transparent 24%),
    radial-gradient(ellipse at 54% 30%, transparent 25%, #d6d6d6 26%, transparent 29%),
    linear-gradient(180deg, transparent 52%, rgba(114, 190, 168, 0.35)),
    #222;
  border: 1px solid var(--stroke-color);
}

.human-ai-section {
  --human-ai-scale: 1;
  --human-ai-zoom: 1;
  --human-ai-pan-x: 0px;
  --human-ai-pan-y: 0px;
  --human-ai-frame-width: 1600px;
  --human-ai-render-height: 992px;
  padding: 240px var(--gutter);
  background: #ffffff;
  color: #0a0a0a;
}

.human-ai-wrap {
  width: min(100%, var(--human-ai-frame-width));
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 36px;
}

.human-ai-tagline {
  position: relative;
  display: flex;
  width: 1600px;
  height: 58px;
  flex-direction: column;
  gap: 24px;
}

.human-ai-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.human-ai-tagline p {
  width: 1600px;
  height: 34px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.human-ai-heading {
  display: flex;
  width: 640px;
  flex-direction: column;
  gap: 32px;
}

.human-ai-heading h2 {
  width: 640px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.human-ai-heading p {
  width: 640px;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.human-ai-gallery {
  position: relative;
  height: auto;
  margin-top: 204px;
}

.human-ai-gallery-sticky {
  position: relative;
  width: 100vw;
  height: var(--human-ai-render-height);
  margin-left: calc((var(--human-ai-frame-width) - 100vw) / 2);
  overflow: hidden;
}

.human-ai-stage-frame {
  width: 1600px;
  height: 992px;
  margin-left: calc((100vw - var(--human-ai-frame-width)) / 2);
  overflow: visible;
  transform: scale(var(--human-ai-scale, 1));
  transform-origin: top left;
}

.human-ai-stage {
  position: relative;
  width: 1600px;
  height: 992px;
  transform:
    translate(var(--human-ai-pan-x, 0px), var(--human-ai-pan-y, 0px))
    scale(var(--human-ai-zoom, 1));
  transform-origin: 800px 496px;
}

.human-ai-panel,
.human-ai-center-card {
  position: absolute;
  margin: 0;
  transform-origin: 50% 50%;
}

.human-ai-panel img,
.human-ai-center-card img {
  display: block;
  width: 100%;
  height: 100%;
}

.human-ai-panel-understand {
  top: 0;
  left: 0;
  width: 712px;
  height: 320px;
  z-index: 2;
}

.human-ai-panel-explore {
  top: 0;
  left: 728px;
  width: 872px;
  height: 320px;
  z-index: 2;
}

.human-ai-panel-create {
  top: 336px;
  left: 0;
  width: 540px;
  height: 320px;
  z-index: 2;
}

.human-ai-center-card {
  top: 335px;
  left: 555px;
  width: 490px;
  height: 322px;
  z-index: 5;
}

.human-ai-panel-evaluate {
  top: 336px;
  left: 1060px;
  width: 540px;
  height: 320px;
  z-index: 2;
}

.human-ai-panel-improve {
  top: 672px;
  left: 888px;
  width: 712px;
  height: 320px;
  z-index: 1;
}

.human-ai-panel-build {
  top: 672px;
  left: 0;
  width: 872px;
  height: 320px;
  z-index: 1;
}

.human-ai-copy-grid {
  display: grid;
  width: 1600px;
  grid-template-columns: 640px 640px;
  column-gap: 320px;
  row-gap: 160px;
  justify-content: start;
  margin-top: 204px;
  will-change: transform, opacity;
}

.human-ai-copy-card {
  display: flex;
  width: 640px;
  min-height: 128px;
  flex-direction: column;
  gap: 8px;
}

.human-ai-copy-card h3 {
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 42px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.human-ai-copy-card p {
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.section-work {
  width: 100%;
  padding: 320px 160px;
  background: #f2f2f1;
  color: #0a0a0a;
}

.work-wrap {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 320px;
  margin: 0 auto;
}

.work-intro {
  display: flex;
  width: 1600px;
  height: 380px;
  flex-direction: column;
  gap: 48px;
}

.work-tagline {
  position: relative;
  display: flex;
  width: 1600px;
  height: 58px;
  flex-direction: column;
  gap: 24px;
}

.work-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.work-tagline p {
  width: 1600px;
  height: 34px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-heading {
  display: flex;
  width: 640px;
  flex-direction: column;
  gap: 32px;
}

.work-heading h2 {
  width: 640px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.work-heading p {
  width: 640px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-project-row {
  display: flex;
  width: 1600px;
  height: 450px;
  align-items: center;
  gap: 8px;
}

.work-hero-card,
.work-summary-card,
.work-detail-card {
  height: 450px;
  overflow: hidden;
  border-radius: 8px;
}

.work-hero-card {
  position: relative;
  flex: 0 0 800px;
  width: 800px;
  color: #fff;
}

.work-hero-background-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: transform 900ms cubic-bezier(0.19, 1, 0.22, 1);
  will-change: transform;
}

.work-hero-card:hover .work-hero-background-image {
  transform: scale(1.04);
}

.work-hero-logo {
  position: absolute;
  top: 32px;
  right: 32px;
  z-index: 1;
  display: block;
  pointer-events: none;
}

.work-hero-logo-dn {
  width: 58px;
  height: 44px;
}

.work-hero-logo-prometric {
  width: 136px;
  height: 48px;
}

.work-hero-logo-symphony {
  width: 166px;
  height: 22px;
}

.work-hero-copy {
  position: absolute;
  right: 32px;
  bottom: 32px;
  z-index: 1;
  display: flex;
  width: 416px;
  flex-direction: column;
  gap: 20px;
  align-items: flex-end;
  text-align: right;
  pointer-events: none;
}

.work-hero-copy h3 {
  width: 416px;
  margin: 0;
  color: #fff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 40px;
  font-weight: 500;
  line-height: 50px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.work-hero-copy p {
  width: 416px;
  margin: 0;
  color: #fff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

@media (prefers-reduced-motion: reduce) {
  .work-hero-background-image {
    transition: none;
  }

  .work-hero-card:hover .work-hero-background-image {
    transform: none;
  }
}

.work-summary-card,
.work-detail-card {
  flex: 0 0 auto;
  background: #fff;
  transition: box-shadow 700ms cubic-bezier(0.19, 1, 0.22, 1);
}

.work-summary-card:hover,
.work-detail-card:hover {
  box-shadow: 0 18px 50px rgba(10, 10, 10, 0.08);
}

.work-summary-card {
  display: flex;
  width: 352px;
  padding: 32px 32px 40px;
  flex-direction: column;
  justify-content: space-between;
}

.work-summary-top {
  position: relative;
  display: flex;
  width: 288px;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 24px;
  border-bottom: 0;
}

.work-summary-top::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.work-eyebrow {
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-summary-card h3 {
  width: 288px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-summary-description {
  width: 288px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-quote-block {
  display: flex;
  width: 288px;
  gap: 24px;
  align-items: flex-start;
}

.work-quote-block img {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
}

.work-quote-block p {
  width: 219px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-detail-card {
  display: flex;
  width: 432px;
  padding: 32px;
  flex-direction: column;
  gap: 24px;
}

.work-detail-card-tall {
  gap: 14px;
}

.work-detail-list {
  display: flex;
  width: 368px;
  flex-direction: column;
  gap: 24px;
}

.work-detail-card-tall .work-detail-list {
  gap: 14px;
}

.work-detail-item {
  position: relative;
  display: flex;
  width: 368px;
  gap: 20px;
  align-items: flex-start;
  padding-bottom: 24px;
  border-bottom: 0;
}

.work-detail-card-tall .work-detail-item {
  padding-bottom: 14px;
}

.work-detail-item:last-child {
  padding-bottom: 0;
}

.work-detail-item:not(:last-child)::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.work-detail-item span {
  display: flex;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  background: #f2f2f2;
}

.work-detail-item img {
  width: 16px;
  height: 16px;
}

.work-detail-item div {
  display: flex;
  width: 308px;
  flex-direction: column;
}

.work-detail-item h4 {
  width: 308px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.work-detail-item p {
  width: 308px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.process-section {
  width: 100%;
  padding: 320px 160px;
  background: #fff;
  color: #0a0a0a;
}

.process-wrap {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 320px;
  margin: 0 auto;
}

.process-intro {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 48px;
}

.process-tagline {
  position: relative;
  display: flex;
  width: 1600px;
  height: 58px;
  flex-direction: column;
  gap: 24px;
}

.process-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.process-tagline p {
  width: 1600px;
  height: 34px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.process-heading {
  display: flex;
  width: 640px;
  flex-direction: column;
  gap: 32px;
}

.process-heading h2 {
  width: 640px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.process-heading p {
  width: 640px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.process-scroll {
  position: relative;
  width: 1600px;
  height: 400vh;
  margin-top: calc((520px - max(100vh, 760px)) / 2);
}

.process-sticky {
  display: flex;
  width: 1600px;
  height: 100vh;
  min-height: 760px;
  align-items: center;
  gap: 80px;
}

.process-scroll.is-native-sticky .process-sticky {
  position: sticky;
  top: 0;
}

.process-stage-list {
  display: flex;
  width: 595px;
  height: 520px;
  gap: 50px;
  align-items: center;
  flex: 0 0 595px;
}

.process-progress {
  width: 5px;
  height: 520px;
  flex: 0 0 5px;
  overflow: hidden;
  border-radius: 100px;
  background: #f2f2f2;
}

.process-progress span {
  display: block;
  width: 5px;
  height: var(--process-progress-height, 95px);
  border-radius: 100px;
  background: #0a0a0a;
  transition: height 650ms cubic-bezier(0.19, 1, 0.22, 1);
}

.process-steps {
  display: flex;
  width: 540px;
  flex-direction: column;
  gap: 24px;
}

.process-step {
  display: flex;
  width: 540px;
  gap: 12px;
  align-items: flex-start;
  padding: 0;
  border: 0;
  background: transparent;
  opacity: 0.32;
  text-align: left;
  cursor: pointer;
  transition: opacity 450ms ease;
}

.process-step.is-active {
  opacity: 1;
}

.process-step-number {
  width: 48px;
  flex: 0 0 48px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 42px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.process-step-copy {
  display: flex;
  width: 480px;
  flex-direction: column;
}

.process-step-title {
  display: block;
  width: 480px;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 42px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.process-step-description {
  display: block;
  width: 480px;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.process-step-divider {
  display: block;
  width: 540px;
  height: 0.5px;
  background: var(--stroke-color);
}

.process-visual {
  position: relative;
  width: 925px;
  height: 520px;
  flex: 0 0 925px;
  overflow: hidden;
  border-radius: 8px;
}

.process-visual-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.015);
  transition:
    opacity 620ms ease,
    transform 900ms cubic-bezier(0.19, 1, 0.22, 1);
}

.process-visual-image.is-active {
  opacity: 1;
  transform: scale(1);
}

.process-visual:hover .process-visual-image.is-active {
  transform: scale(1.04);
}

.process-visual-shade {
  position: absolute;
  inset: 0;
  border-radius: 8px;
  background: #0a0a0a;
  opacity: 0.16;
  pointer-events: none;
}

.industries-section {
  width: 100%;
  padding: 320px 160px;
  background: #f2f2f2;
  color: #0a0a0a;
}

.industries-wrap {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 320px;
  margin: 0 auto;
}

.industries-intro {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 48px;
}

.industries-tagline {
  position: relative;
  display: flex;
  width: 1600px;
  height: 58px;
  flex-direction: column;
  gap: 24px;
}

.industries-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.industries-tagline p {
  width: 1600px;
  height: 34px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.industries-heading {
  display: flex;
  width: 640px;
  flex-direction: column;
  gap: 32px;
}

.industries-heading h2 {
  width: 640px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.industries-heading p {
  width: 640px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.industries-grid {
  display: grid;
  width: 1600px;
  height: 536px;
  grid-template-columns: repeat(3, 528px);
  grid-template-rows: repeat(2, 264px);
  gap: 8px;
}

.industry-card {
  position: relative;
  width: 528px;
  height: 264px;
  overflow: hidden;
  border-radius: 8px;
  background: #0a0a0a;
}

.industry-card-image {
  display: block;
  width: 528px;
  height: 264px;
  object-fit: cover;
  transform: scale(1);
  transition: transform 900ms cubic-bezier(0.19, 1, 0.22, 1);
  will-change: transform;
}

.industry-card:hover .industry-card-image {
  transform: scale(1.04);
}

.industry-card-copy {
  position: absolute;
  left: 32px;
  bottom: 32px;
  z-index: 1;
  display: flex;
  width: 464px;
  height: 60px;
  flex-direction: column;
  pointer-events: none;
}

.industry-card-copy h3 {
  width: 464px;
  height: 34px;
  margin: 0;
  color: #fff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.industry-card-copy p {
  width: 464px;
  height: 26px;
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.why-section {
  width: 100%;
  padding: 320px 160px;
  background: #ffffff;
  color: #0a0a0a;
}

.why-wrap {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 320px;
  margin: 0 auto;
}

.why-intro {
  display: flex;
  width: 1600px;
  min-height: 380px;
  flex-direction: column;
  gap: 48px;
}

.why-tagline {
  position: relative;
  display: flex;
  width: 1600px;
  height: 58px;
  flex-direction: column;
  gap: 24px;
}

.why-tagline::after {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1600px;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.why-tagline p {
  width: 1600px;
  height: 34px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.why-heading {
  display: flex;
  width: 640px;
  flex-direction: column;
  gap: 32px;
}

.why-heading h2 {
  width: 640px;
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.why-heading p {
  width: 640px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.why-outcomes {
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 8px;
}

.why-card-row {
  display: grid;
  width: 1600px;
  height: 404px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.why-card {
  display: flex;
  min-width: 0;
  height: 404px;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  border-radius: 8px;
  padding: 32px;
  background: #f2f2f2;
}

.why-card-image {
  display: block;
  width: 96px;
  height: 96px;
  border-radius: 8px;
  object-fit: cover;
}

.why-card-copy {
  position: relative;
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 8px;
  padding-top: 24px;
}

.why-card-copy::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.5px;
  background: var(--stroke-color);
  content: "";
}

.why-card-copy h3 {
  margin: 0;
  color: #0a0a0a;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.why-card-copy p {
  max-width: 456px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.why-cta {
  position: relative;
  width: 1600px;
  height: 112px;
  overflow: hidden;
  border-radius: 8px;
}

.why-cta-strip {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
}

.why-cta-circle {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: 300px;
  height: 300px;
  opacity: 1;
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: why-circle-breathe 6.4s ease-in-out infinite;
  will-change: transform, opacity;
}

.why-cta-line {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 24.125%;
  height: auto;
  pointer-events: none;
  opacity: 0.86;
  will-change: transform, opacity;
}

.why-cta-line-left {
  left: 8.375%;
  transform: translateY(-50%);
  animation: why-line-left-flow 5.8s ease-in-out infinite;
}

.why-cta-line-right {
  right: 8.375%;
  transform: translateY(-50%);
  animation: why-line-right-flow 5.8s ease-in-out infinite 0.35s;
}

.why-cta p {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  width: 507px;
  height: 42px;
  margin: 0;
  color: #ffffff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 42px;
  letter-spacing: -0.025em;
  text-align: center;
  transform: translate(-50%, -50%);
  font-variation-settings: "wght" 600, "slnt" 0;
}

@keyframes why-circle-breathe {
  0%,
  100% {
    opacity: 0.9;
    transform: translate(-50%, -50%) scale(0.98);
  }

  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.06);
  }
}

@keyframes why-line-left-flow {
  0%,
  100% {
    opacity: 0.72;
    transform: translateY(-50%) translateX(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-50%) translateX(10px);
  }
}

@keyframes why-line-right-flow {
  0%,
  100% {
    opacity: 0.72;
    transform: translateY(-50%) translateX(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-50%) translateX(-10px);
  }
}

.contact-section {
  position: relative;
  isolation: isolate;
  width: 100%;
  overflow: visible;
  padding: 160px 160px 0;
  background: #ffffff;
  color: #0a0a0a;
}

.contact-wrap {
  position: relative;
  display: flex;
  width: 1600px;
  flex-direction: column;
  margin: 0 auto;
}

.contact-panel {
  --contact-panel-bottom-space: 120px;
  position: relative;
  z-index: 2;
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 0;
  margin-bottom: var(--contact-panel-bottom-space);
  background: #ffffff;
  transform: translateZ(0);
}

.contact-panel-placeholder {
  display: block;
  height: 0;
  pointer-events: none;
}

.contact-panel.is-contact-pinned {
  position: fixed;
  top: var(--contact-pin-top);
  left: var(--contact-pin-left);
  width: var(--contact-pin-width);
}

.contact-panel::before {
  position: absolute;
  z-index: -1;
  top: -160px;
  bottom: 0;
  left: 50%;
  width: 100vw;
  background: #ffffff;
  content: "";
  pointer-events: none;
  transform: translateX(-50%);
}

.contact-cta-card {
  position: relative;
  display: flex;
  width: 1600px;
  height: 594px;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  overflow: hidden;
  border-radius: 32px;
  padding: 125px 160px;
  background: #0a0a0a;
}

.contact-cta-background {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.contact-cta-card::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.32) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.48) 100%);
  content: "";
  pointer-events: none;
}

.contact-copy,
.contact-actions {
  position: relative;
  z-index: 2;
}

.contact-copy {
  display: flex;
  width: 800px;
  flex-direction: column;
  gap: 32px;
}

.contact-copy h2 {
  width: 800px;
  margin: 0;
  color: #ffffff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.contact-copy p {
  width: 800px;
  margin: 0;
  color: #ffffff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.contact-actions {
  display: flex;
  align-items: center;
  align-self: flex-start;
  gap: 16px;
  margin-top: 282px;
}

.contact-button {
  display: inline-flex;
  height: 62px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 8px;
  padding: 0 32px;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  letter-spacing: -0.015em;
  text-decoration: none;
  white-space: nowrap;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.contact-button img {
  display: block;
  width: 24px;
  height: 24px;
  transform: translateY(1px);
}

.contact-button-primary {
  min-width: 309px;
  border: 1px solid var(--stroke-color);
  background: #ffffff;
  color: #0a0a0a;
}

.contact-button-secondary {
  min-width: 234px;
  border: 1px solid var(--stroke-color);
  background: transparent;
  color: #ffffff;
}

.contact-service-row {
  display: grid;
  width: 1600px;
  height: 120px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.contact-service-card {
  display: flex;
  min-width: 0;
  height: 120px;
  align-items: center;
  gap: 24px;
  overflow: hidden;
  border-radius: 8px;
  padding: 32px;
  background: #ffffff;
  box-shadow:
    0 0 0 0.5px rgba(10, 10, 10, 0.04),
    0 24px 70px rgba(10, 10, 10, 0.08);
}

.contact-service-card img {
  display: block;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  border-radius: 8px;
  object-fit: cover;
}

.contact-service-card p {
  width: 258px;
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 28px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.contact-footer {
  position: relative;
  z-index: 3;
  display: flex;
  width: 1600px;
  flex-direction: column;
  gap: 80px;
  margin-top: 0;
  padding: 320px 0 0;
  background: #0a0a0a;
  transform: translateZ(0);
}

.contact-footer::before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 50%;
  width: 100vw;
  height: 100%;
  background: #0a0a0a;
  content: "";
  transform: translateX(-50%);
}

.contact-footer-grid {
  display: grid;
  width: 100%;
  grid-template-columns: 380px 132px 178px 214px;
  column-gap: 232px;
  justify-content: start;
  align-items: start;
}

.contact-company {
  display: flex;
  width: 380px;
  flex-direction: column;
  align-items: flex-start;
}

.contact-footer-logo {
  display: block;
  width: 109px;
  height: auto;
  margin-bottom: 16px;
}

.contact-company h3 {
  margin: 0 0 6px;
  color: #ffffff;
  background: linear-gradient(90deg, #ffffff 0%, #676767 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 42px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.contact-company p {
  margin: 0;
  color: #ffffff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.contact-footer-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.contact-footer-column h3 {
  margin: 0;
  color: #ffffff;
  background: linear-gradient(90deg, #ffffff 0%, #676767 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 42px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.contact-footer-column a {
  color: #ffffff;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  text-decoration: none;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.contact-footer-brand {
  display: flex;
  width: 100vw;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  margin-left: calc(50% - 50vw);
}

.contact-footer-wordmark-wrap {
  position: relative;
  display: block;
  width: 1135px;
  height: auto;
  margin: 0 auto;
  --footer-wordmark-x: 50%;
  --footer-wordmark-y: 50%;
  --footer-wordmark-size: clamp(120px, 10vw, 210px);
  --footer-wordmark-reveal: 0;
}

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

.contact-footer-wordmark-hover {
  position: absolute;
  inset: 0;
  opacity: var(--footer-wordmark-reveal);
  pointer-events: none;
  transition: opacity 120ms ease;
  -webkit-mask-image:
    radial-gradient(
      circle var(--footer-wordmark-size) at var(--footer-wordmark-x) var(--footer-wordmark-y),
      rgba(0, 0, 0, 1) 0%,
      rgba(0, 0, 0, 0.88) 38%,
      rgba(0, 0, 0, 0.28) 70%,
      rgba(0, 0, 0, 0) 100%
    );
  mask-image:
    radial-gradient(
      circle var(--footer-wordmark-size) at var(--footer-wordmark-x) var(--footer-wordmark-y),
      rgba(0, 0, 0, 1) 0%,
      rgba(0, 0, 0, 0.88) 38%,
      rgba(0, 0, 0, 0.28) 70%,
      rgba(0, 0, 0, 0) 100%
    );
}

.contact-footer-wordmark-wrap:hover,
.contact-footer-wordmark-wrap:focus-visible {
  --footer-wordmark-reveal: 1;
}

.contact-footer-strip {
  position: relative;
  display: flex;
  width: 100vw;
  height: 72px;
  align-items: center;
  background: transparent;
}

.contact-footer-strip::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--stroke-color);
  content: "";
  pointer-events: none;
}

.contact-footer-strip-inner {
  display: flex;
  width: 1600px;
  height: 100%;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
}

.contact-footer-strip p {
  margin: 0;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

@media (min-width: 761px) and (max-width: 1919px) {
  :root {
    --gutter: clamp(48px, 6.667vw, 160px);
  }

  .reality-section,
  .system-section,
  .human-ai-section,
  .section-work,
  .process-section,
  .industries-section {
    padding: clamp(220px, 16.667vw, 320px) var(--gutter);
  }

  .reality-section {
    min-height: auto;
  }

  .reality-wrap,
  .work-wrap,
  .process-wrap,
  .industries-wrap,
  .why-wrap {
    width: 100%;
    max-width: 1600px;
    gap: clamp(220px, 16.667vw, 320px);
  }

  .reality-intro,
  .reality-body,
  .reality-grid,
  .reality-strip,
  .human-ai-tagline,
  .human-ai-tagline p,
  .human-ai-copy-grid,
  .work-intro,
  .work-tagline,
  .work-tagline p,
  .work-project-row,
  .process-intro,
  .process-tagline,
  .process-tagline p,
  .process-scroll,
  .process-sticky,
  .industries-intro,
  .industries-tagline,
  .industries-tagline p,
  .industries-grid,
  .why-intro,
  .why-tagline,
  .why-tagline p,
  .why-outcomes,
  .why-card-row,
  .why-cta,
  .why-cta-strip {
    width: 100%;
  }

  .reality-tagline::after,
  .human-ai-tagline::after,
  .work-tagline::after,
  .process-tagline::after,
  .industries-tagline::after,
  .why-tagline::after {
    width: 100%;
  }

  .reality-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: clamp(48px, 6.667vw, 160px);
  }

  .reality-note,
  .reality-note div,
  .reality-note h3,
  .reality-note p,
  .reality-visual {
    width: 100%;
  }

  .reality-visual {
    height: auto;
    aspect-ratio: 720 / 480;
  }

  .visual-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .visual-independent {
    top: 15.833%;
    left: 10.556%;
    width: 78.889%;
    height: auto;
  }

  .visual-together {
    top: 7.292%;
    left: 14.583%;
    width: 68.056%;
    height: auto;
  }

  .work-project-row {
    height: auto;
    align-items: stretch;
  }

  .work-hero-card,
  .work-summary-card,
  .work-detail-card {
    height: clamp(390px, 23.438vw, 450px);
  }

  .work-hero-card {
    flex: 1 1 50%;
    width: auto;
    min-width: 0;
  }

  .work-summary-card {
    flex: 1 1 24%;
    width: auto;
    min-width: 0;
  }

  .work-detail-card {
    flex: 1 1 25.5%;
    width: auto;
    min-width: 0;
  }

  .work-summary-top,
  .work-summary-card h3,
  .work-summary-description,
  .work-quote-block,
  .work-detail-list,
  .work-detail-item,
  .work-detail-item div,
  .work-detail-item h4,
  .work-detail-item p {
    width: 100%;
  }

  .work-hero-copy {
    width: min(416px, calc(100% - 64px));
  }

  .work-hero-copy h3,
  .work-hero-copy p {
    width: 100%;
  }

  .process-sticky {
    gap: clamp(40px, 4.167vw, 80px);
  }

  .process-stage-list {
    width: clamp(500px, 37.188vw, 595px);
    flex-basis: clamp(500px, 37.188vw, 595px);
    gap: clamp(32px, 2.604vw, 50px);
  }

  .process-steps,
  .process-step,
  .process-step-divider {
    width: 100%;
  }

  .process-step-copy,
  .process-step-title,
  .process-step-description {
    width: calc(100% - 60px);
  }

  .process-visual {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  .industries-grid {
    height: auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, auto);
  }

  .industry-card,
  .industry-card-image {
    width: 100%;
    height: auto;
    aspect-ratio: 528 / 264;
  }

  .industry-card-copy {
    width: calc(100% - 64px);
  }

  .industry-card-copy h3,
  .industry-card-copy p {
    width: 100%;
  }

  .why-intro {
    min-height: clamp(285px, 19.792vw, 380px);
  }

  .why-card-row {
    height: clamp(303px, 21.042vw, 404px);
    gap: clamp(6px, 0.417vw, 8px);
  }

  .why-outcomes {
    gap: clamp(6px, 0.417vw, 8px);
  }

  .why-card {
    height: 100%;
    padding: clamp(24px, 1.667vw, 32px);
  }

  .why-card-image {
    width: clamp(72px, 5vw, 96px);
    height: clamp(72px, 5vw, 96px);
  }

  .why-cta {
    height: auto;
    aspect-ratio: 1600 / 112;
  }

  .why-cta-circle {
    width: clamp(225px, 15.625vw, 300px);
    height: clamp(225px, 15.625vw, 300px);
  }

  .why-cta p {
    width: clamp(380px, 26.388889vw, 507px);
    height: clamp(31.5px, 2.1875vw, 42px);
    font-size: clamp(24px, 1.666667vw, 32px);
    line-height: clamp(31.5px, 2.1875vw, 42px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .process-visual-image {
    transition: none;
  }

  .process-visual:hover .process-visual-image.is-active {
    transform: scale(1);
  }

  .industry-card-image {
    transition: none;
  }

  .industry-card:hover .industry-card-image {
    transform: none;
  }

  .why-cta-circle,
  .why-cta-line {
    animation: none;
  }
}

@media (max-width: 760px) {
  .why-section {
    padding: 72px 24px;
  }

  .why-wrap,
  .why-intro,
  .why-tagline,
  .why-tagline p,
  .why-heading,
  .why-heading h2,
  .why-heading p,
  .why-outcomes,
  .why-card-row,
  .why-cta,
  .why-cta-strip {
    width: 100%;
  }

  .why-wrap {
    gap: 72px;
  }

  .why-intro {
    min-height: 0;
    gap: 36px;
  }

  .why-tagline {
    height: auto;
    min-height: 52px;
    padding-bottom: 18px;
  }

  .why-tagline::after {
    width: 100%;
  }

  .why-tagline p {
    height: auto;
    font-size: 14px;
    line-height: 20px;
  }

  .why-heading {
    gap: 20px;
  }

  .why-heading h2 {
    font-size: 42px;
    line-height: 48px;
  }

  .why-heading p {
    font-size: 18px;
    line-height: 27px;
  }

  .why-heading p br {
    display: none;
  }

  .why-card-row {
    height: auto;
    grid-template-columns: 1fr;
  }

  .why-card {
    height: 280px;
    padding: 24px;
  }

  .why-card-image {
    width: 72px;
    height: 72px;
  }

  .why-card-copy h3 {
    font-size: 20px;
    line-height: 28px;
  }

  .why-card-copy p {
    font-size: 14px;
    line-height: 22px;
  }

  .why-cta {
    height: auto;
    aspect-ratio: 1600 / 112;
    min-height: 64px;
  }

  .why-cta-strip {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .why-cta p {
    width: min(100%, 300px);
    height: auto;
    font-size: 18px;
    line-height: 24px;
  }

  .contact-section {
    padding: 72px 24px 0;
  }

  .contact-wrap,
  .contact-panel,
  .contact-cta-card,
  .contact-copy,
  .contact-copy h2,
  .contact-copy p,
  .contact-service-row,
  .contact-footer {
    width: 100%;
  }

  .contact-panel {
    position: relative;
    bottom: auto;
    gap: 10px;
    --contact-panel-bottom-space: 96px;
    margin-bottom: 96px;
  }

  .contact-panel::before {
    display: none;
  }

  .contact-cta-card {
    height: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 36px;
    border-radius: 18px;
    padding: 32px;
  }

  .contact-copy {
    gap: 24px;
  }

  .contact-copy h2 {
    font-size: 40px;
    line-height: 46px;
  }

  .contact-copy p {
    font-size: 16px;
    line-height: 24px;
  }

  .contact-copy p br {
    display: none;
  }

  .contact-actions {
    flex-wrap: wrap;
    gap: 12px;
  }

  .contact-button {
    height: 46px;
    padding: 0 18px;
    font-size: 15px;
    line-height: 22px;
  }

  .contact-service-row {
    height: auto;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .contact-service-card {
    height: auto;
    min-height: 104px;
    padding: 24px;
  }

  .contact-service-card p {
    width: auto;
    font-size: 16px;
    line-height: 24px;
  }

  .contact-footer {
    position: relative;
    bottom: auto;
    min-height: 0;
    margin-top: 96px;
    padding: 96px 0;
  }

  .contact-footer-grid {
    grid-template-columns: 1fr;
    gap: 56px;
  }

  .contact-footer-column {
    gap: 20px;
  }

  .contact-footer-column h3 {
    font-size: 24px;
    line-height: 32px;
  }

  .contact-footer-column a {
    font-size: 18px;
    line-height: 28px;
  }

  .contact-footer-brand {
    gap: 48px;
  }

  .contact-footer-wordmark-wrap {
    width: min(100%, 360px);
    height: auto;
    margin: 0 auto;
  }

  .contact-footer-strip {
    height: 40px;
  }
}

@media (max-width: 1180px) {
  :root {
    --gutter: clamp(24px, 5vw, 72px);
  }

  .hero-media {
    inset: -5svh 0;
    min-height: calc(100% + 10svh);
  }

  .hero-background-image {
    object-position: 52% 50%;
  }

  .hero,
  .hero-inner {
    min-height: 900px;
  }

  .side-nav {
    top: 48px;
    right: var(--gutter);
    left: var(--gutter);
    grid-auto-flow: column;
    justify-content: space-between;
    gap: 14px;
  }

  .hero-inner {
    padding-left: 0;
    padding-top: 170px;
  }

  .hero-door {
    left: 58%;
    width: 420px;
    height: 620px;
  }

  .section-system {
    padding-top: 720px;
  }

  .system-arc {
    height: 740px;
  }

  .system-diagram {
    margin-top: 96px;
  }

  .human-ai-section {
    padding-top: 96px;
    padding-bottom: 96px;
  }

  .human-ai-tagline,
  .human-ai-tagline::after,
  .human-ai-tagline p,
  .human-ai-heading,
  .human-ai-heading h2,
  .human-ai-heading p {
    width: 100%;
  }

  .system-tile {
    grid-column: 1 / -1;
  }

  .system-core {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

@media (max-width: 1380px) {
  .silo-map {
    grid-template-columns: repeat(3, 92px);
    gap: 42px 52px;
  }

  .silo-map span {
    width: 92px;
    height: 92px;
    font-size: 11px;
  }

  .system-tile {
    display: grid;
  }

}

@media (max-width: 760px) {
  .section {
    padding: 72px 0;
  }

  .bottom-nav-shell {
    bottom: max(18px, env(safe-area-inset-bottom));
  }

  .bottom-nav-menu {
    width: 190px;
    max-width: none;
    height: 174px;
    overflow: hidden;
  }

  .bottom-nav-link {
    padding: 0;
  }

  .hero,
  .hero-inner {
    min-height: 760px;
  }

  .hero-media {
    inset: 0;
    min-height: 100%;
    transform: none !important;
  }

  .hero-parallax-layer {
    transform: none !important;
    perspective: none;
  }

  .hero-blur-layer,
  .hero-forward-movement-layer {
    display: none;
  }

  .hero-background-image {
    object-position: 50% 50%;
  }

  .hero::before {
    display: none;
  }

  .side-nav {
    position: absolute;
    grid-template-columns: 1fr;
    grid-auto-flow: row;
    justify-content: start;
    font-size: 14px;
  }

  .side-nav a:not(.brand) {
    display: none;
  }

  .hero-inner {
    justify-content: flex-end;
    padding-bottom: 72px;
  }

  .eyebrow {
    font-size: 11px;
  }

  h1 {
    font-size: clamp(48px, 14vw, 68px);
  }

  .hero p {
    font-size: 20px;
  }

  .section-kicker,
  .wide-callout {
    display: block;
  }

  .section-kicker span {
    display: block;
    margin-top: 8px;
  }

  .section-heading h2 {
    font-size: 38px;
  }

  .section-heading p {
    margin-top: 24px;
    font-size: 17px;
  }

  .systems-grid {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 64px;
  }

  .silo-map,
  .radar-card {
    min-height: 330px;
  }

  .silo-map {
    grid-template-columns: repeat(2, 96px);
    gap: 24px;
  }

  .silo-map span {
    width: 96px;
    height: 96px;
  }

  .wide-callout {
    padding: 24px;
  }

  .wide-callout strong {
    margin-bottom: 18px;
  }

  .section-system {
    padding-top: 420px;
  }

  .system-arc {
    height: 430px;
  }

  .system-diagram {
    grid-template-columns: 1fr;
  }

  .system-tile {
    display: grid;
  }

  .human-ai-section {
    padding: 72px 24px;
  }

  .human-ai-tagline {
    height: auto;
    padding-bottom: 24px;
  }

  .human-ai-tagline p {
    height: auto;
    font-size: 16px;
    line-height: 26px;
  }

  .human-ai-heading {
    gap: 24px;
  }

  .human-ai-heading h2 {
    font-size: 38px;
    line-height: 46px;
  }

  .human-ai-heading p {
    font-size: 17px;
    line-height: 27px;
  }

  .human-ai-gallery {
    height: auto;
    margin-top: 32px;
  }

  .human-ai-gallery-sticky {
    width: 100%;
    height: auto;
    margin-left: 0;
    overflow: visible;
  }

  .human-ai-stage-frame {
    width: 100%;
    height: auto;
    margin-left: 0;
    transform: none;
  }

  .human-ai-stage {
    width: 100%;
    height: auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    transform: none;
  }

  .human-ai-panel,
  .human-ai-center-card {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    transform: none !important;
    opacity: 1 !important;
  }

  .human-ai-copy-grid {
    width: 100%;
    grid-template-columns: 1fr;
    gap: 32px;
    margin-top: 48px;
  }

  .human-ai-copy-card {
    width: 100%;
  }

  .section-work {
    padding: 72px 24px;
  }

  .work-wrap,
  .work-intro,
  .work-tagline,
  .work-tagline p,
  .work-heading,
  .work-heading h2,
  .work-heading p,
  .work-project-row {
    width: 100%;
  }

  .work-wrap {
    gap: 72px;
  }

  .work-intro {
    height: auto;
    gap: 32px;
  }

  .work-tagline {
    height: auto;
    padding-bottom: 24px;
  }

  .work-tagline::after {
    width: 100%;
  }

  .work-tagline p {
    height: auto;
    font-size: 16px;
    line-height: 26px;
  }

  .work-heading h2 {
    font-size: 38px;
    line-height: 46px;
  }

  .work-heading p {
    font-size: 17px;
    line-height: 27px;
  }

  .work-project-row {
    height: auto;
    flex-direction: column;
  }

  .work-hero-card,
  .work-summary-card,
  .work-detail-card {
    width: 100%;
    flex-basis: auto;
  }

  .work-summary-card,
  .work-detail-card {
    height: auto;
  }

  .work-summary-top,
  .work-quote-block,
  .work-detail-list,
  .work-detail-item,
  .work-detail-item div,
  .work-detail-item h4,
  .work-detail-item p,
  .work-summary-card h3,
  .work-summary-description {
    width: 100%;
  }
}

@media (min-width: 761px) and (max-width: 1919px) {
  :root {
    --gutter: clamp(96px, 8.333333vw, 160px);
    --desktop-section-pad: clamp(160px, 16.666667vw, 320px);
    --desktop-section-gap: clamp(160px, 16.666667vw, 320px);
    --desktop-content-width: calc(100vw - (var(--gutter) * 2));
    --desktop-tagline-size: clamp(18px, 1.25vw, 24px);
    --desktop-tagline-line: clamp(25.5px, 1.770833vw, 34px);
    --desktop-title-size: clamp(45px, 3.125vw, 60px);
    --desktop-title-line: clamp(52.5px, 3.645833vw, 70px);
    --desktop-body-size: clamp(18px, 1.25vw, 24px);
    --desktop-body-line: clamp(25.5px, 1.770833vw, 34px);
    --desktop-small-size: clamp(12px, 0.833333vw, 16px);
    --desktop-small-line: clamp(19.5px, 1.354167vw, 26px);
    --desktop-card-radius: clamp(6px, 0.416667vw, 8px);
    --desktop-card-gap: clamp(6px, 0.416667vw, 8px);
  }

  .reality-section,
  .system-section,
  .human-ai-section,
  .section-work,
  .process-section,
  .industries-section,
  .why-section {
    padding: var(--desktop-section-pad) var(--gutter);
  }

  .human-ai-section {
    padding-top: 240px;
    padding-bottom: 240px;
  }

  .reality-wrap,
  .system-wrap,
  .human-ai-wrap,
  .work-wrap,
  .process-wrap,
  .industries-wrap,
  .why-wrap {
    width: 100%;
    max-width: none;
    gap: var(--desktop-section-gap);
  }

  .system-wrap {
    gap: clamp(180px, 12.5vw, 240px);
  }

  .human-ai-wrap {
    gap: 36px;
  }

  .reality-intro,
  .system-intro,
  .human-ai-tagline,
  .work-intro,
  .process-intro,
  .industries-intro,
  .why-intro {
    width: 100%;
    height: auto;
    gap: clamp(36px, 2.5vw, 48px);
  }

  .system-intro {
    transform: none;
  }

  .reality-tagline,
  .system-tagline,
  .human-ai-tagline,
  .work-tagline,
  .process-tagline,
  .industries-tagline,
  .why-tagline {
    width: 100%;
    height: clamp(44px, 3.020833vw, 58px);
    gap: clamp(18px, 1.25vw, 24px);
  }

  .reality-tagline::after,
  .system-tagline::after,
  .human-ai-tagline::after,
  .work-tagline::after,
  .process-tagline::after,
  .industries-tagline::after,
  .why-tagline::after {
    width: 100%;
  }

  .reality-tagline p,
  .system-tagline p,
  .human-ai-tagline p,
  .work-tagline p,
  .process-tagline p,
  .industries-tagline p,
  .why-tagline p {
    width: 100%;
    height: var(--desktop-tagline-line);
    font-size: var(--desktop-tagline-size);
    font-weight: 500;
    line-height: var(--desktop-tagline-line);
    letter-spacing: -0.015em;
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .system-tagline p {
    font-weight: 400;
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  .reality-heading,
  .system-heading,
  .human-ai-heading,
  .work-heading,
  .process-heading,
  .industries-heading,
  .why-heading {
    width: clamp(480px, 33.333333vw, 640px);
    height: auto;
    gap: clamp(24px, 1.666667vw, 32px);
  }

  .reality-heading h2,
  .system-heading h2,
  .human-ai-heading h2,
  .work-heading h2,
  .process-heading h2,
  .industries-heading h2,
  .why-heading h2 {
    width: 100%;
    height: auto;
    font-size: var(--desktop-title-size);
    line-height: var(--desktop-title-line);
  }

  .reality-heading p,
  .system-heading p,
  .human-ai-heading p,
  .work-heading p,
  .process-heading p,
  .industries-heading p,
  .why-heading p {
    width: 100%;
    height: auto;
    font-size: var(--desktop-body-size);
    line-height: var(--desktop-body-line);
  }

  .system-sequence {
    width: 100%;
  }

  .reality-body {
    width: 100%;
    height: auto;
    gap: clamp(24px, 1.666667vw, 32px);
  }

  .reality-grid {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto;
    gap: clamp(24px, 1.666667vw, 32px) clamp(120px, 8.333333vw, 160px);
  }

  .reality-note {
    width: 100%;
    height: clamp(100px, 6.875vw, 132px);
    gap: clamp(3.75px, 0.260417vw, 5px);
    padding: clamp(24px, 1.666667vw, 32px);
    border-radius: clamp(12px, 0.833333vw, 16px);
  }

  .note-dot {
    width: clamp(25.5px, 1.770833vw, 34px);
    height: clamp(25.5px, 1.770833vw, 34px);
    flex-basis: clamp(25.5px, 1.770833vw, 34px);
  }

  .note-dot::after {
    top: clamp(8.25px, 0.572917vw, 11px);
    left: clamp(8.25px, 0.572917vw, 11px);
    width: clamp(9px, 0.625vw, 12px);
    height: clamp(9px, 0.625vw, 12px);
  }

  .reality-note div {
    width: auto;
    min-width: 0;
    gap: clamp(6px, 0.416667vw, 8px);
  }

  .reality-note h3 {
    width: 100%;
    height: auto;
    font-size: clamp(18px, 1.25vw, 24px);
    line-height: clamp(25.5px, 1.770833vw, 34px);
  }

  .reality-note p {
    width: 100%;
    height: auto;
    font-size: var(--desktop-small-size);
    line-height: var(--desktop-small-line);
  }

  .reality-visual {
    width: 100%;
    height: auto;
    aspect-ratio: 540 / 360;
    border-radius: clamp(12px, 0.833333vw, 16px);
  }

  .reality-strip {
    width: 100%;
    height: clamp(90px, 6.25vw, 120px);
    gap: clamp(12px, 0.833333vw, 16px);
    padding: clamp(18px, 1.25vw, 24px);
    border-radius: clamp(12px, 0.833333vw, 16px);
  }

  .reality-strip::before {
    border-radius: clamp(12px, 0.833333vw, 16px);
  }

  .strip-left-icon {
    width: clamp(51px, 3.541667vw, 68px);
    height: clamp(51px, 3.541667vw, 68px);
    flex-basis: clamp(51px, 3.541667vw, 68px);
  }

  .strip-copy {
    width: clamp(171px, 11.875vw, 228px);
    height: auto;
    gap: clamp(6px, 0.416667vw, 8px);
  }

  .strip-copy small,
  .strip-right-copy {
    font-size: var(--desktop-small-size);
    line-height: var(--desktop-small-line);
  }

  .strip-copy strong {
    font-size: clamp(18px, 1.25vw, 24px);
    line-height: clamp(25.5px, 1.770833vw, 34px);
  }

  .strip-right-copy {
    width: clamp(133.5px, 9.270833vw, 178px);
    height: auto;
  }

  .work-project-row {
    width: 100%;
    height: clamp(337.5px, 23.4375vw, 450px);
    gap: clamp(7.5px, 0.520833vw, 10px);
  }

  .work-hero-card,
  .work-summary-card,
  .work-detail-card {
    height: 100%;
    border-radius: var(--desktop-card-radius);
  }

  .work-hero-card {
    flex: 1 1 auto;
    min-width: 0;
  }

  .work-summary-card {
    flex: 0 0 clamp(276px, 19.166667vw, 368px);
    width: clamp(276px, 19.166667vw, 368px);
    padding: clamp(24px, 1.666667vw, 32px) clamp(24px, 1.666667vw, 32px) clamp(30px, 2.083333vw, 40px);
  }

  .work-detail-card {
    flex: 0 0 clamp(324px, 22.5vw, 432px);
    width: clamp(324px, 22.5vw, 432px);
    padding: clamp(24px, 1.666667vw, 32px) clamp(24px, 1.666667vw, 32px) clamp(30px, 2.083333vw, 40px);
    gap: clamp(7.5px, 0.520833vw, 10px);
  }

  .work-detail-card-tall,
  .work-detail-card-tall .work-detail-list {
    gap: clamp(10.5px, 0.729167vw, 14px);
  }

  .work-summary-top,
  .work-quote-block,
  .work-detail-list,
  .work-detail-item {
    width: 100%;
  }

  .work-detail-list {
    gap: clamp(18px, 1.25vw, 24px);
  }

  .work-detail-card-prometric .work-detail-list {
    width: clamp(276px, 19.166667vw, 368px);
    gap: clamp(18px, 1.25vw, 24px);
  }

  .work-detail-item {
    gap: clamp(12px, 0.833333vw, 16px);
  }

  .work-detail-card-prometric .work-detail-item {
    width: clamp(276px, 19.166667vw, 368px);
  }

  .work-detail-item {
    padding-bottom: clamp(18px, 1.25vw, 24px);
  }

  .work-detail-card-tall .work-detail-item {
    padding-bottom: clamp(10.5px, 0.729167vw, 14px);
  }

  .work-eyebrow,
  .work-detail-item p,
  .work-summary-description {
    font-size: clamp(10.5px, 0.729167vw, 14px);
    line-height: clamp(18px, 1.25vw, 24px);
  }

  .work-eyebrow {
    font-weight: 500;
    letter-spacing: -0.025em;
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .work-summary-card h3,
  .work-detail-item h4 {
    font-size: clamp(15px, 1.041667vw, 20px);
    line-height: clamp(22.5px, 1.5625vw, 30px);
  }

  .work-summary-card h3,
  .work-summary-card p,
  .work-detail-item div,
  .work-detail-item h4,
  .work-detail-item p {
    width: 100%;
  }

  .work-detail-item span {
    width: clamp(30px, 2.083333vw, 40px);
    height: clamp(30px, 2.083333vw, 40px);
    flex-basis: clamp(30px, 2.083333vw, 40px);
  }

  .work-detail-item img {
    width: clamp(12px, 0.833333vw, 16px);
    height: clamp(12px, 0.833333vw, 16px);
  }

  .work-quote-block p,
  .work-hero-copy p {
    font-size: clamp(12px, 0.833333vw, 16px);
    line-height: clamp(19.5px, 1.354167vw, 26px);
  }

  .work-hero-copy {
    right: clamp(24px, 1.666667vw, 32px);
    bottom: clamp(24px, 1.666667vw, 32px);
    width: min(clamp(312px, 21.666667vw, 416px), calc(100% - 48px));
    gap: clamp(15px, 1.041667vw, 20px);
  }

  .work-hero-copy h3 {
    font-size: clamp(30px, 2.083333vw, 40px);
    line-height: clamp(37.5px, 2.604167vw, 50px);
  }

  .work-quote-block {
    gap: clamp(18px, 1.25vw, 24px);
  }

  .work-quote-block img {
    width: clamp(27px, 1.875vw, 36px);
    height: clamp(27px, 1.875vw, 36px);
    flex-basis: clamp(27px, 1.875vw, 36px);
  }

  .process-scroll {
    width: 100%;
  }

  .process-sticky {
    width: 100%;
    gap: clamp(60px, 4.166667vw, 80px);
  }

  .process-stage-list {
    width: clamp(446.25px, 30.989583vw, 595px);
    flex-basis: clamp(446.25px, 30.989583vw, 595px);
    height: clamp(390px, 27.083333vw, 520px);
    gap: clamp(37.5px, 2.604167vw, 50px);
  }

  .process-progress,
  .process-progress span {
    width: clamp(3.75px, 0.260417vw, 5px);
  }

  .process-progress {
    flex-basis: clamp(3.75px, 0.260417vw, 5px);
    height: clamp(390px, 27.083333vw, 520px);
  }

  .process-steps {
    width: clamp(405px, 28.125vw, 540px);
    gap: clamp(18px, 1.25vw, 24px);
  }

  .process-step,
  .process-step-divider {
    width: clamp(405px, 28.125vw, 540px);
  }

  .process-step {
    gap: clamp(9px, 0.625vw, 12px);
  }

  .process-step-number,
  .process-step-title {
    font-size: clamp(24px, 1.666667vw, 32px);
    font-weight: 500;
    line-height: clamp(31.5px, 2.1875vw, 42px);
    letter-spacing: -0.025em;
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .process-step-number {
    width: clamp(36px, 2.5vw, 48px);
    flex-basis: clamp(36px, 2.5vw, 48px);
  }

  .process-step-copy,
  .process-step-title,
  .process-step-description {
    width: clamp(360px, 25vw, 480px);
  }

  .process-step-description {
    font-size: var(--desktop-small-size);
    color: #676767;
    font-weight: 400;
    line-height: var(--desktop-small-line);
    letter-spacing: -0.015em;
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  .process-visual {
    width: clamp(693.75px, 48.177083vw, 925px);
    flex: 0 0 clamp(693.75px, 48.177083vw, 925px);
    height: clamp(390px, 27.083333vw, 520px);
    border-radius: var(--desktop-card-radius);
  }

  .industries-grid {
    width: 100%;
    height: auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: auto;
    gap: clamp(6px, 0.416667vw, 8px);
  }

  .industry-card,
  .industry-card-image {
    width: 100%;
    height: auto;
    aspect-ratio: 396 / 198;
    border-radius: var(--desktop-card-radius);
  }

  .industry-card-copy {
    left: clamp(24px, 1.666667vw, 32px);
    bottom: clamp(24px, 1.666667vw, 32px);
    width: calc(100% - clamp(48px, 3.333333vw, 64px));
    height: auto;
  }

  .industry-card-copy h3 {
    width: 100%;
    height: auto;
    font-size: clamp(18px, 1.25vw, 24px);
    font-weight: 500;
    line-height: clamp(25.5px, 1.770833vw, 34px);
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .industry-card-copy p {
    width: 100%;
    height: auto;
    font-size: var(--desktop-small-size);
    line-height: var(--desktop-small-line);
  }

  .why-outcomes,
  .why-card-row,
  .why-cta,
  .why-cta-strip {
    width: 100%;
  }

  .why-intro {
    min-height: clamp(285px, 19.791667vw, 380px);
  }

  .why-card-row {
    height: clamp(303px, 21.041667vw, 404px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--desktop-card-gap);
  }

  .why-outcomes {
    gap: var(--desktop-card-gap);
  }

  .why-card {
    height: 100%;
    border-radius: var(--desktop-card-radius);
    padding: clamp(24px, 1.666667vw, 32px);
  }

  .why-card-image {
    width: clamp(72px, 5vw, 96px);
    height: clamp(72px, 5vw, 96px);
    border-radius: var(--desktop-card-radius);
  }

  .why-card-copy {
    gap: clamp(6px, 0.416667vw, 8px);
    padding-top: clamp(18px, 1.25vw, 24px);
  }

  .why-card-copy h3 {
    font-size: var(--desktop-tagline-size);
    line-height: var(--desktop-tagline-line);
  }

  .why-card-copy p {
    max-width: 100%;
    font-size: var(--desktop-small-size);
    line-height: var(--desktop-small-line);
  }

  .why-cta {
    height: auto;
    aspect-ratio: 1600 / 112;
    border-radius: var(--desktop-card-radius);
  }

  .why-cta-circle {
    width: clamp(225px, 15.625vw, 300px);
    height: clamp(225px, 15.625vw, 300px);
  }

  .why-cta p {
    width: clamp(380px, 26.388889vw, 507px);
    height: clamp(31.5px, 2.1875vw, 42px);
    font-size: clamp(24px, 1.666667vw, 32px);
    line-height: clamp(31.5px, 2.1875vw, 42px);
  }

  .contact-section {
    padding: var(--desktop-section-pad) var(--gutter) 0;
  }

  .contact-wrap,
  .contact-panel,
  .contact-cta-card,
  .contact-service-row,
  .contact-footer {
    width: 100%;
  }

  .contact-panel {
    gap: clamp(7.5px, 0.520833vw, 10px);
    --contact-panel-bottom-space: var(--desktop-section-pad);
    margin-bottom: var(--contact-panel-bottom-space);
  }

  .contact-panel::before {
    top: calc(-1 * var(--desktop-section-pad));
    bottom: 0;
  }

  .contact-cta-card {
    height: clamp(274px, 15.833333vw, 304px);
    gap: clamp(171px, 12.5vw, 240px);
    border-radius: clamp(18px, 1.25vw, 24px);
    padding: clamp(60px, 4.166667vw, 80px);
  }

  .contact-copy {
    width: clamp(480px, 33.333333vw, 640px);
    gap: clamp(24px, 1.666667vw, 32px);
  }

  .contact-copy h2,
  .contact-copy p {
    width: 100%;
  }

  .contact-copy h2 {
    font-size: var(--desktop-title-size);
    line-height: var(--desktop-title-line);
  }

  .contact-copy p {
    font-size: var(--desktop-body-size);
    line-height: var(--desktop-body-line);
  }

  .contact-actions {
    gap: clamp(12px, 0.833333vw, 16px);
  }

  .contact-button {
    height: clamp(45px, 3.333333vw, 64px);
    gap: clamp(7.5px, 0.520833vw, 10px);
    border-radius: clamp(4.5px, 0.3125vw, 6px);
    padding: 0 clamp(18px, 1.25vw, 24px);
    font-size: clamp(15px, 1.041667vw, 20px);
    line-height: clamp(22.5px, 1.5625vw, 30px);
  }

  .contact-button-primary {
    min-width: clamp(113px, 7.864583vw, 151px);
  }

  .contact-button-secondary {
    min-width: clamp(142px, 9.895833vw, 190px);
  }

  .contact-button img {
    width: clamp(9px, 0.625vw, 12px);
    height: clamp(9px, 0.625vw, 12px);
  }

  .contact-service-row {
    height: clamp(90px, 6.25vw, 120px);
    gap: clamp(7.5px, 0.520833vw, 10px);
  }

  .contact-service-card {
    height: 100%;
    gap: clamp(18px, 1.25vw, 24px);
    border-radius: clamp(6px, 0.416667vw, 8px);
    padding: clamp(24px, 1.666667vw, 32px);
  }

  .contact-service-card img {
    width: clamp(42px, 2.916667vw, 56px);
    height: clamp(42px, 2.916667vw, 56px);
    flex-basis: clamp(42px, 2.916667vw, 56px);
    border-radius: clamp(6px, 0.416667vw, 8px);
  }

  .contact-service-card p {
    width: clamp(193px, 13.4375vw, 258px);
    font-size: clamp(13.5px, 0.9375vw, 18px);
    line-height: clamp(21px, 1.458333vw, 28px);
  }

  .contact-footer {
    min-height: auto;
    margin-top: 0;
    padding: var(--desktop-section-pad) 0 0;
  }

  .contact-footer-grid {
    grid-template-columns:
      clamp(285px, 19.791667vw, 380px)
      clamp(99px, 6.875vw, 132px)
      clamp(133.5px, 9.270833vw, 178px)
      clamp(160.5px, 11.145833vw, 214px);
    column-gap: clamp(174px, 12.083333vw, 232px);
  }

  .contact-company {
    width: clamp(285px, 19.791667vw, 380px);
  }

  .contact-footer-logo {
    width: clamp(82px, 5.677083vw, 109px);
    margin-bottom: clamp(12px, 0.833333vw, 16px);
  }

  .contact-company h3 {
    font-size: clamp(24px, 1.666667vw, 32px);
    line-height: clamp(31.5px, 2.1875vw, 42px);
  }

  .contact-company p {
    font-size: clamp(18px, 1.25vw, 24px);
    line-height: clamp(25.5px, 1.770833vw, 34px);
  }

  .contact-footer-column {
    gap: clamp(18px, 1.25vw, 24px);
  }

  .contact-footer-column h3 {
    font-size: clamp(24px, 1.666667vw, 32px);
    line-height: clamp(31.5px, 2.1875vw, 42px);
  }

  .contact-footer-column a {
    font-size: clamp(18px, 1.25vw, 24px);
    line-height: clamp(25.5px, 1.770833vw, 34px);
  }

  .contact-footer-brand {
    gap: clamp(60px, 4.166667vw, 80px);
  }

  .contact-footer-wordmark-wrap {
    width: clamp(851px, 59.114583vw, 1135px);
    margin: 0 auto;
  }

  .contact-footer-strip {
    height: clamp(54px, 3.75vw, 72px);
  }

  .contact-footer-strip-inner {
    width: 100%;
    padding: 0 var(--gutter);
  }

  .contact-footer-strip p {
    font-size: clamp(10.5px, 0.729167vw, 14px);
    line-height: clamp(18px, 1.25vw, 24px);
  }

  .human-ai-section .human-ai-copy-grid {
    width: 100%;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: clamp(96px, 16.667vw, 320px);
    row-gap: clamp(96px, 8.333vw, 160px);
  }

  .human-ai-section .human-ai-copy-card,
  .human-ai-section .human-ai-copy-card h3,
  .human-ai-section .human-ai-copy-card p {
    width: 100%;
  }
}

@media (min-width: 1200px) and (max-width: 1599px) {
  .hero,
  .hero-inner {
    height: 56.25vw;
    min-height: 0;
  }

  .side-nav {
    top: 13.645833vw;
    left: 8.333333vw;
    width: 144px;
    gap: 18px;
    font-size: 15px;
    line-height: 22.5px;
  }

  .brand,
  .brand img {
    width: 120px;
    height: 30.13px;
  }

  .side-nav a:not(.brand) {
    width: 144px;
    height: 22.5px;
    gap: 12px;
    font-size: 15px;
    font-weight: 500;
    line-height: 22.5px;
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .nav-icon {
    width: 18px;
    height: 18px;
  }

  .hero-inner {
    top: 13.645833vw;
    left: 31.25vw;
    width: 58.333333vw;
    align-items: flex-start;
    gap: 24px;
  }

  .eyebrow {
    width: auto;
    height: 42px;
    flex: 0 0 auto;
    align-self: flex-start;
    padding: 6px 18px;
    border-radius: 6px;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .hero h1 {
    width: 58.333333vw;
    font-size: 90px;
    line-height: 97.5px;
  }

  .hero p {
    width: 58.333333vw;
    height: auto;
    font-size: 27px;
    line-height: 34.5px;
  }

  .button {
    width: auto;
    height: 46.5px;
    min-height: 46.5px;
    flex: 0 0 auto;
    align-self: flex-start;
    gap: 7.5px;
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 15px;
    line-height: 22.5px;
  }

  .button img {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
  }

  .contact-section {
    padding: 240px 120px 0;
    background: #f2f2f2;
  }

  .contact-wrap,
  .contact-panel,
  .contact-cta-card,
  .contact-service-row {
    width: 1200px;
  }

  .contact-panel {
    gap: 7.5px;
    --contact-panel-bottom-space: 80px;
    margin-bottom: var(--contact-panel-bottom-space);
  }

  .contact-panel::before {
    top: -240px;
    background: #f2f2f2;
  }

  .contact-cta-card {
    height: 446px;
    gap: 7.5px;
    border-radius: 18px;
    padding: 120px 60px;
  }

  .contact-copy {
    width: 600px;
    gap: 24px;
  }

  .contact-copy h2,
  .contact-copy p {
    width: 600px;
  }

  .contact-copy h2 {
    font-size: 45px;
    line-height: 52.5px;
    letter-spacing: -0.025em;
  }

  .contact-copy p {
    font-size: 18px;
    line-height: 25.5px;
    letter-spacing: -0.015em;
  }

  .contact-actions {
    gap: 12px;
    margin-top: 159.5px;
  }

  .contact-button {
    height: 46.5px;
    gap: 7.5px;
    border-radius: 6px;
    padding: 0 24px;
    font-size: 15px;
    line-height: 22.5px;
    letter-spacing: -0.015em;
  }

  .contact-button-primary {
    min-width: 155px;
  }

  .contact-button-secondary {
    min-width: 176px;
  }

  .contact-button img {
    width: 18px;
    height: 18px;
  }

  .contact-service-row {
    height: 90px;
    gap: 7.5px;
  }

  .contact-service-card {
    height: 90px;
    gap: 18px;
    border-radius: 6px;
    padding: 24px;
  }

  .contact-service-card img {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 6px;
  }

  .contact-service-card p {
    width: 193.5px;
    font-size: 13.5px;
    line-height: 21px;
    letter-spacing: -0.015em;
    font-weight: 500;
    font-variation-settings: "wght" 500, "slnt" 0;
  }

  .contact-footer {
    width: 1200px;
    gap: 60px;
    margin-top: 0;
    padding: 240px 0 0;
    background: #0a0a0a;
  }

  .contact-footer::before {
    background: #0a0a0a;
  }

  .contact-footer-grid {
    grid-template-columns: 285px 99px 133.5px 160.5px;
    column-gap: 174px;
  }

  .contact-company {
    width: 285px;
  }

  .contact-footer-logo {
    width: 82px;
    margin-bottom: 12px;
  }

  .contact-company h3,
  .contact-footer-column h3 {
    font-size: 24px;
    line-height: 31.5px;
    letter-spacing: -0.025em;
    font-weight: 600;
    font-variation-settings: "wght" 600, "slnt" 0;
  }

  .contact-company p,
  .contact-footer-column a {
    font-size: 18px;
    line-height: 25.5px;
    letter-spacing: -0.015em;
    font-weight: 400;
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  .contact-footer-column {
    gap: 18px;
  }

  .contact-footer-brand {
    gap: 30px;
  }

  .contact-footer-wordmark-wrap {
    width: 851px;
  }

  .contact-footer-strip {
    height: 54px;
  }

  .contact-footer-strip-inner {
    width: 1200px;
    padding: 0;
  }

  .contact-footer-strip p {
    font-size: 15px;
    line-height: 22.5px;
    letter-spacing: -0.015em;
    font-weight: 400;
    color: #676767;
    font-variation-settings: "wght" 400, "slnt" 0;
  }
}
/* Homepage reveal: Arpeggio-style staggered vertical curtain. */
.page-curtain {
  position: fixed;
  z-index: 2147483646;
  inset: 0;
  display: flex;
  width: 100vw;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
  isolation: isolate;
}

.page-curtain-panel {
  min-width: 0;
  flex: 1 1 0;
  margin-right: -1px;
  background: #0a0a0a;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  transition: transform 360ms cubic-bezier(0.76, 0, 0.24, 1);
  will-change: transform;
}

.page-curtain-panel:nth-child(2) { transition-delay: 18ms; }
.page-curtain-panel:nth-child(3) { transition-delay: 36ms; }
.page-curtain-panel:nth-child(4) { transition-delay: 54ms; }
.page-curtain-panel:nth-child(5) { transition-delay: 72ms; }
.page-curtain-panel:nth-child(6) { transition-delay: 90ms; }
.page-curtain-panel:nth-child(7) { transition-delay: 108ms; }
.page-curtain-panel:nth-child(8) { transition-delay: 126ms; }
.page-curtain-panel:nth-child(9) { transition-delay: 144ms; }
.page-curtain-panel:nth-child(10) { transition-delay: 162ms; }

.page-curtain.is-revealing .page-curtain-panel {
  transform: translate3d(0, -101%, 0);
}

.page-curtain.is-complete {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .page-curtain {
    display: none;
  }
}

/* Temporary static hero mode. Remove `hero-static` to restore the preserved layered effect. */
.hero-static .hero-media {
  inset: 0;
  min-height: 100%;
  transform: none;
}

.hero-static .hero-parallax-layer {
  transform: none;
  perspective: none;
}

.hero-static .hero-base-layer {
  opacity: 1;
  transform: none;
}

.hero-static .hero-blur-layer,
.hero-static .hero-forward-movement-layer,
.hero-static .hero-focus-layer {
  display: none;
  animation: none;
}

/* Updated Figma hero: 1920 × 1080, static artwork, centered 1600px composition. */
.hero-updated {
  height: 100svh;
  min-height: 720px;
}

.hero-updated .hero-media {
  inset: 0;
  min-height: 100%;
  background: #0a0a0a;
}

.hero-updated .hero-background-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero-updated .hero-dark-overlay {
  z-index: 1;
  background: rgba(0, 0, 0, 0.24);
}

.hero-updated .hero-dark-overlay::after {
  display: none;
}

.hero-updated .side-nav {
  top: 50%;
  left: max(var(--gutter), calc((100vw - 1600px) / 2));
  width: 200px;
  gap: 24px;
  transform: translateY(-50%);
}

.hero-updated .side-nav a:not(.brand) {
  width: 200px;
  height: 24px;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.hero-updated .hero-inner {
  top: 50%;
  left: calc(50% - 320px);
  width: min(1120px, calc(100vw - var(--gutter) - (50% - 320px)));
  height: auto;
  min-height: 0;
  gap: 0;
  transform: translateY(-50%);
}

.hero-updated h1 {
  width: 100%;
  color: #fff;
  background: none;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 80px;
  font-weight: 500;
  line-height: 96px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 500, "slnt" 0;
  -webkit-background-clip: initial;
  background-clip: initial;
}

@media (min-width: 1200px) and (max-width: 1599px) {
  .hero-updated {
    height: 56.25vw;
  }

  .hero-updated .side-nav {
    top: 50%;
    left: 8.333333vw;
    width: 150px;
    gap: 18px;
  }

  .hero-updated .side-nav a:not(.brand) {
    width: 150px;
    height: 18px;
    font-size: 16px;
    line-height: 18px;
  }

  .hero-updated .hero-inner {
    top: 50%;
    left: 33.333333vw;
    width: 58.333333vw;
    height: auto;
    transform: translateY(-50%);
  }

  .hero-updated h1 {
    width: 100%;
    font-size: 60px;
    line-height: 72px;
  }
}

@media (max-width: 1180px) {
  .hero-updated .side-nav {
    top: 48px;
    right: var(--gutter);
    left: var(--gutter);
    width: auto;
    grid-auto-flow: column;
    transform: none;
  }

  .hero-updated .hero-inner {
    top: auto;
    right: var(--gutter);
    bottom: 96px;
    left: var(--gutter);
    width: auto;
    min-height: 0;
    padding: 0;
    transform: none;
  }

  .hero-updated h1 {
    font-size: clamp(52px, 7vw, 80px);
    line-height: 1.2;
  }
}

@media (max-width: 760px) {
  .hero-updated .side-nav a:not(.brand) {
    display: none;
  }

  .hero-updated .hero-inner {
    justify-content: flex-start;
    padding: 0;
  }

  .hero-updated h1 {
    font-size: clamp(42px, 12vw, 60px);
    line-height: 1.12;
  }
}

/* Figma Section 2: connected-system overview. */
.connected-overview-section {
  width: 100%;
  height: 1160px;
  padding: 160px;
  overflow: hidden;
  background: #fff;
}

.connected-overview-wrap {
  display: flex;
  width: 1600px;
  height: 840px;
  flex-direction: column;
  gap: 160px;
  margin: 0 auto;
}

.connected-overview-copy {
  display: flex;
  width: 960px;
  height: 206px;
  flex-direction: column;
  gap: 32px;
}

.connected-overview-copy h2 {
  width: 960px;
  color: #2e2e2e;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 500;
  line-height: 1.133333;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 500, "slnt" 0;
}

.connected-overview-copy p {
  width: 960px;
  color: #4e4e4e;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.333333;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.connected-overview-diagram {
  position: relative;
  width: 1600px;
  height: 474px;
  flex: 0 0 474px;
}

.connected-overview-artwork {
  display: block;
  width: 1600px;
  height: 474px;
}

.overview-pill,
.overview-core {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 160px;
  text-align: center;
}

.overview-pill {
  width: 350px;
  min-height: 112px;
  flex-direction: column;
  gap: 8px;
  padding: 24px 32px;
  background: #f9f9f3;
}

.overview-pill h3 {
  width: 286px;
  color: #2e2e2e;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.overview-pill p {
  width: 286px;
  color: #4e4e4e;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
  white-space: nowrap;
}

.overview-pill-ux { top: 0; left: 115px; }
.overview-pill-design { top: 0; left: 625px; }
.overview-pill-research { top: 0; right: 115px; }
.overview-pill-strategy { top: 346px; left: 115px; }
.overview-pill-technology { top: 346px; left: 625px; }
.overview-pill-engineering { top: 346px; right: 115px; }

.overview-core {
  top: 169px;
  left: 640px;
  width: 320px;
  height: 120px;
  color: #fff;
  background: linear-gradient(165deg, #003426 0%, #048665 100%);
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.overview-connector {
  position: absolute;
  z-index: 1;
  display: block;
}

.overview-connector-top-left {
  top: 56px;
  left: 465px;
  width: 176px;
  height: 160px;
}

.overview-connector-top-right {
  top: 56px;
  left: 960px;
  width: 174px;
  height: 160px;
  transform: rotate(180deg) scaleY(-1);
}

.overview-connector-bottom-left {
  top: 242px;
  left: 465px;
  width: 176px;
  height: 160px;
  transform: scaleY(-1);
}

.overview-connector-bottom-right {
  top: 242px;
  left: 959px;
  width: 176px;
  height: 160px;
  transform: rotate(180deg);
}

.overview-connector-center-top,
.overview-connector-center-bottom {
  left: 770px;
  width: 60px;
  height: 5px;
}

.overview-connector-center-top {
  top: 139px;
  transform: rotate(90deg);
}

.overview-connector-center-bottom {
  top: 316px;
  transform: rotate(-90deg);
}

@media (min-width: 1200px) and (max-width: 1599px) {
  .connected-overview-section {
    height: 870px;
    padding: 120px;
  }

  .connected-overview-wrap {
    width: 1200px;
    height: 630px;
    gap: 120px;
  }

  .connected-overview-copy {
    width: 720px;
    height: 154.5px;
    gap: 24px;
  }

  .connected-overview-copy h2 {
    width: 720px;
    font-size: 45px;
    line-height: 51px;
  }

  .connected-overview-copy p {
    width: 720px;
    font-size: 18px;
    line-height: 24px;
  }

  .connected-overview-diagram {
    width: 1600px;
    height: 474px;
    flex-basis: 474px;
    transform: scale(0.75);
    transform-origin: top left;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .connected-overview-section {
    height: 706px;
    padding: 80px;
  }

  .connected-overview-wrap {
    width: 1040px;
    height: 546px;
    gap: 104px;
  }

  .connected-overview-copy {
    width: 624px;
    height: 134px;
    gap: 20px;
  }

  .connected-overview-copy h2 {
    width: 624px;
    font-size: 39px;
    line-height: 44.2px;
  }

  .connected-overview-copy p {
    width: 624px;
    font-size: 15.6px;
    line-height: 20.8px;
  }

  .connected-overview-diagram {
    transform: scale(0.65);
  }
}

@media (max-width: 1199px) {
  .connected-overview-section {
    height: auto;
    padding: 96px var(--gutter);
  }

  .connected-overview-wrap,
  .connected-overview-copy {
    width: 100%;
    height: auto;
  }

  .connected-overview-wrap {
    gap: 80px;
  }

  .connected-overview-copy h2,
  .connected-overview-copy p {
    width: min(100%, 960px);
  }

  .connected-overview-copy h2 {
    font-size: clamp(42px, 6vw, 60px);
    line-height: 1.16;
  }

  .connected-overview-diagram {
    display: grid;
    width: 100%;
    height: auto;
    flex-basis: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  .connected-overview-artwork {
    width: 100%;
    height: auto;
  }

  .overview-pill,
  .overview-core {
    position: static;
    width: 100%;
    min-height: 112px;
  }

  .overview-core {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .overview-pill h3,
  .overview-pill p {
    width: 100%;
  }

  .overview-connector {
    display: none;
  }
}

@media (max-width: 620px) {
  .connected-overview-section {
    padding-top: 72px;
    padding-bottom: 72px;
  }

  .connected-overview-wrap {
    gap: 56px;
  }

  .connected-overview-copy {
    gap: 20px;
  }

  .connected-overview-copy h2 {
    font-size: 38px;
  }

  .connected-overview-copy p {
    font-size: 20px;
    line-height: 30px;
  }

  .connected-overview-diagram {
    grid-template-columns: 1fr;
  }

  .overview-core {
    grid-column: 1;
    grid-row: auto;
  }
}

/* Figma Section 4: trusted leaders. */
.trusted-leaders-section {
  width: 100%;
  height: 1416px;
  padding: 160px;
  overflow: hidden;
  background: #fff;
}

.trusted-leaders-wrap {
  display: flex;
  width: 1600px;
  height: 1096px;
  flex-direction: column;
  gap: 160px;
  margin: 0 auto;
}

.trusted-leaders-copy {
  display: flex;
  width: 961px;
  height: 240px;
  flex-direction: column;
  gap: 32px;
}

.trusted-leaders-copy h2 {
  width: 961px;
  color: #2e2e2e;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 60px;
  font-weight: 600;
  line-height: 70px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 600, "slnt" 0;
}

.trusted-leaders-copy p {
  width: 961px;
  color: #676767;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 34px;
  letter-spacing: -0.015em;
  font-variation-settings: "wght" 400, "slnt" 0;
}

.trusted-leaders-cards {
  display: flex;
  width: 1600px;
  height: 696px;
  flex-direction: column;
  gap: 8px;
}

.trusted-leaders-card-row {
  display: grid;
  width: 1600px;
  height: 576px;
  grid-template-columns: repeat(3, 528px);
  gap: 8px;
}

.trusted-leaders-card,
.trusted-leaders-strip {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

.trusted-leaders-card {
  isolation: isolate;
  width: 528px;
  height: 576px;
}

.trusted-leaders-card img,
.trusted-leaders-strip img {
  display: block;
  width: 100%;
  height: 100%;
}

.trusted-leaders-card img {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.trusted-leaders-card-art {
  z-index: 1 !important;
  transition: transform 700ms cubic-bezier(0.2, 0.7, 0.2, 1);
  transform-origin: center;
}

.trusted-leaders-card:hover .trusted-leaders-card-art {
  transform: scale(1.045);
}

@media (prefers-reduced-motion: reduce) {
  .trusted-leaders-card-art {
    transition: none;
  }

  .trusted-leaders-card:hover .trusted-leaders-card-art {
    transform: none;
  }
}

.trusted-leaders-card h3,
.trusted-leaders-strip h3 {
  position: absolute;
  z-index: 1;
  margin: 0;
  color: #2e2e2e;
  font-family: "InterVariable", Arial, sans-serif;
  font-size: 32px;
  font-weight: 500;
  line-height: 40px;
  letter-spacing: -0.025em;
  font-variation-settings: "wght" 500, "slnt" 0;
  text-align: center;
  white-space: nowrap;
}

.trusted-leaders-card h3 {
  z-index: 2;
  top: 48px;
  left: 50%;
  transform: translateX(-50%);
}

.trusted-leaders-card:nth-child(2) h3 {
  top: 51px;
}

.trusted-leaders-strip {
  width: 1600px;
  height: 112px;
}

.trusted-leaders-strip h3 {
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
}

@media (min-width: 1400px) and (max-width: 1599px) {
  .trusted-leaders-section {
    height: 1062px;
    padding: 120px;
  }

  .trusted-leaders-wrap {
    width: 1200px;
    height: 822px;
    gap: 120px;
  }

  .trusted-leaders-copy {
    width: 720.75px;
    height: 180px;
    gap: 24px;
  }

  .trusted-leaders-copy h2 {
    width: 720.75px;
    font-size: 45px;
    line-height: 52.5px;
  }

  .trusted-leaders-copy p {
    width: 720.75px;
    font-size: 18px;
    line-height: 25.5px;
  }

  .trusted-leaders-cards {
    width: 1600px;
    height: 696px;
    transform: scale(0.75);
    transform-origin: top left;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .trusted-leaders-section {
    height: 920px;
    padding: 104px;
  }

  .trusted-leaders-wrap {
    width: 1040px;
    height: 712px;
    gap: 104px;
  }

  .trusted-leaders-copy {
    width: 625px;
    height: 156px;
    gap: 21px;
  }

  .trusted-leaders-copy h2 {
    width: 625px;
    font-size: 39px;
    line-height: 45.5px;
  }

  .trusted-leaders-copy p {
    width: 625px;
    font-size: 15.6px;
    line-height: 22.1px;
  }

  .trusted-leaders-cards {
    width: 1600px;
    height: 696px;
    transform: scale(0.65);
    transform-origin: top left;
  }
}

@media (max-width: 1199px) {
  .trusted-leaders-section {
    height: auto;
    padding: 96px var(--gutter);
  }

  .trusted-leaders-wrap,
  .trusted-leaders-copy,
  .trusted-leaders-cards,
  .trusted-leaders-card-row,
  .trusted-leaders-strip {
    width: 100%;
    height: auto;
  }

  .trusted-leaders-wrap {
    gap: 80px;
  }

  .trusted-leaders-copy h2,
  .trusted-leaders-copy p {
    width: min(100%, 961px);
  }

  .trusted-leaders-copy h2 {
    font-size: clamp(42px, 6vw, 60px);
    line-height: 1.16;
  }

  .trusted-leaders-card-row {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .trusted-leaders-card {
    width: 100%;
    height: auto;
    aspect-ratio: 528 / 576;
  }

  .trusted-leaders-card h3,
  .trusted-leaders-strip h3 {
    font-size: clamp(22px, 3vw, 32px);
    line-height: 1.2;
  }

  .trusted-leaders-card h3 {
    top: 8.33%;
  }

  .trusted-leaders-card:nth-child(2) h3 {
    top: 8.85%;
  }

  .trusted-leaders-strip {
    aspect-ratio: 1600 / 112;
  }

  .trusted-leaders-strip h3 {
    top: 28.57%;
  }
}

@media (max-width: 760px) {
  .trusted-leaders-section {
    padding-top: 72px;
    padding-bottom: 72px;
  }

  .trusted-leaders-wrap {
    gap: 56px;
  }

  .trusted-leaders-copy {
    gap: 20px;
  }

  .trusted-leaders-copy h2 {
    font-size: 38px;
  }

  .trusted-leaders-copy p {
    font-size: 20px;
    line-height: 30px;
  }

  .trusted-leaders-copy br {
    display: none;
  }

  .trusted-leaders-card-row {
    grid-template-columns: 1fr;
  }

  .trusted-leaders-card h3,
  .trusted-leaders-strip h3 {
    font-size: 28px;
  }

  .trusted-leaders-strip {
    min-height: 72px;
    aspect-ratio: auto;
  }

.trusted-leaders-strip h3 {
    top: 50%;
    transform: translate(-50%, -50%);
  }
}

/* Updated pre-footer CTA — Figma node 2608:144 */
.contact-panel {
  --contact-panel-bottom-space: 160px;
  margin-bottom: var(--contact-panel-bottom-space);
}

@media (min-width: 1400px) and (max-width: 1599px) {
  .contact-section {
    padding: 120px 120px 0;
    background: #ffffff;
  }

  .contact-wrap,
  .contact-panel,
  .contact-cta-card,
  .contact-footer {
    width: 1200px;
  }

  .contact-panel {
    --contact-panel-bottom-space: 120px;
    gap: 0;
  }

  .contact-panel::before {
    top: -120px;
    background: #ffffff;
  }

  .contact-cta-card {
    height: 445.5px;
    gap: 0;
    border-radius: 24px;
    padding: 93.75px 120px;
  }

  .contact-copy {
    width: 600px;
    gap: 24px;
  }

  .contact-copy h2,
  .contact-copy p {
    width: 600px;
  }

  .contact-copy h2 {
    font-size: 45px;
    line-height: 52.5px;
  }

  .contact-copy p {
    font-size: 18px;
    line-height: 25.5px;
  }

  .contact-actions {
    margin-top: 211.5px;
  }

  .contact-button-primary {
    min-width: 231.75px;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .contact-section {
    padding: 104px 104px 0;
    background: #ffffff;
  }

  .contact-wrap,
  .contact-panel,
  .contact-cta-card,
  .contact-footer {
    width: 1040px;
  }

  .contact-panel {
    --contact-panel-bottom-space: 104px;
    gap: 0;
  }

  .contact-panel::before {
    top: -104px;
    background: #ffffff;
  }

  .contact-cta-card {
    height: 386.1px;
    gap: 0;
    border-radius: 20.8px;
    padding: 81.25px 104px;
  }

  .contact-copy {
    width: 520px;
    gap: 20.8px;
  }

  .contact-copy h2,
  .contact-copy p {
    width: 520px;
  }

  .contact-copy h2 {
    font-size: 39px;
    line-height: 45.5px;
  }

  .contact-copy p {
    font-size: 15.6px;
    line-height: 22.1px;
  }

  .contact-actions {
    margin-top: 183.3px;
  }

  .contact-button-primary {
    min-width: 200.85px;
  }
}