/* Tokens */
:root {
  --paper: #000000;
  --surface: #000000;
  --ink: #ffffff;
  --muted: rgba(255, 255, 255, 0.72);
  --line: #ffffff;
  --transition-ms: 1480ms;
  --stage-columns: 32;
  --canvas-columns: 28;
  --canvas-narrow-columns: 24;
  --stage-width: 1440px;
  --grid-size: 45px;
  --stage-half: 720px;
  --grid-stroke: 1px;
  --stage-scale: 1;
  --shell-reveal-ms: 680ms;
  --content-reveal-ms: 5000ms;
  --content-reveal-title-delay: calc(var(--shell-reveal-ms) + 120ms);
  --content-reveal-body-delay: calc(var(--shell-reveal-ms) + 600ms);
  --bottom-loop-height: calc(var(--grid-size) * var(--stage-scale));
  --bottom-loop-gap: 90px;
  --bottom-loop-padding-x: calc(var(--grid-size) * var(--stage-scale) * 1.6667);
  --bottom-loop-item-gap: 90px;
  --bottom-loop-icon-width: calc(var(--grid-size) * var(--stage-scale) * 0.5778);
  --bottom-loop-icon-height: calc(var(--grid-size) * var(--stage-scale) * 0.4333);
  --bottom-loop-font-size: calc(var(--grid-size) * var(--stage-scale) * 0.5333);
}

/* Base */
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

html.is-detail-returning {
  scroll-behavior: auto;
}

html.is-detail-returning .detail-viewport,
html.is-detail-returning .custom-cursor,
html.is-detail-returning .bottom-loop,
html.is-detail-returning .page-turn-shell {
  opacity: 0;
  pointer-events: none;
}
.detail-return-handoff {
  position: fixed;
  inset: 0;
  z-index: 140;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  background: var(--paper);
}
/* Return Handoff */
html.is-detail-returning .detail-return-handoff {
  opacity: 1;
  visibility: visible;
}

.detail-return-handoff__stage {
  position: absolute;
  top: 0;
  left: 50%;
  width: calc(var(--stage-width) * 3);
  height: calc(var(--grid-size) * 20);
  background-color: var(--paper);
  background-image:
    linear-gradient(to right, var(--line) var(--grid-stroke), transparent var(--grid-stroke)),
    linear-gradient(to bottom, var(--line) var(--grid-stroke), transparent var(--grid-stroke));
  background-size:
    var(--grid-size) var(--grid-size),
    var(--grid-size) var(--grid-size);
  background-position:
    0 0,
    0 0;
  transform: translateX(-50%) scale(var(--stage-scale));
  transform-origin: top center;
}

.detail-return-handoff__root {
  position: relative;
  width: var(--stage-width);
  height: 100%;
  margin: 0 auto;
}

.detail-return-handoff__box {
  position: absolute;
  left: var(--detail-return-box-left, calc(var(--grid-size) * 25));
  top: var(--detail-return-box-top, calc(var(--grid-size) * 16));
  width: var(--detail-return-box-width, calc((var(--grid-size) * 3) + var(--grid-stroke)));
  height: var(--detail-return-box-height, calc(var(--grid-size) + var(--grid-stroke)));
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
}

body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  background-color: var(--paper);
}

body.is-page-turning {
  overflow: hidden;
}

body.is-page-turning > .detail-viewport {
  transform: none;
  opacity: 0;
  filter: none;
  visibility: hidden;
  transition: none;
  pointer-events: none;
}

@keyframes bottom-loop-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(-50% - 75px));
  }
}

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

.detail-viewport {
  position: relative;
  min-height: 100vh;
}

/* Page Turn */
.page-turn-shell {
  position: fixed;
  inset: 0;
  z-index: 120;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  overflow: hidden;
  perspective: 2200px;
  perspective-origin: center center;
  transform-style: preserve-3d;
  transition:
    opacity 80ms linear,
    visibility 0s linear 1000ms;
}

body.is-page-turning .page-turn-shell {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.page-turn-card {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  transform-origin: center center;
  transition: transform 1000ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

body.is-page-turning .page-turn-card {
  transform: perspective(2200px) rotateX(180deg);
}

.page-turn-face {
  position: relative;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  overflow: visible;
  backface-visibility: hidden;
}

.page-turn-front {
  background: #ffffff;
}

.page-turn-front > .page-turn-front-snapshot {
  width: 100%;
  height: 100%;
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}

.page-turn-front > .page-turn-front-snapshot .detail-stage-shell {
  overflow: hidden;
}

.page-turn-back {
  background-color: #ffffff;
  transform: rotateX(180deg);
}

html.is-safari-browser .page-turn-shell,
html.is-safari-browser .page-turn-card,
html.is-safari-browser .page-turn-face,
html.is-safari-browser .page-turn-front,
html.is-safari-browser .page-turn-back,
html.is-safari-browser .page-turn-front > .page-turn-front-snapshot {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

html.is-safari-browser .page-turn-front {
  transform: translateZ(1px);
}

html.is-safari-browser .page-turn-back {
  transform: rotateX(180deg) translateZ(1px);
}

html.is-safari-browser .page-turn-front > .page-turn-front-snapshot,
html.is-safari-browser .page-turn-visual-stage-shell,
html.is-safari-browser .page-turn-visual-stage-scale {
  contain: paint;
}

.page-turn-visual-stage-shell {
  position: relative;
  width: 100%;
  min-height: 100%;
}

.page-turn-visual-stage-scale {
  position: absolute;
  top: 0;
  left: 50%;
  width: calc(var(--stage-width) * 3);
  height: 100%;
  background-color: #ffffff;
  transform: translateX(-50%) scale(var(--stage-scale));
  transform-origin: top center;
  pointer-events: none;
}

.page-turn-visual-standalone {
  position: absolute;
  top: 0;
  left: 50%;
  width: var(--stage-width);
  min-height: 100%;
  margin: 0 auto;
  transform: translateX(-50%);
  pointer-events: none;
}

/* Stage */
.detail-stage-shell {
  position: relative;
  width: 100%;
  min-height: 100vh;
}

html.is-home-to-detail .detail-stage-shell {
  perspective: none;
}

.detail-stage-scale {
  position: absolute;
  top: 0;
  left: 50%;
  width: calc(var(--stage-width) * 3);
  background-color: var(--paper);
  background-image:
    linear-gradient(to right, var(--line) var(--grid-stroke), transparent var(--grid-stroke)),
    linear-gradient(to bottom, var(--line) var(--grid-stroke), transparent var(--grid-stroke));
  background-size:
    var(--grid-size) var(--grid-size),
    var(--grid-size) var(--grid-size);
  background-position:
    0 0,
    0 0;
  transform: translateX(-50%) scale(var(--stage-scale));
  transform-origin: top center;
}

.detail-standalone {
  position: relative;
  z-index: 1;
  width: var(--stage-width);
  min-height: 100vh;
  margin: 0 auto;
  background: transparent;
  transform-origin: center bottom;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition:
    transform var(--transition-ms) cubic-bezier(0.2, 0.78, 0.16, 1),
    opacity var(--transition-ms) cubic-bezier(0.2, 0.78, 0.16, 1),
    filter var(--transition-ms) cubic-bezier(0.2, 0.78, 0.16, 1);
}

.detail-standalone::after {
  content: "";
  position: absolute;
  inset: 0;
  border-bottom: var(--grid-stroke) solid var(--line);
  pointer-events: none;
}

.detail-main {
  display: grid;
  gap: 0;
  padding: var(--grid-size) 0 0;
}

.custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 64px;
  height: 64px;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-9999px, -9999px, 0);
  transition: opacity 120ms linear;
  z-index: 999;
  mix-blend-mode: normal;
}

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

html.is-safari-browser .custom-cursor {
  will-change: transform, opacity;
  contain: layout style paint;
}

.custom-cursor__media {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.bottom-loop {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 30;
  height: var(--bottom-loop-height);
  background: var(--surface);
  border-top: var(--grid-stroke) solid var(--line);
  overflow: hidden;
}

.bottom-loop__viewport {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.bottom-loop__track {
  display: flex;
  align-items: center;
  gap: var(--bottom-loop-gap);
  width: max-content;
  min-width: max-content;
  height: 100%;
  padding: 0 var(--bottom-loop-padding-x);
  animation: bottom-loop-scroll 30s linear infinite;
}

html.is-safari-browser .bottom-loop__track {
  will-change: transform;
  transform: translate3d(0, 0, 0);
}

.bottom-loop__item {
  display: flex;
  align-items: center;
  gap: var(--bottom-loop-item-gap);
  flex: 0 0 auto;
}

.bottom-loop__icon {
  width: var(--bottom-loop-icon-width);
  height: var(--bottom-loop-icon-height);
  object-fit: contain;
  flex: 0 0 auto;
}

.bottom-loop__text {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: var(--bottom-loop-font-size);
  font-weight: 400;
  line-height: normal;
  color: var(--ink);
  white-space: nowrap;
}

@media (hover: hover) and (pointer: fine) {
  body.has-custom-cursor,
  body.has-custom-cursor a,
  body.has-custom-cursor button {
    cursor: none;
  }
}

.panel {
  width: 100%;
  --panel-scroll-down-grids: 0;
  scroll-margin-top: var(--grid-size);
}

#panel-5 {
  scroll-margin-top: calc(var(--grid-size) * -1);
}

.panel > .canvas {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  backface-visibility: hidden;
  transform: translateZ(0);
  will-change: opacity;
}

.panel.is-panel-revealed > .canvas {
  transition:
    opacity 280ms ease,
    visibility 0s linear 0s;
}

html.is-safari-browser .panel > .canvas {
  will-change: auto;
}

/* Shared staged reveal timing. Shells appear first, then titles, then body/summary copy. */
[data-reveal-shell] {
  opacity: 0;
  visibility: hidden;
  transition: none;
}

.panel-content-fade {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity var(--content-reveal-ms) ease,
    visibility 0s linear var(--content-reveal-ms);
}

.panel:not(.panel-hero) [data-reveal-shell] [data-content-role]:not(.panel-content-fade) {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity var(--content-reveal-ms) ease,
    visibility 0s linear var(--content-reveal-ms);
}

.panel.is-panel-revealed [data-reveal-shell] {
  opacity: 1;
  visibility: visible;
  transition-delay: var(--reveal-base-delay, 0ms), var(--reveal-base-delay, 0ms);
}

.panel.is-panel-revealed .panel-content-fade {
  opacity: 1;
  visibility: visible;
  transition-delay: 120ms, 0s;
}

.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] .panel-content-fade[data-content-role="title"],
.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] [data-content-role="title"]:not(.panel-content-fade) {
  opacity: 1;
  visibility: visible;
  transition-delay:
    calc(var(--reveal-base-delay, 0ms) + var(--content-reveal-title-delay)),
    calc(var(--reveal-base-delay, 0ms) + var(--content-reveal-title-delay));
}

.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] .panel-content-fade[data-content-role="body"],
.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] .panel-content-fade[data-content-role="summary"],
.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] [data-content-role="body"]:not(.panel-content-fade),
.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] [data-content-role="summary"]:not(.panel-content-fade),
.panel:not(.panel-hero).is-panel-revealed [data-reveal-shell] .panel-content-fade:not([data-content-role]) {
  opacity: 1;
  visibility: visible;
  transition-delay:
    calc(var(--reveal-base-delay, 0ms) + var(--content-reveal-body-delay)),
    calc(var(--reveal-base-delay, 0ms) + var(--content-reveal-body-delay));
}

.panel-hero.is-panel-revealed .panel-content-fade {
  opacity: 0;
  visibility: hidden;
  transition-delay: 0s, var(--content-reveal-ms);
}

.panel-hero.is-panel-revealed.is-hero-content-visible .panel-content-fade {
  opacity: 1;
  visibility: visible;
  transition-delay: 120ms, 0s;
}

.panel-box {
  position: relative;
  justify-self: start;
  align-self: start;
  color: var(--ink);
  background: var(--surface);
}

.panel-box--border {
  border: var(--grid-stroke) solid var(--line);
}

.panel-box--outline {
  outline: var(--grid-stroke) solid var(--line);
  outline-offset: 0;
}

.panel-box--triple-split::before,
.panel-box--triple-split::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: var(--grid-stroke);
  background: var(--line);
  pointer-events: none;
}

.panel-box--triple-split::before {
  top: var(--panel-box-split-top-1);
}

.panel-box--triple-split::after {
  top: var(--panel-box-split-top-2);
}

.panel-box--header-split::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: var(--panel-box-split-top-1);
  height: var(--grid-stroke);
  background: var(--line);
  pointer-events: none;
}

.panel-box--top-triple-split::after {
  content: "";
  position: absolute;
  top: var(--panel-box-split-top-1);
  left: calc((var(--grid-size) * 9) - var(--grid-stroke));
  width: var(--grid-stroke);
  height: calc((var(--grid-size) * 5) + var(--grid-stroke));
  background: var(--line);
  box-shadow: calc(var(--grid-size) * 9) 0 0 var(--line);
  pointer-events: none;
}

.panel-box--bottom-double-split::after {
  content: "";
  position: absolute;
  top: var(--panel-box-split-top-1);
  left: calc((var(--grid-size) * 14) - var(--grid-stroke));
  width: var(--grid-stroke);
  height: calc((var(--grid-size) * 5) + var(--grid-stroke));
  background: var(--line);
  pointer-events: none;
}

/* Section spacing and reserved anchor offset hooks.
   The current top navigation uses native anchors, but these custom properties remain grouped
   here so any future JS-based landing adjustments stay separate from visual styling. */
.panel-paradigm {
  margin-top: 0;
  --panel-scroll-down-grids: 0;
}

.panel-problem {
  margin-top: calc(var(--grid-size) * 2);
}

.panel-opportunity {
  margin-top: calc(var(--grid-size) * 5);
}

.panel-customers {
  --panel-scroll-down-grids: 0;
}

.panel-benefit {
  margin-top: var(--grid-size);
}

.panel-vision {
  margin-top: calc(var(--grid-size) * 4);
}

.panel-cooperation {
  margin-top: calc(var(--grid-size) * 5);
}

.panel-roadmap {
  margin-top: calc(var(--grid-size) * 6);
  --panel-scroll-down-grids: -1;
}

.panel-footer {
  margin-top: calc(var(--grid-size) * 5);
}

/* Canvas sizes by section */
.canvas {
  width: calc(var(--grid-size) * var(--canvas-columns));
  margin: 0 auto;
  position: relative;
  display: grid;
  grid-template-columns: repeat(28, var(--grid-size));
  grid-auto-rows: var(--grid-size);
}

.panel-hero .canvas {
  min-height: calc(var(--grid-size) * 19);
}

.panel-placeholder .canvas {
  min-height: calc(var(--grid-size) * 20);
}

.panel-applications {
  margin-top: calc(var(--grid-size) * -1);
}

.panel-credentials {
  margin-top: calc(var(--grid-size) * 5);
}

.panel-footer-brand {
  margin-top: calc(var(--grid-size) * 3);
}

.panel-capability {
  margin-top: calc(var(--grid-size) * 2);
}

/* Standard 20-grid content panels. */
.panel-intro .canvas,
.panel-statement .canvas,
.panel-capability .canvas,
.panel-product .canvas,
.panel-technology .canvas,
.panel-paradigm .canvas {
  min-height: calc(var(--grid-size) * 20);
}

.panel-tech-overview .canvas {
  min-height: calc(var(--grid-size) * 17);
}

.panel-problem .canvas {
  min-height: calc(var(--grid-size) * 14);
}

.panel-opportunity .canvas {
  width: calc(var(--grid-size) * 26);
  grid-template-columns: repeat(26, var(--grid-size));
  min-height: calc(var(--grid-size) * 21);
}

.panel-scale .canvas {
  width: calc(var(--grid-size) * 26);
  grid-template-columns: repeat(26, var(--grid-size));
  min-height: calc(var(--grid-size) * 19);
}

.panel-customers .canvas {
  width: calc(var(--grid-size) * 24);
  grid-template-columns: repeat(24, var(--grid-size));
  min-height: calc(var(--grid-size) * 20);
  left: calc(var(--grid-size) * 2);
}

.panel-benefit .canvas {
  min-height: calc(var(--grid-size) * 19);
}

.panel-business .canvas {
  min-height: calc(var(--grid-size) * 16);
}

.panel-vision .canvas {
  width: calc(var(--grid-size) * 22);
  grid-template-columns: repeat(22, var(--grid-size));
  min-height: calc(var(--grid-size) * 20);
}

.panel-team .canvas {
  width: calc(var(--grid-size) * 24);
  grid-template-columns: repeat(24, var(--grid-size));
  min-height: calc(var(--grid-size) * 16);
  left: calc(var(--grid-size) * -2);
}

.panel-cooperation .canvas {
  min-height: calc(var(--grid-size) * 13);
}

.panel-roadmap .canvas {
  min-height: calc(var(--grid-size) * 16);
}

.panel-footer .canvas {
  min-height: calc(var(--grid-size) * 16);
}

.box,
.section-tag,
.step-card,
.benefit-card,
.business-item,
.vision-label,
.mission-label,
.roadmap-card {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.box {
  padding: calc(var(--grid-size) * 0.4) calc(var(--grid-size) * 0.4889);
}

.box--display {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: calc(var(--grid-size) * 1.6);
  line-height: 1.04;
  letter-spacing: -0.06em;
}

.box--copy {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: calc(var(--grid-size) * 0.5333);
  line-height: 1.45;
}

.box--meta {
  padding: calc(var(--grid-size) * 0.2667) calc(var(--grid-size) * 0.3556);
  font-family: "IBM Plex Mono", monospace;
  font-size: calc(var(--grid-size) * 0.3111);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.section-tag {
  height: var(--grid-size);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 calc(var(--grid-size) * 0.5333);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.2;
}

.section-tag--right {
  justify-self: end;
}

.section-tag--center {
  justify-self: center;
}

.canvas-problem .section-tag {
  grid-column: 27 / 29;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-opportunity .section-tag {
  grid-column: 18 / 22;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
  position: relative;
  left: var(--grid-size);
}

.canvas-scale .section-tag {
  grid-column: 1 / 3;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
}

.canvas-customers .section-tag {
  grid-column: 21 / 25;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-benefit .section-tag {
  grid-column: 1 / 3;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-business .section-tag {
  grid-column: 1 / 5;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-vision .section-tag {
  grid-column: 11 / 13;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-team .section-tag {
  grid-column: 1 / 3;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-cooperation .section-tag {
  grid-column: 27 / 29;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.canvas-roadmap .section-tag {
  grid-column: 1 / 5;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  justify-self: start;
}

.hero-brand,
.hero-menu__link,
.hero-language__link,
.hero-signin,
.hero-statement {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
}

.hero-brand {
  grid-column: 1 / 5;
  grid-row: 1 / 2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding:
    calc(var(--grid-size) * 0.0889)
    calc(var(--grid-size) * 0.3556)
    calc(var(--grid-size) * 0.1111)
    calc(var(--grid-size) * 0.3556);
  overflow: hidden;
  justify-self: start;
  align-self: start;
  z-index: 1;
}

.hero-brand__lockup {
  display: flex;
  align-items: center;
  width: 160px;
  height: 100%;
  transform: translateX(-7px);
}

.hero-brand__logo {
  display: block;
  width: 160px;
  height: auto;
  object-fit: contain;
}

.hero-menu {
  grid-column: 9 / 23;
  grid-row: 1 / 2;
  display: grid;
  grid-template-columns: repeat(5, calc((var(--grid-size) * 2) + var(--grid-stroke)));
  column-gap: calc(var(--grid-size) - var(--grid-stroke));
  justify-self: start;
  align-self: start;
  width: calc((var(--grid-size) * 14) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  z-index: 4;
}

.hero-language {
  grid-column: 24 / 26;
  grid-row: 1 / 2;
  display: grid;
  grid-template-columns: repeat(2, calc(var(--grid-size) + var(--grid-stroke)));
  column-gap: 0;
  justify-self: start;
  align-self: start;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  box-shadow: var(--grid-stroke) 0 0 0 var(--surface);
  z-index: 4;
}

.hero-language__link,
.hero-signin,
.hero-menu__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  line-height: 1;
  text-align: center;
  appearance: none;
  border-radius: 0;
  cursor: pointer;
  color: #ffffff;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}

.hero-language__link {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  background: var(--surface);
  color: var(--ink);
}

.hero-language__link + .hero-language__link {
  margin-left: calc(var(--grid-stroke) * -1);
}

.hero-menu__link {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  width: 100%;
  font-size: 16px;
  letter-spacing: 0;
  font-weight: 700;
  text-transform: none;
}

.hero-menu__label,
.hero-language__label,
.hero-signin__label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.hero-language__link:hover,
.hero-language__link:focus-visible,
.hero-menu__link:hover,
.hero-menu__link:focus-visible {
  background: var(--ink);
  color: var(--paper);
}

.hero-language__link--active,
.hero-language__link--active:hover,
.hero-language__link--active:focus-visible {
  background: var(--ink);
  color: var(--paper);
  cursor: default;
}

.hero-brand:hover,
.hero-brand:focus-visible {
  background: var(--surface);
}

.hero-signin {
  grid-column: 27 / 29;
  grid-row: 1 / 2;
  justify-self: start;
  align-self: start;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  letter-spacing: 0;
  font-weight: 700;
  text-transform: none;
  box-shadow: var(--grid-stroke) 0 0 0 var(--surface);
  z-index: 4;
}

.hero-signin:hover,
.hero-signin:focus-visible {
  background: var(--ink);
  color: var(--paper);
}

html[data-language="en"] .panel-hero .hero-menu {
  grid-column: 7 / 23;
  grid-template-columns:
    calc(var(--grid-size) * 2)
    calc(var(--grid-size) * 3)
    calc(var(--grid-size) * 3)
    calc(var(--grid-size) * 2)
    calc(var(--grid-size) * 2);
  width: calc(var(--grid-size) * 16);
}

html[data-language="en"] .panel-hero .hero-menu__link,
html[data-language="en"] .panel-hero .hero-signin {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
}

html[data-language="en"] .panel-hero .hero-language__link {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-weight: 600;
}

html[data-language="en"] .panel-hero .hero-menu__label,
html[data-language="en"] .panel-hero .hero-language__label,
html[data-language="en"] .panel-hero .hero-signin__label {
  white-space: nowrap;
}

.hero-statement {
  grid-column: 1 / 29;
  grid-row: 3 / 17;
  position: relative;
  justify-self: start;
  align-self: start;
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 14) + var(--grid-stroke));
  overflow: hidden;
  z-index: 1;
  cursor: pointer;
}

.hero-statement--text-only {
  cursor: default;
}

.hero-statement__content,
.hero-statement__media,
.hero-statement__body {
  transition:
    opacity 260ms ease,
    visibility 260ms ease;
}

.hero-statement__content {
  position: absolute;
  inset: 0;
}

.hero-statement__media {
  position: absolute;
  inset: 0;
  opacity: 1;
  visibility: visible;
}

.hero-statement__video,
.hero-statement__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-statement__image {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 260ms ease,
    visibility 260ms ease;
}

.hero-statement__body {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.hero-statement--text-only .hero-statement__body {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.hero-statement.is-content-visible {
  cursor: default;
}

.hero-statement.is-content-visible .hero-statement__media {
  opacity: 0;
  visibility: hidden;
}

.hero-statement.is-content-visible .hero-statement__body {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.hero-statement__body {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: 826px;
  min-height: 409px;
  align-content: start;
  justify-items: start;
  transform: translate(-50%, -50%);
  color: #ffffff;
}

.hero-statement__cn,
.hero-statement__en {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-weight: 400;
  line-height: 1.2;
  color: inherit;
}

.hero-statement__cn {
  width: auto;
  max-width: 686.533px;
  font-size: 80px;
  letter-spacing: normal;
  text-align: left;
  white-space: nowrap;
}

.hero-statement__en {
  width: 826px;
  margin-top: 110px;
  font-size: 84px;
  letter-spacing: normal;
  text-align: left;
}

.hero-statement__subcopy {
  width: 540px;
  margin: 56px 0 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  color: var(--muted);
  text-align: left;
}

.hero-statement__cn-comma {
  letter-spacing: -32px;
}

.hero-banner-control {
  position: absolute;
  left: calc(var(--grid-size) * -1);
  top: calc(var(--grid-size) * 8);
  z-index: 3;
  display: grid;
  place-items: center;
  width: calc(var(--grid-size) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  padding: 0;
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    filter 180ms ease;
}

.hero-banner-control--next {
  right: calc((var(--grid-size) * -1) - 1px);
  left: auto;
}

.hero-banner-control:hover,
.hero-banner-control:focus-visible {
  background: var(--ink);
  color: var(--surface);
  outline: none;
}

.hero-banner-control__arrow {
  position: relative;
  display: block;
  width: 19px;
  height: 16px;
  transform: translateY(1px);
}

.hero-banner-control--prev .hero-banner-control__arrow {
  transform: translateY(1px) scaleX(-1);
}

.hero-banner-control__chevron {
  position: absolute;
  top: 2px;
  width: 9px;
  height: 9px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  box-sizing: border-box;
}

.hero-banner-control__chevron:first-child {
  left: 0;
}

.hero-banner-control__chevron:last-child {
  left: 7px;
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__video {
  opacity: 0;
  visibility: hidden;
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__image {
  opacity: 1;
  visibility: visible;
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__cn {
  width: 1079px;
  max-width: 1079px;
  font-size: 56px;
  font-weight: 600;
  line-height: 1.2;
  text-align: justify;
  transform: translateY(calc(-10px + 40pt - 25px));
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__en {
  width: 1170px;
  margin-top: 190px;
  font-size: 28px;
  line-height: 1.35;
  text-align: justify;
  transform: translateY(-35px);
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__summary-line {
  display: block;
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__quoted-title {
  display: inline-block;
  transform: translateX(-25px);
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__quoted-title--first {
  transform: translateX(-30px);
}

.panel-hero[data-hero-banner-index="1"] .hero-statement__body {
  transform: translate(calc(-50% - 173px), calc(-50% - 55px));
}

html[data-language="en"] .panel-hero[data-hero-banner-index="1"] .hero-statement__cn {
  width: 1011px;
  max-width: 1011px;
  font-size: 54px;
  line-height: 1.2;
  text-align: left;
  transform: translateY(65px);
}

html[data-language="en"] .panel-hero[data-hero-banner-index="1"] .hero-statement__en {
  width: 1170px;
  margin-top: 146px;
  font-size: 24px;
  line-height: 1.2;
  text-align: left;
  transform: translateY(55px);
}

.intro-card {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 22px;
  justify-self: start;
  align-self: start;
}

.intro-card--genesis {
  grid-column: 1 / 12;
  grid-row: 3 / 9;
  width: calc((var(--grid-size) * 11) + var(--grid-stroke));
  height: calc((var(--grid-size) * 6) + var(--grid-stroke));
  border-right-width: 0;
  border-bottom-width: 0;
}

.intro-card--mission {
  grid-column: 1 / 12;
  grid-row: 9 / 13;
  width: calc((var(--grid-size) * 11) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  border-right-width: 0;
  border-bottom-width: 0;
}

.intro-card--vision {
  grid-column: 1 / 12;
  grid-row: 13 / 17;
  width: calc((var(--grid-size) * 11) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  border-right-width: 0;
}

.intro-showcase {
  grid-column: 12 / 29;
  grid-row: 3 / 17;
  width: calc((var(--grid-size) * 17) + var(--grid-stroke));
  height: calc((var(--grid-size) * 14) + var(--grid-stroke));
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  overflow: hidden;
  justify-self: start;
  align-self: start;
}

.intro-showcase__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.intro-card__media {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 260ms ease,
    visibility 260ms ease;
}

.intro-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.intro-card__media,
.intro-card__body {
  transition:
    opacity 260ms ease,
    visibility 260ms ease;
}

.intro-card__media {
  position: absolute;
  inset: var(--grid-stroke);
}

.intro-card__content {
  position: relative;
  z-index: 1;
}

.intro-card__heading {
  color: #ffffff;
  display: flex;
  align-items: flex-start;
  transform: translateY(-2px);
}

.intro-card__copy {
  display: block;
  transform: translateY(2px);
}

.intro-card__label-cn,
.intro-card__paragraph {
  margin: 0;
  color: #ffffff;
}

.intro-card__label-cn {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
  font-size: 32px;
}

.intro-card__paragraph {
  width: 450px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-style: normal;
  font-weight: 400;
  text-align: justify;
  letter-spacing: 0;
}

.intro-card__paragraph--cn {
  font-size: 16px;
  line-height: 1.35;
}

html[data-language="en"] .panel-intro .intro-card__label-cn {
  max-width: 348px;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

html[data-language="en"] .panel-intro .intro-card--genesis .intro-card__label-cn {
  max-width: 334px;
}

html[data-language="en"] .panel-intro .intro-card__paragraph {
  width: 430px;
  max-width: 100%;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.2;
  text-align: left;
  letter-spacing: -0.01em;
  text-wrap: pretty;
}

.panel-three-summary,
.panel-three-logo,
.panel-three-card__body,
.panel-three-card__title {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  justify-self: start;
  align-self: start;
}

.panel-three-summary--tag {
  grid-column: 1 / 3;
  grid-row: 2 / 5;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: grid;
  align-content: start;
  justify-items: center;
  padding: 28px 0 0;
  border-right-width: 0;
  border-bottom-width: 0;
}

.panel-three-summary__tag-line {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.35;
  transform: translateY(-3px);
}

.panel-three-summary--statement {
  grid-column: 3 / 29;
  grid-row: 2 / 5;
  width: calc((var(--grid-size) * 26) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: grid;
  place-items: center;
  padding: 0 30px;
}

.panel-three-summary__copy {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  letter-spacing: 0;
  transform: translateX(22px);
}

.panel-three-logo {
  grid-column: 1 / 12;
  grid-row: 5 / 8;
  width: calc((var(--grid-size) * 11) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 11px 20px 14px;
}

.panel-three-logo__image {
  display: block;
  width: auto;
  max-width: 100%;
  height: 95px;
  object-fit: contain;
}

.panel-three-card {
  display: contents;
}

.panel-three-card__body {
  position: relative;
  overflow: hidden;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  height: calc((var(--grid-size) * 7) + var(--grid-stroke));
  padding: 22px 24px 16px 22px;
}

.panel-three-card__body--interactive {
  cursor: pointer;
}

.panel-three-card__body-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms ease;
}

.panel-three-card__body-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.panel-three-card__body-copy {
  position: relative;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity var(--content-reveal-ms) ease,
    visibility 0s linear var(--content-reveal-ms);
}

.panel-three-card__title {
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
  border-top-width: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  letter-spacing: 0;
}

.panel-three-card__title-text {
  display: block;
}

.panel-three-card--native .panel-three-card__body {
  grid-column: 1 / 8;
  grid-row: 9 / 16;
  border-right-width: 0;
}

.panel-three-card--native .panel-three-card__title {
  grid-column: 1 / 8;
  grid-row: 16 / 18;
  border-right-width: 0;
}

.panel-three-card--relation .panel-three-card__body {
  grid-column: 8 / 15;
  grid-row: 9 / 16;
  border-right-width: 0;
}

.panel-three-card--relation .panel-three-card__title {
  grid-column: 8 / 15;
  grid-row: 16 / 18;
  border-right-width: 0;
}

.panel-three-card--geometry .panel-three-card__body {
  grid-column: 15 / 22;
  grid-row: 9 / 16;
  border-right-width: 0;
}

.panel-three-card--geometry .panel-three-card__title {
  grid-column: 15 / 22;
  grid-row: 16 / 18;
  border-right-width: 0;
}

.panel-three-card--execution .panel-three-card__body {
  grid-column: 22 / 29;
  grid-row: 9 / 16;
}

.panel-three-card--execution .panel-three-card__title {
  grid-column: 22 / 29;
  grid-row: 16 / 18;
}

.panel-three-card__copy {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  text-align: justify;
  letter-spacing: 0;
}

html[data-language="en"] .panel-statement .panel-three-summary--tag {
  grid-column: 1 / 5;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

html[data-language="en"] .panel-statement .panel-three-summary--statement {
  grid-column: 5 / 29;
  width: calc((var(--grid-size) * 24) + var(--grid-stroke));
}

html[data-language="en"] .panel-statement .panel-three-summary__tag-line {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 0.8;
  text-transform: uppercase;
}

html[data-language="en"] .panel-statement .panel-three-summary--tag .panel-three-summary__tag-line:nth-child(2) {
  display: none;
}

html[data-language="en"] .panel-statement .panel-three-summary__copy {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.2;
}

html[data-language="en"] .panel-statement .panel-three-card__title {
  justify-content: flex-start;
  padding: 0 18px;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  line-height: 1;
  text-align: left;
}

html[data-language="en"] .panel-statement .panel-three-card__title-text {
  text-wrap: balance;
}

html[data-language="en"] .panel-statement .panel-three-card__copy {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.2;
  text-align: left;
}

.panel-statement.is-panel-revealed .panel-three-card__body--interactive .panel-three-card__body-media {
  opacity: 0;
}

.panel-statement.is-panel-revealed .panel-three-card__body--interactive .panel-three-card__body-copy {
  opacity: 1;
}

.panel-statement.is-panel-revealed .panel-three-card__body--interactive.is-content-visible .panel-three-card__body-media {
  opacity: 1;
  transition-delay: 0ms;
}

.panel-statement.is-panel-revealed .panel-three-card__body--interactive.is-content-visible .panel-three-card__body-copy {
  opacity: 0;
  transition-delay: 90ms;
}

.panel-intro.is-panel-revealed .intro-card--genesis {
  --reveal-base-delay: 120ms;
}

.panel-intro.is-panel-revealed .intro-card--mission {
  --reveal-base-delay: 260ms;
}

.panel-intro.is-panel-revealed .intro-card--vision {
  --reveal-base-delay: 400ms;
}

.panel-intro.is-panel-revealed .intro-showcase {
  --reveal-base-delay: 540ms;
}

.panel-statement.is-panel-revealed .panel-three-summary--tag,
.panel-statement.is-panel-revealed .panel-three-summary--statement,
.panel-statement.is-panel-revealed .panel-three-logo,
.panel-statement.is-panel-revealed .panel-three-card__body,
.panel-statement.is-panel-revealed .panel-three-card__title {
  --reveal-base-delay: 0ms;
}

.panel-statement.is-panel-revealed .panel-three-card__body--interactive .panel-three-card__body-copy[data-content-role="body"] {
  opacity: 1;
  visibility: visible;
  transition-delay:
    calc(var(--reveal-base-delay, 0ms) + var(--content-reveal-body-delay)),
    calc(var(--reveal-base-delay, 0ms) + var(--content-reveal-body-delay));
}

.panel-statement.is-panel-revealed .panel-three-card__body--interactive.is-content-visible .panel-three-card__body-copy[data-content-role="body"] {
  display: none;
}

.orb-shell {
  position: relative;
  display: grid;
  place-items: center;
}

.orb-shell__media {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  background: var(--surface);
}

.orb-shell--visual,
.orb-shell--business {
  width: calc(var(--grid-size) * 5);
  height: calc(var(--grid-size) * 5);
}

.orb-shell--hero-panel {
  width: 100%;
  height: 100%;
  padding: calc(var(--grid-size) * 0.6667);
}

.orb-shell--hero-panel .orb-shell__media {
  width: calc(100% + 60px);
  height: calc(100% + 60px);
  margin: -30px;
  object-fit: cover;
}

.orb-shell--footer {
  width: calc(var(--grid-size) * 4);
  height: calc(var(--grid-size) * 4);
}

.orb-mark {
  position: absolute;
  width: calc(var(--grid-size) * 1.25);
  height: calc(var(--grid-size) * 0.66);
  background: rgba(0, 0, 0, 0.3);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.orb-mark--top {
  top: calc(var(--grid-size) * -0.8);
  left: 50%;
  transform: translateX(-50%);
}

.orb-mark--bottom {
  bottom: calc(var(--grid-size) * -0.8);
  left: 50%;
  transform: translateX(-50%) rotate(180deg);
}

.orb-mark--right {
  right: calc(var(--grid-size) * -0.66);
  top: 50%;
  transform: translateY(-50%) rotate(90deg);
}

.orb-mark--left {
  left: calc(var(--grid-size) * -0.66);
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
}

.capability-title,
.capability-strip {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  align-self: start;
  color: var(--ink);
  overflow: hidden;
}

.capability-title {
  grid-column: 13 / 17;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  letter-spacing: 1.6px;
  line-height: 1;
}

.capability-strip {
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
}


.capability-strip--wide {
  width: calc((var(--grid-size) * 14) + var(--grid-stroke));
}

.capability-strip--medium {
  width: calc((var(--grid-size) * 10) + var(--grid-stroke));
}

.capability-strip--narrow {
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
}

.capability-strip--one {
  grid-column: 8 / 22;
  grid-row: 3 / 5;
}

.capability-strip--two {
  grid-column: 10 / 20;
  grid-row: 6 / 8;
}

.capability-strip--three {
  grid-column: 8 / 22;
  grid-row: 9 / 11;
}

.capability-strip--four {
  grid-column: 10 / 20;
  grid-row: 12 / 14;
}

.capability-strip--five {
  grid-column: 12 / 18;
  grid-row: 15 / 17;
}

/* Panel 4: exact-placed technology overview boxes. */
.canvas-panel-four {
  position: relative;
  min-height: calc(var(--grid-size) * 18);
}

.panel-four-box {
  --panel-four-cover-right: 0px;
  --panel-four-cover-bottom: 0px;
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  justify-self: start;
  align-self: start;
  overflow: hidden;
  position: relative;
  z-index: 1;
  box-shadow:
    var(--panel-four-cover-right) 0 0 0 var(--surface),
    0 var(--panel-four-cover-bottom) 0 0 var(--surface);
}

.panel-four-box--flush-right {
  --panel-four-cover-right: var(--grid-stroke);
}

.panel-four-box--flush-bottom {
  --panel-four-cover-bottom: var(--grid-stroke);
}

.panel-four-box--lead {
  grid-column: 1 / 27;
  grid-row: 2 / 5;
  width: calc(var(--grid-size) * 26);
  height: calc(var(--grid-size) * 3);
  position: relative;
  padding: 25px 24px 23px 20px;
  border-right-width: 0;
  border-bottom-width: 0;
  overflow: visible;
}

.panel-four-box--lead::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: calc(var(--grid-stroke) * -1);
  width: calc(var(--grid-size) * 16);
  height: var(--grid-stroke);
  background: var(--line);
  z-index: 1;
  pointer-events: none;
}

.panel-four-box__lead-copy {
  width: 100%;
  max-width: 1126px;
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  transform: translate(18px, 1px);
}

.panel-four-box--tag {
  grid-column: 27 / 29;
  grid-row: 2 / 5;
  width: calc(var(--grid-size) * 2);
  height: calc(var(--grid-size) * 3);
  display: grid;
  align-content: start;
  justify-items: center;
  padding-top: 28px;
  border-right-width: 0;
  border-bottom-width: 0;
  overflow: visible;
}

.panel-four-box--tag::after {
  content: "";
  position: absolute;
  top: 0;
  right: calc(var(--grid-stroke) * -1);
  width: var(--grid-stroke);
  height: 100%;
  background: var(--line);
  pointer-events: none;
}

.panel-four-box__tag-line {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.35;
  transform: translateY(-2px);
}

.panel-four-box--labs {
  grid-column: 17 / 29;
  grid-row: 5 / 8;
  width: calc(var(--grid-size) * 12);
  height: calc(var(--grid-size) * 3);
  padding: 21px 24px 24px 52px;
  border-right-width: 0;
  border-bottom-width: 0;
  overflow: visible;
}

.panel-four-box--labs::before,
.panel-four-box--labs::after {
  content: "";
  position: absolute;
  background: var(--line);
  pointer-events: none;
}

.panel-four-box--labs::before {
  top: 0;
  right: calc(var(--grid-stroke) * -1);
  width: var(--grid-stroke);
  height: 100%;
}

.panel-four-box--labs::after {
  left: 0;
  bottom: calc(var(--grid-stroke) * -1);
  width: 100%;
  height: var(--grid-stroke);
}

.panel-four-box__labs-lockup {
  display: block;
  width: 449px;
  height: 95px;
  transform: translateX(-8px);
}

.panel-four-box__labs-logo {
  display: block;
  width: 449px;
  height: 95px;
  object-fit: contain;
}

.panel-four-box--arch-header,
.panel-four-box--knowledge-header {
  display: block;
}

.panel-four-box--arch-header {
  grid-column: 1 / 13;
  grid-row: 9 / 12;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc(var(--grid-size) * 3);
  padding: 29px 24px 0 27px;
  border-bottom-width: 0;
}

.panel-four-box--arch-row-one,
.panel-four-box--arch-row-two,
.panel-four-box--arch-row-three,
.panel-four-box--knowledge-row-one,
.panel-four-box--knowledge-row-two {
  display: block;
}

.panel-four-box--arch-row-one {
  grid-column: 1 / 13;
  grid-row: 12 / 14;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc(var(--grid-size) * 2);
  padding: 22px 24px 0 24px;
  border-bottom-width: 0;
}

.panel-four-box--arch-row-two {
  grid-column: 1 / 13;
  grid-row: 14 / 16;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc(var(--grid-size) * 2);
  padding: 22px 24px 0 24px;
  border-bottom-width: 0;
}

.panel-four-box--arch-row-three {
  grid-column: 1 / 13;
  grid-row: 16 / 18;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  padding: 16px 24px 0 24px;
}

.panel-four-box--knowledge-header {
  grid-column: 17 / 29;
  grid-row: 9 / 12;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc(var(--grid-size) * 3);
  padding: 29px 24px 0 22px;
  border-bottom-width: 0;
}

.panel-four-box--knowledge-row-one {
  grid-column: 17 / 29;
  grid-row: 12 / 14;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc(var(--grid-size) * 2);
  padding: 26px 0 0 22px;
  border-bottom-width: 0;
}

.panel-four-box--knowledge-row-two {
  grid-column: 17 / 29;
  grid-row: 14 / 16;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  padding: 25px 24px 0 25px;
}

.panel-four-box--arch-header,
.panel-four-box--arch-row-one,
.panel-four-box--arch-row-two,
.panel-four-box--arch-row-three,
.panel-four-box--knowledge-header,
.panel-four-box--knowledge-row-one,
.panel-four-box--knowledge-row-two,
.panel-four-box--readmore {
  --panel-four-cover-right: 0px;
}

.panel-four-box--arch-row-three,
.panel-four-box--knowledge-row-two,
.panel-four-box--readmore {
  --panel-four-cover-bottom: 0px;
}

.panel-four-box__section-title {
  margin: 0;
  width: 352px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
  transform: translateY(-8px);
}

.panel-four-box__section-title--knowledge {
  width: 188px;
}

.panel-four-box__body {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  text-align: left;
}

.panel-four-box__body > span {
  display: block;
}

.panel-four-box__body--arch-one,
.panel-four-box__body--arch-two {
  width: 393px;
}

.panel-four-box__body--arch-one {
  transform: translateY(1px);
}

.panel-four-box__body--arch-two {
  transform: translateY(2px);
}

.panel-four-box__body--arch-three {
  transform: translateY(7px);
}

.panel-four-box__body--arch-three,
.panel-four-box__body--knowledge-two {
  width: 491px;
}

.panel-four-box__body--knowledge-one {
  width: 518px;
  transform: translateY(-2px);
}

.panel-four-box__body--knowledge-two {
  transform: translateY(-2px);
}

.panel-four-box__lead {
  font-weight: 700;
}

.panel-four-box--readmore {
  grid-column: 26 / 29;
  grid-row: 17 / 18;
  width: calc((var(--grid-size) * 3) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  display: grid;
  grid-template-columns: repeat(3, var(--grid-size));
  align-items: center;
  justify-items: center;
  padding: 0;
  text-decoration: none;
  cursor: pointer;
  appearance: none;
  border-radius: 0;
  transition:
    opacity 180ms ease,
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}

.panel-four-box--readmore:hover,
.panel-four-box--readmore:focus-visible {
  background: var(--ink);
  color: var(--paper);
}

.panel-four-box--readmore:focus-visible {
  outline: none;
}

.panel-four-box__readmore-arrow {
  position: relative;
  grid-column: 1 / 2;
  justify-self: center;
  width: 19px;
  height: 16px;
  flex: 0 0 auto;
  transform: translateY(1px);
}

.panel-four-box__readmore-chevron {
  position: absolute;
  top: 2px;
  width: 9px;
  height: 9px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  box-sizing: border-box;
}

.panel-four-box__readmore-chevron:first-child {
  left: 0;
}

.panel-four-box__readmore-chevron:last-child {
  left: 7px;
}

.panel-four-box__readmore-label {
  display: block;
  grid-column: 2 / 4;
  justify-self: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  color: inherit;
}

html[data-language="en"] .panel-tech-overview .panel-four-box--lead {
  grid-column: 1 / 24;
  width: calc(var(--grid-size) * 23);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__lead-copy {
  width: 100%;
  max-width: 970px;
  margin: 0;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.2;
}

html[data-language="en"] .panel-tech-overview .panel-four-box--tag {
  grid-column: 24 / 29;
  width: calc(var(--grid-size) * 5);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__tag-line {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.35;
  text-transform: uppercase;
}

html[data-language="en"] .panel-tech-overview .panel-four-box--tag .panel-four-box__tag-line:nth-child(2) {
  display: none;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__section-title {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
  text-wrap: balance;
}

html[data-language="en"] .panel-tech-overview .panel-four-box--arch-header .panel-four-box__section-title {
  width: 364px;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__section-title--knowledge {
  width: 311px;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__body {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.2;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__lead {
  font-weight: 600;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__body--arch-one,
html[data-language="en"] .panel-tech-overview .panel-four-box__body--arch-two,
html[data-language="en"] .panel-tech-overview .panel-four-box__body--arch-three,
html[data-language="en"] .panel-tech-overview .panel-four-box__body--knowledge-two {
  width: 491px;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__body--knowledge-one {
  width: 507px;
}

html[data-language="en"] .panel-tech-overview .panel-four-box__readmore-label {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  text-transform: uppercase;
}

.panel-four-overlay {
  position: absolute;
  inset: 0;
  z-index: 24;
  pointer-events: none;
}

.panel-four-overlay__panel {
  position: absolute;
  left: calc(var(--grid-size) * 25);
  top: calc(var(--grid-size) * 16);
  width: calc((var(--grid-size) * 3) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  overflow: hidden;
  opacity: 0;
  transition:
    opacity 120ms linear,
    left 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    top 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    width 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    height 560ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.panel-four-overlay__content {
  display: grid;
  grid-template-rows: 1fr auto;
  width: 100%;
  height: 100%;
  padding: 90px 66px 45px;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 240ms ease,
    transform 240ms ease;
}

.panel-four-overlay__message {
  align-self: center;
  margin: 0;
  max-width: 640px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--ink);
}

.panel-four-overlay__back {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 225px;
  height: 45px;
  padding: 0 22px;
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  appearance: none;
  border-radius: 0;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}

.panel-four-overlay__back:hover,
.panel-four-overlay__back:focus-visible {
  background: var(--ink);
  color: var(--paper);
  outline: none;
}

.panel-tech-overview.is-overlay-visible .panel-four-overlay {
  pointer-events: auto;
}

.panel-tech-overview.is-overlay-visible .panel-four-overlay__panel {
  opacity: 1;
}

.panel-tech-overview.is-overlay-visible .panel-four-box--readmore {
  opacity: 0;
  pointer-events: none;
}

.panel-tech-overview.is-overlay-open .panel-four-overlay__panel {
  left: 0;
  top: calc(var(--grid-size) * 1);
  width: calc(var(--grid-size) * 28);
  height: calc(var(--grid-size) * 16);
}

.panel-tech-overview.is-overlay-open .panel-four-overlay__content {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 360ms;
}

.panel-tech-overview.is-overlay-navigating .panel-four-overlay__content {
  opacity: 0;
  transform: translateY(12px);
  transition: none;
}

.panel-tech-overview.is-overlay-navigating .panel-four-overlay__back {
  pointer-events: none;
}

.readmore-page {
  background: var(--paper);
}

.readmore-stage-shell {
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
}

.readmore-stage-scale {
  position: absolute;
  top: 0;
  left: 50%;
  width: calc(var(--stage-width) * 3);
  background-color: var(--paper);
  background-image:
    linear-gradient(to right, var(--line) var(--grid-stroke), transparent var(--grid-stroke)),
    linear-gradient(to bottom, var(--line) var(--grid-stroke), transparent var(--grid-stroke));
  background-size:
    var(--grid-size) var(--grid-size),
    var(--grid-size) var(--grid-size);
  background-position:
    0 0,
    0 0;
  transform: translateX(-50%) scale(var(--stage-scale));
  transform-origin: top center;
  overflow: hidden;
}

.readmore-stage-scale::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: var(--grid-stroke);
  background: var(--line);
  pointer-events: none;
}

.readmore-root {
  position: relative;
  z-index: 1;
  width: var(--stage-width);
  min-height: 100vh;
  margin: 0 auto;
  background: transparent;
}

.readmore-join-page .readmore-stage-shell {
  height: calc(var(--grid-size) * 42 * var(--stage-scale)) !important;
  min-height: 0;
}

.readmore-join-page .readmore-stage-scale,
.readmore-join-page .readmore-root {
  height: calc(var(--grid-size) * 42) !important;
  min-height: 0;
}

.readmore-join-page.is-partner-expanded .readmore-stage-shell {
  height: calc(var(--grid-size) * 65 * var(--stage-scale)) !important;
}

.readmore-join-page.is-partner-expanded .readmore-stage-scale,
.readmore-join-page.is-partner-expanded .readmore-root {
  height: calc(var(--grid-size) * 65) !important;
}

.readmore-main {
  display: grid;
  gap: 0;
  padding: var(--grid-size) 0 0;
}

.panel-readmore .canvas {
  position: relative;
  min-height: calc(var(--grid-size) * 20);
}

.readmore-surface {
  position: absolute;
  left: 0;
  top: calc(var(--grid-size) * 1);
  width: calc(var(--grid-size) * 28);
  height: calc(var(--grid-size) * 16);
  border-top: var(--grid-stroke) solid var(--line);
  border-left: var(--grid-stroke) solid var(--line);
  border-right: 0;
  border-bottom: 0;
  background: var(--surface);
  isolation: isolate;
  transition:
    left 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    top 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    width 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    height 560ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-surface::before,
.readmore-surface::after {
  content: "";
  position: absolute;
  background: var(--line);
  pointer-events: none;
}

.readmore-surface::before {
  top: 0;
  right: calc(var(--grid-stroke) * -1);
  width: var(--grid-stroke);
  height: 100%;
}

.readmore-surface::after {
  left: 0;
  bottom: calc(var(--grid-stroke) * -1);
  width: 100%;
  height: var(--grid-stroke);
}

.readmore-surface__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-content: center;
  row-gap: 96px;
  width: 100%;
  height: 100%;
  padding: 0 66px;
  text-align: center;
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 180ms ease,
    transform 180ms ease;
}

.readmore-surface__message {
  margin: 0;
  width: 100%;
  max-width: 640px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--ink);
  text-align: center;
  transform: translateX(10px);
}

.readmore-surface__back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  align-self: center;
  width: calc(var(--grid-size) * 4);
  min-width: 0;
  height: 45px;
  padding: 0;
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  appearance: none;
  border-radius: 0;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}

.readmore-surface__back:hover,
.readmore-surface__back:focus-visible {
  background: var(--ink);
  color: var(--paper);
  outline: none;
}

.readmore-page.is-returning .readmore-surface {
  left: var(--readmore-return-box-left, calc(var(--grid-size) * 25));
  top: var(--readmore-return-box-top, calc(var(--grid-size) * 16));
  width: var(--readmore-return-box-width, calc((var(--grid-size) * 3) + var(--grid-stroke)));
  height: var(--readmore-return-box-height, calc(var(--grid-size) + var(--grid-stroke)));
  transition-duration: 980ms, 980ms, 980ms, 980ms;
}

.readmore-page.is-returning .readmore-surface__content {
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .readmore-surface,
  .readmore-surface__content {
    transition: none;
  }
}

.readmore-join-page .readmore-main {
  display: grid;
  gap: 0;
  padding: var(--grid-size) 0 0;
}

.readmore-join-page .panel {
  position: relative;
}

.canvas-readmore-hero,
.canvas-readmore-section {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--canvas-columns), var(--grid-size));
  grid-auto-rows: var(--grid-size);
  width: calc(var(--grid-size) * var(--canvas-columns));
  margin: 0 auto;
}

.canvas-readmore-hero {
  min-height: calc(var(--grid-size) * 18);
}

.readmore-panel {
  margin-top: calc(var(--grid-size) * 4);
}

.readmore-panel .canvas-readmore-section {
  min-height: calc(var(--grid-size) * 13);
  transition: min-height 520ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-hero-card,
.readmore-role-row {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
}

.readmore-hero-card {
  grid-column: 1 / 29;
  grid-row: 4 / 18;
  display: grid;
  grid-template-columns: repeat(28, var(--grid-size));
  grid-template-rows: repeat(14, var(--grid-size));
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 14) + var(--grid-stroke));
  overflow: hidden;
}

.readmore-hero-headline {
  grid-column: 1 / 29;
  grid-row: 1 / 6;
  display: flex;
  align-items: center;
  padding: 0 var(--grid-size);
  border-bottom: var(--grid-stroke) solid var(--line);
}

.readmore-hero-title {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 64px;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: 0;
}

.readmore-hero-title__line {
  display: block;
}

.readmore-hero-title__line--quote-hang {
  display: grid;
  grid-template-columns: 0 max-content;
}

.readmore-hero-title__hanging-mark {
  display: inline-block;
  position: relative;
  left: -60px;
}

.readmore-hero-title__text {
  grid-column: 2;
}

.readmore-hero-title__tail {
  display: inline-block;
  position: relative;
  left: -10px;
}

.readmore-hero-body {
  grid-column: 1 / 29;
  grid-row: 6 / 12;
  display: grid;
  align-content: start;
  gap: calc(var(--grid-size) * 0.55);
  padding: calc(var(--grid-size) * 1.02) var(--grid-size) 0;
}

.readmore-hero-copy {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.35;
  color: var(--ink);
}

.readmore-hero-copy + .readmore-hero-copy {
  transform: translateY(3px);
}

.readmore-copy-break {
  display: block;
  height: calc(1.2em * 1.35);
}

.readmore-role-intro {
  grid-column: 2 / 28;
  grid-row: 12 / 15;
  margin: 0;
  padding-top: calc(var(--grid-size) * 0.7556);
  align-self: start;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.1667;
  letter-spacing: 0;
}

.readmore-role-row {
  display: grid;
  grid-template-columns: calc(var(--grid-size) * 10) calc(var(--grid-size) * 16) calc(var(--grid-size) * 2);
  align-items: center;
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  text-decoration: none;
  overflow: hidden;
  transition:
    height 520ms cubic-bezier(0.2, 0.78, 0.16, 1),
    opacity 240ms ease,
    transform 520ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-role-row--partner {
  grid-column: 1 / 29;
  grid-row: 1 / 3;
}

.readmore-role-row--algorithm {
  grid-column: 1 / 29;
  grid-row: 6 / 8;
}

.readmore-role-row--marketing {
  grid-column: 1 / 29;
  grid-row: 11 / 13;
}

.readmore-role-title,
.readmore-role-direction {
  display: flex;
  align-items: center;
  height: 100%;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: 0;
}

.readmore-role-title {
  padding-left: var(--grid-size);
  border-right: var(--grid-stroke) solid var(--line);
  font-weight: 600;
}

.readmore-role-direction {
  padding-left: calc(var(--grid-size) * 0.6444);
  border-right: var(--grid-stroke) solid var(--line);
  font-weight: 400;
}

.readmore-role-action {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: stretch;
  align-self: stretch;
  width: 100%;
  height: 100%;
  border-right: var(--grid-stroke) solid var(--line);
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
  color: var(--ink);
  background: var(--surface);
  appearance: none;
  border-radius: 0;
  padding: 0;
  cursor: pointer;
  transition:
    background-color 160ms ease,
    filter 160ms ease;
}

.readmore-role-action__icon {
  display: block;
  width: 18px;
  height: 18px;
}

.readmore-role-action:hover,
.readmore-role-action:focus-visible {
  background: var(--ink);
  outline: none;
}

.readmore-role-action:hover .readmore-role-action__icon,
.readmore-role-action:focus-visible .readmore-role-action__icon {
  filter: invert(1);
}

.readmore-partner-detail {
  position: absolute;
  left: 0;
  top: calc(var(--grid-size) * 2);
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(28, var(--grid-size));
  grid-template-rows: repeat(33, var(--grid-size));
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  min-height: calc((var(--grid-size) * 33) + var(--grid-stroke));
  background: var(--surface);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(calc(var(--grid-size) * -0.35));
  transition:
    opacity 280ms ease 160ms,
    visibility 0s linear 520ms,
    transform 520ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-partner-detail::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background:
    linear-gradient(var(--line), var(--line)) 0 0 / 100% var(--grid-stroke) no-repeat,
    linear-gradient(var(--line), var(--line)) 0 calc(var(--grid-size) * 8) / 100% var(--grid-stroke) no-repeat,
    linear-gradient(var(--line), var(--line)) 0 calc(var(--grid-size) * 19) / 100% var(--grid-stroke) no-repeat,
    linear-gradient(var(--line), var(--line)) 0 calc(var(--grid-size) * 28) / 100% var(--grid-stroke) no-repeat,
    linear-gradient(var(--line), var(--line)) 0 calc(var(--grid-size) * 33) / 100% var(--grid-stroke) no-repeat,
    linear-gradient(90deg, var(--line), var(--line)) 0 0 / var(--grid-stroke) 100% no-repeat,
    linear-gradient(90deg, var(--line), var(--line)) calc((var(--grid-size) * 28) - var(--grid-stroke)) 0 / var(--grid-stroke) 100% no-repeat,
    linear-gradient(90deg, var(--line), var(--line)) calc(var(--grid-size) * 14) calc(var(--grid-size) * 19) / var(--grid-stroke) calc(var(--grid-size) * 9) no-repeat,
    linear-gradient(90deg, var(--line), var(--line)) calc(var(--grid-size) * 27) calc(var(--grid-size) * 28) / var(--grid-stroke) calc(var(--grid-size) * 5) no-repeat;
}

.readmore-partner-section {
  position: relative;
  z-index: 0;
  display: grid;
  align-content: start;
  row-gap: calc(var(--grid-size) * 1.35);
  background: var(--surface);
  box-shadow: none;
}

.readmore-partner-section--overview {
  grid-column: 1 / 29;
  grid-row: 1 / 9;
  padding: var(--grid-size) var(--grid-size) 0 var(--grid-size);
}

.readmore-partner-section--participate {
  grid-column: 1 / 29;
  grid-row: 9 / 20;
  padding: var(--grid-size) var(--grid-size) 0;
}

.readmore-partner-section--requirements {
  grid-column: 1 / 15;
  grid-row: 20 / 29;
  padding: var(--grid-size) var(--grid-size) 0;
}

.readmore-partner-section--bonus {
  grid-column: 15 / 29;
  grid-row: 20 / 29;
  padding: var(--grid-size) calc(var(--grid-size) * 0.2) 0 var(--grid-size);
}

.readmore-partner-section--offer {
  grid-column: 1 / 28;
  grid-row: 29 / 34;
  grid-template-columns: calc(var(--grid-size) * 7) minmax(0, 1fr);
  column-gap: calc(var(--grid-size) * 0.9);
  align-items: start;
  padding: var(--grid-size) var(--grid-size) 0;
}

.readmore-partner-section--offer .readmore-partner-copy {
  grid-column: 2;
}

.readmore-partner-heading {
  opacity: 0;
  transform: translateY(calc(var(--grid-size) * 0.28));
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  transition:
    opacity 300ms ease,
    transform 360ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-partner-copy {
  display: grid;
  opacity: 0;
  transform: translateY(calc(var(--grid-size) * 0.28));
  row-gap: calc(var(--grid-size) * 0.2);
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: 0;
  transition:
    opacity 300ms ease,
    transform 360ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-partner-copy p {
  margin: 0;
}

.readmore-partner-section--overview .readmore-partner-copy {
  row-gap: 1.35em;
  transform: translateY(calc(20px + (var(--grid-size) * 0.28)));
}

.readmore-partner-section--participate .readmore-partner-copy {
  margin-left: -15pt;
  row-gap: 1.35em;
  transform: translateY(calc(5pt + (var(--grid-size) * 0.28)));
}

.readmore-partner-section--requirements .readmore-partner-copy {
  margin-left: calc(-15px - 3pt);
  row-gap: 1.35em;
  transform: translateY(calc(-15px + 15pt + (var(--grid-size) * 0.28)));
}

.readmore-partner-section--bonus .readmore-partner-copy {
  margin-left: calc(-10pt - 5px);
  row-gap: 1.35em;
  transform: translateY(calc(-20px + 15pt + (var(--grid-size) * 0.28)));
}

.readmore-partner-section--offer .readmore-partner-copy {
  row-gap: 1.35em;
}

.readmore-partner-list {
  padding-left: calc(var(--grid-size) * 0.42);
  list-style-position: outside;
}

.readmore-partner-list li {
  padding-left: calc(var(--grid-size) * 0.08);
}

.readmore-partner-copy strong {
  display: block;
  font-weight: 600;
}

.readmore-partner-detail-action {
  position: relative;
  z-index: 0;
  grid-column: 28 / 29;
  grid-row: 29 / 34;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--grid-size) + var(--grid-stroke));
  height: calc((var(--grid-size) * 5) + var(--grid-stroke));
  border: 0;
  box-shadow: none;
  color: var(--ink);
  background: var(--surface);
  appearance: none;
  border-radius: 0;
  padding: 0;
  cursor: pointer;
  transition:
    background-color 160ms ease,
    filter 160ms ease;
}

.readmore-partner-detail-action img {
  display: block;
  opacity: 0;
  width: 19px;
  height: auto;
  transform: translateY(calc(var(--grid-size) * 0.28));
  transition:
    opacity 300ms ease,
    transform 360ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-partner-detail-action:hover,
.readmore-partner-detail-action:focus-visible {
  background: var(--ink);
  outline: none;
}

.readmore-partner-detail-action:hover img,
.readmore-partner-detail-action:focus-visible img {
  filter: invert(1);
}

.readmore-panel-roles.is-partner-expanded .canvas-readmore-section,
.readmore-panel-roles.is-algorithm-expanded .canvas-readmore-section {
  min-height: calc(var(--grid-size) * 35);
}

.readmore-panel-roles.is-partner-expanded .readmore-role-row--partner {
  grid-row: 1 / 3;
  grid-template-columns: calc(var(--grid-size) * 10) calc(var(--grid-size) * 18);
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.readmore-panel-roles.is-algorithm-expanded .readmore-role-row--algorithm {
  grid-row: 1 / 3;
  grid-template-columns: calc(var(--grid-size) * 10) calc(var(--grid-size) * 18);
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.readmore-panel-roles.is-partner-expanded .readmore-role-row--partner .readmore-role-direction,
.readmore-panel-roles.is-algorithm-expanded .readmore-role-row--algorithm .readmore-role-direction {
  border-right: 0;
}

.readmore-panel-roles.is-partner-expanded .readmore-role-row--partner .readmore-role-action,
.readmore-panel-roles.is-algorithm-expanded .readmore-role-row--algorithm .readmore-role-action {
  display: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.readmore-panel-roles.is-partner-expanded .readmore-role-row--algorithm,
.readmore-panel-roles.is-partner-expanded .readmore-role-row--marketing,
.readmore-panel-roles.is-algorithm-expanded .readmore-role-row--partner,
.readmore-panel-roles.is-algorithm-expanded .readmore-role-row--marketing {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(calc(var(--grid-size) * -1));
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-detail,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-detail {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition:
    opacity 320ms ease 120ms,
    visibility 0s linear 0s,
    transform 520ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-heading,
.readmore-panel-roles.is-partner-expanded .readmore-partner-detail-action img,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-heading,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-detail-action img {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 800ms;
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-copy,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-copy {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1250ms;
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-section--overview .readmore-partner-copy,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(20px);
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-section--participate .readmore-partner-copy,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--participate .readmore-partner-copy {
  transform: translateY(5pt);
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-section--requirements .readmore-partner-copy,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt));
}

.readmore-panel-roles.is-partner-expanded .readmore-partner-section--bonus .readmore-partner-copy,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-20px + 15pt));
}

.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-copy,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  row-gap: 0.55em;
}

.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-copy {
  row-gap: 1.35em;
  transform: translateY(calc(-15px + 15pt - 20pt));
}

.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  row-gap: 1.35em;
  transform: translateY(calc(-15px + 15pt - 20pt));
}

.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-list,
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-list {
  width: calc(100% + var(--grid-size) * 0.65);
}

.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-list li:nth-child(1),
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-list li:nth-child(2),
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-list li:nth-child(4),
.readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-list li:nth-child(5) {
  white-space: nowrap;
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-list li {
  white-space: normal;
  overflow-wrap: anywhere;
}

.readmore-join-page.is-returning .readmore-stage-shell,
.readmore-join-page.is-returning .bottom-loop {
  opacity: 0;
  pointer-events: none;
  transition: opacity 360ms ease;
}

html[data-language="en"] .readmore-join-page .hero-signin,
html[data-language="en"] .readmore-join-page .hero-language__link,
html[data-language="en"] .readmore-join-page .hero-signin__label,
html[data-language="en"] .readmore-join-page .hero-language__label {
  font-family: "IBM Plex Sans", "IBM Plex Sans SC", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  -webkit-text-stroke: 0.25px currentColor;
  text-shadow: 0 0 0 currentColor;
}

html[data-language="en"] .readmore-join-page .readmore-hero-title,
html[data-language="en"] .readmore-join-page .readmore-hero-copy,
html[data-language="en"] .readmore-join-page .readmore-role-intro,
html[data-language="en"] .readmore-join-page .readmore-role-title,
html[data-language="en"] .readmore-join-page .readmore-role-direction,
html[data-language="en"] .readmore-join-page .readmore-partner-heading,
html[data-language="en"] .readmore-join-page .readmore-partner-copy {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
}

html[data-language="en"] .readmore-join-page .readmore-hero-title {
  font-size: 58px;
  letter-spacing: -2px;
}

html[data-language="en"] .readmore-join-page .readmore-hero-copy {
  font-size: 20px;
}

html[data-language="en"] .readmore-join-page .readmore-role-intro {
  font-size: 20px;
}

html[data-language="en"] .readmore-join-page .readmore-hero-body {
  gap: 24px;
}

html[data-language="en"] .readmore-join-page .readmore-hero-copy + .readmore-hero-copy {
  transform: none;
}

html[data-language="en"] .readmore-join-page .readmore-copy-break {
  height: 24px;
}

html[data-language="en"] .readmore-join-page .readmore-role-title,
html[data-language="en"] .readmore-join-page .readmore-role-direction {
  line-height: 1.2;
  letter-spacing: 0;
  white-space: pre-line;
}

html[data-language="en"] .readmore-join-page .readmore-role-title {
  padding-left: 37px;
  font-size: 30px;
  font-weight: 700;
  text-transform: uppercase;
}

html[data-language="en"] .readmore-join-page .readmore-role-direction {
  padding-left: 22px;
  font-size: 30px;
}

html[data-language="en"] .readmore-join-page .readmore-partner-heading {
  font-size: 30px;
  line-height: 1.2;
}

html[data-language="en"] .readmore-join-page .readmore-partner-copy {
  font-size: 14px;
  line-height: 1.2;
}

html[data-language="en"] .readmore-join-page .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(calc(20px - 15pt + (var(--grid-size) * 0.28)));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-partner-expanded .readmore-partner-section--overview .readmore-partner-copy,
html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(calc(20px - 15pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(calc(20px - 15pt - 13pt));
}

html[data-language="en"] .readmore-join-page .readmore-partner-section--participate .readmore-partner-copy {
  transform: translateY(calc(45pt + (var(--grid-size) * 0.28)));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-partner-expanded .readmore-partner-section--participate .readmore-partner-copy,
html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--participate .readmore-partner-copy {
  transform: translateY(45pt);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--participate .readmore-partner-copy {
  transform: translateY(25pt);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--participate .readmore-partner-copy strong {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  -webkit-text-stroke: 0.2px currentColor;
  text-shadow: 0 0 0 currentColor;
}

html[data-language="en"] .readmore-join-page .readmore-partner-section--requirements .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt + 30pt + (var(--grid-size) * 0.28)));
}

html[data-language="en"] .readmore-join-page .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-20px + 15pt + 30pt + (var(--grid-size) * 0.28)));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-partner-expanded .readmore-partner-section--requirements .readmore-partner-copy,
html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt + 30pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt + 30pt - 75pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--requirements .readmore-partner-heading {
  transform: translateY(-5pt);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-heading {
  transform: translateY(-5pt);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-partner-expanded .readmore-partner-section--bonus .readmore-partner-copy,
html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-20px + 15pt + 30pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt + 30pt - 75pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-algorithm-expanded .readmore-partner-section--offer .readmore-partner-list li {
  white-space: nowrap;
}

.readmore-panel-roles.is-marketing-expanded .canvas-readmore-section {
  min-height: calc(var(--grid-size) * 35);
}

.readmore-panel-roles.is-marketing-expanded .readmore-role-row--marketing {
  grid-row: 1 / 3;
  grid-template-columns: calc(var(--grid-size) * 10) calc(var(--grid-size) * 18);
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.readmore-panel-roles.is-marketing-expanded .readmore-role-row--marketing .readmore-role-direction {
  border-right: 0;
}

.readmore-panel-roles.is-marketing-expanded .readmore-role-row--marketing .readmore-role-action {
  display: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.readmore-panel-roles.is-marketing-expanded .readmore-role-row--partner,
.readmore-panel-roles.is-marketing-expanded .readmore-role-row--algorithm {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(calc(var(--grid-size) * -1));
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-detail {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition:
    opacity 320ms ease 120ms,
    visibility 0s linear 0s,
    transform 520ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-heading,
.readmore-panel-roles.is-marketing-expanded .readmore-partner-detail-action img {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 800ms;
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-copy {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1250ms;
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(20px);
}

html[data-language="zh"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--overview .readmore-partner-copy,
html:not([data-language="en"]) .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(5px);
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--participate .readmore-partner-copy {
  transform: translateY(5pt);
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--requirements .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt));
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-20px + 15pt));
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--requirements .readmore-partner-copy,
.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  row-gap: 1.35em;
  transform: translateY(calc(-15px + 15pt - 30pt));
}

.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--requirements .readmore-partner-list,
.readmore-panel-roles.is-marketing-expanded .readmore-partner-section--bonus .readmore-partner-list {
  width: calc(100% + var(--grid-size) * 0.65);
}

html[data-language="zh"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--offer .readmore-partner-heading,
html:not([data-language="en"]) .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--offer .readmore-partner-heading,
html[data-language="zh"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--offer .readmore-partner-copy,
html:not([data-language="en"]) .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--offer .readmore-partner-copy {
  transform: translateY(-10px);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--requirements .readmore-partner-list li {
  white-space: normal;
  overflow-wrap: anywhere;
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--overview .readmore-partner-copy {
  transform: translateY(calc(20px - 15pt - 13pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--participate .readmore-partner-copy {
  transform: translateY(25pt);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--participate .readmore-partner-copy strong {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  -webkit-text-stroke: 0.2px currentColor;
  text-shadow: 0 0 0 currentColor;
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--requirements .readmore-partner-copy,
html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt + 30pt - 75pt));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--bonus .readmore-partner-copy {
  transform: translateY(calc(-15px + 15pt + 30pt - 75pt + 5px));
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--requirements .readmore-partner-heading,
html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--bonus .readmore-partner-heading {
  transform: translateY(-5pt);
}

html[data-language="en"] .readmore-join-page .readmore-panel-roles.is-marketing-expanded .readmore-partner-section--offer .readmore-partner-list li {
  white-space: nowrap;
}

html[data-language="en"] .readmore-join-page .readmore-hero-title,
html[data-language="en"] .readmore-join-page .readmore-hero-copy,
html[data-language="en"] .readmore-join-page .readmore-role-intro,
html[data-language="en"] .readmore-join-page .readmore-role-title,
html[data-language="en"] .readmore-join-page .readmore-role-direction {
  line-height: 1.2;
}

.panel-tech-overview.is-panel-revealed .panel-four-box--lead,
.panel-tech-overview.is-panel-revealed .panel-four-box--tag {
  --reveal-base-delay: 120ms;
}

.panel-tech-overview.is-panel-revealed .panel-four-box--labs {
  --reveal-base-delay: 260ms;
}

.panel-tech-overview.is-panel-revealed .panel-four-box--arch-header,
.panel-tech-overview.is-panel-revealed .panel-four-box--arch-row-one,
.panel-tech-overview.is-panel-revealed .panel-four-box--arch-row-two,
.panel-tech-overview.is-panel-revealed .panel-four-box--arch-row-three {
  --reveal-base-delay: 400ms;
}

.panel-tech-overview.is-panel-revealed .panel-four-box--knowledge-header,
.panel-tech-overview.is-panel-revealed .panel-four-box--knowledge-row-one,
.panel-tech-overview.is-panel-revealed .panel-four-box--knowledge-row-two {
  --reveal-base-delay: 520ms;
}

.panel-tech-overview.is-panel-revealed .panel-four-box--readmore .panel-content-fade {
  transition-delay: 660ms, 0s;
}

/* Panel 5: ecosystem landing scenarios */
.panel-ecosystem-overview {
  margin-top: 0;
}

.canvas-panel-five {
  min-height: calc(var(--grid-size) * 21);
}

.panel-five-lead-label,
.panel-five-lead,
.panel-five-card {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  justify-self: start;
  align-self: start;
}

.panel-five-lead-label {
  grid-column: 1 / 3;
  grid-row: 4 / 7;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: grid;
  align-content: center;
  justify-items: center;
}

.panel-five-lead-label__line {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}

.panel-five-lead {
  grid-column: 3 / 29;
  grid-row: 4 / 7;
  width: calc((var(--grid-size) * 26) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  align-items: center;
  padding: 0 29px;
}

.panel-five-lead__copy {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  transform: translateY(-20px);
}

.panel-five-card {
  position: relative;
  height: calc((var(--grid-size) * 10) + var(--grid-stroke));
  overflow: hidden;
}

.panel-five-card::after {
  content: "";
  position: absolute;
  left: 0;
  top: calc((var(--grid-size) * 5) - var(--grid-stroke));
  width: 100%;
  height: var(--grid-stroke);
  background: var(--line);
  pointer-events: none;
}

.panel-five-card--power {
  grid-column: 1 / 11;
  grid-row: 8 / 18;
  width: calc((var(--grid-size) * 10) + var(--grid-stroke));
}

.panel-five-card--city {
  grid-column: 11 / 20;
  grid-row: 10 / 20;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
}

.panel-five-card--embodied {
  grid-column: 20 / 29;
  grid-row: 12 / 22;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
}

.panel-five-card__title-wrap,
.panel-five-card__body-wrap {
  position: absolute;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: flex-start;
}

.panel-five-card__title-wrap {
  top: 0;
  height: calc(var(--grid-size) * 5);
  align-items: center;
}

.panel-five-card__body-wrap {
  top: calc(var(--grid-size) * 5);
  height: calc(var(--grid-size) * 5);
  align-items: center;
}

.panel-five-card__title-wrap--power {
  padding: 0 24px;
}

.panel-five-card__title-wrap--city {
  padding: 0 27px;
}

.panel-five-card__title-wrap--embodied {
  padding: 0 42px;
}

.panel-five-card__body-wrap--power {
  padding: 0 21px;
}

.panel-five-card__body-wrap--city,
.panel-five-card__body-wrap--embodied {
  padding: 0 23px 0 24px;
}

.panel-five-card__title {
  margin: 0;
  display: grid;
  gap: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}

.panel-five-card__title span {
  display: block;
}

.panel-five-card__title-line--hang-quote {
  position: relative;
  padding-left: 0;
}

.panel-five-card__title-hanging-quote {
  position: absolute;
  left: -33px;
  top: 0;
}

.panel-five-card__body {
  margin: 0;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: justify;
}

.panel-five-card__body--power {
  width: 405px;
}

.panel-five-card__body--city,
.panel-five-card__body--embodied {
  width: 360px;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-lead-label {
  grid-column: 1 / 6;
  width: calc((var(--grid-size) * 5) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 0 0 18px;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-lead-label__line {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.35;
  text-transform: uppercase;
  transform: translateX(10px);
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-lead-label__line:nth-child(2) {
  display: none;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-lead {
  grid-column: 6 / 29;
  width: calc((var(--grid-size) * 23) + var(--grid-stroke));
  padding: 0 30px;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-lead__copy {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.2;
  transform: translate(5px, -1px);
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-card__title {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-card__title-wrap--power,
html[data-language="en"] .panel-ecosystem-overview .panel-five-card__body-wrap--power {
  padding-left: 24px;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-card__title-wrap--city,
html[data-language="en"] .panel-ecosystem-overview .panel-five-card__body-wrap--city {
  padding-left: 25px;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-card__title-wrap--embodied,
html[data-language="en"] .panel-ecosystem-overview .panel-five-card__body-wrap--embodied {
  padding-left: 25px;
}

html[data-language="en"] .panel-ecosystem-overview .panel-five-card__body {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.2;
  text-align: left;
}

.panel-ecosystem-overview.is-panel-revealed .panel-five-lead-label,
.panel-ecosystem-overview.is-panel-revealed .panel-five-lead {
  --reveal-base-delay: 120ms;
}

.panel-ecosystem-overview.is-panel-revealed .panel-five-card--power {
  --reveal-base-delay: 260ms;
}

.panel-ecosystem-overview.is-panel-revealed .panel-five-card--city {
  --reveal-base-delay: 400ms;
}

.panel-ecosystem-overview.is-panel-revealed .panel-five-card--embodied {
  --reveal-base-delay: 540ms;
}

/* Panel 6: data governance pathway */
.canvas-panel-six {
  min-height: calc(var(--grid-size) * 19);
}

.panel-six-flow-lead,
.panel-six-flow-tag,
.panel-six-flow-card {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  justify-self: start;
  align-self: start;
}

.panel-six-flow-lead {
  grid-column: 1 / 27;
  grid-row: 4 / 7;
  width: calc((var(--grid-size) * 26) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  align-items: center;
  padding: 0 27px;
}

.panel-six-flow-lead__copy {
  margin: 0;
  width: 1125px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}

.panel-six-flow-tag {
  grid-column: 27 / 29;
  grid-row: 4 / 7;
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: grid;
  align-content: center;
  justify-items: center;
}

.panel-six-flow-tag__line {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}

.panel-six-flow-card {
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 68px 20px;
}

.panel-six-flow-card--search {
  grid-column: 17 / 29;
  grid-row: 8 / 11;
}

.panel-six-flow-card--knowledge {
  grid-column: 13 / 25;
  grid-row: 11 / 14;
}

.panel-six-flow-card--relation {
  grid-column: 5 / 17;
  grid-row: 14 / 17;
}

.panel-six-flow-card--extract {
  grid-column: 1 / 13;
  grid-row: 17 / 20;
}

.panel-six-flow-card__title,
.panel-six-flow-card__body {
  margin: 0;
  text-align: left;
}

.panel-six-flow-card__title {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}

.panel-six-flow-card__body {
  margin-top: 8px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: 0;
}

.panel-six-flow-card__body--search {
  width: 472.8px;
}

.panel-six-flow-card__body--knowledge {
  width: 429px;
}

.panel-six-flow-card__body--relation {
  width: 461.823px;
}

.panel-six-flow-card__body--extract {
  width: 436.8px;
}

html[data-language="en"] .panel-technology .panel-six-flow-lead {
  grid-column: 1 / 22;
  width: calc((var(--grid-size) * 21) + var(--grid-stroke));
  padding: 0 27px;
}

html[data-language="en"] .panel-technology .panel-six-flow-lead__copy {
  width: 902px;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.2;
  transform: translate(15px, -2px);
}

html[data-language="en"] .panel-technology .panel-six-flow-tag {
  grid-column: 22 / 29;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 20px;
}

html[data-language="en"] .panel-technology .panel-six-flow-tag__line {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.35;
  text-transform: uppercase;
  transform: translateX(10px);
}

html[data-language="en"] .panel-technology .panel-six-flow-tag__line:nth-child(2) {
  display: none;
}

html[data-language="en"] .panel-technology .panel-six-flow-card {
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  justify-content: center;
  padding-top: 0;
  padding-bottom: 0;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--knowledge {
  grid-column: 12 / 25;
  width: calc((var(--grid-size) * 13) + var(--grid-stroke));
}

html[data-language="en"] .panel-technology .panel-six-flow-card__title {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
}

html[data-language="en"] .panel-technology .panel-six-flow-card__body {
  display: none;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--search {
  padding-left: 23px;
  padding-right: 6px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--search .panel-six-flow-card__title {
  width: 511px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--knowledge {
  padding-left: 23px;
  padding-right: 23px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--knowledge .panel-six-flow-card__title {
  width: 540px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--relation {
  padding-left: 26px;
  padding-right: 41px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--relation .panel-six-flow-card__title {
  width: 454px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--extract {
  padding-left: 26px;
  padding-right: 12px;
}

html[data-language="en"] .panel-technology .panel-six-flow-card--extract .panel-six-flow-card__title {
  width: 497px;
}

.panel-technology.is-panel-revealed .panel-six-flow-lead,
.panel-technology.is-panel-revealed .panel-six-flow-tag {
  --reveal-base-delay: 120ms;
}

.panel-technology.is-panel-revealed .panel-six-flow-card--search {
  --reveal-base-delay: 240ms;
}

.panel-technology.is-panel-revealed .panel-six-flow-card--knowledge {
  --reveal-base-delay: 360ms;
}

.panel-technology.is-panel-revealed .panel-six-flow-card--relation {
  --reveal-base-delay: 480ms;
}

.panel-technology.is-panel-revealed .panel-six-flow-card--extract {
  --reveal-base-delay: 600ms;
}

/* Panel 7: credentials / validation */
.canvas-panel-seven-honors {
  min-height: calc(var(--grid-size) * 19);
}

.panel-seven-honors-row,
.panel-seven-honors-cta {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  justify-self: start;
  align-self: start;
}

.panel-seven-honors-row {
  display: grid;
  grid-template-columns: calc(var(--grid-size) * 7) calc(var(--grid-size) * 21);
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  position: relative;
}

.panel-seven-honors-row::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc((var(--grid-size) * 7) - var(--grid-stroke));
  width: var(--grid-stroke);
  background: var(--line);
  pointer-events: none;
}

.panel-seven-honors-row--research {
  grid-column: 1 / 29;
  grid-row: 4 / 8;
}

.panel-seven-honors-row--team {
  grid-column: 1 / 29;
  grid-row: 9 / 13;
}

.panel-seven-honors-row--validation {
  grid-column: 1 / 29;
  grid-row: 14 / 18;
}

.panel-seven-honors-row__label-wrap,
.panel-seven-honors-row__copy-wrap {
  display: flex;
  align-items: center;
  height: 100%;
}

.panel-seven-honors-row__label-wrap {
  justify-content: center;
  padding: 0 24px;
}

.panel-seven-honors-row__copy-wrap {
  padding: 0 22px;
}

.panel-seven-honors-row__label,
.panel-seven-honors-row__copy {
  margin: 0;
  color: var(--ink);
}

.panel-seven-honors-row__label {
  width: 253px;
  max-width: 253px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: center;
}

.panel-seven-honors-row__copy {
  width: 900px;
  max-width: 900px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: justify;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row__label-wrap {
  justify-content: flex-start;
  padding: 0 0 0 30px;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row__copy-wrap {
  padding: 0 18px 0 18px;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row__label {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 46px;
  font-weight: 600;
  line-height: 1;
  text-align: left;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row--research .panel-seven-honors-row__label {
  width: 208px;
  max-width: 208px;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row--team .panel-seven-honors-row__label {
  width: 159px;
  max-width: 159px;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row--validation .panel-seven-honors-row__label {
  width: 253px;
  max-width: 253px;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row__copy {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 1.2;
  text-align: left;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row--research .panel-seven-honors-row__copy {
  width: 908px;
  max-width: 908px;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-row--team .panel-seven-honors-row__copy,
html[data-language="en"] .panel-honors-overview .panel-seven-honors-row--validation .panel-seven-honors-row__copy {
  width: 900px;
  max-width: 900px;
}

.panel-seven-honors-cta {
  grid-column: 26 / 29;
  grid-row: 19 / 20;
  width: calc((var(--grid-size) * 3) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  display: grid;
  grid-template-columns: repeat(3, var(--grid-size));
  align-items: center;
  justify-items: center;
  padding: 0;
  appearance: none;
  border-radius: 0;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
  cursor: pointer;
}

.panel-seven-honors-cta:hover,
.panel-seven-honors-cta:focus-visible {
  background: var(--ink);
  color: var(--paper);
}

.panel-seven-honors-cta:focus-visible {
  outline: none;
}

.panel-seven-honors-cta__arrow {
  position: relative;
  grid-column: 1 / 2;
  justify-self: center;
  width: 19px;
  height: 16px;
  display: block;
  transform: translateY(1px);
}

.panel-seven-honors-cta__chevron {
  position: absolute;
  top: 2px;
  width: 9px;
  height: 9px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
  box-sizing: border-box;
}

.panel-seven-honors-cta__chevron:first-child {
  left: 0;
}

.panel-seven-honors-cta__chevron:last-child {
  left: 7px;
}

.panel-seven-honors-cta__label {
  display: block;
  grid-column: 2 / 4;
  justify-self: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}

html[data-language="en"] .panel-honors-overview .panel-seven-honors-cta__label {
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
}

.panel-seven-honors-overlay {
  position: absolute;
  inset: 0;
  z-index: 24;
  pointer-events: none;
}

.panel-seven-honors-overlay__panel {
  position: absolute;
  left: calc(var(--grid-size) * 25);
  top: calc(var(--grid-size) * 18);
  width: calc((var(--grid-size) * 3) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  overflow: hidden;
  opacity: 0;
  transition:
    opacity 120ms linear,
    left 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    top 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    width 560ms cubic-bezier(0.2, 0.78, 0.16, 1),
    height 560ms cubic-bezier(0.2, 0.78, 0.16, 1);
}

.panel-seven-honors-overlay__content {
  display: grid;
  grid-template-rows: 1fr auto;
  width: 100%;
  height: 100%;
  padding: 90px 66px 45px;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 240ms ease,
    transform 240ms ease;
}

.panel-seven-honors-overlay__message {
  align-self: center;
  margin: 0;
  max-width: 640px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--ink);
}

.panel-seven-honors-overlay__back {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 225px;
  height: 45px;
  padding: 0 22px;
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  color: var(--ink);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  appearance: none;
  border-radius: 0;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}

.panel-seven-honors-overlay__back:hover,
.panel-seven-honors-overlay__back:focus-visible {
  background: var(--ink);
  color: var(--paper);
  outline: none;
}

.panel-honors-overview.is-overlay-visible .panel-seven-honors-overlay {
  pointer-events: auto;
}

.panel-honors-overview.is-overlay-visible .panel-seven-honors-overlay__panel {
  opacity: 1;
}

.panel-honors-overview.is-overlay-visible .panel-seven-honors-cta {
  opacity: 0;
  pointer-events: none;
}

.panel-honors-overview.is-overlay-open .panel-seven-honors-overlay__panel {
  left: 0;
  top: calc(var(--grid-size) * 1);
  width: calc(var(--grid-size) * 28);
  height: calc(var(--grid-size) * 16);
}

.panel-honors-overview.is-overlay-open .panel-seven-honors-overlay__content {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 360ms;
}

.panel-honors-overview.is-overlay-navigating .panel-seven-honors-overlay__content {
  opacity: 0;
  transform: translateY(12px);
  transition: none;
}

.panel-honors-overview.is-overlay-navigating .panel-seven-honors-overlay__back {
  pointer-events: none;
}

.panel-honors-overview.is-panel-revealed .panel-seven-honors-row--research {
  --reveal-base-delay: 120ms;
}

.panel-honors-overview.is-panel-revealed .panel-seven-honors-row--team {
  --reveal-base-delay: 240ms;
}

.panel-honors-overview.is-panel-revealed .panel-seven-honors-row--validation {
  --reveal-base-delay: 360ms;
}

.panel-honors-overview.is-panel-revealed .panel-seven-honors-cta .panel-content-fade {
  transition-delay: 480ms, 0s;
}

/* Keep scroll-trigger timing, but unify the within-panel phases:
   1) all shells, 2) all titles, 3) all body/summary copy. */
.panel.is-panel-revealed [data-reveal-shell] {
  --reveal-base-delay: 0ms;
}

/* Panel 6: two full-width framed groups with header/body splits. */
.canvas-panel-six {
  min-height: calc(var(--grid-size) * 16);
}

/* Group shell geometry */
.panel-six-group {
  display: grid;
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 7) + var(--grid-stroke));
  --panel-box-split-top-1: calc((var(--grid-size) * 2) - var(--grid-stroke));
}

.panel-six-group--top {
  grid-column: 1 / 29;
  grid-row: 1 / 8;
  grid-template-columns: calc(var(--grid-size) * 9) calc(var(--grid-size) * 9) calc(var(--grid-size) * 10);
  grid-template-rows: calc(var(--grid-size) * 2) calc(var(--grid-size) * 5);
}

.panel-six-group--bottom {
  grid-column: 1 / 29;
  grid-row: 9 / 16;
  grid-template-columns: calc(var(--grid-size) * 14) calc(var(--grid-size) * 14);
  grid-template-rows: calc(var(--grid-size) * 2) calc(var(--grid-size) * 5);
}

.panel-six-header,
.panel-six-card {
  background: transparent;
  color: inherit;
  overflow: hidden;
}

/* Header row */
.panel-six-header {
  grid-column: 1 / -1;
  grid-row: 1 / 2;
  padding: 0 20px;
}

.panel-six-header__content {
  display: flex;
  align-items: center;
  gap: 18px;
  width: 100%;
  height: 100%;
}

.panel-six-header__cn,
.panel-six-header__en {
  margin: 0;
}

.panel-six-header__cn {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.2;
}

.panel-six-header__en {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 1.2;
}

.panel-six-card {
  display: block;
  padding: 19px 18px 18px 18px;
}

/* Card body */
.panel-six-card__content {
  display: grid;
  align-content: start;
  gap: 38px;
  width: 100%;
  height: 100%;
}

.panel-six-group--top .panel-six-card__content {
  grid-template-rows: 44px auto;
  row-gap: 38px;
  transform: translateX(3px);
}

.panel-six-group--bottom .panel-six-card__content {
  grid-template-rows: 44px auto;
  row-gap: 38px;
  transform: translate(2px, 20px);
}

.panel-six-card--small,
.panel-six-card--medium,
.panel-six-card--wide {
  grid-row: 2 / 3;
}

.panel-six-card--small:nth-of-type(2) {
  grid-column: 1 / 2;
}

.panel-six-card--small:nth-of-type(3) {
  grid-column: 2 / 3;
}

.panel-six-card--medium {
  grid-column: 3 / 4;
}

.panel-six-card--wide:nth-of-type(2) {
  grid-column: 1 / 2;
}

.panel-six-card--wide:nth-of-type(3) {
  grid-column: 2 / 3;
}

.panel-six-card__cn,
.panel-six-card__en {
  margin: 0;
  text-align: left;
}

.panel-six-group--top .panel-six-card__cn,
.panel-six-group--top .panel-six-card__en {
  width: 360px;
  max-width: 360px;
  text-align: justify;
}

.panel-six-group .panel-six-card__cn {
  min-height: 44px;
}

.panel-six-group--top .panel-six-card--medium .panel-six-card__cn {
  width: 405px;
  max-width: 405px;
}

.panel-six-group--bottom .panel-six-card__cn,
.panel-six-group--bottom .panel-six-card__en {
  width: 585px;
  max-width: 585px;
  text-align: justify;
}

.panel-six-card__cn {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  align-self: start;
}

.panel-six-card__en {
  font-family: "IBM Plex Sans", "IBM Plex Sans SC", sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.2;
  align-self: start;
  font-variant-ligatures: common-ligatures;
  font-feature-settings: "liga" 1, "clig" 1;
}

.panel-six-group .panel-six-card__content > :first-child {
  grid-row: 1;
}

.panel-six-group .panel-six-card__content > :nth-child(2) {
  grid-row: 2;
}

.panel-six-group--top .panel-six-card__en {
  text-align: left;
  hyphens: auto;
  -webkit-hyphens: auto;
  word-spacing: normal;
  text-wrap: pretty;
  transform: translateY(10px);
}

.panel-six-card__en-stack {
  display: grid;
  align-content: start;
  gap: 0;
}

.panel-six-card__en-stack--cross-modal {
  width: 407px;
  max-width: 407px;
}

.panel-six-group--top .panel-six-card__en--cross-modal-lead,
.panel-six-group--top .panel-six-card__en--cross-modal-body {
  width: 407px;
  max-width: 407px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 17px;
  line-height: 1.2;
}

.panel-six-group--top .panel-six-card__en--cross-modal-lead {
  font-weight: 700;
  text-align: left;
}

.panel-six-group--top .panel-six-card__en--cross-modal-body {
  font-weight: 400;
  text-align: left;
  hyphens: auto;
  -webkit-hyphens: auto;
  word-spacing: normal;
  text-wrap: pretty;
}

.panel-six-group--bottom .panel-six-card__en {
  text-align: justify;
  text-justify: inter-word;
  text-align-last: left;
  hyphens: auto;
  -webkit-hyphens: auto;
  hyphenate-character: "-";
  word-spacing: normal;
  text-wrap: pretty;
  transform: translateY(8px);
}

.panel-six-card__lead {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-weight: 700;
  width: 100%;
}

/* Panel 7: three 8x16 vertical application cards. */
/* Panel 8: three 28x4 horizontal credential rows with a vertical split. */
.canvas-panel-eight {
  min-height: calc(var(--grid-size) * 12);
}

/* Row shell */
.panel-eight-row {
  display: grid;
  grid-template-columns: calc((var(--grid-size) * 10) + var(--grid-stroke)) calc(var(--grid-size) * 18);
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  position: relative;
}

.panel-eight-row::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc((var(--grid-size) * 10) - var(--grid-stroke));
  width: var(--grid-stroke);
  background: var(--line);
  pointer-events: none;
}

.panel-eight-row:nth-child(1) {
  grid-column: 1 / 29;
  grid-row: 1 / 5;
}

.panel-eight-row:nth-child(2) {
  grid-column: 1 / 29;
  grid-row: 6 / 10;
}

.panel-eight-row:nth-child(3) {
  grid-column: 1 / 29;
  grid-row: 11 / 15;
}

.panel-eight-row__label,
.panel-eight-row__content {
  padding: 18px 20px 18px 18px;
}

/* Left title block / right body block */
.panel-eight-row__label {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transform: translate(12px, 5px);
}

.panel-eight-row__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transform: translateX(2px);
}

.panel-eight-row__title-cn,
.panel-eight-row__title-en,
.panel-eight-row__body-cn,
.panel-eight-row__body-en {
  margin: 0;
  color: var(--ink);
}

.panel-eight-row__title-cn {
  width: 315px;
  max-width: 315px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.35;
  text-align: left;
}

.panel-eight-row__title-en {
  width: 315px;
  max-width: 315px;
  margin-top: 43px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 34px;
  font-weight: 400;
  line-height: 1.2;
  text-align: left;
  white-space: nowrap;
  transform: translateY(3px);
}

.panel-eight-row__body-cn {
  width: 765px;
  max-width: 765px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  text-align: justify;
  transform: translateY(9px);
}

.panel-eight-row__body-en {
  width: 765px;
  max-width: 765px;
  margin-top: 28px;
  font-family: "IBM Plex Sans", "IBM Plex Sans SC", sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.2;
  text-align: justify;
  text-justify: inter-word;
  text-align-last: left;
  hyphens: auto;
  -webkit-hyphens: auto;
  hyphenate-character: "-";
}


/* Panel 9: one 28x5 hero box plus two bottom utility boxes. */
.canvas-panel-nine {
  min-height: calc(var(--grid-size) * 14);
}

/* Footer box geometry */
.panel-nine-hero {
  grid-column: 1 / 29;
  grid-row: 4 / 9;
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 5) + var(--grid-stroke));
  position: relative;
  overflow: hidden;
}

.panel-nine-hero__content {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.panel-nine-hero__brand-image {
  display: block;
  width: 1210px;
  max-width: 1210px;
  height: auto;
  object-fit: contain;
}

.panel-nine-copyright {
  grid-column: 1 / 10;
  grid-row: 9 / 10;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  position: relative;
  z-index: 1;
}

.panel-nine-copyright__content {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 100%;
  padding: 0 15px;
}

.panel-nine-copyright__brand {
  display: block;
  width: 109px;
  max-width: 109px;
  height: 13.262px;
  max-height: 13.262px;
  object-fit: contain;
}

.panel-nine-copyright__text {
  margin: 0;
  font-family: "Helvetica Neue", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  color: var(--ink);
  white-space: nowrap;
}

.panel-nine-record {
  grid-column: 25 / 29;
  grid-row: 9 / 10;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  position: relative;
  z-index: 1;
}

.panel-nine-record__text {
  margin: 0;
  height: 100%;
  padding: 0 4px 0 3px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-family: "IBM Plex Sans", "IBM Plex Sans SC", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  color: var(--ink);
  white-space: nowrap;
  text-align: right;
  text-transform: uppercase;
}

.panel-nine-record__mono {
  font-family: "IBM Plex Mono", "IBM Plex Sans", monospace;
}

.product-panel__title,
.product-badge,
.product-card {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  justify-self: start;
  align-self: start;
}

.product-panel__title {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
  width: calc(var(--grid-size) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: grid;
  place-items: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  letter-spacing: 1.6px;
  line-height: 1.2;
  writing-mode: vertical-rl;
  text-orientation: upright;
}

.product-badge {
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: grid;
  place-items: center;
}

.product-badge--one {
  grid-column: 7 / 9;
  grid-row: 2 / 4;
}

.product-badge--two {
  grid-column: 7 / 9;
  grid-row: 6 / 8;
}

.product-badge--three {
  grid-column: 7 / 9;
  grid-row: 9 / 11;
}

.product-badge--four {
  grid-column: 7 / 9;
  grid-row: 13 / 15;
}

.product-badge__shape {
  position: relative;
  width: calc(var(--grid-size) * 1.6667);
  height: calc(var(--grid-size) * 1.6667);
}

.product-badge__graphic {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.product-badge__core {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--paper);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 24px;
  font-weight: 400;
  letter-spacing: 1.2px;
  line-height: 1;
  transform: translate(-50%, -50%);
}

.product-card {
  display: flex;
  align-items: center;
  padding-left: calc((var(--grid-size) * 0.4889) + 5px);
  overflow: hidden;
}

.product-card--engine {
  grid-column: 10 / 29;
  grid-row: 2 / 5;
  width: calc((var(--grid-size) * 19) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
}

.product-card--vision {
  grid-column: 10 / 22;
  grid-row: 6 / 8;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.product-card--graph {
  grid-column: 10 / 23;
  grid-row: 9 / 12;
  width: calc((var(--grid-size) * 13) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
}

.product-card--enterprise {
  grid-column: 10 / 29;
  grid-row: 13 / 15;
  width: calc((var(--grid-size) * 19) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.product-card__copy {
  display: grid;
  gap: 0;
}

.product-card__line {
  display: block;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  color: var(--ink);
  white-space: nowrap;
}

.technology-panel__title,
.technology-card {
  border: var(--grid-stroke) solid var(--line);
  background: var(--surface);
  justify-self: start;
  align-self: start;
  color: var(--ink);
  overflow: hidden;
}

.technology-panel__title {
  grid-column: 27 / 28;
  grid-row: 1 / 3;
  width: calc(var(--grid-size) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: grid;
  place-items: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  letter-spacing: 1.6px;
  line-height: 1.2;
  writing-mode: vertical-rl;
  text-orientation: upright;
}

.technology-card {
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: var(--technology-padding-left, 22px);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  white-space: nowrap;
}

.technology-card--dwg {
  --technology-padding-left: 23px;
  grid-column: 2 / 14;
  grid-row: 1 / 3;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
}

.technology-card--detection {
  --technology-padding-left: 41px;
  grid-column: 16 / 25;
  grid-row: 1 / 3;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
}

.technology-card--ocr {
  --technology-padding-left: 30px;
  grid-column: 2 / 11;
  grid-row: 5 / 7;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
}

.technology-card--geometry {
  --technology-padding-left: 11px;
  grid-column: 13 / 20;
  grid-row: 5 / 7;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
}

.technology-card--private {
  --technology-padding-left: 32px;
  grid-column: 2 / 9;
  grid-row: 9 / 11;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
}

.technology-card--multimodal {
  --technology-padding-left: 36px;
  grid-column: 11 / 18;
  grid-row: 9 / 11;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
}

.technology-card--reasoning {
  --technology-padding-left: 16px;
  grid-column: 2 / 7;
  grid-row: 13 / 15;
  width: calc((var(--grid-size) * 5) + var(--grid-stroke));
}

.technology-card--causal {
  --technology-padding-left: 18px;
  grid-column: 9 / 14;
  grid-row: 13 / 15;
  width: calc((var(--grid-size) * 5) + var(--grid-stroke));
}

.problem-lead,
.problem-card {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
}

.problem-lead {
  grid-column: 1 / 23;
  grid-row: 1 / 3;
  width: calc((var(--grid-size) * 22) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.problem-card {
  width: calc((var(--grid-size) * 10) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.problem-card--one {
  grid-column: 1 / 11;
  grid-row: 5 / 7;
}

.problem-card--two {
  grid-column: 13 / 23;
  grid-row: 5 / 7;
}

.problem-card--three {
  grid-column: 1 / 11;
  grid-row: 9 / 11;
}

.problem-card--four {
  grid-column: 13 / 23;
  grid-row: 9 / 11;
}

.problem-card--five {
  grid-column: 1 / 11;
  grid-row: 13 / 15;
}

.problem-card--six {
  grid-column: 13 / 23;
  grid-row: 13 / 15;
}

.problem-lead__copy,
.problem-card__copy {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

.problem-lead__copy {
  width: 730px;
}

.problem-card__copy--wide {
  width: 423.333px;
}

.problem-card__copy--audit {
  width: 416px;
}

.problem-card__copy--bim {
  width: 357px;
}

.problem-card__copy--narrow {
  width: 402px;
}

.opportunity-card {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.opportunity-video {
  background: var(--surface);
  grid-column: 1 / 13;
  grid-row: 3 / 13;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc((var(--grid-size) * 12) + var(--grid-stroke));
  position: relative;
  justify-self: start;
  left: var(--grid-size);
  overflow: hidden;
}

.opportunity-video::after {
  content: "";
  position: absolute;
  inset: 0;
  border: var(--grid-stroke) solid var(--line);
  pointer-events: none;
}

.opportunity-video__media {
  position: absolute;
  inset: -10px;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  display: block;
  object-fit: cover;
}

.opportunity-card {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  position: relative;
}

.opportunity-card--market {
  grid-column: 18 / 27;
  grid-row: 3 / 5;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
  left: var(--grid-size);
}

.opportunity-card--bim {
  grid-column: 18 / 25;
  grid-row: 6 / 8;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  left: var(--grid-size);
}

.opportunity-card--review {
  grid-column: 18 / 25;
  grid-row: 9 / 11;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  left: var(--grid-size);
}

.opportunity-card--site {
  grid-column: 18 / 24;
  grid-row: 12 / 14;
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
  left: var(--grid-size);
}

.opportunity-card--twin {
  grid-column: 18 / 24;
  grid-row: 15 / 17;
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
  left: var(--grid-size);
}

.opportunity-card__copy {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

.opportunity-card__copy--market {
  width: 354px;
}

.opportunity-card__copy--bim,
.opportunity-card__copy--review {
  width: 264px;
}

.opportunity-card__copy--site {
  width: 213px;
}

.opportunity-card__copy--twin {
  width: 200px;
}

.scale-note,
.scale-total,
.scale-caption,
.scale-metric {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.scale-note {
  grid-column: 1 / 18;
  grid-row: 4 / 5;
  width: calc((var(--grid-size) * 17) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
}

.scale-note__copy {
  width: 749px;
  position: relative;
  left: -10px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

.scale-total {
  grid-column: 1 / 27;
  grid-row: 5 / 8;
  width: calc((var(--grid-size) * 26) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
}

.scale-total__value,
.scale-metric__mono {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}

.scale-total__value {
  width: 1147px;
  position: relative;
  left: -5px;
  font-size: 80px;
  text-align: center;
}

.scale-caption {
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
}

.scale-caption--left {
  grid-column: 1 / 10;
  grid-row: 10 / 12;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
}

.scale-caption--right {
  grid-column: 15 / 23;
  grid-row: 10 / 12;
  width: calc((var(--grid-size) * 8) + var(--grid-stroke));
}

.scale-caption__copy {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

.scale-caption--left .scale-caption__copy {
  width: 381px;
  position: relative;
  left: 1px;
}

.scale-caption--right .scale-caption__copy {
  width: 327px;
}

.scale-caption__copy span {
  display: block;
}

.scale-metric {
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  align-items: center;
}

.scale-metric--left {
  grid-column: 1 / 13;
  grid-row: 12 / 15;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  position: relative;
  display: block;
  padding: 0;
}

.scale-metric--left .scale-metric__mono {
  position: absolute;
  left: -2px;
  top: 30px;
  width: 342px;
  text-align: center;
}

.scale-metric--left .scale-metric__suffix--large {
  position: absolute;
  left: 329px;
  top: 32px;
  width: 126px;
  text-align: center;
  margin-left: 0;
}

.scale-metric--left .scale-metric__suffix--stack {
  position: absolute;
  left: 447px;
  top: 34px;
  width: 75px;
  margin-left: 0;
  line-height: 1.2;
}

.scale-metric--right {
  grid-column: 15 / 25;
  grid-row: 12 / 15;
  width: calc((var(--grid-size) * 10) + var(--grid-stroke));
  position: relative;
  justify-content: center;
}

.scale-metric__mono {
  font-size: 80px;
}

.scale-metric--right .scale-metric__mono {
  position: relative;
  left: -8px;
}

.scale-metric__suffix {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-weight: 400;
  color: var(--ink);
}

.scale-metric__suffix--large,
.scale-metric__suffix--solo {
  font-size: 80px;
  line-height: 1;
}

.scale-metric__suffix--large {
  margin-left: -12px;
}

.scale-metric__suffix--stack {
  margin-left: -4px;
  display: grid;
  font-size: 32px;
  line-height: 1.18;
  text-align: center;
}

.scale-metric__suffix--stack span {
  display: block;
}

.scale-metric__suffix--solo {
  position: relative;
  left: -8px;
  margin-left: 6px;
}

.customer-label,
.customer-box {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.customer-label {
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
}

.customer-label--icp {
  grid-column: 1 / 4;
  grid-row: 3 / 5;
  width: calc((var(--grid-size) * 3) + var(--grid-stroke));
}

.customer-label--decision {
  grid-column: 1 / 5;
  grid-row: 12 / 14;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
}

.customer-label__copy {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

.customer-label__copy--icp {
  width: 100px;
  text-transform: uppercase;
}

.customer-label__copy--decision {
  width: 150px;
}

.customer-box {
  position: relative;
}

.customer-box--icp {
  grid-column: 1 / 19;
  grid-row: 5 / 10;
  width: calc((var(--grid-size) * 18) + var(--grid-stroke));
  height: calc((var(--grid-size) * 5) + var(--grid-stroke));
}

.customer-box--decision {
  grid-column: 1 / 21;
  grid-row: 14 / 16;
  width: calc((var(--grid-size) * 20) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
}

.customer-box__copy {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--ink);
}

.customer-box__copy--icp {
  position: absolute;
  left: 24px;
  top: 24px;
  width: 771px;
  line-height: 1.29;
}

.customer-box__copy--icp span {
  display: block;
}

.customer-box__copy--decision {
  position: absolute;
  left: 17px;
  top: 23px;
  width: 854px;
  line-height: 1.2;
}

.benefit-graphic,
.benefit-copy,
.benefit-number {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.benefit-graphic {
  position: relative;
  width: calc((var(--grid-size) * 3) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
}

.benefit-graphic--up {
  grid-column: 12 / 15;
  grid-row: 3 / 7;
}

.benefit-graphic--down {
  grid-column: 1 / 4;
  grid-row: 10 / 14;
}

.benefit-graphic span {
  position: absolute;
  left: 50%;
  width: 56px;
  height: 56px;
  border-left: 10px solid var(--line);
  border-top: 10px solid var(--line);
}

.benefit-graphic--up span:first-child {
  top: 58px;
  transform: translateX(-50%) rotate(45deg);
}

.benefit-graphic--up span:last-child {
  top: 96px;
  transform: translateX(-50%) rotate(45deg);
}

.benefit-graphic--down span:first-child {
  top: 34px;
  transform: translateX(-50%) rotate(225deg);
}

.benefit-graphic--down span:last-child {
  top: 72px;
  transform: translateX(-50%) rotate(225deg);
}

.benefit-copy {
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  position: relative;
}

.benefit-copy--top {
  grid-column: 15 / 23;
  grid-row: 3 / 7;
  width: calc((var(--grid-size) * 8) + var(--grid-stroke));
}

.benefit-copy--bottom {
  grid-column: 4 / 11;
  grid-row: 10 / 14;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
}

.benefit-copy span {
  display: block;
}

.benefit-copy--top span,
.benefit-copy--bottom span {
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 64px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
}

.benefit-copy--top span:first-child,
.benefit-copy--bottom span:first-child {
  position: absolute;
  left: 22px;
  top: 14px;
}

.benefit-copy--top span:last-child,
.benefit-copy--bottom span:last-child {
  position: absolute;
  left: 22px;
  top: 91px;
}

.benefit-copy--bottom span:first-child,
.benefit-copy--bottom span:last-child {
  left: 28px;
}

.benefit-number {
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "IBM Plex Mono", monospace;
  font-size: 120px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
}

.benefit-number__value {
  display: block;
}

.benefit-number--top {
  grid-column: 23 / 29;
  grid-row: 3 / 7;
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
}

.benefit-number__value--top {
  position: relative;
  left: -3px;
}

.benefit-number--bottom .benefit-number__value {
  position: relative;
  left: -4px;
}

.benefit-number--bottom {
  grid-column: 11 / 17;
  grid-row: 10 / 14;
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
}

.business-mode-badge,
.business-mode-card,
.business-video {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.business-mode-badge {
  width: calc((var(--grid-size) * 2) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  position: relative;
  overflow: hidden;
}

.business-mode-badge--one {
  grid-column: 1 / 3;
  grid-row: 7 / 9;
}

.business-mode-badge--two {
  grid-column: 1 / 3;
  grid-row: 11 / 13;
}

.business-mode-badge--three {
  grid-column: 1 / 3;
  grid-row: 15 / 17;
}

.business-mode-badge__shape {
  position: absolute;
  inset: 7px;
}

.business-mode-badge__graphic {
  position: absolute;
  left: 0;
  top: 0;
  width: 75px;
  height: 75px;
  display: block;
}

.business-mode-badge__core {
  position: absolute;
  left: 30px;
  top: 26px;
  width: 14px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: 1.2px;
  color: var(--paper);
}

.business-mode-card {
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  align-items: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  color: var(--ink);
}

.business-mode-card--one {
  grid-column: 4 / 12;
  grid-row: 7 / 9;
  width: calc((var(--grid-size) * 8) + var(--grid-stroke));
  padding-left: 11px;
  justify-self: start;
}

.business-mode-card--two {
  grid-column: 4 / 11;
  grid-row: 11 / 13;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  padding-left: 15px;
  justify-self: start;
}

.business-mode-card--three {
  grid-column: 4 / 18;
  grid-row: 15 / 17;
  width: calc((var(--grid-size) * 14) + var(--grid-stroke));
  padding-left: 19px;
  justify-self: start;
}

.business-video {
  grid-column: 17 / 29;
  grid-row: 2 / 14;
  width: calc((var(--grid-size) * 12) + var(--grid-stroke));
  height: calc((var(--grid-size) * 12) + var(--grid-stroke));
  position: relative;
  overflow: hidden;
  justify-self: start;
}

.business-video__media {
  position: absolute;
  inset: 38px;
  width: calc(100% - 76px);
  height: calc(100% - 76px);
  display: block;
  object-fit: cover;
}

.vision-keyword-box,
.vision-statement-box,
.mission-keyword-box,
.mission-statement-box {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
}

.vision-keyword-box {
  grid-column: 9 / 15;
  grid-row: 4 / 6;
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  justify-self: start;
}

.vision-keyword-copy,
.mission-keyword-copy {
  align-self: center;
  justify-self: center;
  font-family: "IBM Plex Sans", "IBM Plex Sans SC", sans-serif;
  font-size: 64px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--ink);
}

.vision-keyword-copy {
  grid-column: 9 / 15;
  grid-row: 4 / 6;
  width: 272px;
  text-align: center;
}

.vision-statement-box {
  grid-column: 5 / 19;
  grid-row: 6 / 10;
  width: calc((var(--grid-size) * 14) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  justify-self: start;
}

.vision-statement-copy,
.mission-statement-copy {
  display: grid;
  align-self: center;
  justify-self: center;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 64px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: center;
  color: var(--ink);
}

.vision-statement-copy {
  grid-column: 5 / 19;
  grid-row: 6 / 10;
  width: 670px;
}

.mission-keyword-box {
  grid-column: 8 / 16;
  grid-row: 11 / 13;
  width: calc((var(--grid-size) * 8) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  justify-self: start;
}

.mission-keyword-copy {
  grid-column: 8 / 16;
  grid-row: 11 / 13;
  width: 305px;
  text-align: center;
}

.mission-statement-box {
  grid-column: 1 / 23;
  grid-row: 13 / 17;
  width: calc((var(--grid-size) * 22) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  justify-self: start;
}

.mission-statement-copy {
  grid-column: 1 / 23;
  grid-row: 13 / 17;
  width: 969px;
  position: relative;
  left: 18px;
}

.team-lead,
.team-advisor {
  display: contents;
}

.team-lead__portrait,
.team-lead__title,
.team-lead__bio,
.team-advisor__name,
.team-advisor__bio {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
  justify-self: start;
  color: var(--ink);
}

.team-lead__portrait {
  position: relative;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  overflow: visible;
}

.team-lead__portrait-frame {
  display: none;
}

.team-lead__portrait-image {
  position: absolute;
  display: block;
  object-fit: cover;
}

.team-lead--ceo .team-lead__portrait {
  grid-column: 5 / 9;
  grid-row: 3 / 7;
}

.team-lead--ceo .team-lead__portrait-image {
  left: 22px;
  top: -28px;
  width: 150px;
  height: 208px;
}

.team-lead--cto .team-lead__portrait {
  grid-column: 5 / 9;
  grid-row: 8 / 12;
  background: transparent;
  border: 0;
  overflow: hidden;
}

.team-lead__portrait-image--full {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.team-lead--coo .team-lead__portrait {
  grid-column: 5 / 9;
  grid-row: 13 / 17;
}

.team-lead__portrait-image--coo {
  left: 3px;
  top: -8px;
  width: 174px;
  height: 188px;
}

.team-lead__title,
.team-lead__bio {
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  min-height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  padding: 0 11px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-weight: 400;
  letter-spacing: 0;
}

.team-lead__title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  font-size: 32px;
  line-height: 1.2;
  text-align: left;
}

.team-lead__bio {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  font-size: 16px;
  line-height: 1.2;
  text-align: left;
}

.team-lead__title span,
.team-lead__bio span,
.team-advisor__bio span {
  display: block;
}

.team-lead__title span,
.team-lead__bio span {
  position: relative;
  left: 7px;
}

.team-lead--ceo .team-lead__title {
  grid-column: 9 / 16;
  grid-row: 3 / 5;
}

.team-lead--ceo .team-lead__bio {
  grid-column: 9 / 16;
  grid-row: 5 / 7;
}

.team-lead--cto .team-lead__title {
  grid-column: 9 / 16;
  grid-row: 8 / 10;
}

.team-lead--cto .team-lead__bio {
  grid-column: 9 / 16;
  grid-row: 10 / 12;
}

.team-lead--coo .team-lead__title {
  grid-column: 9 / 16;
  grid-row: 13 / 15;
}

.team-lead--coo .team-lead__bio {
  grid-column: 9 / 16;
  grid-row: 15 / 17;
}

.team-advisor__name,
.team-advisor__bio {
  width: calc((var(--grid-size) * 5) + var(--grid-stroke));
  padding: 0 11px 0 21px;
}

.team-advisor__name {
  min-height: calc(var(--grid-size) + var(--grid-stroke));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  font-family: "IBM Plex Sans", "IBM Plex Sans SC", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  text-align: left;
}

.team-advisor__bio {
  min-height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: left;
}

.team-advisor--one .team-advisor__name {
  grid-column: 20 / 25;
  grid-row: 3 / 4;
}

.team-advisor--one .team-advisor__bio {
  grid-column: 20 / 25;
  grid-row: 4 / 6;
}

.team-advisor--two .team-advisor__name {
  grid-column: 20 / 25;
  grid-row: 7 / 8;
}

.team-advisor--two .team-advisor__bio {
  grid-column: 20 / 25;
  grid-row: 8 / 10;
}

.team-advisor--three .team-advisor__name {
  grid-column: 20 / 25;
  grid-row: 11 / 12;
}

.team-advisor--three .team-advisor__bio {
  grid-column: 20 / 25;
  grid-row: 12 / 13;
  min-height: calc(var(--grid-size) + var(--grid-stroke));
}

.team-advisor--four .team-advisor__name {
  grid-column: 20 / 25;
  grid-row: 14 / 15;
}

.team-advisor--four .team-advisor__bio {
  grid-column: 20 / 25;
  grid-row: 15 / 17;
}

.cooperation-brand-card,
.cooperation-statement {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
  justify-self: start;
}

.cooperation-brand-card {
  grid-column: 1 / 21;
  grid-row: 4 / 9;
  width: calc((var(--grid-size) * 20) + var(--grid-stroke));
  height: calc((var(--grid-size) * 5) + var(--grid-stroke));
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cooperation-brand-inner {
  position: relative;
  width: 829.187px;
  height: 178.636px;
}

.cooperation-brand-emblem {
  position: absolute;
  left: 0;
  top: 5.136px;
  width: 170.75px;
  height: 170.73px;
  display: block;
}

.cooperation-brand-line {
  position: absolute;
  left: 213.81px;
  top: 86.946px;
  width: 615.378px;
  height: 7.33px;
  display: block;
}

.cooperation-brand-lab {
  position: absolute;
  left: 218.061px;
  top: 0;
  width: 251.703px;
  height: 74.036px;
  display: block;
}

.cooperation-brand-title {
  position: absolute;
  left: 217.25px;
  top: 106.636px;
  width: 570px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  color: var(--ink);
}

.cooperation-statement {
  grid-column: 2 / 29;
  grid-row: 11 / 14;
  width: calc((var(--grid-size) * 27) + var(--grid-stroke));
  height: calc((var(--grid-size) * 3) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: center;
}

.cooperation-statement__copy {
  width: 1154px;
  height: 100px;
  padding: 0;
  position: relative;
  left: -2px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 48px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: right;
  color: var(--ink);
}

.cooperation-statement__copy span {
  display: block;
  line-height: 1.2;
}

.roadmap-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 calc(var(--grid-size) * 0.3556);
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 64px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: center;
}

.roadmap-card--one {
  grid-column: 1 / 10;
  grid-row: 13 / 17;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  justify-self: start;
}

.roadmap-card--two {
  grid-column: 8 / 14;
  grid-row: 11 / 13;
  width: calc((var(--grid-size) * 6) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  justify-self: start;
}

.roadmap-card--three {
  grid-column: 12 / 19;
  grid-row: 9 / 11;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  justify-self: start;
}

.roadmap-card--four {
  grid-column: 17 / 24;
  grid-row: 5 / 9;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  justify-self: start;
}

.roadmap-card--five {
  grid-column: 22 / 29;
  grid-row: 1 / 5;
  width: calc((var(--grid-size) * 7) + var(--grid-stroke));
  height: calc((var(--grid-size) * 4) + var(--grid-stroke));
  justify-self: start;
}

.roadmap-card span {
  display: block;
}

.site-footer-contact-label,
.site-footer-contact-box,
.site-footer-brand-box,
.site-footer-copyright-box,
.site-footer-icp-box {
  background: var(--surface);
  border: var(--grid-stroke) solid var(--line);
  justify-self: start;
  color: var(--ink);
}

.site-footer-contact-label {
  grid-column: 1 / 5;
  grid-row: 1 / 2;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 0 0 26px;
  font-family: "IBM Plex Sans SC", "IBM Plex Sans", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: normal;
}

.site-footer-contact-label-copy {
  position: relative;
  top: 1px;
}

.site-footer-contact-box {
  grid-column: 1 / 15;
  grid-row: 2 / 4;
  width: calc((var(--grid-size) * 14) + var(--grid-stroke));
  height: calc((var(--grid-size) * 2) + var(--grid-stroke));
  display: flex;
  align-items: center;
}

.site-footer-contact-copy {
  width: 597px;
  height: 45px;
  padding: 0 0 0 21px;
  display: flex;
  align-items: center;
  font-family: "IBM Plex Sans", Arial, sans-serif;
  font-size: 48px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0;
  color: #000000;
}

.site-footer-brand-box {
  grid-column: 1 / 29;
  grid-row: 6 / 14;
  width: calc((var(--grid-size) * 28) + var(--grid-stroke));
  height: calc((var(--grid-size) * 8) + var(--grid-stroke));
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.site-footer-brand-inner {
  position: relative;
  width: 1212px;
  height: 294.811px;
}

.site-footer-brand-left,
.site-footer-brand-orb,
.site-footer-brand-right {
  position: absolute;
  display: block;
}

.site-footer-brand-left {
  left: 0;
  top: 25.919px;
  width: 693.503px;
  height: 268.892px;
}

.site-footer-brand-orb {
  left: 707.803px;
  top: 0;
  width: 167.119px;
  height: 166.66px;
}

.site-footer-brand-right {
  left: 863.501px;
  top: 74.23px;
  width: 348.499px;
  height: 164.093px;
}

.site-footer-copyright-box {
  grid-column: 1 / 10;
  grid-row: 14 / 15;
  width: calc((var(--grid-size) * 9) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  display: flex;
  align-items: center;
}

.site-footer-copyright-copy {
  padding: 0 10px;
  display: flex;
  align-items: center;
  position: relative;
  left: 2px;
  gap: 5px;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
  color: #000000;
}

.site-footer-meta-copy,
.site-footer-meta-rights {
  display: block;
  line-height: 1;
  position: relative;
  top: 1px;
}

.site-footer-meta-brand {
  display: inline-flex;
  align-items: center;
}

.site-footer-meta-brand-logo {
  width: 108.477px;
  height: 13.198px;
  display: block;
  filter: brightness(0);
}

.site-footer-icp-box {
  grid-column: 25 / 29;
  grid-row: 14 / 15;
  width: calc((var(--grid-size) * 4) + var(--grid-stroke));
  height: calc(var(--grid-size) + var(--grid-stroke));
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.site-footer-icp-copy {
  padding: 0 3px;
  display: inline-flex;
  align-items: center;
  position: relative;
  left: 1px;
  top: 1px;
  font-family: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

.site-footer-record-cn {
  font-family: "IBM Plex Sans SC", "Noto Sans SC", sans-serif;
  font-weight: 400;
}

.site-footer-record-no {
  font-family: "IBM Plex Mono", monospace;
  font-weight: 400;
}