
@font-face {
  font-family: "Newsreader";
  src: url("fonts/newsreader-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

@font-face {
  font-family: "Newsreader";
  src: url("fonts/newsreader-variable-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("fonts/manrope-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

:root {
  /* Consolidated 2026-07-28 from 9 separate :root blocks. Custom properties
     cascade like any other declaration, so the last one in source order won
     document-wide regardless of where it sat — merging to the winning value
     is behaviour-identical, verified by full-page pixel diff. */
  --ink: var(--tk-gray-darkest);
  --forest: var(--tk-gray-darker);
  --color-dark-canvas: #08090b;
  --color-dark-surface: #151619;
  --color-dark-text-primary: #f7f6f3;
  --color-dark-text-secondary: #b3b3b5;
  --color-dark-text-muted: #a3a5a8;
  --color-paper-canvas: #f3f2ef;
  --color-paper-surface: #faf9f6;
  --color-light-text-primary: #171719;
  --color-light-text-secondary: #55575b;
  --color-light-text-muted: #696c6a;
  --brand-burgundy: #6c1d2d;
  --brand-rose: #d7a1ac;
  --brand-signal: #c96a7d;
  --brand-focus: #e8b4be;
  --accent-info: #7faaff;
  --accent-positive: #76d887;
  --accent-caution: #d49a73;
  --paper: var(--color-paper-canvas);
  --white: #ffffff;
  --mist: rgba(137, 137, 141, .14);
  --muted: var(--tk-gray);
  --line: rgba(137, 137, 141, .35);
  --line-dark: var(--color-dark-text-muted);
  --aqua: var(--brand-focus);
  --teal: #232323;
  --acid: var(--brand-rose);
  --shell: var(--tk-content);
  --ease: var(--tk-ease-soft);
  --font-neue: "neue", "neue Fallback", -apple-system, BlinkMacSystemFont,
    "Segoe UI", "Helvetica Neue", "Arial Nova", Arial, sans-serif;
  --surface-base: var(--color-dark-canvas);
  --surface-deep: #000000;
  --surface-raised: var(--color-dark-surface);
  --surface-soft: rgba(137, 137, 141, .12);
  --text-primary: var(--color-dark-text-primary);
  --text-secondary: var(--color-dark-text-secondary);
  --border-soft: rgba(255, 255, 255, .14);
  --section-space: var(--space-7);
  --section-space-compact: var(--space-6);
  --radius-pill: 999px;
  --motion-fast: 130ms;
  --motion-standard: 210ms;
  --phi: 1.618;
  --space-1: 8px;
  --space-2: 13px;
  --space-3: 21px;
  --space-4: 34px;
  --space-5: 55px;
  --space-6: 89px;
  --space-7: 144px;
  --motion-slow: 340ms;
  --tk-white: #fff;
  --tk-gray-lightest: var(--color-paper-surface);
  --tk-gray-lighter: #ddd;
  --tk-gray-light: var(--color-dark-text-secondary);
  --tk-gray: var(--color-dark-text-secondary);
  --tk-gray-dark: var(--color-light-text-secondary);
  --tk-gray-darker: var(--color-dark-surface);
  --tk-gray-darkest: var(--color-dark-canvas);
  --tk-black: #000;
  --tk-gray-blue: var(--color-dark-text-secondary);
  --tk-gray-blue-dark: #20232d;
  --tk-green: var(--brand-rose);
  --tk-ease-soft: cubic-bezier(.645, .045, .355, 1);
  --tk-ease-power: cubic-bezier(.25, .46, .45, .94);
  --tk-fast: .17s;
  --tk-normal: .35s;
  --tk-slow: .55s;
  --tk-pad-x: 17.4479vw;
  --tk-content: 65.104vw;
  --tk-header-top: .8333vw;
  --tk-1: clamp(6px, .4167vw, 10px);
  --tk-2: clamp(12px, .8333vw, 20px);
  --tk-3: clamp(18px, 1.4vw, 30px);
  --tk-4: clamp(30px, 2.6vw, 52px);
  --tk-5: clamp(52px, 4.4vw, 88px);
  --tk-fs-h1: clamp(42px, 3.35vw, 72px);
  --tk-fs-h1-sub: clamp(19px, 1.55vw, 32px);
  --tk-fs-h2: clamp(32px, 2.7vw, 58px);
  --tk-fs-h3: clamp(20px, 1.25vw, 27px);
  --tk-fs-h3-sm: clamp(18px, 1.1vw, 23px);
  --tk-fs-lead: clamp(18px, 1.05vw, 22px);
  --tk-fs-body: clamp(16px, .9vw, 18px);
  --tk-fs-small: clamp(13px, .72vw, 15px);
  --tk-violet: var(--brand-rose);
  --tk-amber: var(--brand-rose);
  --tk-steel: var(--brand-rose);
  --tk-rose: var(--brand-rose);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  font-family: "Manrope", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

main {
  padding-top: 0;
}

body.menu-open {
  overflow: hidden;
}

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

img,
svg {
  display: block;
  max-width: 100%;
}

h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}

h1,
h2,
h3 {
  font-family: "Newsreader", serif;
  font-weight: 430;
  letter-spacing: -.05em;
  line-height: .97;
  text-wrap: pretty;
}

h1 {
  font-size: clamp(4.7rem, 7.35vw, 8.5rem);
}

h2 {
  font-size: clamp(3.1rem, 5.2vw, 5.9rem);
}

h3 {
  font-size: clamp(2rem, 3vw, 3.3rem);
}

p,
li {
  text-wrap: pretty;
}

::selection {
  background: var(--acid);
  color: var(--ink);
}

:focus-visible {
  outline: 3px solid var(--aqua);
  outline-offset: 3px;
}

.shell {
  width: var(--shell);
  margin-inline: auto;
}

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1000;
  padding: 10px 14px;
  background: var(--acid);
  transform: translateY(-160%);
}

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

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: 98px;
  pointer-events: none;
  transition:
    opacity 320ms ease,
    transform 420ms var(--ease);
  will-change: transform, opacity;
}

.site-header::before {
  display: none;
}

.site-header.is-hidden {
  opacity: 0;
  transform: translateY(-108%);
}

.header-inner {
  position: relative;
  height: 66px;
  display: flex;
  align-items: center;
  gap: 40px;
  margin-top: 16px;
  padding: 0 12px 0 16px;
  border: 1.5px solid var(--ink);
  border-radius: 999px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 8px 28px rgba(0, 0, 0, .08);
  pointer-events: auto;
  backdrop-filter: blur(16px);
  transition:
    box-shadow 220ms var(--ease),
    background 220ms var(--ease);
}

.site-header.is-scrolled .header-inner {
  background: rgba(255, 255, 255, .985);
  box-shadow: 0 15px 44px rgba(0, 0, 0, .14);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 770;
  letter-spacing: .2em;
}

.logo-crop {
  position: relative;
  width: 46px;
  height: 28px;
  overflow: hidden;
  flex: 0 0 auto;
}

.logo-crop img {
  position: absolute;
  width: 96px;
  height: auto;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  mix-blend-mode: multiply;
}

.primary-nav {
  display: flex;
  gap: 34px;
  margin-left: auto;
}

.primary-nav a {
  position: relative;
  min-height: 48px;
  display: flex;
  align-items: center;
  color: #89898d;
  font-size: 13px;
  font-weight: 610;
}

.primary-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -7px;
  height: 2px;
  background: var(--ink);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms var(--ease);
}

.primary-nav a:hover,
.primary-nav a[aria-current="page"] {
  color: var(--ink);
}

.primary-nav a:hover::after,
.primary-nav a[aria-current="page"]::after {
  transform: scaleX(1);
}

.button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 11px 21px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: var(--white);
  font-size: 13px;
  font-weight: 740;
  border-radius: 999px;
  transition: transform 180ms var(--ease), background 180ms var(--ease), color 180ms var(--ease);
}

.button:hover {
  transform: translateY(-2px);
  background: var(--forest);
}

.button--light {
  border-color: var(--acid);
  background: var(--acid);
  color: var(--ink);
}

.button--light:hover {
  background: var(--aqua);
  color: var(--ink);
}

.text-link {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 22px;
  border-bottom: 1px solid currentColor;
  font-size: 13px;
  font-weight: 740;
}

.text-link span:last-child,
.button span:last-child {
  transition: transform 180ms var(--ease);
}

.text-link:hover span:last-child,
.button:hover span:last-child {
  transform: translate(2px, -2px);
}

.mobile-menu {
  display: none;
  margin-left: auto;
  position: relative;
}

.mobile-menu summary {
  width: 48px;
  height: 48px;
  display: grid;
  place-content: center;
  gap: 7px;
  list-style: none;
  cursor: pointer;
}

.mobile-menu summary::-webkit-details-marker {
  display: none;
}

.mobile-menu summary span {
  width: 24px;
  height: 2px;
  background: var(--ink);
  transition: transform 180ms var(--ease);
}

.mobile-menu[open] summary span:first-child {
  transform: translateY(4.5px) rotate(45deg);
}

.mobile-menu[open] summary span:last-child {
  transform: translateY(-4.5px) rotate(-45deg);
}

.mobile-menu nav {
  position: absolute;
  right: 0;
  top: 58px;
  min-width: 260px;
  padding: 12px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: 0 26px 70px rgba(0, 0, 0, .14);
}

.mobile-menu nav a {
  min-height: 48px;
  display: flex;
  align-items: center;
  padding-inline: 12px;
  font-weight: 650;
}

.mobile-menu nav a[aria-current="page"] {
  background: var(--mist);
}

.section-label {
  margin: 0 0 25px;
  color: #232323;
  font-size: 10px;
  font-weight: 780;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.section-label::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 11px;
  border-radius: 50%;
  background: var(--aqua);
  box-shadow: 0 0 0 4px rgba(137, 137, 141, .17);
}

.home-hero {
  position: relative;
  min-height: calc(100svh - 88px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 86%, rgba(137, 137, 141, .14), transparent 32%),
    radial-gradient(circle at 72% 72%, rgba(35, 35, 35, .08), transparent 24%);
}

.home-hero__inner {
  position: relative;
  flex: 1;
  min-height: 680px;
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  padding-block: 72px 64px;
  isolation: isolate;
}

.home-hero__copy {
  position: relative;
  z-index: 2;
  width: min(100%, 1000px);
  margin-inline: auto;
  text-align: center;
  animation: enter 500ms var(--ease) both;
}

.home-hero h1 {
  margin: 0 auto 26px;
  font-family: var(--font-neue);
  font-size: clamp(5.2rem, 8.2vw, 9.4rem);
  font-style: normal;
  font-weight: 500;
  letter-spacing: -.065em;
  line-height: .92;
}

.home-hero h1 em,
.page-hero h1 em {
  color: var(--teal);
  font-weight: 390;
}

.home-hero h1 em {
  font-style: normal;
  font-weight: 500;
}

.home-hero__declaration {
  max-width: 660px;
  margin: 25px auto 30px;
  font-family: var(--font-neue);
  font-size: 24px;
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.22;
}

.home-hero__declaration strong {
  color: var(--teal);
  font-weight: 500;
}

.hero-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}

.page-hero {
  padding: 126px 0 92px;
}

.page-hero__grid {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  align-items: end;
  gap: 9%;
}

.page-hero h1 {
  max-width: 920px;
  margin-bottom: 0;
}

.page-hero__body {
  max-width: 560px;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 18px;
}

.page-hero__body .button {
  margin-top: 24px;
}

.content-section {
  padding: 138px 0;
}

.page-hero + .content-section {
  padding-top: 48px;
}

.content-section--mist {
  background: var(--mist);
}

.content-section--dark {
  background: var(--ink);
  color: var(--white);
}

.split-heading {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  align-items: end;
  gap: 12%;
}

.split-heading__body {
  max-width: 570px;
  padding-bottom: 8px;
  color: var(--muted);
  font-size: 18px;
}

.split-heading__body strong {
  display: block;
  margin-bottom: 22px;
  color: var(--ink);
  font-family: "Newsreader", serif;
  font-size: 32px;
  font-weight: 430;
  line-height: 1.1;
}

.friction-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 76px;
  border-top: 1px solid var(--line);
}

.friction-grid article {
  min-height: 172px;
  padding: 24px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.friction-grid article:nth-child(3n + 1) {
  padding-left: 0;
}

.friction-grid article:nth-child(3n) {
  border-right: 0;
}

.friction-grid small,
.index-number {
  color: #89898d;
  font-size: 10px;
  font-weight: 760;
  letter-spacing: .1em;
}

.friction-grid p {
  margin: 62px 0 0;
  font-weight: 680;
}

.benefit-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  margin-top: 68px;
  border-block: 1px solid #89898d;
}

.benefit-list li {
  min-height: 150px;
  display: flex;
  align-items: flex-end;
  padding: 22px;
  border-right: 1px solid #89898d;
  color: #ffffff;
  list-style: none;
  font-size: 13px;
}

.benefit-list li:first-child {
  padding-left: 0;
}

.benefit-list li:last-child {
  border-right: 0;
}

.system-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.system-list li {
  min-height: 74px;
  display: flex;
  align-items: center;
  padding: 12px 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  font-weight: 650;
}

.system-list li:nth-child(3n) {
  border-right: 0;
}

.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 48px;
  margin-bottom: 68px;
}

.section-heading p {
  max-width: 440px;
  margin-bottom: 8px;
  color: var(--muted);
}

.solution-list {
  border-top: 1px solid var(--line);
}

.solution-row {
  min-height: 132px;
  display: grid;
  grid-template-columns: 64px 1fr 1fr 28px;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--line);
  transition: padding 180ms var(--ease), background 180ms var(--ease);
}

.solution-row:hover {
  padding-inline: 16px;
  background: rgba(255, 255, 255, .55);
}

.solution-row h3 {
  margin: 0;
  font-family: "Manrope", sans-serif;
  font-size: 20px;
  font-weight: 720;
  letter-spacing: -.02em;
}

.solution-row p {
  margin: 0;
  color: var(--muted);
}

.trust-grid {
  display: grid;
  grid-template-columns: 1.16fr .84fr .84fr;
  gap: 12px;
}

.trust-card {
  min-height: 330px;
  display: flex;
  flex-direction: column;
  padding: 32px;
  background: var(--white);
}

.trust-card--feature {
  background: var(--ink);
  color: var(--white);
}

.trust-card--accent {
  background: var(--acid);
}

.trust-card--wide {
  grid-column: 1 / 4;
  min-height: 260px;
}

.trust-card__label {
  margin-bottom: auto;
  color: inherit;
  font-size: 9px;
  font-weight: 780;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .6;
}

.trust-card h3 {
  margin-bottom: 18px;
  font-size: 34px;
}

.trust-card p {
  margin-bottom: 0;
  opacity: .72;
}

.trust-card ul {
  margin: 18px 0 0;
  padding-left: 18px;
  font-size: 13px;
  opacity: .76;
}

.final-cta {
  padding: 122px 0;
  background: var(--ink);
  color: var(--white);
}

.final-cta__grid {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  align-items: end;
  gap: 10%;
}

.final-cta__copy p {
  color: #89898d;
}

.final-cta__actions {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 26px;
}

.solution-intro {
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: 10%;
}

.solution-intro__body {
  max-width: 720px;
  color: var(--muted);
  font-size: 18px;
}

.solution-intro__body p:first-child {
  color: var(--ink);
  font-family: "Newsreader", serif;
  font-size: 32px;
  line-height: 1.12;
}

.solution-detail-list {
  border-top: 1px solid var(--line);
}

.solution-detail {
  display: grid;
  grid-template-columns: 70px .7fr 1fr;
  gap: 40px;
  padding: 76px 0;
  border-bottom: 1px solid var(--line);
}

.solution-detail__title h2 {
  margin-bottom: 18px;
  font-size: clamp(2.8rem, 4vw, 4.8rem);
}

.solution-detail__title p {
  max-width: 390px;
  font-weight: 720;
}

.solution-detail__body > p {
  color: var(--muted);
}

.feature-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 30px 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.feature-list li {
  padding: 11px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}

.outcome {
  padding: 19px 21px;
  background: var(--mist);
  font-size: 14px;
}

.outcome strong {
  display: block;
  margin-bottom: 5px;
  color: #89898d;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.deployment-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 68px;
  border-top: 1px solid var(--line-dark);
}

.deployment-grid article {
  min-height: 260px;
  padding: 25px;
  border-right: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
}

.deployment-grid article:first-child {
  padding-left: 0;
}

.deployment-grid article:last-child {
  border-right: 0;
}

.deployment-grid h3 {
  margin: 90px 0 16px;
  font-family: "Manrope", sans-serif;
  font-size: 18px;
  font-weight: 720;
  letter-spacing: -.02em;
}

.deployment-grid p {
  color: #89898d;
  font-size: 13px;
}

.mission-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.mission-panel {
  min-height: 430px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 36px;
  background: var(--white);
}

.mission-panel:last-child {
  background: var(--acid);
}

.mission-panel h3 {
  margin-bottom: 22px;
}

.mission-panel p {
  max-width: 560px;
  margin-bottom: 0;
  color: #89898d;
}

.principle-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: #89898d;
  border: 1px solid #89898d;
}

.principle {
  min-height: 320px;
  display: flex;
  flex-direction: column;
  padding: 30px;
  background: var(--paper);
}

.principle h3 {
  margin: auto 0 16px;
  font-family: "Manrope", sans-serif;
  font-size: 20px;
  font-weight: 720;
  letter-spacing: -.02em;
}

.principle p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 14px;
}

.partnership-grid {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 12%;
}

.partnership-grid__body {
  padding-top: 42px;
  color: var(--muted);
  font-size: 18px;
}

.site-footer {
  padding: 78px 0 24px;
  background: #000000;
  color: #89898d;
  border-top: 1px solid #232323;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr .65fr 1fr 1.1fr;
  gap: 50px;
  padding-bottom: 68px;
}

.footer-brand__asset {
  width: 148px;
  height: 86px;
  overflow: hidden;
  background: var(--white);
}

.footer-brand__asset img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.footer-brand h2 {
  margin: 24px 0 15px;
  color: var(--white);
  font-size: 27px;
  line-height: 1.08;
}

.footer-brand p {
  max-width: 390px;
  font-size: 13px;
}

.footer-column {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.footer-label {
  margin-bottom: 13px;
  color: #89898d;
  font-size: 9px;
  font-weight: 780;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.footer-column a,
.footer-column span {
  font-size: 13px;
}

.footer-contact h3 {
  margin: 0 0 20px;
  color: var(--white);
  font-size: 30px;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  padding-top: 20px;
  border-top: 1px solid #232323;
  font-size: 10px;
}

.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 420ms var(--ease), transform 420ms var(--ease);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

@keyframes enter {

  from {
    opacity: 0;
    transform: translateY(22px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes logo-reveal {

  from {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }

  to {
    opacity: 1;
    clip-path: inset(0);
  }
}

@media (max-width: 1024px) {

  :root {
    --shell: min(100% - 48px, 900px);
  }

  .primary-nav,
  .header-inner > .button {
    display: none;
  }

  .mobile-menu {
    display: block;
  }

  .home-hero__inner,
.split-heading,
.page-hero__grid,
.final-cta__grid,
.solution-intro,
.partnership-grid {
    grid-template-columns: 1fr;
    gap: 58px;
  }

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

  .home-hero__inner {
    min-height: 660px;
    gap: 0;
  }

  .page-hero__body {
    max-width: 720px;
  }

  .friction-grid,
  .principle-grid {
    grid-template-columns: 1fr 1fr;
  }

  .friction-grid article:nth-child(3n + 1) {
    padding-left: 24px;
  }

  .friction-grid article:nth-child(3n) {
    border-right: 1px solid var(--line);
  }

  .friction-grid article:nth-child(2n + 1) {
    padding-left: 0;
  }

  .friction-grid article:nth-child(2n) {
    border-right: 0;
  }

  .benefit-list {
    grid-template-columns: repeat(3, 1fr);
  }

  .trust-grid {
    grid-template-columns: 1fr 1fr;
  }

  .trust-card--feature {
    grid-column: 1 / 3;
  }

  .trust-card--wide {
    grid-column: 1 / 3;
  }

  .solution-detail {
    grid-template-columns: 56px 1fr;
  }

  .solution-detail__body {
    grid-column: 2;
  }

  .deployment-grid {
    grid-template-columns: 1fr 1fr;
  }

  .deployment-grid article:first-child {
    padding-left: 25px;
  }

  .deployment-grid article:nth-child(2n) {
    border-right: 0;
  }

  .footer-grid {
    grid-template-columns: 1.4fr 1fr 1fr;
  }

  .footer-contact {
    grid-column: 2 / 4;
  }
}

@media (max-width: 680px) {

  :root {
    --shell: calc(100% - 32px);
  }

  .site-header {
    height: 82px;
  }

  .header-inner {
    height: 58px;
    margin-top: 12px;
    padding-inline: 12px 7px;
    border-radius: 30px;
  }

  main {
    padding-top: 0;
  }

  .brand {
    font-size: 11px;
  }

  .home-hero__inner {
    min-height: 680px;
    padding-block: 66px 92px;
  }

  h1 {
    font-size: clamp(4.15rem, 20.4vw, 5.65rem);
  }

  .home-hero h1 {
    max-width: 520px;
    font-size: clamp(4.25rem, 20vw, 5.75rem);
    line-height: .9;
  }

  h2 {
    font-size: clamp(2.9rem, 14vw, 4.2rem);
  }

  .page-hero__body,
.split-heading__body,
.solution-intro__body,
.partnership-grid__body {
    font-size: 16px;
  }

  .home-hero__declaration {
    font-size: 21px;
  }

  .hero-actions,
  .final-cta__actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
  }

  .home-hero .hero-actions {
    align-items: center;
  }

  .page-hero {
    padding: 84px 0 64px;
  }

  .content-section {
    padding: 88px 0;
  }

  .friction-grid {
    grid-template-columns: 1fr;
    margin-top: 52px;
  }

  .friction-grid article,
  .friction-grid article:nth-child(3n + 1),
  .friction-grid article:nth-child(2n + 1) {
    min-height: 118px;
    padding: 18px 0;
    border-right: 0;
  }

  .friction-grid p {
    margin-top: 27px;
  }

  .benefit-list {
    grid-template-columns: 1fr;
    padding: 0;
  }

  .benefit-list li {
    min-height: 80px;
    padding: 16px 0;
    border-right: 0;
    border-bottom: 1px solid #89898d;
  }

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

  .system-list li:nth-child(3n) {
    border-right: 1px solid var(--line);
  }

  .system-list li:nth-child(2n) {
    border-right: 0;
  }

  .section-heading {
    align-items: flex-start;
    flex-direction: column;
    margin-bottom: 48px;
  }

  .solution-row {
    grid-template-columns: 34px 1fr 24px;
    padding-block: 22px;
    gap: 12px;
  }

  .solution-row p {
    grid-column: 2 / 4;
  }

  .trust-grid,
.mission-grid {
    grid-template-columns: 1fr;
  }

  .trust-card--feature {
    grid-column: auto;
  }

  .trust-card--wide {
    grid-column: auto;
  }

  .trust-card,
  .mission-panel {
    min-height: 290px;
  }

  .solution-detail {
    grid-template-columns: 34px 1fr;
    gap: 18px;
    padding: 52px 0;
  }

  .solution-detail__body {
    grid-column: 2;
  }

  .feature-list,
  .deployment-grid {
    grid-template-columns: 1fr;
  }

  .deployment-grid article,
  .deployment-grid article:first-child {
    min-height: 210px;
    padding: 22px 0;
    border-right: 0;
  }

  .deployment-grid h3 {
    margin-top: 64px;
  }

  .principle-grid {
    grid-template-columns: 1fr;
  }

  .principle {
    min-height: 270px;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 42px 24px;
  }

  .footer-brand,
  .footer-contact {
    grid-column: 1 / 3;
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}

/* ==========================================================================
   Accessible colour system / red-led palette

   Burgundy is reserved for paper surfaces, where it has strong contrast.
   Dark surfaces use the brighter rose family so brand signals remain visible.
   Blue, green and amber remain only in the closing efficiency carousel.
   ========================================================================== */

html {
  accent-color: var(--brand-burgundy);
}

::selection {
  background: var(--brand-signal);
  color: var(--color-dark-canvas);
}

/* Shared navigation and controls */

.primary-nav a {
  color: var(--color-light-text-secondary);
}

.primary-nav a:hover,
.primary-nav a[aria-current="page"] {
  color: var(--color-light-text-primary);
}

.skip-link {
  background: var(--brand-burgundy);
  color: #fff;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline-color: var(--brand-burgundy);
}

.page-home a:focus-visible,
.page-solutions a:focus-visible,
.page-home summary:focus-visible,
.page-solutions summary:focus-visible,
.site-footer a:focus-visible,
.final-cta a:focus-visible,
.content-section--dark a:focus-visible {
  outline-color: var(--brand-focus);
}

/* Preloader */

.site-preloader {
  background:
    radial-gradient(circle at 50% 46%, rgba(201, 106, 125, .2), transparent 38%),
    var(--color-dark-canvas);
  color: var(--color-dark-text-primary);
}

.site-preloader::after {
  border-color: rgba(232, 180, 190, .14);
  box-shadow:
    0 0 0 12vw rgba(201, 106, 125, .035),
    inset 0 0 100px rgba(201, 106, 125, .11);
}

.site-preloader__eyebrow {
  color: var(--brand-focus);
}

.site-preloader__brand {
  color: var(--color-dark-text-primary);
}

.site-preloader__message {
  color: var(--color-dark-text-secondary);
}

.site-preloader__industries::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(201, 106, 125, .08) 20%,
    rgba(232, 180, 190, .2) 50%,
    rgba(201, 106, 125, .08) 80%,
    transparent
  );
}

.site-preloader__industry {
  color: var(--brand-rose);
}

.site-preloader__industry small {
  color: var(--color-dark-text-muted);
}

.site-preloader__industry svg {
  filter: drop-shadow(0 0 10px rgba(232, 180, 190, .16));
}

.site-preloader__progress {
  background: rgba(255, 255, 255, .16);
}

.site-preloader__progress i {
  background: linear-gradient(90deg, var(--brand-signal), var(--brand-focus));
  box-shadow: 0 0 16px rgba(201, 106, 125, .62);
}

@keyframes preloader-icon-breathe {

  0%,
  100% {
    color: var(--brand-rose);
    opacity: .76;
    transform: translateY(0) scale(1);
  }

  50% {
    color: var(--brand-focus);
    opacity: 1;
    transform: translateY(-2px) scale(1.06);
  }
}

/* Dark editorial surfaces */

.page-home,
.page-solutions,
.page-home main,
.page-solutions main {
  background-color: var(--color-dark-canvas);
  color: var(--color-dark-text-primary);
}

.page-home main p,
.page-solutions main p,
.page-home main li,
.page-solutions main li,
.site-footer {
  color: var(--color-dark-text-secondary);
}

.page-home main .section-label,
.page-solutions main .section-label,
.page-home .friction-grid small,
.page-solutions .outcome strong {
  color: var(--brand-rose);
}

.page-home .hero-bridge__region,
.page-solutions .roadmap-flow__statement span + span {
  color: var(--brand-rose);
}

.page-home .hero-bridge__rule {
  background: var(--brand-signal);
}

.page-home .hero-bridge__aside .hero-bridge__sub,
.page-home .hero-bridge__content p.section-label,
.page-solutions .sector-showcase__sub {
  color: var(--color-dark-text-secondary);
}

.site-footer,
.site-footer .footer-label,
.site-footer .footer-bottom {
  color: var(--color-dark-text-muted);
}

.site-footer a,
.site-footer p {
  color: var(--color-dark-text-secondary);
}

/* Solutions: one high-contrast brand signal instead of legacy orange and
   unrelated per-section accent colours. */

.page-solutions .solution-detail,
.page-solutions .solution-detail:nth-child(n),
.page-solutions .platform-category,
.page-solutions .platform-category:nth-child(n),
.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:nth-child(n) {
  --route-accent: var(--brand-rose);
  --icon-accent: var(--brand-signal);
  --deployment-accent: var(--brand-signal);
}

.page-solutions .solution-detail__title .section-label,
.page-solutions .platform-category__icon,
.page-solutions .platform-category h3,
.page-solutions .deployment-card__label,
.page-solutions .roadmap-phase__label em,
.page-solutions .rm-brace::after,
.page-solutions .rm-num::after {
  color: var(--brand-rose);
}

.page-solutions .roadmap-phase__figure {
  background:
    radial-gradient(120% 90% at 86% 8%, rgba(201, 106, 125, .12) 0%, transparent 58%),
    linear-gradient(160deg, rgba(255, 255, 255, .024) 0%, rgba(8, 9, 11, .6) 100%);
}

.page-solutions .roadmap-phase__figure .rm-accent-line,
.page-solutions .roadmap-phase__figure .rm-accent,
.page-solutions .roadmap-phase__figure .rm-bars {
  stroke: var(--brand-rose);
}

.page-solutions .roadmap-phase__figure .rm-accent-dot {
  fill: var(--brand-rose);
}

.page-solutions .roadmap-phase li,
.page-solutions .deployment-grid p,
.page-solutions .solutions-deployment .split-heading__body p {
  color: var(--color-dark-text-secondary);
}

.page-solutions .journey-step__num,
.page-solutions .journey-step ul {
  color: var(--color-dark-text-muted);
}

.page-solutions .journey-step ul li::before {
  color: var(--brand-rose);
}

.page-solutions .journey-step:hover {
  border-color: rgba(215, 161, 172, .48);
}

.page-solutions .sector-pill {
  color: var(--color-dark-text-secondary);
}

.page-solutions .sector-pill:hover {
  border-color: rgba(201, 106, 125, .72);
  background: rgba(201, 106, 125, .16);
  color: var(--color-dark-text-primary);
}

/* Culture: warm paper, graphite hierarchy and burgundy meaning. */

.page-culture {
  --culture-paper: var(--color-paper-canvas);
  --culture-ink: var(--color-light-text-primary);
  --culture-muted: var(--color-light-text-muted);
  --culture-green: var(--brand-burgundy);
  --culture-card: var(--color-paper-surface);
  --culture-card-raised: var(--color-paper-surface);
  background: var(--color-paper-canvas);
  color: var(--color-light-text-primary);
}

.page-culture main,
.page-culture .culture-belief {
  background-color: var(--color-paper-canvas);
}

.page-culture main h1,
.page-culture main h2,
.page-culture main h3,
.page-culture .mission-panel h3,
.page-culture .principle h3,
.page-culture .founder-quote blockquote p {
  color: var(--color-light-text-primary);
}

.page-culture main p,
.page-culture .culture-about .culture-about__copy .split-heading__body p,
.page-culture .mission-panel__content > p:last-child,
.page-culture .principle p {
  color: var(--color-light-text-secondary);
}

.page-culture main .section-label,
.page-culture .mission-panel .section-label,
.page-culture .principle__meta,
.page-culture .founder-quote__eyebrow,
.page-culture .founder-quote blockquote .founder-quote__statement {
  color: var(--brand-burgundy);
}

.page-culture .mission-grid {
  background: rgba(250, 249, 246, .72);
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2) {
  background-color: transparent;
}

.page-culture .principle:hover {
  background: rgba(108, 29, 45, .055);
}

.page-culture .principle:hover h3 {
  color: var(--brand-burgundy);
}

.page-culture .founder-quote figcaption span {
  color: var(--color-light-text-muted);
}

/* The partnership sits on a wine-to-black field, so its typography uses the
   dark-surface hierarchy rather than low-contrast burgundy. */

.page-culture .culture-partnership h2 {
  color: var(--color-dark-text-primary);
}

.page-culture .culture-partnership .section-label {
  color: var(--brand-focus);
}

.page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
  color: var(--color-dark-text-secondary);
}

.page-culture .culture-industry-pills .sector-pill {
  color: var(--color-dark-text-secondary);
  border-color: rgba(255, 255, 255, .18);
}

.page-culture .culture-industry-pills .sector-pill:hover {
  border-color: rgba(232, 180, 190, .58);
  background: rgba(201, 106, 125, .2);
  color: var(--color-dark-text-primary);
}

/* The closing carousel is the only intentionally multicolour component. */

.final-cta__word--fragmented {
  color: var(--accent-positive);
}

.final-cta__word--efficiency {
  color: var(--accent-info);
}

.final-cta__word--decisions {
  color: var(--accent-caution);
}

.header-inner > .button {
  border-color: var(--brand-burgundy);
  background: var(--brand-burgundy);
  color: #fff;
}

.header-inner > .button:hover {
  border-color: #541623;
  background: #541623;
  color: #fff;
}

.page-culture .looking-ahead {
  color: var(--color-dark-text-primary);
}

.page-culture .looking-ahead__sub {
  color: var(--color-dark-text-secondary);
}

.page-solutions .industry-card:hover {
  border-color: var(--brand-signal);
  background: rgba(201, 106, 125, .12);
}

/* Calm cross-page transition for local document navigation */
.page-transition {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: #08090b;
  opacity: 1;
  pointer-events: none;
  transition: opacity 620ms cubic-bezier(.22, 1, .36, 1);
  will-change: opacity;
}

.page-transition.is-ready {
  opacity: 0;
}

.page-transition.is-leaving {
  opacity: 1;
  pointer-events: auto;
  transition-duration: 520ms;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

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

/* First-session industry preloader */
body.is-preloading {
  overflow: hidden;
}

.site-preloader {
  position: fixed;
  inset: 0;
  z-index: 10020;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: clamp(26px, 5vw, 72px);
  background:
    radial-gradient(circle at 50% 46%, rgba(108, 29, 45, .2), transparent 38%),
    #08090b;
  color: #fff;
  opacity: 1;
  visibility: visible;
  transition:
    opacity 1080ms cubic-bezier(.22, 1, .36, 1),
    visibility 1080ms step-end;
}

.site-preloader::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("frost-noise.svg") center / 180px 180px repeat;
  opacity: .11;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.site-preloader::after {
  content: "";
  position: absolute;
  width: min(920px, 88vw);
  aspect-ratio: 1;
  border: 1px solid rgba(232, 180, 190, .09);
  border-radius: 50%;
  box-shadow:
    0 0 0 12vw rgba(108, 29, 45, .025),
    inset 0 0 100px rgba(108, 29, 45, .08);
  opacity: .38;
  transform: scale(.72);
  animation: preloader-field-breathe 4.8s ease-in-out infinite;
  pointer-events: none;
}

.site-preloader__inner {
  position: relative;
  z-index: 1;
  width: min(920px, 100%);
  text-align: center;
  transition:
    transform 1080ms cubic-bezier(.22, 1, .36, 1),
    filter 1080ms cubic-bezier(.22, 1, .36, 1);
}

.site-preloader__eyebrow {
  margin: 0 0 14px;
  color: #e8b4be;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  line-height: 1.2;
  text-transform: uppercase;
  animation: preloader-copy-in 700ms cubic-bezier(.22, 1, .36, 1) both;
}

.site-preloader__brand {
  margin: 0;
  color: #fff;
  font-size: clamp(46px, 6vw, 92px);
  font-weight: 560;
  letter-spacing: -.055em;
  line-height: .9;
  animation: preloader-brand-in 1.25s cubic-bezier(.22, 1, .36, 1) 100ms both;
}

.site-preloader__message {
  margin: clamp(18px, 2vw, 28px) 0 0;
  color: #b3b3b5;
  font-size: clamp(15px, 1.15vw, 19px);
  letter-spacing: -.015em;
  line-height: 1.4;
  animation: preloader-copy-in 760ms cubic-bezier(.22, 1, .36, 1) 150ms both;
}

.site-preloader__industries {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 24px);
  overflow: hidden;
  margin-top: clamp(38px, 5vw, 68px);
  padding-block: clamp(20px, 2.4vw, 30px);
  border-block: 1px solid rgba(255, 255, 255, .055);
}

.site-preloader__industries::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0 auto 0 -28%;
  width: 22%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(108, 29, 45, .06) 20%,
    rgba(232, 180, 190, .16) 50%,
    rgba(108, 29, 45, .06) 80%,
    transparent
  );
  filter: blur(12px);
  transform: skewX(-12deg);
  animation: preloader-industry-scan 5.2s cubic-bezier(.45, 0, .2, 1) 250ms both;
  pointer-events: none;
}

.site-preloader__industry {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 10px;
  min-width: 0;
  color: #d8d8da;
  opacity: 0;
  filter: blur(4px);
  transform: translateY(18px) scale(.92);
  animation: preloader-industry-in 900ms cubic-bezier(.22, 1, .36, 1)
    calc(360ms + var(--preloader-index) * 105ms) both;
}

.site-preloader__industry svg {
  width: clamp(22px, 1.7vw, 28px);
  height: clamp(22px, 1.7vw, 28px);
  stroke-width: 1.45;
  filter: drop-shadow(0 0 10px rgba(232, 180, 190, .1));
  animation: preloader-icon-breathe 2.8s ease-in-out
    calc(1.9s + var(--preloader-index) * 90ms) infinite;
}

.site-preloader__industry small {
  overflow: hidden;
  max-width: 100%;
  color: #89898d;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.2;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.site-preloader__progress {
  position: relative;
  width: min(340px, 60vw);
  height: 1px;
  display: block;
  overflow: hidden;
  margin: clamp(42px, 5vw, 66px) auto 0;
  background: rgba(255, 255, 255, .12);
}

.site-preloader__progress i {
  position: absolute;
  inset: 0;
  background: #6c1d2d;
  box-shadow: 0 0 14px rgba(108, 29, 45, .55);
  transform: scaleX(0);
  transform-origin: left center;
  animation: preloader-progress 5.2s cubic-bezier(.22, 1, .36, 1) both;
}

.site-preloader__progress i::after {
  content: "";
  position: absolute;
  top: -2px;
  right: -1px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #e8b4be;
  box-shadow: 0 0 12px rgba(232, 180, 190, .9);
}

.site-preloader.is-complete {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.site-preloader.is-complete .site-preloader__inner {
  filter: blur(5px);
  transform: translateY(-10px) scale(.985);
}

@keyframes preloader-copy-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes preloader-brand-in {
  from {
    opacity: 0;
    filter: blur(7px);
    letter-spacing: .02em;
    transform: translateY(14px) scale(.97);
  }

  to {
    opacity: 1;
    filter: blur(0);
    letter-spacing: -.055em;
    transform: translateY(0) scale(1);
  }
}

@keyframes preloader-industry-in {
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

@keyframes preloader-icon-breathe {

  0%,
  100% {
    color: #d8d8da;
    opacity: .72;
    transform: translateY(0) scale(1);
  }

  50% {
    color: #e8b4be;
    opacity: 1;
    transform: translateY(-2px) scale(1.06);
  }
}

@keyframes preloader-industry-scan {
  from {
    transform: translateX(0) skewX(-12deg);
  }

  to {
    transform: translateX(610%) skewX(-12deg);
  }
}

@keyframes preloader-field-breathe {

  0%,
  100% {
    opacity: .2;
    transform: scale(.72);
  }

  50% {
    opacity: .46;
    transform: scale(.8);
  }
}

@keyframes preloader-progress {
  to {
    transform: scaleX(1);
  }
}

@media (max-width: 680px) {
  .site-preloader__industries {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px 12px;
    margin-top: 38px;
    padding-block: 22px;
  }

  .site-preloader__industry {
    gap: 0;
  }

  .site-preloader__industry small {
    display: none;
  }

  .site-preloader__progress {
    margin-top: 42px;
  }
}

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

/* Home matrix / calm breathing light
   Opacity-only animation avoids repeated SVG filter recomposition and the
   visible flash caused by the former 0.55-to-2.05 brightness swing. */

.page-home .hero-bridge::before {
  will-change: opacity;
  filter: none;
  animation-name: home-hero-matrix-breathe-soft;
  animation-duration: 8.6s;
  animation-delay: -1.4s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}

@keyframes home-hero-matrix-breathe-soft {

  0%,
  100% {
    opacity: .46;
  }

  50% {
    opacity: .78;
  }
}

@media (prefers-reduced-motion: reduce) {

  .page-home .hero-bridge::before {
    animation: none !important;
    opacity: .62;
    filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {

  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-delay: 0ms !important;
    transition-duration: .01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

/* Infinitas unified polish v0
   Shared visual spine for Home, Solutions and Culture. */

body {
  background: var(--surface-base);
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.65;
}

h1,
h2,
h3 {
  font-family: var(--font-neue);
  font-style: normal;
  font-weight: 500;
}

h1,
h2 {
  letter-spacing: -.06em;
}

h1 {
  font-size: clamp(4.6rem, 7.2vw, 8.25rem);
  line-height: .92;
}

h2 {
  font-size: clamp(3rem, 4.7vw, 5.4rem);
  line-height: .96;
}

h3 {
  letter-spacing: -.035em;
}

h1 em,
h2 em,
h3 em {
  color: var(--text-secondary);
  font-style: normal;
  font-weight: 500;
}

p,
li {
  text-wrap: pretty;
}

a,
button,
summary {
  touch-action: manipulation;
}

.shell {
  width: var(--shell);
}

.site-header {
  height: 88px;
}

.header-inner {
  height: 60px;
  gap: 32px;
  margin-top: 12px;
  padding: 0 10px 0 14px;
  border: 1px solid rgba(8, 9, 11, .8);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 10px 32px rgba(0, 0, 0, .07);
}

.site-header.is-scrolled .header-inner {
  box-shadow: 0 16px 44px rgba(0, 0, 0, .11);
}

.primary-nav {
  gap: 30px;
}

.primary-nav a {
  color: var(--forest);
  font-size: 12px;
  font-weight: 600;
}

.primary-nav a::after {
  bottom: 3px;
  height: 1px;
}

.header-inner > .button {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--white);
}

.header-inner > .button:hover {
  background: var(--forest);
  color: var(--white);
}

.mobile-menu nav a {
  color: var(--ink);
}

.button {
  min-height: 52px;
  gap: 28px;
  padding: 13px 24px;
  border-radius: var(--radius-pill);
  border-color: var(--white);
  background: var(--white);
  color: var(--ink);
  font-size: 13px;
  font-weight: 650;
  transition:
    background var(--motion-fast) var(--ease),
    color var(--motion-fast) var(--ease),
    transform var(--motion-fast) var(--ease);
}

.button:hover {
  background: var(--text-secondary);
  color: var(--ink);
  transform: none;
}

.button:active {
  transform: scale(.98);
}

.button--light {
  border-color: var(--white);
  background: var(--white);
  color: var(--ink);
}

.button--light:hover {
  background: var(--muted);
  color: var(--ink);
}

.text-link {
  min-height: 52px;
  gap: 26px;
  border-bottom-width: 1px;
  font-size: 13px;
  font-weight: 650;
  color: var(--white);
}

.section-label {
  margin-bottom: 24px;
  color: var(--text-secondary);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .14em;
}

.section-label::before {
  display: none;
}

.home-hero {
  min-height: 100svh;
  background:
    radial-gradient(circle at 50% 12%, #232323 0, #08090b 48%, #000000 120%);
}

.home-hero__inner {
  min-height: 760px;
  padding-block: 148px 96px;
}

.home-hero__copy {
  width: min(100%, 1040px);
}

.home-hero h1 {
  margin-bottom: 32px;
  font-size: clamp(5.1rem, 8vw, 9rem);
  line-height: .89;
}

.home-hero__declaration {
  max-width: 700px;
  margin: 28px auto 32px;
  font-family: var(--font-neue);
  font-size: 25px;
  font-weight: 400;
  line-height: 1.24;
}

.home-hero__declaration strong {
  color: var(--white);
  font-weight: 600;
}

.hero-actions {
  gap: 30px;
}

.page-hero {
  padding: 152px 0 104px;
  border-bottom: 1px solid var(--border-soft);
  background:
    radial-gradient(circle at 18% 0, #232323 0, #08090b 42%, #000000 130%);
}

.page-hero__grid {
  grid-template-columns: 1.32fr .68fr;
  gap: 8%;
}

.page-hero h1 {
  max-width: 900px;
}

.page-hero__body {
  max-width: 520px;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.7;
}

.page-hero__body .button {
  margin-top: 28px;
}

.content-section {
  padding: var(--section-space) 0;
}

.page-hero + .content-section {
  padding-top: var(--section-space-compact);
}

.content-section--mist {
  background: var(--surface-soft);
}

.content-section--dark,
.final-cta {
  background: var(--surface-deep);
  color: var(--white);
}

.split-heading,
.solution-intro,
.partnership-grid {
  gap: 10%;
}

.split-heading__body,
.solution-intro__body,
.partnership-grid__body {
  max-width: 680px;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.72;
}

.final-cta__copy p {
  color: var(--text-secondary);
}

.friction-grid,
.benefit-list,
.solution-list,
.system-list,
.solution-detail-list {
  border-color: var(--border-soft);
}

.friction-grid,
.benefit-list {
  margin-top: 64px;
}

.friction-grid article,
.benefit-list li {
  border-color: var(--border-soft);
}

.solution-row {
  padding-block: 28px;
  transition:
    background var(--motion-fast) var(--ease),
    padding-inline var(--motion-fast) var(--ease);
}

.solution-row:hover {
  padding-inline: 16px;
  background: var(--surface-soft);
}

.solution-row h3 {
  font-size: clamp(1.8rem, 2.5vw, 2.8rem);
}

.trust-grid,
.principle-grid {
  gap: 1px;
  border: 1px solid var(--border-soft);
  background: var(--border-soft);
}

.trust-card,
.principle,
.mission-panel {
  background: var(--surface-raised);
  color: var(--white);
}

.trust-card--feature {
  background: var(--surface-deep);
  color: var(--white);
}

.trust-card--accent,
.mission-panel:last-child {
  background: rgba(137, 137, 141, .24);
}

.trust-card,
.principle {
  padding: 32px;
}

.trust-card h3,
.principle h3 {
  font-family: var(--font-neue);
  font-weight: 500;
}

.solution-detail {
  grid-template-columns: 56px .78fr 1fr;
  gap: 44px;
  padding: 64px 0;
  transition: background var(--motion-fast) var(--ease);
}

.solution-detail:hover {
  background: rgba(137, 137, 141, .07);
}

.solution-detail__title h2 {
  font-size: clamp(2.7rem, 3.8vw, 4.4rem);
}

.feature-list {
  margin-block: 28px;
}

.feature-list li {
  min-height: 48px;
  display: flex;
  align-items: center;
}

.outcome {
  padding: 20px 22px;
  background: var(--surface-soft);
  color: var(--white);
}

.principle {
  min-height: 288px;
}

.final-cta {
  padding: var(--section-space-compact) 0;
}

.final-cta__grid {
  gap: 8%;
}

.final-cta__copy p {
  max-width: 680px;
  color: var(--muted);
}

.final-cta__actions {
  gap: 20px;
  margin-top: 28px;
}

.site-footer {
  padding: 72px 0 24px;
  background: var(--black, #000000);
}

.site-footer a {
  transition: color var(--motion-fast) var(--ease);
}

.site-footer a:hover {
  color: var(--white);
}

.footer-grid {
  gap: 40px;
  padding-bottom: 56px;
}

.footer-brand__asset {
  width: 128px;
  height: 72px;
}

.footer-brand h2 {
  font-family: var(--font-neue);
  font-size: 25px;
  font-weight: 500;
}

.footer-column a,
.footer-column span,
.footer-brand p {
  font-size: 12px;
}

.reveal {
  transform: translateY(14px);
  transition:
    opacity 360ms var(--ease),
    transform 360ms var(--ease);
}

:focus-visible {
  outline-color: var(--white);
}

.friction-grid article,
.benefit-list li,
.solution-row,
.system-list li,
.solution-detail,
.feature-list,
.feature-list li,
.deployment-grid,
.deployment-grid article {
  border-color: var(--border-soft);
}

.friction-grid p,
.solution-row p,
.solution-detail__body > p,
.principle p,
.mission-panel p,
.deployment-grid p {
  color: var(--text-secondary);
}

@media (max-width: 1024px) {

  :root {
    --shell: min(100% - 48px, 900px);
  }

  .home-hero__inner {
    min-height: 680px;
    padding-block: 132px 80px;
  }

  .page-hero {
    padding: 136px 0 88px;
  }

  .page-hero__grid,
.split-heading,
.solution-intro,
.partnership-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .page-hero__body {
    max-width: 680px;
  }

  .solution-detail {
    grid-template-columns: 44px 1fr;
    gap: 24px;
  }

  .solution-detail__body {
    grid-column: 2;
  }
}

@media (max-width: 680px) {

  :root {
    --shell: calc(100% - 32px);
    --section-space: 80px;
    --section-space-compact: 64px;
  }

  .site-header {
    height: 78px;
  }

  .header-inner {
    height: 56px;
    margin-top: 10px;
  }

  .home-hero__inner {
    min-height: auto;
    padding-block: 126px 68px;
  }

  .home-hero h1,
  .page-hero h1 {
    font-size: clamp(3.65rem, 17vw, 5rem);
    line-height: .92;
  }

  .page-hero__body,
.split-heading__body,
.solution-intro__body,
.partnership-grid__body {
    font-size: 16px;
  }

  .home-hero__declaration {
    font-size: 21px;
  }

  .home-hero .hero-actions,
  .final-cta__actions {
    width: 100%;
    align-items: stretch;
  }

  .home-hero .button,
  .final-cta__actions .button {
    width: 100%;
  }

  .home-hero .text-link,
  .final-cta__actions .text-link {
    align-self: flex-start;
  }

  .page-hero {
    padding: 124px 0 72px;
  }

  .solution-detail {
    padding: 48px 0;
  }

  .trust-card,
.principle,
.mission-panel {
    min-height: auto;
  }

  .footer-grid {
    gap: 36px 20px;
  }
}

/* Golden-ratio polish
   φ = 1.618; spatial sequence = 8 / 13 / 21 / 34 / 55 / 89 / 144. */

body {
  font-size: 17px;
  line-height: 1.618;
}

h1 {
  font-size: clamp(89px, 8.4vw, 144px);
}

h2 {
  font-size: clamp(55px, 5.4vw, 89px);
}

h3 {
  font-size: clamp(21px, 2.6vw, 34px);
}

.site-header {
  height: 81px;
}

.header-inner {
  width: min(987px, calc(100vw - 110px));
  height: 55px;
  gap: var(--space-4);
  margin-top: var(--space-2);
  padding-inline: var(--space-3) var(--space-2);
}

.primary-nav {
  gap: var(--space-4);
}

.button,
.text-link {
  min-height: 55px;
}

.button {
  gap: var(--space-3);
  padding: var(--space-2) var(--space-3);
}

.text-link {
  gap: var(--space-3);
}

.section-label {
  margin-bottom: var(--space-3);
}

.home-hero__inner {
  min-height: max(720px, calc(100svh - 89px));
  padding-block: var(--space-7) var(--space-6);
}

.home-hero__copy {
  width: min(100%, 987px);
}

.home-hero h1 {
  margin-bottom: var(--space-4);
  font-size: clamp(89px, 8.4vw, 144px);
}

.home-hero__declaration {
  max-width: 610px;
  margin: var(--space-4) auto;
  font-size: 21px;
}

.hero-actions {
  gap: var(--space-4);
}

.page-hero {
  padding-block: var(--space-7) var(--space-6);
}

.page-hero__grid,
.split-heading,
.solution-intro,
.partnership-grid,
.final-cta__grid {
  grid-template-columns: 1.618fr 1fr;
  gap: var(--space-5);
}

.page-hero__body {
  max-width: 466px;
  font-size: 17px;
}

.page-hero__body .button {
  margin-top: var(--space-4);
}

.content-section {
  padding-block: var(--space-7);
}

.page-hero + .content-section,
.final-cta {
  padding-block: var(--space-6);
}

.split-heading__body,
.solution-intro__body,
.partnership-grid__body,
.final-cta__copy p {
  max-width: 610px;
  font-size: 17px;
}

.split-heading__body strong {
  margin-bottom: var(--space-3);
  color: var(--white);
  font-family: var(--font-neue);
  font-size: 34px;
  font-weight: 500;
}

.friction-grid,
.benefit-list {
  margin-top: var(--space-6);
}

.friction-grid article,
.benefit-list li {
  padding: var(--space-3);
}

.friction-grid p {
  margin-top: var(--space-5);
}

.solution-row {
  min-height: 144px;
  gap: var(--space-3);
  padding-block: var(--space-4);
}

.trust-card,
.principle,
.mission-panel {
  padding: var(--space-4);
}

.trust-card,
.principle {
  min-height: 322px;
}

.solution-detail {
  grid-template-columns: 55px 1fr 1.618fr;
  gap: var(--space-4);
  padding-block: var(--space-6);
}

.solution-detail__title h2 {
  margin-bottom: var(--space-3);
  font-size: clamp(34px, 4vw, 55px);
}

.feature-list {
  margin-block: var(--space-4);
}

.feature-list li {
  min-height: 55px;
}

.outcome {
  padding: var(--space-3);
}

.deployment-grid {
  margin-top: var(--space-6);
}

.deployment-grid article {
  min-height: 233px;
  padding: var(--space-3);
}

.deployment-grid h3 {
  margin: var(--space-6) 0 var(--space-3);
}

.mission-grid {
  grid-template-columns: 1fr 1.618fr;
  gap: var(--space-2);
}

.mission-panel {
  min-height: 377px;
}

.final-cta__actions {
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.site-footer {
  padding-block: var(--space-6) var(--space-3);
}

.footer-grid {
  grid-template-columns: 1.618fr .618fr 1fr 1fr;
  gap: var(--space-4);
  padding-bottom: var(--space-5);
}

.footer-brand__asset {
  width: 144px;
  height: 89px;
}

.footer-brand h2 {
  margin-block: var(--space-3) var(--space-2);
  font-size: 21px;
}

.reveal {
  transform: translateY(13px);
  transition:
    opacity var(--motion-slow) var(--ease),
    transform var(--motion-slow) var(--ease);
}

@media (max-width: 1024px) {

  :root {
    --shell: min(100% - 68px, 900px);
    --section-space: var(--space-6);
    --section-space-compact: var(--space-5);
  }

  .header-inner {
    width: min(900px, calc(100% - 68px));
  }

  .home-hero__inner {
    min-height: 610px;
    padding-block: var(--space-7) var(--space-5);
  }

  .page-hero {
    padding-block: 123px var(--space-6);
  }

  .page-hero__grid,
.split-heading,
.solution-intro,
.partnership-grid,
.final-cta__grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .page-hero__body,
.split-heading__body,
.solution-intro__body,
.partnership-grid__body {
    max-width: 610px;
  }

  .solution-detail {
    grid-template-columns: 55px 1fr;
    gap: var(--space-3);
  }

  .footer-grid {
    grid-template-columns: 1.618fr 1fr 1fr;
  }
}

@media (max-width: 680px) {

  :root {
    --shell: calc(100% - 42px);
    --section-space: var(--space-6);
    --section-space-compact: var(--space-5);
  }

  body {
    font-size: 17px;
  }

  h1,
  .home-hero h1,
  .page-hero h1 {
    font-size: clamp(55px, 17vw, 89px);
  }

  h2 {
    font-size: clamp(34px, 12vw, 55px);
  }

  h3 {
    font-size: clamp(21px, 8vw, 34px);
  }

  .site-header {
    height: 81px;
  }

  .header-inner {
    width: calc(100% - 42px);
    height: 55px;
    margin-top: var(--space-2);
    padding-inline: var(--space-2) var(--space-1);
  }

  .home-hero__inner {
    min-height: auto;
    padding-block: 123px var(--space-5);
  }

  .home-hero__declaration {
    margin-block: var(--space-4);
    font-size: 21px;
  }

  .home-hero .hero-actions,
  .final-cta__actions {
    gap: var(--space-2);
  }

  .page-hero {
    padding-block: 123px var(--space-5);
  }

  .content-section {
    padding-block: var(--space-6);
  }

  .page-hero + .content-section,
  .final-cta {
    padding-block: var(--space-5);
  }

  .friction-grid,
.benefit-list,
.deployment-grid {
    margin-top: var(--space-5);
  }

  .trust-card,
.principle,
.mission-panel {
    min-height: auto;
    padding: var(--space-3);
  }

  .deployment-grid article {
    min-height: auto;
  }

  .solution-detail {
    padding-block: var(--space-5);
  }

  .mission-grid,
  .footer-grid {
    grid-template-columns: 1fr;
    gap: var(--space-3);
  }

  .footer-brand,
  .footer-contact {
    grid-column: auto;
  }
}

/* Home hero reference composition */

.home-hero__copy {
  text-align: left;
}

.home-hero h1 {
  max-width: 987px;
  margin: 0 0 var(--space-4);
  font-size: clamp(48px, 4.6vw, 76px);
  font-weight: 600;
  line-height: .95;
}

.home-hero__declaration {
  max-width: 987px;
  margin: 0 0 var(--space-4);
  font-size: clamp(18px, 1.8vw, 28px);
  line-height: 1.18;
  text-align: left;
}

.hero-actions {
  justify-content: flex-start;
  gap: var(--space-2);
}

.home-hero .button,
.home-hero .text-link {
  min-width: 233px;
  padding-inline: var(--space-3);
}

.home-hero .text-link {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-pill);
  background: var(--surface-raised);
}

.home-hero .text-link:hover {
  background: var(--text-secondary);
  color: var(--ink);
}

@media (max-width: 680px) {

  .home-hero h1 {
    font-size: clamp(44px, 13vw, 60px);
  }

  .home-hero__declaration {
    font-size: 18px;
  }

  .home-hero .button,
  .home-hero .text-link {
    min-width: 0;
  }
}

/* Compact navigation proportions */

@media (min-width: 1025px) {

  .site-header {
    height: 76px;
  }

  .header-inner {
    width: min(880px, calc(100vw - 68px));
    height: 52px;
    gap: 26px;
    margin-top: 12px;
    padding: 0 7px 0 16px;
  }

  .primary-nav {
    gap: 26px;
  }

  .header-inner > .button {
    min-height: 40px;
    gap: 16px;
    padding: 9px 16px 9px 18px;
    font-size: 12px;
    white-space: nowrap;
  }
}

/* Off-white home hero */

.home-hero {
  background-color: #f4f3ef;
  background-image: url("home-hero-reference-view-v9.webp");
  background-position: center 35%;
  background-repeat: no-repeat;
  background-size: cover;
  color: var(--ink);
}

.home-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: 0;
  height: 60%;
  background: linear-gradient(
    to bottom,
    rgba(8, 9, 11, 0),
    rgba(8, 9, 11, .18) 28%,
    rgba(8, 9, 11, .72) 70%,
    #08090b 100%
  );
  pointer-events: none;
}

.home-hero__inner {
  position: relative;
  z-index: 1;
}

.home-hero__copy {
  top: 55px;
  left: -34px;
  padding: 21px;
  background: transparent;
  backdrop-filter: none;
}

.home-hero h1,
.home-hero h1 em,
.home-hero__declaration {
  color: var(--ink);
}

.home-hero__declaration strong {
  color: inherit;
  font-weight: 600;
}

.home-hero .button {
  min-width: 170px;
  min-height: 56px;
  padding: 12px 20px;
  border-radius: 18px;
  border-color: var(--ink);
  background: var(--ink);
  color: var(--white);
  font-size: 14px;
}

.home-hero .button:hover {
  background: var(--forest);
  color: var(--white);
}

.home-hero .text-link {
  min-width: 230px;
  min-height: 56px;
  padding: 12px 20px;
  border-radius: 18px;
  border-color: rgba(8, 9, 11, .28);
  background: rgba(255, 255, 255, .94);
  color: var(--ink);
  font-size: 14px;
}

.home-hero .text-link:hover {
  border-color: var(--ink);
  background: var(--white);
  color: var(--ink);
}

@media (max-width: 680px) {

  .home-hero {
    background-position: 54% 31%;
    background-size: auto 118%;
  }

  .home-hero .button,
  .home-hero .text-link {
    min-height: 52px;
    padding: 10px 16px;
    border-radius: 16px;
    font-size: 13px;
  }

  .home-hero__copy {
    top: 34px;
    left: -8px;
    padding-inline: 0;
    background: transparent;
  }
}

/* Navigation logo integration */

.brand {
  gap: 8px;
}

.logo-crop {
  width: 60px;
  height: 36px;
}

.logo-crop img {
  width: 132px;
  filter: grayscale(1) contrast(8);
  mix-blend-mode: multiply;
}

@media (max-width: 680px) {

  .logo-crop {
    width: 54px;
    height: 32px;
  }

  .logo-crop img {
    width: 118px;
  }
}

/* Hero-to-content bridge */

.hero-world {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #f4f3ef;
  background-image: url("home-hero-reference-view-v9.webp");
  background-position: center 52%;
  background-repeat: no-repeat;
  background-size: cover;
}

.hero-world::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(
    to bottom,
    rgba(8, 9, 11, 0) 0%,
    rgba(8, 9, 11, 0) 38%,
    rgba(8, 9, 11, .16) 51%,
    rgba(8, 9, 11, .68) 68%,
    #08090b 82%,
    #08090b 100%
  );
  pointer-events: none;
}

.hero-world .home-hero,
.hero-world .hero-bridge {
  position: relative;
  z-index: 1;
  background-color: transparent;
  background-image: none;
}

.hero-world .home-hero::after {
  display: none;
}

.hero-bridge {
  position: relative;
  margin-top: -1px;
  min-height: 320px;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: var(--white);
}

.hero-bridge::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .76;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='21' viewBox='0 0 17 21'%3E%3Cpath d='M0 10.5H5' fill='none' stroke='%2362C772' stroke-width='1'/%3E%3C/svg%3E");
  background-position: center;
  background-size: 17px 21px;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000000 18%,
    #000000 54%,
    rgba(0, 0, 0, .56) 74%,
    transparent 100%
  );
  pointer-events: none;
}

.hero-bridge__content {
  position: relative;
  z-index: 1;
  text-align: center;
}

.hero-bridge h2 {
  max-width: 1160px;
  margin: 0 auto var(--space-2);
  color: var(--white);
  font-size: clamp(42px, 4.25vw, 68px);
  line-height: .98;
}

.hero-bridge p {
  margin: 0;
  color: var(--text-secondary);
  font-size: clamp(17px, 1.4vw, 21px);
}

@media (max-width: 680px) {

  .hero-world {
    background-position: 54% 46%;
    background-size: auto 118%;
  }

  .hero-world::after {
    background: linear-gradient(
      to bottom,
      rgba(8, 9, 11, 0) 0%,
      rgba(8, 9, 11, .08) 40%,
      rgba(8, 9, 11, .7) 66%,
      #08090b 82%,
      #08090b 100%
    );
  }

  .hero-bridge {
    min-height: 260px;
  }

  .hero-bridge::before {
    inset: 0;
  }

  .hero-bridge h2 {
    font-size: 38px;
  }

  .hero-bridge p {
    font-size: 17px;
  }
}

/* Centred intelligence-gap introduction */

.intelligence-gap .split-heading {
  display: block;
}

.intelligence-gap {
  padding-block: var(--space-5) var(--space-7);
}

.intelligence-gap .split-heading__body {
  max-width: 820px;
  margin: 0 auto;
  color: var(--text-secondary);
  font-size: 18px;
  line-height: 1.7;
  text-align: center;
}

.intelligence-gap .split-heading__body p {
  margin-bottom: var(--space-2);
}

.intelligence-gap .split-heading__body p:last-child {
  margin-bottom: 0;
}

.intelligence-gap .friction-grid {
  max-width: 1100px;
  margin-top: var(--space-5);
  border-color: rgba(255, 255, 255, .18);
}

.intelligence-gap .friction-grid article {
  min-height: 144px;
  padding: var(--space-3) var(--space-4);
  border-color: rgba(255, 255, 255, .18);
  transition: background var(--motion-fast) var(--ease);
}

.intelligence-gap .friction-grid article:hover {
  background: rgba(255, 255, 255, .035);
}

.intelligence-gap .friction-grid small {
  color: var(--brand-rose);
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .12em;
}

.intelligence-gap .friction-grid p {
  margin: var(--space-4) 0 0;
  color: var(--white);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
}

@media (max-width: 680px) {

  .intelligence-gap {
    padding-block: var(--space-5) var(--space-6);
  }

  .intelligence-gap .split-heading__body {
    font-size: 17px;
    text-align: left;
  }

  .intelligence-gap .friction-grid {
    margin-top: var(--space-4);
  }

  .intelligence-gap .friction-grid article {
    min-height: 112px;
    padding: var(--space-3);
  }

  .intelligence-gap .friction-grid p {
    margin-top: var(--space-3);
    font-size: 15px;
  }
}

/* Repeated dash-matrix transition */

.section-dash-divider {
  position: relative;
  min-height: 320px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(to bottom, #08090b, #000000);
}

.section-dash-divider::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .76;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='21' viewBox='0 0 17 21'%3E%3Cpath d='M0 10.5H5' fill='none' stroke='%2362C772' stroke-width='1'/%3E%3C/svg%3E");
  background-position: center;
  background-size: 17px 21px;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000000 24%,
    #000000 58%,
    rgba(0, 0, 0, .52) 76%,
    transparent 100%
  );
}

.section-dash-divider__content {
  position: relative;
  z-index: 1;
  text-align: center;
}

.section-dash-divider h2 {
  max-width: 1160px;
  margin: 0 auto;
  color: var(--white);
  font-size: clamp(42px, 4.25vw, 68px);
  line-height: .98;
}

@media (max-width: 680px) {

  .section-dash-divider {
    min-height: 260px;
  }

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

/* ==========================================================================
   TRUNK SYSTEM ALIGNMENT
   Design system extracted from trunk.io (tokens, fluid vw type scale,
   spacing rhythm, capsule header, dashed-row matrix). Content stays Infinitas.
   Design basis width: 1920px  ->  1vw = 19.2px
   ========================================================================== */

/* --- Surface: one continuous page colour, black footer only --- */

body {
  background: var(--tk-gray-darkest);
  font-family: var(--font-neue);
}

/* --- Container: Trunk's 17.4479vw side padding model --- */

.shell {
  width: min(var(--tk-content), calc(100vw - 2 * var(--tk-2)));
  max-width: none;
}

/* --- Typography: sans throughout, Trunk weights and tracking --- */

h1,
h2,
h3,
h4 {
  font-family: var(--font-neue);
  text-wrap: pretty;
}

h1 {
  font-size: var(--tk-fs-h1);
  font-weight: 700;
  letter-spacing: -1px;
  line-height: .94;
}

h2 {
  font-size: var(--tk-fs-h2);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1;
}

h3 {
  font-size: var(--tk-fs-h3);
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.5;
}

p,
li {
  font-size: var(--tk-fs-body);
  line-height: 1.6;
}

/* Trunk's text colour hierarchy: white heads, #ddd/#c1c5c8 lead, #b3b3b5 body */

.content-section h2,
.content-section h3,
.final-cta h2,
.trust-card h3 {
  color: var(--tk-white);
}

.content-section p,
.content-section li,
.benefit-list li,
.final-cta__copy p,
.system-list li {
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  line-height: 1.6;
}

/* Lead paragraphs keep the 24/300/#c1c5c8 treatment Trunk uses under an H2. */

.final-cta__copy > p:first-child {
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.3;
}

/* Trunk keeps eyebrow labels in normal case at body weight — no small-caps. */

.section-label,
.content-section p.section-label,
.final-cta p.section-label {
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.system-list li {
  font-size: var(--tk-fs-small);
  font-weight: 400;
  letter-spacing: normal;
}

/* --- Header: white capsule, r32, sticky at .8333vw, no shadow --- */

@media (min-width: 1025px) {

  .site-header {
    height: auto;
    padding-top: var(--tk-header-top);
  }

  .header-inner {
    width: min(var(--tk-content), calc(100vw - 2 * var(--tk-3)));
    height: clamp(48px, 3.14vw, 76px);
    gap: clamp(18px, 1.6667vw, 40px);
    margin-top: 0;
    padding: 0 .469vw 0 .573vw;
    /* 9px / 11px @1920 - asymmetric, as Trunk */
    border-radius: 32px;
    box-shadow: none;
    backdrop-filter: none;
  }

  .site-header::before {
    display: none;
  }

  .primary-nav {
    gap: clamp(18px, 1.6667vw, 40px);
  }

  .primary-nav a {
    font-size: clamp(14px, .9375vw, 22px);
    font-weight: 500;
    letter-spacing: normal;
    text-transform: none;
  }

  .header-inner > .button {
    min-height: clamp(36px, 2.29vw, 55px);
    gap: var(--tk-2);
    padding: 0 var(--tk-3);
    border-radius: 32px;
    font-size: clamp(13px, .8333vw, 20px);
    font-weight: 500;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
  }
}

/* --- Hero type: 75/700/-1px over 36/400/-1px --- */

.home-hero h1 {
  max-width: none;
  margin-bottom: var(--tk-3);
  font-size: var(--tk-fs-h1);
  font-weight: 700;
  letter-spacing: -1px;
  line-height: .94;
}

.home-hero h1 em {
  font-style: normal;
  font-weight: 700;
}

.home-hero__declaration {
  max-width: 40ch;
  margin-bottom: var(--tk-4);
  font-size: var(--tk-fs-h1-sub);
  font-weight: 400;
  letter-spacing: -1px;
  line-height: 1.06;
}

.home-hero__declaration strong {
  font-weight: 400;
}

.hero-actions {
  gap: var(--tk-4);
}

/* --- Hero seam: foreground plate overruns the fold, as Trunk does --- */

.hero-world::before {
  content: none;
  position: absolute;
  inset: 0 0 -8vw;
  z-index: 0;
  background-image: none;
  background-position: center 52%;
  background-repeat: no-repeat;
  background-size: cover;
  pointer-events: none;
}

.hero-world::after {
  z-index: 0;
}

/* --- Dashed-row matrix: Trunk's exact pattern --------------------------
   tile 68x20 - path M0 0 L60 0 - stroke-width 4 - dasharray 5,12
   mask fades downward: #000 0% -> 60% at 20% -> transparent 100%
   strip height 186px @1920; content overlaps its lower 110px
   --------------------------------------------------------------------- */

.hero-bridge,
.section-dash-divider {
  min-height: 0;
  display: block;
  padding-top: clamp(48px, 3.958vw, 95px);
  /* 76px @1920 */
  padding-bottom: var(--tk-4);
  place-items: initial;
}

.hero-bridge::before,
.section-dash-divider::before {
  inset: 0 0 auto;
  height: clamp(120px, 9.6875vw, 232px);
  /* 186px @1920 */
  opacity: 1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3E%3Cpath d='M 0 0 L 60 0' fill='none' stroke='%2362C772' stroke-width='4' stroke-dasharray='5,12'/%3E%3C/svg%3E");
  background-position: left top;
  background-size: 68px 20px;
  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    rgba(0, 0, 0, .6) 20%,
    rgba(0, 0, 0, 0) 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0%,
    rgba(0, 0, 0, .6) 20%,
    rgba(0, 0, 0, 0) 100%
  );
}

.hero-bridge h2,
.section-dash-divider h2 {
  max-width: none;
  font-size: var(--tk-fs-h2);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1;
}

.hero-bridge p {
  margin-top: var(--tk-2);
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.3;
}

/* --- Section rhythm: 110px between blocks, 60px inside cards --- */

.content-section {
  padding-block: var(--tk-5);
}

.intelligence-gap {
  padding-block: var(--tk-4) var(--tk-5);
}

.intelligence-gap .split-heading__body {
  max-width: 60ch;
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.3;
}

.intelligence-gap .split-heading__body p {
  margin-bottom: var(--tk-3);
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.intelligence-gap .friction-grid {
  max-width: none;
  margin-top: var(--tk-5);
}

.intelligence-gap .friction-grid article {
  min-height: 0;
  padding: var(--tk-4) var(--tk-3);
}

.intelligence-gap .friction-grid small {
  color: var(--tk-green);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
}

.intelligence-gap .friction-grid p {
  margin-top: var(--tk-1);
  color: var(--tk-white);
  font-size: var(--tk-fs-h3-sm);
  font-weight: 400;
  line-height: 1.5;
}

/* --- Cards / rows: Trunk's 28-700 head over 20-400 body at #b3b3b5 --- */

.trust-card h3,
.solution-row h3 {
  font-size: var(--tk-fs-h3);
  font-weight: 700;
  line-height: 1.5;
}

.trust-card p,
.solution-row p {
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  line-height: 1.6;
}

.trust-card__label,
.footer-label,
.index-number {
  color: var(--tk-green);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
}

/* --- Footer sits on pure black, as Trunk --- */

.site-footer {
  background: var(--tk-black);
}

.site-footer p,
.site-footer a {
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
}

.site-footer a:hover {
  color: var(--tk-white);
}

/* --- Mobile: Trunk drops to 4.26667vw gutters and fixes type in px --- */

@media (max-width: 680px) {

  :root {
    --tk-pad-x: 4.26667vw;
  }

  .shell {
    width: calc(100vw - 2 * var(--tk-pad-x));
  }

  .home-hero h1 {
    font-size: 44px;
    line-height: .96;
  }

  .home-hero__declaration {
    font-size: 20px;
  }

  .hero-actions {
    gap: var(--tk-3);
  }

  .hero-bridge h2,
  .section-dash-divider h2,
  h2 {
    font-size: 34px;
  }

  .hero-bridge,
  .section-dash-divider {
    padding-top: 56px;
    padding-bottom: var(--tk-3);
  }

  .hero-bridge::before,
  .section-dash-divider::before {
    height: 120px;
  }

  .content-section {
    padding-block: var(--tk-4);
  }
}

/* --- Trunk alignment, pass 2: components on Solutions and Culture -------
   Everything below replaces a leftover micro-caps / oversized-serif rule
   with the Trunk equivalent from the same measured scale.
   Hero CTAs are deliberately NOT touched: their geometry was signed off.
   ---------------------------------------------------------------------- */

/* Buttons and text links: 18/500, normal case â€” Trunk sets no small-caps. */

.button,
.text-link {
  font-size: clamp(14px, .9375vw, 22px);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

/* Micro labels become Trunk's 16/500 normal-case eyebrow. */

.outcome strong,
.trust-card__label,
.footer-label,
.index-number {
  color: var(--tk-green);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

/* Section-level H2 anywhere it was still on the old 55px step. */

.solution-detail__title h2,
.content-section h2,
.final-cta h2 {
  font-size: var(--tk-fs-h2);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1;
}

/* Card headings: 28/700 primary, 24/500 secondary. */

.deployment-grid h3,
.content-section article h3,
.principle h3 {
  font-size: var(--tk-fs-h3);
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.5;
}

.mission-panel h4 {
  font-size: var(--tk-fs-h3-sm);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.5;
}

/* Lead paragraphs under a page heading: 24/300 on #c1c5c8. */

.page-hero__body,
.page-hero__body p,
.solution-intro__body,
.solution-intro__body p,
.partnership-grid__body,
.partnership-grid__body p {
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.3;
}

/* Remaining list and card copy sits on the 20/400/#b3b3b5 body step. */

.principle p,
.mission-panel p,
.feature-list li,
.deployment-grid p,
.solution-detail p {
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.6;
}

@media (max-width: 680px) {

  .button,
  .text-link {
    font-size: 14px;
  }

  .page-hero__body,
.page-hero__body p,
.solution-intro__body,
.solution-intro__body p,
.partnership-grid__body,
.partnership-grid__body p {
    font-size: 18px;
  }

  .deployment-grid h3,
.content-section article h3,
.principle h3 {
    font-size: 22px;
  }
}

/* --- Trunk alignment, pass 3: last stragglers ------------------------- */

/* Old first-paragraph emphasis rules outrank the lead selector above. */

.solution-intro__body p:first-child,
.page-hero__body p:first-child,
.partnership-grid__body p:first-child {
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.3;
}

/* Footer typography lands on the same scale as the rest of the page. */

.footer-brand h2 {
  font-size: var(--tk-fs-h3-sm);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.4;
}

.footer-contact h3 {
  font-size: var(--tk-fs-h3);
  font-weight: 700;
  line-height: 1.5;
}

.footer-bottom span {
  color: var(--tk-gray);
  font-size: var(--tk-fs-small);
  letter-spacing: normal;
  text-transform: none;
}

@media (max-width: 680px) {

  .solution-intro__body p:first-child,
.page-hero__body p:first-child,
.partnership-grid__body p:first-child {
    font-size: 18px;
  }
}

/* Page heroes on Solutions and Culture need the same mobile ceiling the
   home hero already has — they were still resolving to ~66px at 375px. */

@media (max-width: 680px) {

  .page-hero h1 {
    font-size: 44px;
    line-height: .96;
  }
}

/* Violet variant of the dashed-row matrix. Same Trunk pattern geometry
   (68x20 tile, dasharray 5,12) with the accent swapped — Trunk themes the
   matrix per section, so a second colour is native to the system.
   Scoped to a modifier so the Culture matrix stays green. */

.section-dash-divider--violet::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3E%3Cpath d='M 0 0 L 60 0' fill='none' stroke='%238869A0' stroke-width='4' stroke-dasharray='5,12'/%3E%3C/svg%3E");
}

/* Hero-bridge matrix moves off the green onto amber. .hero-bridge is unique
   to the home page, so no modifier class is needed here. */

.hero-bridge::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3E%3Cpath d='M 0 0 L 60 0' fill='none' stroke='%23DD8853' stroke-width='4' stroke-dasharray='5,12'/%3E%3C/svg%3E");
}

/* Hero headline sits on exactly two lines, and "Enterprise Intelligence"
   never breaks. That phrase measures 10.51em wide, so the type size has to be
   capped against the container or the nowrap would overflow:
     above 680px the shell is 65.104vw  ->  65.104 / 10.51 = 6.19vw ceiling
     at or below 680px it is 91.47vw    ->  91.47 / 10.51 = 8.70vw ceiling
   Both ceilings are set slightly under the limit to leave room for rounding. */

.home-hero h1 > span,
.home-hero h1 > em {
  display: block;
  white-space: nowrap;
}

.home-hero h1 {
  font-size: min(var(--tk-fs-h1), 6vw);
}

@media (max-width: 680px) {

  .home-hero h1 {
    font-size: min(44px, 8.4vw);
  }
}

/* Hero copy breaks out of the centred shell and sits close to the viewport
   edge. The shell starts at Trunk's 17.4479vw gutter; this pulls the block
   back so its left edge lands at 6vw instead. Hero only — every other
   section keeps the Trunk gutter. */

@media (min-width: 681px) {

  .home-hero__copy {
    left: calc(6vw - 17.4479vw);
  }
}

/* .home-hero__copy was being centred inside .home-hero__inner (987px block in
   a 1237px shell), so the negative offset above was measured from the wrong
   origin. Pin it to the start first, then the 6vw target holds. */

@media (min-width: 681px) {

  .home-hero__copy {
    margin-left: 0;
    margin-right: auto;
    justify-self: start;
  }
}

/* Hero copy: centre-left placement. .home-hero__inner already vertically
   centres its grid content, so the earlier +55px nudge just pushed the block
   off-centre; drop it so the block sits on the true vertical middle while
   staying pinned near the left edge (6vw, set above). */

@media (min-width: 681px) {

  .home-hero__copy {
    top: 0;
  }
}

/* ---- Hero, matched against a fresh measurement of trunk.io ---------------
   Earlier numbers in this file came from the wrong node: Trunk's real CTA is
   <button class="button cta">, not the bare <a> inside it. Measured at 1900px:
     primary   228 x 71, radius 23.75px, #08090b bg, white, 23.75/500
     padding   23.75px 47.5px      gap between the two CTAs  12px
   23.75px is 1.25vw, the same step as the lead paragraph, so the radius and
   label track the type scale rather than sitting on fixed pixels.
   Hero copy sits centre-left: 11.5vw, between Trunk's 18.2vw gutter and the
   6vw edge tried previously.
   ------------------------------------------------------------------------ */

@media (min-width: 681px) {

  .home-hero__copy {
    left: calc(11.5vw - 17.4479vw);
  }

  .hero-actions {
    gap: 12px;
  }

  .home-hero .button,
  .home-hero .text-link {
    min-width: 0;
    min-height: clamp(52px, 3.75vw, 90px);
    padding: 0 clamp(28px, 2.5vw, 60px);
    border-radius: clamp(16px, 1.25vw, 30px);
    font-size: var(--tk-fs-lead);
    font-weight: 500;
    letter-spacing: normal;
  }
}

/* .home-hero__inner centres its grid content but carried asymmetric padding
   (144 top / 89 bottom), which pushed the block below the true middle.
   Equalise so "centre-left" is actually centred. */

@media (min-width: 681px) {

  .home-hero__inner {
    padding-block: var(--tk-5);
  }
}

/* Hero copy shifts back to the right so the whitespace on that side is not
   left stranded. 17.4479vw puts its left edge exactly on the Trunk gutter,
   in line with the nav — which is also where trunk.io's own hero text sits
   (measured at 18.2vw). Supersedes the 11.5vw attempt above. */

@media (min-width: 681px) {

  .home-hero__copy {
    left: 0;
  }
}

/* Hero copy drops below the vertical centre. 5vw keeps the offset on the
   same fluid basis as the rest of the hero, so the drop scales with the
   viewport instead of drifting at large widths. */

@media (min-width: 681px) {

  .home-hero__copy {
    top: 5vw;
  }
}

/* The hard break in the hero declaration is a desktop composition choice
   ("Clear" starts line two, under "Turn"). On mobile the line is far shorter
   than the container, so let it wrap naturally instead. */

@media (max-width: 680px) {

  .home-hero__declaration br {
    display: none;
  }
}

/* ---- The Intelligence Gap: five-step hierarchy ---------------------------
   label -> header -> supporting copy -> list lead-in + six items -> summary.
   Everything stays centred under the centred header. Reading measure is held
   near 62ch: centred running text gets hard to track much past that.
   ------------------------------------------------------------------------ */

/* 1-3. Label and subtitle sit with the header inside the amber matrix. */

.hero-bridge__content .section-label {
  margin-bottom: var(--tk-2);
  color: var(--tk-gray-blue);
}

.hero-bridge__sub {
  margin-top: var(--tk-2);
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.3;
}

/* 4. Supporting copy. */

.intelligence-gap .split-heading__body {
  max-width: 62ch;
}

/* 5. Lead-in belongs to the grid, so it sits tight above it. */

.friction-lead {
  max-width: 62ch;
  margin: 0 auto;
  color: var(--tk-white);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  line-height: 1.6;
  text-align: center;
}

.intelligence-gap .friction-grid {
  margin-top: var(--tk-3);
}

@media (max-width: 680px) {

  .friction-lead {
    text-align: left;
  }
}

/* Specificity fix: `.hero-bridge p` and `.content-section p` are both (0,2,0)
   and were beating the single-class rules above, so the eyebrow rendered at
   lead size and the summary stayed body-grey. */

.hero-bridge__content p.section-label {
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  line-height: 1.6;
}

.intelligence-gap p.friction-lead {
  color: var(--tk-white);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  line-height: 1.6;
}

/* ---- Friction list: solid cards, not a bordered matrix -------------------
   Trunk's own card figure: raised #232323 surface, no rules, real gaps
   between cards, 60px padding. The hairline table read as data; these read
   as six discrete problems.
   ------------------------------------------------------------------------ */

.intelligence-gap .friction-grid {
  gap: var(--tk-2);
  border: 0;
  background: none;
}

.intelligence-gap .friction-grid article {
  min-height: 0;
  padding: var(--tk-4) var(--tk-3);
  border: 0;
  border-radius: clamp(12px, 1.25vw, 30px);
  background: var(--tk-gray-darker);
  transition: background var(--tk-normal) var(--tk-ease-soft);
}

.intelligence-gap .friction-grid article:hover {
  background: #2b2b2b;
}

.intelligence-gap .friction-grid small {
  display: block;
  color: var(--tk-green);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
}

.intelligence-gap .friction-grid p {
  margin: var(--tk-3) 0 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-h3-sm);
  font-weight: 400;
  line-height: 1.35;
}

@media (max-width: 680px) {

  .intelligence-gap .friction-grid {
    gap: 12px;
  }

  .intelligence-gap .friction-grid article {
    padding: var(--tk-3);
    border-radius: 12px;
  }

  .intelligence-gap .friction-grid p {
    margin-top: var(--tk-2);
    font-size: 20px;
  }
}

/* ---- Friction list: two-column editorial list ---------------------------
   Replaces the card grid. No fills, no boxes — two columns of numbered rows
   separated by a single hairline, with the phrase set large enough to read
   as content rather than table data. The last row in each column drops its
   rule so the block ends clean.
   ------------------------------------------------------------------------ */

.intelligence-gap .friction-grid {
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--tk-5);
  row-gap: 0;
  border: 0;
  background: none;
}

.intelligence-gap .friction-grid article {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: var(--tk-3);
  align-items: baseline;
  min-height: 0;
  padding: var(--tk-3) 0;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: none;
  transition: none;
}

.intelligence-gap .friction-grid article:hover {
  background: none;
}

/* Rows 3 and 6 sit at the foot of their column. */

.intelligence-gap .friction-grid article:nth-child(3),
.intelligence-gap .friction-grid article:nth-child(6) {
  border-bottom: 0;
}

.intelligence-gap .friction-grid small {
  display: block;
  color: var(--tk-green);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  font-variant-numeric: tabular-nums;
}

.intelligence-gap .friction-grid p {
  margin: 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-h3);
  font-weight: 400;
  line-height: 1.3;
  text-align: left;
}

@media (max-width: 680px) {

  .intelligence-gap .friction-grid {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .intelligence-gap .friction-grid article {
    column-gap: var(--tk-2);
    padding: var(--tk-2) 0;
  }

  /* Single column: only the very last row loses its rule. */

  .intelligence-gap .friction-grid article:nth-child(3) {
    border-bottom: 1px solid var(--border-soft);
  }

  .intelligence-gap .friction-grid p {
    font-size: 22px;
  }
}

/* Fill column by column (01-03 left, 04-06 right) rather than row by row,
   so the numbering reads down each column as in the chosen layout. */

.intelligence-gap .friction-grid {
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
}

@media (max-width: 680px) {

  .intelligence-gap .friction-grid {
    grid-template-rows: none;
    grid-auto-flow: row;
  }
}

/* The subtitle and the supporting copy are one continuous thought, but they
   were separated by a full section step twice over: 59px below the matrix
   plus 59px above the copy. Tighten both so the gap reads as a paragraph
   break (48px) rather than a section break (119px). */

.hero-bridge {
  padding-bottom: var(--tk-3);
}

.intelligence-gap {
  padding-top: var(--tk-2);
}

@media (max-width: 680px) {

  .hero-bridge {
    padding-bottom: var(--tk-2);
  }

  .intelligence-gap {
    padding-top: var(--tk-2);
  }
}

/* Fix: the foreground plate was being painted twice — once inside the
   .hero-world background stack (1219px tall) and again on ::before (1371px,
   because it overruns the fold by 8vw). Two `cover` fits at different heights
   meant two different scales of the same linework, which showed as ghosted,
   doubled edges on the pipework.
   .hero-world now carries only linework + clouds; the foreground lives solely
   on ::before, which is the layer that has to cross the fold. */

.hero-world {
  background-image: url("home-hero-reference-view-v9.webp");
  background-position: center 52%;
  background-size: cover;
  background-repeat: no-repeat;
}

@media (max-width: 680px) {

  .hero-world {
    background-position: 54% 46%;
    background-size: auto 118%;
  }
}

/* The list lead-in belongs to the list, so it aligns to the list's left edge
   instead of sitting centred above it. Measure stays capped at 62ch; only the
   centring goes, so the line still ends before it gets hard to track. */

.intelligence-gap p.friction-lead {
  max-width: 62ch;
  margin-left: 0;
  margin-right: auto;
  text-align: left;
}

/* Correction: the previous rule set margin-left:0, which cancelled .shell's
   `margin: 0 auto` and threw the lead-in to the viewport edge. The element is
   itself the shell, so it must keep the auto margins; only the text alignment
   changes. Dropping the 62ch cap too — capping the width of a centred shell
   box just re-centres the smaller box, which would break the alignment again.
   The line is a single short list header, so full shell width is correct. */

.intelligence-gap p.friction-lead {
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

/* Supporting copy: left-aligned on the same edge as the lead-in and the list,
   so the whole block reads as one continuous passage instead of two centred
   fragments floating above a full-width list.
   Measure widens 62ch -> 72ch and the line-height opens from 1.3 to 1.45:
   1.3 is a display leading, too tight for two sentences of running text at
   24px. Paragraph gap goes to a full 60px step for air between the thoughts.
   The parent .split-heading is the shell here, so zeroing margin-left on the
   body is safe — it does not cancel any centring. */

.intelligence-gap .split-heading__body {
  max-width: 72ch;
  margin-left: 0;
  margin-right: auto;
  text-align: left;
  line-height: 1.45;
}

.intelligence-gap .split-heading__body p {
  margin-bottom: var(--tk-4);
  line-height: 1.45;
}

.intelligence-gap .split-heading__body p:last-child {
  margin-bottom: 0;
}

/* More room on either side of the passage. */

.intelligence-gap .split-heading {
  margin-bottom: var(--tk-4);
}

@media (max-width: 680px) {

  .intelligence-gap .split-heading__body {
    max-width: none;
  }

  .intelligence-gap .split-heading__body p {
    margin-bottom: var(--tk-3);
  }

  .intelligence-gap .split-heading {
    margin-bottom: var(--tk-3);
  }
}

.intelligence-gap .friction-grid {
  margin-bottom: var(--tk-5);
}

@media (max-width: 680px) {

  .intelligence-gap .friction-grid {
    margin-bottom: var(--tk-4);
  }
}

/* Lift the matrix heading further into the dashed strip. It was starting
   76px down (Trunk's own offset), which left the header sitting below the
   point where the dashes have already faded out. 40px puts it inside the
   live part of the pattern. */

.hero-bridge {
  padding-top: clamp(28px, 2.08vw, 50px);
}

/* Centre the label + header block vertically inside the dashed strip rather
   than nudging it with padding. The content box is given the strip's own
   height and centres its children, so the block stays optically centred at
   any viewport width and however many lines the heading wraps to. */

.hero-bridge {
  padding-top: 0;
}

.hero-bridge__content {
  min-height: clamp(120px, 9.6875vw, 232px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero-bridge__content .section-label {
  margin-top: 0;
}

.hero-bridge__content h2 {
  margin-bottom: 0;
}

@media (max-width: 680px) {

  .hero-bridge__content {
    min-height: 120px;
  }
}

/* Every revealed block was resting 13px below its layout position: three
   generations of `.reveal { transform: translateY(...) }` were declared after
   the single `.reveal.is-visible { transform: none }`, and the settled state
   never returned to zero. Restated last so the finished state actually wins.
   This affects every .reveal element on all three pages, not just the matrix. */

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* ===== Enterprise Intelligence: same treatment as The Intelligence Gap =====
   1. label + header centred vertically inside the violet dashed strip
   2. supporting copy left-aligned on the block edge, 72ch, open leading
   3. benefits move off the hairline strip onto the two-column editorial list
   4. matrix-to-copy gap reduced from a section step to a paragraph step
   ========================================================================= */

/* 1. Heading block centred in the strip, matching .hero-bridge__content. */

.section-dash-divider {
  padding-top: 0;
  padding-bottom: var(--tk-3);
}

.section-dash-divider__content {
  min-height: clamp(120px, 9.6875vw, 232px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.section-dash-divider__content .section-label {
  margin-top: 0;
  margin-bottom: var(--tk-2);
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.section-dash-divider__content h2 {
  margin-bottom: 0;
}

/* 2. Supporting copy: lead size, left edge, open leading. */

#enterprise-intelligence {
  padding-top: var(--tk-2);
}

/* 3. Benefits as a two-column list: no boxes, one hairline per row.
      Five items over three rows fills 1-3 left, 4-5 right. */

#enterprise-intelligence .benefit-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
  column-gap: var(--tk-5);
  row-gap: 0;
  margin-top: var(--tk-5);
  padding: 0;
  border: 0;
  background: none;
  list-style: none;
}

#enterprise-intelligence .benefit-list li {
  min-height: 0;
  display: block;
  padding: var(--tk-3) 0;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  color: var(--tk-white);
  font-size: var(--tk-fs-h3);
  font-weight: 400;
  line-height: 1.3;
  text-align: left;
}

/* Foot of each column: item 3 ends the left column, item 5 the right. */

#enterprise-intelligence .benefit-list li:nth-child(3),
#enterprise-intelligence .benefit-list li:nth-child(5) {
  border-bottom: 0;
}

@media (max-width: 680px) {

  .section-dash-divider__content {
    min-height: 120px;
  }

  #enterprise-intelligence .benefit-list {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
    column-gap: 0;
    margin-top: var(--tk-4);
  }

  #enterprise-intelligence .benefit-list li {
    padding: var(--tk-2) 0;
    font-size: 22px;
  }

  /* Single column: only the final item loses its rule. */

  #enterprise-intelligence .benefit-list li:nth-child(3) {
    border-bottom: 1px solid var(--border-soft);
  }
}

/* "This gives teams:" introduces the benefit list, so it takes the same
   treatment as "This creates:" in the section above — white body text on the
   block's left edge, sitting tight against the list it leads into. */

#enterprise-intelligence p.benefit-lead {
  max-width: none;
  margin: var(--tk-4) auto 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
}

#enterprise-intelligence .benefit-list {
  margin-top: var(--tk-3);
}

@media (max-width: 680px) {

  #enterprise-intelligence p.benefit-lead {
    margin-top: var(--tk-3);
  }

  #enterprise-intelligence .benefit-list {
    margin-top: var(--tk-2);
  }
}

/* The row numbers take the colour of the matrix that introduces them, so the
   list reads as belonging to the amber "Intelligence Gap" block rather than
   carrying an unrelated accent. --tk-amber is the same #DD8853 used by
   .hero-bridge::before. */

.intelligence-gap .friction-grid small {
  color: var(--tk-amber);
}

/* Numbered rows for the benefit list, matching the friction list's structure.
   The numbers are generated with a CSS counter rather than hard-coded markup,
   so they renumber themselves if an item is ever added or removed.
   Colour follows the violet matrix that introduces this section, the same way
   the friction numbers follow the amber one. */

#enterprise-intelligence .benefit-list {
  counter-reset: benefit;
}

#enterprise-intelligence .benefit-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: var(--tk-3);
  align-items: baseline;
  counter-increment: benefit;
}

#enterprise-intelligence .benefit-list li::before {
  content: counter(benefit, decimal-leading-zero);
  color: var(--tk-violet);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: inherit;
}

@media (max-width: 680px) {

  #enterprise-intelligence .benefit-list li {
    column-gap: var(--tk-2);
  }
}

/* ===== Platform Overview: same treatment as the two sections above ========
   Was a two-column grid (heading left, boxed table right). Now stacked and
   left-aligned on the same 324px baseline as everything else.
   Third accent, #5F8A9B, is a placeholder chosen to sit between the amber and
   the violet in saturation and value — swap it if you want a specific tone.
   ========================================================================= */

.section-dash-divider--steel::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3E%3Cpath d='M 0 0 L 60 0' fill='none' stroke='%235F8A9B' stroke-width='4' stroke-dasharray='5,12'/%3E%3C/svg%3E");
}

#platform {
  padding-top: var(--tk-2);
}

/* Eleven systems over two columns: 01-06 left, 07-11 right. */

#platform .system-list {
  counter-reset: system;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(6, auto);
  grid-auto-flow: column;
  column-gap: var(--tk-5);
  row-gap: 0;
  margin-top: var(--tk-5);
  padding: 0;
  border: 0;
  background: none;
  list-style: none;
}

#platform .system-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: var(--tk-3);
  align-items: baseline;
  counter-increment: system;
  min-height: 0;
  padding: var(--tk-3) 0;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: none;
  color: var(--tk-white);
  font-size: var(--tk-fs-h3);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.3;
  text-align: left;
}

#platform .system-list li::before {
  content: counter(system, decimal-leading-zero);
  color: var(--tk-steel);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* Foot of each column: item 6 ends the left column, item 11 the right. */

#platform .system-list li:nth-child(6),
#platform .system-list li:nth-child(11) {
  border-bottom: 0;
}

@media (max-width: 680px) {

  #platform .system-list {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
    column-gap: 0;
    margin-top: var(--tk-4);
  }

  #platform .system-list li {
    column-gap: var(--tk-2);
    padding: var(--tk-2) 0;
    font-size: 22px;
  }

  /* Single column: only the final item loses its rule. */

  #platform .system-list li:nth-child(6) {
    border-bottom: 1px solid var(--border-soft);
  }
}

/* An older `.system-list { margin: 0 }` zeroed the inline auto margins that
   .shell relies on to centre, so the list was rendering full-bleed from x=0
   while the copy above it sat on the 324px baseline. Restore the centring. */

#platform .system-list {
  margin-inline: auto;
}

/* ===== Core Capabilities: same treatment ================================
   The rows here carry a title, a description and a link arrow, so unlike the
   earlier lists they stay single-column full-width — the descriptions need
   the measure. Everything else matches: hairline rows, no boxes, numbers in
   the matrix accent, 324px baseline.
   Accent reuses the brand green #62C772 rather than inventing a fourth hue;
   it was left unused on this page once the two matrices above were recoloured.
   ======================================================================== */

.section-dash-divider--green::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3E%3Cpath d='M 0 0 L 60 0' fill='none' stroke='%2362C772' stroke-width='4' stroke-dasharray='5,12'/%3E%3C/svg%3E");
}

#capabilities {
  padding-top: var(--tk-2);
}

#capabilities .solution-list {
  border: 0;
  background: none;
}

#capabilities .solution-row {
  display: grid;
  grid-template-columns: auto minmax(0, 22ch) minmax(0, 1fr) auto;
  column-gap: var(--tk-3);
  align-items: baseline;
  padding: var(--tk-3) 0;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: none;
  transition: opacity var(--tk-fast) var(--tk-ease-soft);
}

#capabilities .solution-row:last-child {
  border-bottom: 0;
}

#capabilities .solution-row:hover {
  background: none;
  opacity: .72;
}

#capabilities .solution-row .index-number {
  color: var(--tk-green);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  font-variant-numeric: tabular-nums;
}

#capabilities .solution-row h3 {
  margin: 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-h3);
  font-weight: 400;
  line-height: 1.3;
}

#capabilities .solution-row p {
  margin: 0;
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  line-height: 1.5;
}

#capabilities .solution-row > span {
  color: var(--tk-gray);
  font-size: var(--tk-fs-body);
}

.capabilities-outro {
  margin: var(--tk-5) 0 0;
}

@media (max-width: 680px) {

  #capabilities .solution-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
    row-gap: var(--tk-2);
    column-gap: var(--tk-2);
    padding: var(--tk-3) 0;
  }

  /* Description drops under the title, spanning the two content columns. */

  #capabilities .solution-row p {
    grid-column: 2 / 4;
  }

  #capabilities .solution-row h3 {
    font-size: 22px;
  }

  .capabilities-outro {
    margin-top: var(--tk-4);
  }
}

/* ===== Why Infinitas: same treatment ====================================
   Was a four-card grid with panel fills. Now hairline rows on the shared
   324px baseline like every other section on this page.

   These rows carry more than the earlier lists — an eyebrow, a title, body
   copy and in two cases a sub-list — so the row splits into a title column
   and a body column rather than collapsing to one line.

   Fifth accent, #A8708A, is a placeholder like the steel one: distinct from
   the amber, violet, steel and green already in use. Swap when you pick it.
   ======================================================================== */

.section-dash-divider--rose::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3E%3Cpath d='M 0 0 L 60 0' fill='none' stroke='%23A8708A' stroke-width='4' stroke-dasharray='5,12'/%3E%3C/svg%3E");
}

#trust {
  padding-top: var(--tk-2);
}

/* Rows, not cards. */

#trust .trust-grid {
  counter-reset: trust;
  display: block;
  margin-top: var(--tk-5);
  padding: 0;
  border: 0;
  background: none;
}

#trust .trust-card {
  counter-increment: trust;
  display: grid;
  grid-template-columns: auto minmax(0, 26ch) minmax(0, 1fr);
  column-gap: var(--tk-3);
  row-gap: var(--tk-1);
  min-height: 0;
  padding: var(--tk-4) 0;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: none;
}

#trust .trust-card:last-child {
  border-bottom: 0;
}

#trust .trust-card::before {
  content: counter(trust, decimal-leading-zero);
  grid-row: 1 / span 2;
  color: var(--tk-rose);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  line-height: 1.6;
}

#trust .trust-card__label {
  grid-column: 2;
  grid-row: 1;
  color: var(--tk-rose);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

#trust .trust-card h3 {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-h3);
  font-weight: 400;
  line-height: 1.3;
}

/* The one heading that carries a hard break was set for a narrow card. */

#trust .trust-card h3 br {
  display: none;
}

#trust .trust-card p {
  grid-column: 3;
  grid-row: 1 / span 2;
  margin: 0;
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  line-height: 1.5;
}

/* Sub-lists run inline under the body copy, separated by middots, so a row
   with five sub-items stays the same height as one without. */

#trust .trust-card ul {
  grid-column: 3;
  grid-row: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--tk-2);
  margin: var(--tk-2) 0 0;
  padding: 0;
  list-style: none;
}

#trust .trust-card li {
  position: relative;
  color: var(--tk-gray);
  font-size: var(--tk-fs-small);
  font-weight: 400;
  line-height: 1.6;
}

#trust .trust-card li + li::before {
  content: "·";
  position: absolute;
  left: calc(-1 * var(--tk-2) / 2 - .2em);
  color: var(--tk-gray-dark);
}

@media (max-width: 680px) {

  #trust .trust-grid {
    margin-top: var(--tk-4);
  }

  #trust .trust-card {
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: var(--tk-2);
    padding: var(--tk-3) 0;
  }

  #trust .trust-card p {
    grid-column: 2;
    grid-row: 3;
    margin-top: var(--tk-2);
  }

  #trust .trust-card ul {
    grid-column: 2;
    grid-row: 4;
  }

  #trust .trust-card h3 {
    font-size: 22px;
  }
}

/* ===== Final CTA ==========================================================
   Was a two-column split: heading left, copy and buttons right. Now stacked
   on the same 324px baseline as the rest of the page.

   Deliberately keeps no dashed matrix. The page already closes on the rose
   matrix and the trust rows immediately above; a sixth strip here would make
   the closing block read as one more content section rather than the exit.

   The buttons were wrapping inside their pills ("Schedule a / Consultation"),
   so both get nowrap and sized padding instead of a min-width.
   ========================================================================= */

.final-cta {
  padding-block: var(--tk-5);
}

.final-cta__grid {
  display: block;
}

.final-cta p.section-label {
  margin-bottom: var(--tk-2);
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.final-cta h2 {
  max-width: 20ch;
  margin: 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-h2);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1;
}

.final-cta p.final-cta__copy {
  max-width: 60ch;
  margin: var(--tk-4) 0 0;
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.45;
  text-align: left;
}

.final-cta__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--tk-3);
  margin-top: var(--tk-4);
}

/* Labels stay on one line; the pill sizes to its text. */

.final-cta__actions .button,
.final-cta__actions .text-link {
  min-width: 0;
  height: auto;
  min-height: clamp(44px, 2.9vw, 70px);
  padding: 0 var(--tk-3);
  gap: var(--tk-2);
  border-radius: 999px;
  font-size: clamp(14px, .9375vw, 22px);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
}

.final-cta__actions .text-link {
  border: 1px solid var(--border-soft);
  background: none;
  color: var(--tk-white);
}

.final-cta__actions .text-link:hover {
  border-color: var(--tk-white);
  background: none;
  color: var(--tk-white);
}

@media (max-width: 680px) {

  .final-cta {
    padding-block: var(--tk-4);
  }

  .final-cta h2 {
    max-width: none;
    font-size: 34px;
  }

  .final-cta p.final-cta__copy {
    max-width: none;
    margin-top: var(--tk-3);
    font-size: 18px;
  }

  .final-cta__actions {
    gap: var(--tk-2);
    margin-top: var(--tk-3);
  }

  .final-cta__actions .button,
  .final-cta__actions .text-link {
    justify-content: space-between;
    width: 100%;
    font-size: 14px;
  }
}

/* ===== Final CTA, centred composition ====================================
   Reworked to the reference arrangement: one centred statement, headline in
   white with the follow-on line beneath it in an accent, buttons centred
   under both. This is the only centred block on the page — everything else
   sits on the 324px left baseline — which is what makes the closing moment
   read as an exit rather than another content section.

   The accent is amber, the same #DD8853 as the first matrix. Nothing ties
   the CTA to a particular section, so it reuses the page's opening accent to
   bookend rather than introducing a sixth colour.
   ========================================================================= */

.final-cta__grid {
  max-width: none;
  text-align: center;
}

.final-cta h2 {
  max-width: 22ch;
  margin: 0 auto;
  color: var(--tk-white);
  font-size: var(--tk-fs-h2);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.05;
}

/* Follow-on line: part of the same statement, so it keeps display scale
   rather than dropping to body copy. */

.final-cta p.final-cta__copy {
  max-width: 26ch;
  margin: var(--tk-2) auto 0;
  color: var(--tk-amber);
  font-size: var(--tk-fs-h1-sub);
  font-weight: 500;
  letter-spacing: -1px;
  line-height: 1.1;
  text-align: center;
}

.final-cta__actions {
  justify-content: center;
  margin-top: var(--tk-4);
}

@media (max-width: 680px) {

  .final-cta h2 {
    max-width: none;
    font-size: 34px;
  }

  .final-cta p.final-cta__copy {
    max-width: none;
    margin-top: var(--tk-2);
    font-size: 22px;
  }

  .final-cta__actions {
    margin-top: var(--tk-3);
  }
}

/* ===== Final CTA: line-art landscape =====================================
   The reference closes on a drawn mountain range along the bottom edge.
   That range already exists inside trunk-hero-linework.png — the same file
   the hero uses — so this reuses an asset we hold rather than pulling in a
   new one. The existing licensing caveat on the hero artwork applies here
   too; it does not add a second one.

   The source is dark linework on a light ground, which is the inverse of
   what this section needs, so it is flipped with filter: invert(1). White
   lines on black is what comes out.

   --cta-art-y is the single knob: it slides the artwork vertically to frame
   the mountain band against the section's bottom edge. Raise it to bring
   higher parts of the drawing into view, lower it for the foreground.
   ========================================================================= */

.final-cta {
  --cta-art-y: 46%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.final-cta::before {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: -1;
  height: 78%;
  background-image: url("trunk-hero-linework.webp");
  background-position: center var(--cta-art-y);
  background-repeat: no-repeat;
  background-size: cover;
  filter: invert(1) grayscale(1) contrast(1.25);
  opacity: .38;
  pointer-events: none;
  /* Fade the top so the drawing rises out of the flat background instead of
     starting on a hard edge, and ease it off at the very bottom. */
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .35) 28%,
    #000 62%,
    #000 94%,
    rgba(0, 0, 0, .7) 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .35) 28%,
    #000 62%,
    #000 94%,
    rgba(0, 0, 0, .7) 100%
  );
}

/* Give the composition room to breathe above the horizon line. */

.final-cta__grid {
  position: relative;
  z-index: 1;
  padding-bottom: var(--tk-5);
}

@media (max-width: 680px) {

  .final-cta {
    --cta-art-y: 44%;
  }

  .final-cta::before {
    height: 60%;
    opacity: .3;
  }

  .final-cta__grid {
    padding-bottom: var(--tk-4);
  }
}

/* !!! PLACEHOLDER ARTWORK — NOT FINAL !!! -------------------------------
   The landscape behind the final CTA is derived from trunk-hero-linework.png
   by inversion. It stands in for a dedicated mountain illustration that does
   not exist yet.

   It is NOT the reference artwork. Trunk's closing CTA uses a separate
   illustration of its own; that file is not held here and must not be copied
   onto a commercial site.

   To swap in the real asset, change the one declaration below. Nothing else
   in this block needs touching — sizing, inversion, mask and framing knob all
   carry over. If the replacement is already light-on-dark, drop the invert()
   from the filter on .final-cta::before.

   Required spec, see HANDOFF section 11.
   --------------------------------------------------------------------- */

.final-cta::before {
  background-image: url("trunk-hero-linework.webp");
  /* <- replace */;
}

/* Ridge framing, measured rather than guessed. Sampling the source at 300px
   wide gives ink density per row: near zero above 16%, a sharp jump at 60.3%
   (the horizon edge) and the densest band at 60-64%. The previous 46% sat in
   the quiet stretch between features, which is why cliff faces showed instead
   of the ridge line. */

.final-cta {
  --cta-art-y: 62%;
}

@media (max-width: 680px) {

  .final-cta {
    --cta-art-y: 62%;
  }
}

/* ===== Footer ============================================================
   Seamless join first: the footer was pure black against the page's #08090b,
   which drew a hard horizontal band right where the CTA artwork was cut off.
   Both now share the page colour, so the artwork fades out rather than
   stopping at an edge.

   Layout follows the reference: an isolated mark on the left, then link
   columns under plain white headings, then the closing block on the right.
   ========================================================================= */

.site-footer {
  position: relative;
  background: var(--tk-gray-darkest);
  padding-block: var(--tk-5) var(--tk-4);
}

.site-footer .footer-grid {
  display: grid;
  grid-template-columns: auto repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr);
  gap: var(--tk-3) var(--tk-4);
  align-items: start;
}

.footer-brand {
  display: block;
  max-width: none;
  margin: 0;
  padding-right: var(--tk-3);
}

.footer-brand__asset {
  width: clamp(48px, 3.2vw, 76px);
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
}

.footer-brand__asset img {
  width: 100%;
  height: auto;
  filter: grayscale(1) brightness(3) contrast(2);
  mix-blend-mode: screen;
}

/* Column headings: plain white at body weight, not green micro-caps. */

.site-footer .footer-label {
  margin: 0 0 var(--tk-3);
  color: var(--tk-white);
  font-size: var(--tk-fs-body);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.footer-column {
  display: flex;
  flex-direction: column;
  gap: var(--tk-2);
}

.site-footer .footer-column a {
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  line-height: 1.4;
  transition: color var(--tk-fast) var(--tk-ease-soft);
}

.site-footer .footer-column a:hover {
  color: var(--tk-white);
}

/* Closing block. */

.footer-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--tk-2);
}

.footer-contact h3 {
  margin: 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-h3-sm);
  font-weight: 500;
  line-height: 1.3;
}

.site-footer .footer-contact p {
  margin: 0;
  max-width: 40ch;
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-small);
  line-height: 1.6;
}

.site-footer .footer-contact .text-link {
  margin-top: var(--tk-2);
  padding: 0;
  border: 0;
  color: var(--tk-white);
  font-size: var(--tk-fs-body);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.site-footer .footer-contact .text-link:hover {
  background: none;
  color: var(--tk-gray-light);
}

/* Bottom line. */

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--tk-2);
  margin-top: var(--tk-5);
  padding-top: var(--tk-3);
  border-top: 1px solid var(--border-soft);
}

.site-footer .footer-bottom span {
  color: var(--tk-gray);
  font-size: var(--tk-fs-small);
  letter-spacing: normal;
  text-transform: none;
}

@media (max-width: 1024px) {

  .site-footer .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--tk-4) var(--tk-3);
  }

  .footer-brand,
  .footer-contact {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {

  .site-footer {
    padding-block: var(--tk-4) var(--tk-3);
  }

  .site-footer .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-bottom {
    margin-top: var(--tk-4);
  }
}

/* The CTA was still sitting on pure black between two #08090b neighbours,
   so fixing the footer only moved the seam rather than removing it. The whole
   tail of the page — last content section, CTA, footer — now shares one
   colour, and the artwork is the only thing that changes across it. */

.final-cta {
  background: var(--tk-gray-darkest);
}

/* Ridge framing, corrected.

   The earlier 62% was read off ink density alone, which pointed at the
   densest band — but that band is the foreground rock face, not a horizon.
   Re-sampling with horizontal coverage as well as density separates them:

     14-18%   ink 0      cover 0      sky, empty
     19%      ink 0.013  cover 0.04   first peaks
     20%      ink 0.118  cover 0.37   ridge, widest span
     21-22%   ink 0.10   cover 0.26
     54-64%   ink 0.11   cover 0.30   foreground rock, not a horizon

   A distant ridge is a wide thin outline with nothing above it. Density alone
   cannot tell that apart from a dense object; coverage can.

   With cover sizing the scaled image runs ~1881px against a ~594px strip, so
   0% shows the top 31.6% of the drawing and puts the 19-24% ridge band at
   roughly 60-76% down the strip — sky above it, ground below. */

.final-cta {
  --cta-art-y: 0%;
}

@media (max-width: 680px) {

  .final-cta {
    --cta-art-y: 0%;
  }
}

/* Zoom the framing onto the ridge.

   With cover sizing the strip showed the top 31.6% of the drawing, so the
   19-24% ridge band was only about a sixth of what was on screen and the rest
   was empty plain. The ridge was present but not the subject.

   Sizing to 625% of the strip height scales the drawing to ~3712px against a
   594px strip, so the visible window narrows to roughly 14-30% of the image:
   a little sky, the ridge, a little ground. The ridge then sits across the
   middle of the strip instead of clinging to the top edge.

   Horizontal overflow is expected and fine — the ridge runs the full width of
   the source, so a centre crop still reads as a range.

   Opacity also lifts from .38, which was too faint to register against the
   background at this size. */

.final-cta::before {
  background-size: auto 625%;
  background-position: center 16.7%;
  opacity: .72;
  filter: invert(1) grayscale(1) contrast(1.62) brightness(1.24);
}

@media (max-width: 680px) {

  .final-cta::before {
    background-size: auto 420%;
    background-position: center 18%;
    opacity: .6;
  }
}

/* Crop the ground away.

   The window was showing 14-30% of the drawing, and everything past the 24%
   ridge line is open plain — scattered debris and a piece of pipework. Those
   were the only things left with any weight once the ridge was in frame, so
   they read as the subject.

   Solving for the ridge base landing on the strip's bottom edge:

     0.24 x 3712 + (594 - 3712) x P = 594   ->   P = 9.5%

   gives a window of 8-24%: sky, then the ridge, ending exactly where the
   strip does. Nothing below the ridge line is in frame at all, so it cannot
   show through however the mask is tuned.

   The ridge lands in the bottom 31% of the strip, sitting on the section's
   own bottom edge the way the reference does. */

.final-cta::before {
  background-position: center 9.5%;
}

@media (max-width: 680px) {

  .final-cta::before {
    background-size: auto 625%;
    background-position: center 9.5%;
  }
}

/* The page colour was only ever set on body and propagated to the canvas,
   leaving html itself transparent. That propagation does not cover the
   overscroll area on every engine, so rubber-banding past the footer — or any
   paint that resolves the canvas before body's background applies — can flash
   the default white through underneath.

   Setting it on html as well makes the colour unconditional. The two must
   stay in step; if one changes, change both. */

html {
  background: var(--tk-gray-darkest);
}

/* Belt and braces on the join itself: the footer is the last painted box, so
   it carries the colour to the bottom of the document regardless of how far
   the viewport runs past it. */

body,
.site-footer {
  background-color: var(--tk-gray-darkest);
}

/* Kill the hard bottom edge.

   Cropping exactly at 24% put the window's lower boundary on the drawing's
   own horizon — the long straight line where the range meets the plain. A
   full-width horizontal rule was the result, and it read as a seam rather
   than as part of the picture.

   Two changes together:

   1. Stop the window at 23%, just above that horizon, so the base line is
      never in frame:
        0.23 x 3712 + (594 - 3712) x P = 594   ->   P = 8.3%
      Window becomes 7-23%: sky, then peaks, ending before the ground line.

   2. Fade the mask to fully transparent at the bottom instead of stopping at
      .7 opacity. Any remaining edge dissolves rather than being sliced, and
      the lower slopes settle into the background the way a silhouette should.

   The ridge now runs from ~75% down the strip to the bottom, softening as it
   goes. */

.final-cta::before {
  background-position: center 8.3%;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .3) 30%,
    #000 66%,
    #000 84%,
    rgba(0, 0, 0, .45) 95%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .3) 30%,
    #000 66%,
    #000 84%,
    rgba(0, 0, 0, .45) 95%,
    transparent 100%
  );
}

@media (max-width: 680px) {

  .final-cta::before {
    background-position: center 8.3%;
  }
}

/* ===== Footer glow =======================================================
   A soft pool of light rising from the bottom centre, breathing slowly in and
   out. Sits behind the footer content and takes no pointer events.

   Built as a radial gradient on a pseudo-element rather than a box-shadow so
   the falloff can be shaped: bright core, long tail, nothing at the edges.
   Both opacity and scale animate, which reads as light swelling rather than a
   flat fade.

   14s is deliberately slow. Anything quicker starts pulsing at you instead of
   sitting under the page.
   ========================================================================= */

.site-footer {
  isolation: isolate;
}

.site-footer::before {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: -1;
  height: 78%;
  background: radial-gradient(
    62% 100% at 50% 118%,
    rgba(255, 255, 255, .16) 0%,
    rgba(255, 255, 255, .07) 34%,
    rgba(255, 255, 255, .02) 62%,
    transparent 82%
  );
  pointer-events: none;
  transform-origin: 50% 100%;
  animation: footer-glow 14s var(--tk-ease-soft) infinite;
}

@keyframes footer-glow {

  0% {
    opacity: .45;
    transform: scale(.94);
  }

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

  100% {
    opacity: .45;
    transform: scale(.94);
  }
}

/* Anyone who has asked the system to reduce motion keeps the glow, but still. */

@media (prefers-reduced-motion: reduce) {

  .site-footer::before {
    animation: none;
    opacity: .75;
    transform: none;
  }
}

/* ===== CTA + footer: seamless breathing-light finish =================== */

.final-cta {
  margin-bottom: 0;
  border-bottom: 0;
  background: var(--tk-gray-darkest);
}

.final-cta::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: 0;
  height: 110px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(8, 9, 11, .72) 58%,
    var(--tk-gray-darkest) 100%
  );
  pointer-events: none;
}

.final-cta__grid {
  position: relative;
  z-index: 1;
}

.site-footer {
  isolation: isolate;
  overflow: hidden;
  margin-top: -1px;
  border-top: 0;
  background: var(--tk-gray-darkest);
}

.site-footer::before {
  inset: auto -10% -12%;
  z-index: 0;
  height: 92%;
  background: radial-gradient(
    58% 94% at 50% 112%,
    rgba(255, 255, 255, .72) 0%,
    rgba(255, 255, 255, .4) 28%,
    rgba(255, 255, 255, .18) 50%,
    rgba(255, 255, 255, .065) 66%,
    transparent 82%
  );
  filter: blur(10px);
  animation: footer-breathe 3.8s var(--tk-ease-soft) infinite;
}

.site-footer .footer-grid,
.site-footer .footer-bottom {
  position: relative;
  z-index: 1;
}

@keyframes footer-breathe {

  0%,
  100% {
    opacity: .38;
    transform: scaleX(.91) scaleY(.86);
  }

  50% {
    opacity: 1;
    transform: scaleX(1.12) scaleY(1.1);
  }
}

@media (max-width: 680px) {

  .final-cta::after {
    height: 72px;
  }

  .site-footer::before {
    inset-inline: -30%;
    height: 76%;
    filter: blur(14px);
  }
}

@media (prefers-reduced-motion: reduce) {

  .site-footer::before {
    animation-name: footer-breathe !important;
    animation-duration: 3.8s !important;
    animation-delay: 0s !important;
    animation-timing-function: var(--tk-ease-soft) !important;
    animation-iteration-count: infinite !important;
    animation-fill-mode: both !important;
  }
}

/* Desktop navigation: true geometric centre */

@media (min-width: 1025px) {

  .header-inner {
    position: relative;
  }

  .primary-nav {
    position: absolute;
    left: 50%;
    margin-left: 0;
    transform: translateX(-50%);
  }

  .header-inner > .button {
    margin-left: auto;
  }
}

/* Home closing statement accent */

.final-cta p.final-cta__copy--blue {
  color: #306ae2;
}

.final-cta p.final-cta__word-switch {
  display: grid;
  overflow: hidden;
  padding-block: .1em .18em;
  line-height: 1.12;
}

.final-cta__word {
  grid-area: 1 / 1;
  display: block;
  white-space: nowrap;
  will-change: transform;
  animation-duration: 6s;
  animation-timing-function: cubic-bezier(.76, 0, .24, 1);
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}

.final-cta__word--fragmented {
  color: #5fbf6f;
  animation-name: cta-word-scroll-fragmented;
}

.final-cta__word--efficiency {
  color: #306ae2;
  animation-name: cta-word-scroll-efficiency;
}

.final-cta__word--decisions {
  color: #97603d;
  animation-name: cta-word-scroll-decisions;
}

@keyframes cta-word-scroll-fragmented {

  0%,
  28% {
    transform: translateY(0);
  }

  33%,
  94% {
    transform: translateY(-115%);
  }

  94.01% {
    transform: translateY(115%);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes cta-word-scroll-efficiency {

  0%,
  28% {
    transform: translateY(115%);
  }

  33%,
  61% {
    transform: translateY(0);
  }

  66%,
  100% {
    transform: translateY(-115%);
  }
}

@keyframes cta-word-scroll-decisions {

  0%,
  61% {
    transform: translateY(115%);
  }

  66%,
  94% {
    transform: translateY(0);
  }

  99%,
  100% {
    transform: translateY(-115%);
  }
}

/*
 * Windows Reduce Motion is enabled on the design workstation. Restore this
 * user-requested copy carousel without re-enabling motion elsewhere.
 */
@media (prefers-reduced-motion: reduce) {

  .final-cta__word {
    animation-duration: 6s !important;
    animation-timing-function: cubic-bezier(.76, 0, .24, 1) !important;
    animation-delay: 0s !important;
    animation-iteration-count: infinite !important;
    animation-fill-mode: both !important;
  }
}

/* Independent breathing light for every dashed matrix */

.hero-bridge,
.section-dash-divider {
  --matrix-glow: rgba(98, 199, 114, .78);
  --matrix-cycle: 6.3s;
  --matrix-delay: -1.2s;
}

.hero-bridge {
  --matrix-glow: rgba(221, 136, 83, .82);
  --matrix-cycle: 5.2s;
  --matrix-delay: -.4s;
}

.section-dash-divider--violet {
  --matrix-glow: rgba(136, 105, 160, .86);
  --matrix-cycle: 6.1s;
  --matrix-delay: -2.1s;
}

.section-dash-divider--steel {
  --matrix-glow: rgba(95, 138, 155, .88);
  --matrix-cycle: 5.7s;
  --matrix-delay: -3.7s;
}

.section-dash-divider--green {
  --matrix-glow: rgba(98, 199, 114, .86);
  --matrix-cycle: 6.6s;
  --matrix-delay: -5.4s;
}

.section-dash-divider--rose {
  --matrix-glow: rgba(168, 112, 138, .86);
  --matrix-cycle: 5.4s;
  --matrix-delay: -7s;
}

.hero-bridge::before,
.section-dash-divider::before {
  will-change: opacity, filter;
  animation-name: matrix-breathing-light;
  animation-duration: var(--matrix-cycle);
  animation-delay: var(--matrix-delay);
  animation-timing-function: cubic-bezier(.45, 0, .25, 1);
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}

@keyframes matrix-breathing-light {

  0%,
  100% {
    opacity: .22;
    filter:
      brightness(.55)
      saturate(.72)
      drop-shadow(0 0 0 transparent);
  }

  42% {
    opacity: 1;
    filter:
      brightness(2.05)
      saturate(1.32)
      drop-shadow(0 0 10px var(--matrix-glow))
      drop-shadow(0 0 30px var(--matrix-glow));
  }

  68% {
    opacity: .62;
    filter:
      brightness(1.16)
      saturate(1.08)
      drop-shadow(0 0 7px var(--matrix-glow));
  }
}

/*
 * Restore only the requested matrix light animation on systems where the
 * global reduced-motion rule would otherwise collapse it to .01ms.
 */
@media (prefers-reduced-motion: reduce) {

  .hero-bridge::before,
  .section-dash-divider::before {
    animation-name: matrix-breathing-light !important;
    animation-duration: var(--matrix-cycle) !important;
    animation-delay: var(--matrix-delay) !important;
    animation-timing-function: cubic-bezier(.45, 0, .25, 1) !important;
    animation-iteration-count: infinite !important;
    animation-fill-mode: both !important;
  }
}

/* ==========================================================================
   SOLUTIONS + CULTURE / HOME-DERIVED REDESIGN
   Dark editorial system, mountain heroes, no dashed matrices.
   ========================================================================== */

.page-solutions,
.page-culture {
  background: var(--tk-gray-darkest);
  color: var(--tk-white);
}

.page-solutions main,
.page-culture main {
  overflow: clip;
}

.page-solutions main {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  background: var(--tk-gray-darkest);
}

.page-solutions main::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: 0;
  width: 100%;
  height: calc(clamp(680px, 78vh, 820px) + clamp(360px, 34vw, 500px));
  background-image: url("solutions-hero-mountains-only.webp");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  opacity: .72;
  mask-image: linear-gradient(to bottom, #000 0%, #000 58%, rgba(0, 0, 0, .56) 76%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 58%, rgba(0, 0, 0, .56) 76%, transparent 100%);
  pointer-events: none;
}

.page-solutions main > section {
  position: relative;
  z-index: 1;
}

/* Shared mountain hero: the same existing ridge drawing used in the closing
   artwork, reframed as a full opening scene. No new image is introduced. */

.page-solutions .page-hero--mountain,
.page-culture .page-hero--mountain {
  position: relative;
  isolation: isolate;
  min-height: clamp(680px, 78vh, 880px);
  display: flex;
  align-items: flex-end;
  padding-block: clamp(180px, 15vh, 230px) clamp(82px, 8vh, 118px);
  overflow: hidden;
  border-bottom: 0;
  background: var(--tk-gray-darkest);
}

.page-solutions .page-hero--mountain::before,
.page-culture .page-hero--mountain::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: url("trunk-hero-linework.webp");
  background-repeat: no-repeat;
  background-size: auto 580%;
  background-position: center 8.3%;
  opacity: .52;
  filter: invert(1) grayscale(1) contrast(1.45) brightness(1.12);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 76%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 76%, transparent 100%);
}

.page-solutions .page-hero--mountain::after,
.page-culture .page-hero--mountain::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(to bottom, rgba(8, 9, 11, .18) 0%, rgba(8, 9, 11, .02) 46%, var(--tk-gray-darkest) 100%),
    linear-gradient(90deg, rgba(8, 9, 11, .84) 0%, rgba(8, 9, 11, .22) 58%, rgba(8, 9, 11, .42) 100%);
}

.page-solutions .page-hero__grid,
.page-culture .page-hero__grid {
  width: 100%;
  grid-template-columns: minmax(0, 1.618fr) minmax(280px, 1fr);
  align-items: end;
  gap: var(--tk-5);
}

.page-solutions .page-hero h1,
.page-culture .page-hero h1 {
  max-width: 12ch;
  color: var(--tk-white);
  font-size: clamp(58px, 5.4vw, 104px);
  font-weight: 500;
  line-height: .92;
  letter-spacing: -.04em;
  text-wrap: balance;
}

.page-solutions .page-hero h1 em {
  color: var(--tk-steel);
}

.page-culture .page-hero h1 em {
  color: var(--tk-green);
}

.page-solutions .page-hero .section-label,
.page-culture .page-hero .section-label {
  margin-bottom: var(--tk-3);
  color: var(--tk-white);
}

.page-solutions .page-hero__body,
.page-culture .page-hero__body {
  max-width: 33ch;
  margin: 0;
  padding-bottom: 8px;
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-lead);
  font-weight: 300;
  line-height: 1.45;
}

.page-solutions .page-hero__body .button {
  margin-top: var(--tk-3);
}

/* Solutions / opening statement */

.page-solutions .solutions-opening {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(96px, 8vw, 132px) 0 clamp(72px, 6vw, 104px);
  border-bottom: 0;
  background: transparent;
}

.page-solutions .solutions-opening::before {
  content: none;
}

.page-solutions .solutions-opening::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(ellipse 48% 44% at 50% 54%, rgba(8, 9, 11, .9) 0%, rgba(8, 9, 11, .72) 38%, rgba(8, 9, 11, 0) 76%),
    linear-gradient(to bottom, rgba(8, 9, 11, .04), rgba(8, 9, 11, .2) 52%, var(--tk-gray-darkest) 100%);
  pointer-events: none;
}

.page-solutions .solutions-opening .solution-intro {
  position: relative;
  z-index: 1;
  display: block;
  max-width: 1280px;
  text-align: center;
}

.page-solutions .solutions-opening .solution-intro::before {
  content: none;
}

.page-solutions .solutions-opening h2 {
  max-width: none;
  margin: 0 auto 24px;
  font-size: clamp(58px, 7.3vw, 124px);
  line-height: .9;
  letter-spacing: -.068em;
}

.page-solutions .solutions-opening h2 span {
  color: var(--tk-white);
}

.page-solutions .solutions-opening .solution-intro__body {
  max-width: 920px;
  margin-inline: auto;
  padding-top: 0;
  text-align: center;
}

.page-solutions .solutions-opening .solution-intro__body p:first-child {
  margin: 0;
  color: #b9bdc0;
  font-family: "Manrope", sans-serif;
  font-size: clamp(18px, 1.45vw, 23px);
  font-weight: 300;
  line-height: 1.4;
}

/* Solutions / five service routes */

.page-solutions .solutions-services {
  padding-block: var(--tk-3) var(--tk-5);
  background: var(--tk-gray-darkest);
}

.page-solutions .solution-detail-list {
  position: relative;
  width: min(82vw, 1320px);
  max-width: 1320px;
  display: grid;
  gap: clamp(20px, 2vw, 32px);
  border-top: 0;
}

.page-solutions .solution-detail-list::before {
  content: none;
}

.page-solutions .solution-detail {
  --route-accent: var(--tk-steel);
  --route-glow-x: 18%;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: clamp(24px, 3vw, 48px);
  min-height: 460px;
  padding: clamp(32px, 3vw, 44px);
  border: 1px solid color-mix(in srgb, var(--route-accent) 22%, rgba(255, 255, 255, .08));
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .012) 44%, color-mix(in srgb, var(--route-accent) 5%, transparent) 100%),
    rgba(15, 16, 17, .9);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .05),
    inset 0 -1px 0 rgba(0, 0, 0, .4),
    0 26px 72px rgba(0, 0, 0, .2);
}

.page-solutions .solution-detail::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .34;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.page-solutions .solution-detail::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -12%;
  bottom: -18%;
  left: -12%;
  height: 58%;
  background: radial-gradient(ellipse at var(--route-glow-x) 100%, color-mix(in srgb, var(--route-accent) 62%, transparent) 0%, color-mix(in srgb, var(--route-accent) 26%, transparent) 38%, transparent 74%);
  filter: blur(10px);
  opacity: 1;
  pointer-events: none;
}

.page-solutions .solution-detail > * {
  position: relative;
  z-index: 1;
}

.page-solutions .solution-detail:nth-child(2) {
  --route-accent: var(--tk-green);
  --route-glow-x: 82%;
}

.page-solutions .solution-detail:nth-child(3) {
  --route-accent: var(--tk-violet);
  --route-glow-x: 52%;
}

.page-solutions .solution-detail:nth-child(4) {
  --route-accent: var(--tk-amber);
  --route-glow-x: 20%;
}

.page-solutions .solution-detail:nth-child(5) {
  --route-accent: var(--tk-rose);
  --route-glow-x: 78%;
}

.page-solutions .solution-detail:hover {
  transform: none;
}

.page-solutions .solution-detail > .index-number {
  position: relative;
  z-index: 1;
  width: 52px;
  height: 52px;
  display: block;
  margin: 0;
  border: 2px solid rgba(255, 255, 255, .68);
  border-radius: 48% 53% 47% 55%;
  background: radial-gradient(circle at 34% 28%, color-mix(in srgb, var(--route-accent) 76%, white 14%), var(--route-accent) 58%, color-mix(in srgb, var(--route-accent) 82%, black) 100%);
  box-shadow:
    0 0 28px color-mix(in srgb, var(--route-accent) 30%, transparent),
    inset 1px 1px 0 rgba(255, 255, 255, .16);
  color: transparent;
  font-size: 0;
  transform: rotate(-4deg);
}

.page-solutions .solution-detail > .index-number::before {
  content: "";
  position: absolute;
  inset: 7px 8px 6px 6px;
  border-bottom: 1px solid rgba(255, 255, 255, .32);
  border-left: 1px solid rgba(255, 255, 255, .24);
  border-radius: 50%;
  transform: rotate(12deg);
}

.page-solutions .solution-detail > .index-number::after {
  content: "";
  position: absolute;
  left: 9px;
  bottom: -5px;
  width: 34px;
  height: 2px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .34);
  transform: rotate(-3deg);
}

.page-solutions .solution-detail__title {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding-right: var(--tk-3);
}

.page-solutions .solution-detail__title .section-label {
  color: var(--route-accent);
}

.page-solutions .solution-detail__title h2 {
  max-width: none;
  margin-top: var(--tk-2);
  font-size: clamp(30px, 2.35vw, 46px);
  font-weight: 500;
  line-height: 1.06;
}

.page-solutions .solution-title-line {
  display: block;
  letter-spacing: -.03em;
  white-space: normal;
  text-wrap: pretty;
}

.page-solutions .solution-detail__title > p:not(.section-label):not(.outcome) {
  max-width: 36ch;
  margin-top: var(--tk-3);
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-h3-sm);
  font-weight: 300;
  line-height: 1.4;
}

.page-solutions .solution-detail__body {
  max-width: 66ch;
  padding-top: 4px;
}

.page-solutions .solution-detail__body > p:first-child {
  color: var(--route-accent);
  font-size: var(--tk-fs-body);
  font-weight: 500;
}

.page-solutions .feature-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
  margin-top: var(--tk-2);
}

.page-solutions .feature-list li {
  position: relative;
  min-height: 96px;
  display: block;
  padding: 15px;
  border: 1px solid color-mix(in srgb, var(--route-accent) 16%, rgba(255, 255, 255, .07));
  border-radius: 10px;
  background: linear-gradient(
    110deg,
    color-mix(in srgb, var(--route-accent) 9%, rgba(255, 255, 255, .018)) 0%,
    rgba(255, 255, 255, .012) 68%
  );
}

.page-solutions .feature-list li::before {
  content: none;
}

.page-solutions .feature-list li strong {
  display: block;
  color: var(--route-accent);
  font-size: clamp(15px, .94vw, 18px);
  font-weight: 500;
  line-height: 1.3;
}

.page-solutions .feature-list li span {
  display: block;
  margin-top: 7px;
  color: var(--tk-gray);
  font-size: clamp(12px, .72vw, 14px);
  font-weight: 400;
  line-height: 1.42;
}

.page-solutions .feature-list li:last-child:nth-child(odd) {
  grid-column: 1 / -1;
  min-height: 82px;
}

.page-solutions .solution-detail .outcome {
  margin-top: var(--tk-4);
  padding: 22px;
  border: 1px solid color-mix(in srgb, var(--route-accent) 24%, rgba(255, 255, 255, .08));
  border-left: 3px solid var(--route-accent);
  border-radius: 12px;
  background: rgba(8, 9, 11, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}

.page-solutions .solution-detail .outcome strong {
  color: var(--route-accent);
}

.page-solutions .solution-detail__title .outcome {
  max-width: 420px;
}

/* Business outcome / editorial result rail

   This is the conclusion of each service, not another nested card. A fine
   accent rule and a restrained pool of light keep the route colour visible
   without adding another bordered container to the composition. */

.page-solutions .solution-detail .outcome {
  position: relative;
  isolation: isolate;
  overflow: visible;
  max-width: 38ch;
  margin-top: var(--tk-3);
  padding: var(--tk-3) 0 0;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--route-accent) 58%, rgba(255, 255, 255, .12));
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-body);
  font-weight: 400;
  line-height: 1.5;
}

@media (min-width: 1025px) {

  .page-solutions .solution-detail__title > p:not(.section-label):not(.outcome) {
    min-height: 168px;
  }

  .page-solutions .solution-detail__title .outcome {
    min-height: 116px;
    margin-top: var(--tk-3);
  }
}

.page-solutions .solution-detail .outcome::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -56px;
  left: -44px;
  width: 260px;
  height: 150px;
  background: radial-gradient(
    ellipse at center,
    color-mix(in srgb, var(--route-accent) 14%, transparent) 0%,
    transparent 70%
  );
  filter: blur(10px);
  pointer-events: none;
}

.page-solutions .solution-detail .outcome strong {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: var(--tk-2);
  color: var(--route-accent);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  line-height: 1;
}

.page-solutions .solution-detail .outcome strong::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--route-accent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--route-accent) 72%, transparent);
}

/* Solutions / connected environment */

.page-solutions .solutions-platform {
  position: relative;
  padding-block: var(--tk-5);
  border-block: 0;
  background: var(--tk-gray-darkest);
}

.page-solutions .solutions-platform h2 {
  max-width: none;
}

.page-solutions .platform-section-header {
  max-width: 920px;
  margin: 0 auto var(--tk-5);
  text-align: center;
}

.page-solutions .platform-section-header h2 {
  margin-top: var(--tk-2);
  font-size: clamp(54px, 5.5vw, 88px);
  letter-spacing: -.055em;
  line-height: .92;
  white-space: nowrap;
}

.page-solutions .platform-section-header > p:not(.section-label) {
  max-width: 54ch;
  margin: var(--tk-3) auto 0;
  color: var(--tk-gray-blue);
  font-size: var(--tk-fs-h3-sm);
  font-weight: 300;
  line-height: 1.45;
}

.page-solutions .platform-category-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  max-width: 1120px;
  margin-inline: auto;
}

.page-solutions .platform-category {
  --platform-accent: var(--tk-steel);
  position: relative;
  min-height: 250px;
  padding: 26px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--platform-accent) 24%, rgba(255, 255, 255, .08));
  border-radius: 20px;
  background:
    radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--platform-accent) 13%, transparent), transparent 31%),
    linear-gradient(150deg, rgba(255, 255, 255, .027), rgba(8, 9, 11, .56));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
}

.page-solutions .platform-category:nth-child(2) {
  --platform-accent: var(--tk-green);
}

.page-solutions .platform-category:nth-child(3) {
  --platform-accent: var(--tk-violet);
}

.page-solutions .platform-category:nth-child(4) {
  --platform-accent: var(--tk-amber);
}

.page-solutions .platform-category__icon {
  position: absolute;
  top: 22px;
  right: 22px;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--platform-accent) 38%, rgba(255, 255, 255, .1));
  border-radius: 17px;
  background: color-mix(in srgb, var(--platform-accent) 8%, rgba(8, 9, 11, .72));
  color: var(--platform-accent);
  box-shadow: 0 0 24px color-mix(in srgb, var(--platform-accent) 13%, transparent);
}

.page-solutions .platform-category__icon svg {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-solutions .platform-category h3 {
  max-width: 14ch;
  margin-top: clamp(50px, 4vw, 72px);
  color: var(--tk-white);
  font-size: clamp(22px, 1.45vw, 28px);
  font-weight: 500;
  line-height: 1.15;
}

.page-solutions .platform-category ul {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: var(--tk-3);
  padding: 0;
  list-style: none;
}

.page-solutions .platform-category li {
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 999px;
  background: rgba(255, 255, 255, .025);
  color: var(--tk-gray-light);
  font-size: clamp(12px, .72vw, 14px);
  line-height: 1.25;
}

/* Solutions / deployment and roadmap */

.page-solutions .solutions-deployment,
.page-solutions .solutions-roadmap {
  padding-block: var(--tk-5);
  background: var(--tk-gray-darkest);
}

.page-solutions .solutions-deployment .split-heading {
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr);
  gap: clamp(36px, 4vw, 72px);
  padding-bottom: var(--tk-4);
}

.page-solutions .section-heading-line {
  display: block;
  white-space: nowrap;
}

.page-solutions .solutions-roadmap > .shell > h2 {
  max-width: none;
  font-size: clamp(42px, 4.4vw, 72px);
  line-height: .98;
}

.page-solutions .solutions-deployment .split-heading h2 {
  max-width: none;
  font-size: clamp(38px, 3.1vw, 58px);
  line-height: .98;
}

.page-solutions .deployment-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  border-block: 0;
}

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  --deployment-accent: var(--tk-steel);
  position: relative;
  min-height: 320px;
  padding: 28px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--deployment-accent) 24%, rgba(255, 255, 255, .08));
  border-radius: 20px;
  background:
    radial-gradient(circle at 82% 12%, color-mix(in srgb, var(--deployment-accent) 13%, transparent), transparent 34%),
    linear-gradient(150deg, rgba(255, 255, 255, .025), rgba(8, 9, 11, .54));
}

.page-solutions .deployment-grid article:nth-child(2) {
  --deployment-accent: var(--tk-green);
}

.page-solutions .deployment-grid article:nth-child(3) {
  --deployment-accent: var(--tk-violet);
}

.page-solutions .deployment-grid article:nth-child(4) {
  --deployment-accent: var(--tk-amber);
}

.page-solutions .deployment-grid article::before {
  content: "";
  position: absolute;
  top: 26px;
  right: 26px;
  width: 38px;
  height: 38px;
  border: 1px solid color-mix(in srgb, var(--deployment-accent) 60%, white 14%);
  border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, color-mix(in srgb, var(--deployment-accent) 72%, white 12%), var(--deployment-accent) 64%, transparent 68%);
  box-shadow: 0 0 24px color-mix(in srgb, var(--deployment-accent) 24%, transparent);
}

.page-solutions .deployment-grid article:hover {
  border-color: color-mix(in srgb, var(--deployment-accent) 48%, rgba(255, 255, 255, .08));
  background:
    radial-gradient(circle at 82% 12%, color-mix(in srgb, var(--deployment-accent) 18%, transparent), transparent 36%),
    linear-gradient(150deg, rgba(255, 255, 255, .035), rgba(8, 9, 11, .5));
}

.page-solutions .deployment-card__label {
  display: block;
  max-width: calc(100% - 56px);
  color: var(--deployment-accent);
  font-size: var(--tk-fs-small);
  font-weight: 500;
  line-height: 1.3;
}

.page-solutions .deployment-grid h3 {
  margin-top: clamp(76px, 7vw, 112px);
  color: var(--tk-white);
  font-size: clamp(23px, 1.5vw, 30px);
  line-height: 1.15;
}

.page-solutions .deployment-grid p {
  margin-top: var(--tk-2);
  color: var(--tk-gray-light);
  font-size: var(--tk-fs-body);
  line-height: 1.5;
}

.page-solutions .solutions-roadmap {
  border-top: 0;
  background: var(--tk-gray-darkest);
}

.page-solutions .solutions-roadmap > .shell > h2 {
  margin-bottom: var(--tk-5);
}

/* Culture / defining belief */

.page-culture .culture-belief {
  position: relative;
  padding-block: clamp(120px, 12vw, 230px);
  overflow: hidden;
  border-block: 1px solid var(--border-soft);
  background:
    radial-gradient(circle at 50% 50%, rgba(98, 199, 114, .11), transparent 34%),
    var(--tk-black);
}

.page-culture .culture-belief::before,
.page-culture .culture-belief::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(84vw, 1480px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(98, 199, 114, .5), transparent);
  transform: translateX(-50%) rotate(-4deg);
}

.page-culture .culture-belief::before {
  top: 32%;
}

.page-culture .culture-belief::after {
  bottom: 28%;
  transform: translateX(-50%) rotate(3deg);
  opacity: .55;
}

.page-culture .culture-belief h2 {
  max-width: 18ch;
  margin: 0 auto;
  color: var(--tk-white);
  font-size: clamp(50px, 5.4vw, 104px);
  font-weight: 500;
  line-height: .98;
  letter-spacing: -.04em;
  text-wrap: balance;
}

/* Culture / about, sequence and mission */

.page-culture .culture-about {
  padding-block: var(--tk-5);
  background: var(--tk-gray-darkest);
}

.page-culture .culture-about > .split-heading {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: var(--tk-5);
  align-items: start;
}

.page-culture .culture-about .split-heading h2 {
  max-width: 9ch;
  font-size: clamp(50px, 4.6vw, 88px);
  line-height: .95;
}

.page-culture .culture-about .split-heading__body {
  max-width: 64ch;
  padding-top: 8px;
}

.page-culture .culture-about .split-heading__body p:first-child {
  color: var(--tk-white);
  font-size: var(--tk-fs-h3-sm);
  font-weight: 500;
}

.page-culture .mission-grid {
  grid-template-columns: 1fr 1fr;
  gap: var(--tk-5);
  margin-top: var(--tk-5);
}

.page-culture .mission-panel {
  padding: var(--tk-4) 0 0;
  border: 0;
  border-top: 3px solid var(--tk-green);
  background: transparent;
}

.page-culture .mission-panel:nth-child(2) {
  border-top-color: var(--tk-steel);
}

.page-culture .mission-panel h3 {
  max-width: 17ch;
  margin-top: var(--tk-3);
  font-size: clamp(34px, 2.8vw, 54px);
  font-weight: 500;
  line-height: 1.05;
}

/* Culture / principles as an editorial field, not cards */

.page-culture .culture-principles {
  padding-block: var(--tk-5);
  border-block: 1px solid var(--border-soft);
  background:
    radial-gradient(circle at 18% 20%, rgba(136, 105, 160, .1), transparent 24%),
    var(--tk-gray-darker);
}

.page-culture .culture-principles .section-heading {
  align-items: end;
  padding-bottom: var(--tk-5);
}

.page-culture .culture-principles .section-heading h2 {
  max-width: 9ch;
  font-size: clamp(50px, 4.5vw, 86px);
  line-height: .96;
}

.page-culture .principle-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 var(--tk-5);
  border-top: 1px solid var(--border-soft);
}

.page-culture .principle {
  min-height: 330px;
  padding: var(--tk-4) 0;
  border: 0;
  border-bottom: 1px solid var(--border-soft);
  border-radius: 0;
  background: transparent;
}

.page-culture .principle:hover {
  background: transparent;
  transform: none;
}

.page-culture .principle .index-number {
  color: var(--tk-green);
}

.page-culture .principle h3 {
  max-width: 16ch;
  margin-top: var(--tk-5);
  font-size: clamp(31px, 2.35vw, 45px);
  font-weight: 500;
  line-height: 1.08;
}

.page-culture .principle p {
  max-width: 54ch;
}

/* Culture / partnership closing chapter */

.page-culture .culture-partnership {
  position: relative;
  padding-block: var(--tk-5);
  overflow: hidden;
  background: var(--tk-gray-darkest);
}

.page-culture .culture-partnership::after {
  content: none;
}

.page-culture .culture-partnership .partnership-grid {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: var(--tk-5);
}

.page-culture .culture-partnership h2 {
  max-width: 11ch;
  font-size: clamp(50px, 4.5vw, 86px);
  line-height: .96;
}

/* Both pages close cleanly: mountain moved to Hero; footer owns new artwork. */

.page-solutions .final-cta::before,
.page-culture .final-cta::before {
  display: none;
}

.page-solutions .final-cta,
.page-culture .final-cta {
  padding-block: var(--tk-5);
  border-top: 1px solid var(--border-soft);
  background: var(--tk-black);
}

.page-solutions .final-cta__grid,
.page-culture .final-cta__grid {
  padding-bottom: 0;
}

/* Code-native footer drawings. They are DOM vectors, not generated images. */

.page-solutions .site-footer,
.page-culture .site-footer {
  padding-top: clamp(250px, 20vw, 360px);
}

/* Responsive composition */

@media (max-width: 1024px) {

  .page-solutions .page-hero__grid,
  .page-culture .page-hero__grid,
  .page-solutions .solutions-opening .solution-intro,
  .page-culture .culture-about > .split-heading,
  .page-culture .culture-partnership .partnership-grid {
    grid-template-columns: 1fr;
    gap: var(--tk-4);
  }

  .page-solutions .page-hero__body,
  .page-culture .page-hero__body {
    max-width: 44ch;
  }

  .page-solutions .solution-detail {
    grid-template-columns: 56px 1fr;
    min-height: 0;
    padding: 40px;
    border-radius: 22px;
  }

  .page-solutions .solution-detail__body {
    grid-column: 2;
  }

  .page-solutions .deployment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .page-solutions .deployment-grid article:nth-child(2) {
    border-right: 1px solid color-mix(in srgb, var(--deployment-accent) 24%, rgba(255, 255, 255, .08));
  }

  .page-solutions .deployment-grid article:nth-child(-n+2) {
    border-bottom: 1px solid color-mix(in srgb, var(--deployment-accent) 24%, rgba(255, 255, 255, .08));
  }
}

@media (max-width: 680px) {

  .page-solutions .page-hero--mountain,
  .page-culture .page-hero--mountain {
    min-height: 720px;
    padding-block: 150px 72px;
  }

  .page-solutions .page-hero--mountain::before,
  .page-culture .page-hero--mountain::before {
    background-size: auto 430%;
    background-position: 52% 8.3%;
    opacity: .45;
  }

  .page-solutions .page-hero h1,
  .page-culture .page-hero h1 {
    max-width: 11ch;
    font-size: clamp(46px, 14vw, 62px);
  }

  .page-solutions .page-hero__body,
  .page-culture .page-hero__body {
    font-size: 19px;
  }

  .page-solutions .solutions-opening,
  .page-solutions .solutions-platform,
  .page-solutions .solutions-deployment,
  .page-solutions .solutions-roadmap,
  .page-culture .culture-about,
  .page-culture .culture-principles,
  .page-culture .culture-partnership {
    padding-block: 72px;
  }

  .page-solutions .solution-detail-list::before {
    left: 21px;
  }

  .page-solutions .solution-detail {
    grid-template-columns: 44px 1fr;
    gap: var(--tk-3);
    padding: 28px 24px 32px;
    border-radius: 18px;
  }

  .page-solutions .solution-detail > .index-number {
    width: 44px;
    height: 44px;
  }

  .page-solutions .solution-detail__body {
    grid-column: 1 / -1;
    padding-left: 0;
  }

  .page-solutions .solution-title-line {
    white-space: normal;
  }

  .page-solutions .section-heading-line {
    white-space: normal;
  }

  .page-solutions .platform-section-header h2 {
    white-space: normal;
  }

  .page-solutions .feature-list,
.page-solutions .solutions-platform .system-list,
.page-solutions .deployment-grid,
.page-culture .mission-grid,
.page-culture .principle-grid {
    grid-template-columns: 1fr;
  }

  .page-solutions .platform-category-grid {
    grid-template-columns: 1fr;
  }

  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child {
    min-height: 280px;
    border: 1px solid color-mix(in srgb, var(--deployment-accent) 24%, rgba(255, 255, 255, .08));
  }

  .page-solutions .deployment-grid article:last-child {
    border-bottom: 1px solid color-mix(in srgb, var(--deployment-accent) 24%, rgba(255, 255, 255, .08));
  }

  .page-solutions .deployment-grid h3 {
    margin-top: 76px;
  }

  .page-culture .culture-belief {
    padding-block: 120px;
  }

  .page-culture .culture-belief h2 {
    font-size: 48px;
  }

  .page-culture .mission-grid {
    gap: 72px;
  }

  .page-culture .principle-grid {
    gap: 0;
  }

  .page-culture .principle {
    min-height: 0;
  }

  .page-solutions .site-footer,
  .page-culture .site-footer {
    padding-top: 220px;
  }
}

/* Solutions Hero: user-supplied final mountain artwork. Keep the full-width
   ridge as authored instead of reconstructing its crop from the source scene. */

.page-solutions .page-hero--mountain::before {
  content: none;
}

.page-solutions .page-hero--mountain {
  min-height: clamp(680px, 78vh, 820px);
  align-items: center;
  padding-block: clamp(220px, 23vh, 270px) clamp(110px, 13vh, 150px);
  background: transparent;
}

.page-solutions .page-hero--mountain::after {
  background:
    linear-gradient(to bottom, rgba(8, 9, 11, .08) 0%, rgba(8, 9, 11, .04) 32%, rgba(8, 9, 11, .12) 76%, rgba(8, 9, 11, .08) 100%),
    radial-gradient(circle at 50% 48%, rgba(35, 35, 35, .18), transparent 52%);
}

.page-solutions .page-hero__grid {
  position: relative;
  z-index: 1;
  display: flex;
  max-width: 1120px;
  flex-direction: column;
  align-items: center;
  gap: var(--tk-4);
  text-align: center;
  transform: translateY(0);
}

.page-solutions .page-hero__grid > div:first-child {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.page-solutions .page-hero .section-label {
  margin-bottom: var(--tk-3);
}

.page-solutions .page-hero h1 {
  width: 100%;
  max-width: none;
  display: grid;
  grid-template-columns: auto auto auto;
  justify-content: center;
  align-items: baseline;
  column-gap: .2em;
  row-gap: .3em;
  font-size: clamp(42px, 2.65vw, 52px);
  letter-spacing: -.052em;
  line-height: 1;
  white-space: normal;
}

.page-solutions .hero-title__lead {
  grid-area: 1 / 1;
}

.page-solutions .page-hero h1 .hero-title__keyword {
  grid-area: 1 / 2;
  color: var(--tk-white);
}

.page-solutions .hero-title__tail {
  grid-area: 1 / 3;
}

.page-solutions .hero-title__with,
.page-solutions .hero-title__brand,
.page-solutions .hero-title__period {
  font-size: .62em;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1;
}

.page-solutions .hero-title__with {
  grid-area: 2 / 1;
  justify-self: end;
}

.page-solutions .hero-title__brand {
  grid-area: 2 / 2;
  width: 88%;
  display: flex;
  justify-content: space-between;
  justify-self: center;
  color: var(--tk-steel);
  font-style: normal;
}

.page-solutions .hero-title__period {
  grid-area: 2 / 3;
  justify-self: start;
}

.page-solutions .page-hero__body {
  display: flex;
  width: min(100%, 1000px);
  max-width: 1000px;
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  font-size: clamp(16px, 1.2vw, 20px);
  line-height: 1.55;
  text-align: left;
}

@media (max-width: 680px) {

  .page-solutions .page-hero--mountain {
    min-height: 720px;
    padding-block: 190px 88px;
  }

  .page-solutions .page-hero--mountain::before {
    height: auto;
    background-position: center top;
    background-size: auto 100%;
    opacity: .72;
  }

  .page-solutions .page-hero__grid {
    gap: 26px;
  }

  .page-solutions .page-hero h1 {
    max-width: 560px;
    display: block;
    font-size: clamp(48px, 14vw, 68px);
    letter-spacing: -.055em;
    line-height: .94;
    white-space: normal;
  }

  .page-solutions .hero-title__lead,
  .page-solutions .hero-title__keyword,
  .page-solutions .hero-title__tail {
    display: inline;
  }

  .page-solutions .hero-title__with {
    display: block;
    margin-top: .4em;
  }

  .page-solutions .hero-title__brand {
    width: auto;
    display: inline-flex;
    gap: .08em;
    margin-left: .18em;
  }

  .page-solutions .page-hero__body {
    font-size: 16px;
  }
}

/* Solutions / client wall */

.page-solutions .client-showcase {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  order: 90;
  margin-top: -1px;
  padding: clamp(64px, 5.5vw, 92px) 0 clamp(104px, 10vw, 170px);
  border-top: 0;
  border-bottom: 0;
  background: var(--tk-gray-darkest);
}

.page-solutions::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 90;
  background: url("frost-noise.svg") repeat;
  background-size: 180px 180px;
  opacity: .085;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.page-solutions .client-showcase::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 180px 180px;
  opacity: .07;
  mix-blend-mode: overlay;
  pointer-events: none;
}

.page-solutions .client-showcase > .shell {
  position: relative;
  z-index: 1;
}

.page-solutions .client-showcase__heading {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  align-items: end;
  gap: var(--tk-3) clamp(48px, 7vw, 124px);
  max-width: none;
  margin: 0 0 clamp(58px, 6vw, 92px);
  justify-items: start;
  text-align: left;
}

.page-solutions .client-showcase__heading .section-label {
  grid-column: 1 / -1;
}

.page-solutions .client-showcase__heading h2 {
  max-width: 12ch;
  margin-top: 0;
  font-size: clamp(48px, 4.25vw, 76px);
  line-height: .98;
  letter-spacing: -.045em;
}

.page-solutions .client-showcase__heading > p:last-child {
  max-width: 460px;
  margin: 0 0 .35em;
  justify-self: end;
  color: var(--tk-gray-blue);
  font-size: clamp(16px, 1.2vw, 20px);
  line-height: 1.55;
}

.page-solutions .client-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 396px));
  justify-content: center;
  gap: 22px;
}

@media (min-width: 1180px) {

  .page-solutions .client-grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    max-width: 1232px;
    margin-inline: auto;
  }

  .page-solutions .client-card {
    grid-column: span 4;
  }

  .page-solutions .client-card:nth-child(n + 10) {
    grid-column: span 2;
    height: 176px;
    min-height: 176px;
    padding: 22px 16px;
    justify-content: center;
    opacity: .72;
  }

  .page-solutions .client-card:nth-child(n + 10) > p {
    min-height: 0;
    margin-top: 10px;
    font-size: 11px;
  }

  .page-solutions .client-card:nth-child(n + 10) .client-card__tags {
    display: none;
  }

  .page-solutions .client-grid::after {
    content: "";
    position: absolute;
    z-index: 2;
    right: -2px;
    bottom: -2px;
    left: -2px;
    height: 62px;
    background: linear-gradient(to bottom, rgba(7, 8, 9, 0), rgba(7, 8, 9, .68));
    pointer-events: none;
  }
}

.page-solutions .client-card {
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  height: 220px;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 24px 20px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 15px;
  background:
    linear-gradient(150deg, rgba(255, 255, 255, .038), rgba(255, 255, 255, .008) 52%, rgba(0, 0, 0, .1)),
    rgba(19, 21, 22, .72);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    inset 0 -1px 0 rgba(0, 0, 0, .36),
    0 14px 36px rgba(0, 0, 0, .12);
  color: var(--tk-white);
  text-align: center;
  transition: border-color var(--motion-fast) var(--ease), transform var(--motion-fast) var(--ease), background-color var(--motion-fast) var(--ease);
}

.page-solutions .client-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 180px 180px;
  opacity: .16;
  mix-blend-mode: overlay;
  pointer-events: none;
}

.page-solutions .client-card > * {
  position: relative;
  z-index: 1;
}

.page-solutions .client-card:hover {
  border-color: rgba(98, 199, 114, .48);
  background-color: #0d100f;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .04),
    0 20px 48px rgba(36, 142, 82, .08);
  transform: translateY(-2px);
}

.page-solutions .client-card > p {
  min-height: 34px;
  margin-top: 8px;
  color: #c4c5c6;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .035em;
  line-height: 1.35;
}

.page-solutions .client-card__tags {
  width: 100%;
  min-height: 36px;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .08);
}

.page-solutions .client-card__tags span {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  color: #aaaeb1;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .01em;
  line-height: 1;
  white-space: nowrap;
}

.page-solutions .client-card__tags span:first-child {
  background: rgba(32, 151, 99, .2);
  color: #49d391;
}

.page-solutions .client-logo {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f3f3f1;
  filter: grayscale(1);
}

.page-solutions .client-logo span {
  display: block;
}

.page-solutions .client-logo--wide span {
  font-size: clamp(34px, 2.7vw, 46px);
  font-weight: 760;
  letter-spacing: -.06em;
}

.page-solutions .client-logo--seal {
  width: 58px;
  min-height: 58px;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.page-solutions .client-logo--seal span {
  font-family: "Newsreader", serif;
  font-size: 22px;
  font-weight: 700;
}

.page-solutions .client-logo--forest {
  width: 68px;
  min-height: 54px;
  border: 2px solid currentColor;
  border-radius: 50% 50% 44% 44%;
}

.page-solutions .client-logo--forest span {
  font-family: "Newsreader", serif;
  font-size: 22px;
  font-style: italic;
}

.page-solutions .client-logo--wordmark span {
  font-size: clamp(30px, 2.3vw, 42px);
  font-weight: 650;
  letter-spacing: .06em;
}

.page-solutions .client-logo--frame {
  min-width: 150px;
  min-height: 46px;
  border: 2px solid currentColor;
}

.page-solutions .client-logo--frame span {
  font-size: 18px;
  font-weight: 750;
  letter-spacing: .12em;
}

.page-solutions .client-logo--horror span {
  font-family: "Newsreader", serif;
  font-size: 20px;
  font-weight: 650;
  letter-spacing: .02em;
  line-height: .82;
}

.page-solutions .client-logo--italic span {
  font-size: clamp(36px, 2.8vw, 50px);
  font-style: italic;
  font-weight: 800;
  letter-spacing: -.08em;
}

.page-solutions .client-logo--script span {
  font-family: "Newsreader", serif;
  font-size: clamp(34px, 2.5vw, 46px);
  font-style: italic;
  font-weight: 620;
  letter-spacing: -.05em;
}

.page-solutions .client-logo--crest {
  width: 58px;
  min-height: 58px;
  border: 1px solid rgba(255, 255, 255, .64);
  border-radius: 50%;
}

.page-solutions .client-logo--crest span {
  font-family: "Newsreader", serif;
  font-size: 24px;
  font-weight: 700;
}

@media (max-width: 1024px) {

  .page-solutions .client-grid {
    grid-template-columns: repeat(2, minmax(0, 396px));
  }
}

@media (max-width: 680px) {

  .page-solutions .page-hero__grid {
    transform: translateY(-28px);
  }

  .page-solutions .client-showcase {
    padding: 64px 0 88px;
  }

  .page-solutions .client-showcase__heading {
    grid-template-columns: 1fr;
    gap: var(--tk-3);
    justify-items: start;
    text-align: left;
  }

  .page-solutions .client-showcase__heading .section-label {
    grid-column: auto;
  }

  .page-solutions .client-showcase__heading h2 {
    font-size: 42px;
  }

  .page-solutions .client-showcase__heading > p:last-child {
    justify-self: start;
    margin-bottom: 0;
  }

  .page-solutions .client-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .page-solutions .client-card {
    min-height: 220px;
  }
}

/* Home / continuous black canvas

   The page previously alternated between #08090b and pure #000, most visibly
   inside every dash-matrix transition. Keep one charcoal-black substrate from
   the first dark section through the footer, then lay one viewport-anchored
   grain film over the whole composition so the texture never restarts at a
   section boundary. */

.page-home {
  --home-black: var(--tk-gray-darkest);
  background-color: var(--home-black);
}

.page-home main,
.page-home main > .content-section,
.page-home main > .section-dash-divider,
.page-home .final-cta,
.page-home .site-footer {
  background-color: var(--home-black);
}

.page-home main > .section-dash-divider {
  background-image: none;
}

.page-home::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 90;
  background: url("frost-noise.svg") repeat;
  background-size: 180px 180px;
  opacity: .13;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

@media (max-width: 680px) {

  .page-home::after {
    opacity: .11;
  }
}

/* ==========================================================================
   Three-page density pass

   Home, Solutions and Culture had each accumulated a different large-screen
   rhythm. This final layer brings them back to one calmer editorial scale:
   display type steps down slightly, repeated rows become shallower, and large
   cards use their horizontal space before asking for more page height.
   ========================================================================== */

/* Shared section cadence */

.page-home .content-section,
.page-solutions .solutions-platform,
.page-solutions .solutions-deployment,
.page-solutions .solutions-roadmap,
.page-culture .culture-about,
.page-culture .culture-principles,
.page-culture .culture-partnership,
.page-solutions .final-cta,
.page-culture .final-cta {
  padding-block: clamp(52px, 4.4vw, 70px);
}

.page-home .final-cta {
  padding-block: clamp(48px, 4vw, 64px);
}

/* Home ------------------------------------------------------------------- */

@media (min-width: 681px) {

  .page-home .home-hero,
  .page-home .home-hero__inner {
    min-height: clamp(620px, 84svh, 760px);
  }

  .page-home .home-hero__inner {
    padding-block: clamp(72px, 7vw, 106px);
  }

  .page-home .home-hero__copy {
    top: 3vw;
  }

  .page-home .home-hero .button,
  .page-home .home-hero .text-link {
    min-height: clamp(48px, 3.2vw, 62px);
    padding-inline: clamp(24px, 2vw, 38px);
    font-size: clamp(16px, 1.05vw, 20px);
  }
}

.page-home .hero-bridge,
.page-home .section-dash-divider {
  padding-bottom: var(--tk-3);
}

.page-home .hero-bridge__content,
.page-home .section-dash-divider__content {
  min-height: clamp(104px, 8vw, 148px);
}

.page-home .hero-bridge::before,
.page-home .section-dash-divider::before {
  height: clamp(104px, 8vw, 148px);
}

.page-home .intelligence-gap {
  padding-top: var(--tk-2);
}

.page-home .intelligence-gap .split-heading {
  margin-bottom: var(--tk-3);
}

.page-home .intelligence-gap .split-heading__body p {
  margin-bottom: var(--tk-3);
}

.page-home .intelligence-gap .friction-grid,
.page-home #enterprise-intelligence .benefit-list,
.page-home #platform .system-list {
  column-gap: clamp(36px, 4vw, 64px);
}

.page-home .intelligence-gap .friction-grid article,
.page-home #enterprise-intelligence .benefit-list li,
.page-home #platform .system-list li {
  padding-block: clamp(15px, 1.35vw, 20px);
}

.page-home .intelligence-gap .friction-grid {
  margin-bottom: clamp(38px, 3.6vw, 54px);
}

.page-home #enterprise-intelligence p.benefit-lead {
  margin-top: var(--tk-3);
}

.page-home #enterprise-intelligence .benefit-list {
  margin-top: var(--tk-2);
}

.page-home #platform .system-list {
  margin-top: clamp(32px, 3vw, 46px);
}

.page-home #capabilities .solution-row {
  grid-template-columns: auto minmax(0, 20ch) minmax(0, 1fr) auto;
  padding-block: clamp(16px, 1.35vw, 20px);
}

.page-home .capabilities-outro {
  margin-top: clamp(36px, 3.4vw, 52px);
}

.page-home #trust .trust-grid {
  margin-top: clamp(34px, 3.2vw, 48px);
}

.page-home #trust .trust-card {
  grid-template-columns: auto minmax(0, 23ch) minmax(0, 1fr);
  padding-block: clamp(26px, 2.25vw, 34px);
}

.page-home .final-cta p.final-cta__copy {
  margin-top: var(--tk-3);
}

.page-home .final-cta__actions {
  margin-top: var(--tk-3);
}

/* Solutions -------------------------------------------------------------- */

.page-solutions .page-hero--mountain {
  min-height: clamp(620px, 72vh, 700px);
  padding-block: clamp(188px, 19vh, 220px) clamp(78px, 10vh, 104px);
}

.page-solutions .solutions-opening {
  padding: clamp(66px, 5.4vw, 86px) 0 clamp(48px, 4.2vw, 66px);
}

.page-solutions .solutions-opening h2 {
  margin-bottom: var(--tk-3);
  font-size: clamp(56px, 5.7vw, 90px);
  line-height: .92;
}

.page-solutions .solutions-opening .solution-intro__body p:first-child {
  font-size: clamp(17px, 1.2vw, 20px);
}

.page-solutions .solutions-services {
  padding-block: var(--tk-2) clamp(52px, 4.4vw, 70px);
}

.page-solutions .solution-detail-list {
  gap: clamp(16px, 1.5vw, 22px);
}

@media (min-width: 1025px) {

  .page-solutions .solution-detail {
    grid-template-columns: 46px minmax(0, .94fr) minmax(0, 1.06fr);
    gap: clamp(24px, 2.2vw, 34px);
    min-height: 0;
    padding: clamp(28px, 2.35vw, 34px);
    border-radius: 20px;
  }

  .page-solutions .solution-detail > .index-number {
    width: 44px;
    height: 44px;
  }

  .page-solutions .solution-detail > .index-number::after {
    width: 29px;
  }

  .page-solutions .solution-detail__title {
    padding-right: var(--tk-2);
  }

  .page-solutions .solution-detail__title h2 {
    font-size: clamp(27px, 2vw, 36px);
  }

  .page-solutions .solution-detail__title > p:not(.section-label):not(.outcome) {
    min-height: 126px;
    margin-top: var(--tk-3);
    font-size: clamp(17px, 1.15vw, 19px);
    line-height: 1.45;
  }

  .page-solutions .solution-detail__title .outcome {
    min-height: 92px;
    margin-top: var(--tk-2);
    padding-top: var(--tk-2);
  }

  .page-solutions .solution-detail__body > p:first-child {
    font-size: 15px;
  }

  .page-solutions .feature-list {
    gap: 8px 10px;
    margin-top: 12px;
  }

  .page-solutions .feature-list li {
    min-height: 82px;
    padding: 12px;
  }

  .page-solutions .feature-list li strong {
    font-size: clamp(14px, .85vw, 16px);
  }

  .page-solutions .feature-list li span {
    margin-top: 5px;
    font-size: clamp(11px, .66vw, 13px);
    line-height: 1.38;
  }

  .page-solutions .feature-list li:last-child:nth-child(odd) {
    min-height: 66px;
  }
}

.page-solutions .platform-section-header {
  max-width: 820px;
  margin-bottom: clamp(38px, 3.6vw, 54px);
}

.page-solutions .platform-section-header h2 {
  font-size: clamp(48px, 4.6vw, 70px);
}

.page-solutions .platform-section-header > p:not(.section-label) {
  margin-top: var(--tk-3);
  font-size: clamp(17px, 1.15vw, 19px);
}

.page-solutions .platform-category-grid {
  gap: 12px;
}

.page-solutions .platform-category {
  min-height: 215px;
  padding: 22px;
  border-radius: 17px;
}

.page-solutions .platform-category__icon {
  top: 18px;
  right: 18px;
  width: 46px;
  height: 46px;
  border-radius: 14px;
}

.page-solutions .platform-category__icon svg {
  width: 26px;
  height: 26px;
}

.page-solutions .platform-category h3 {
  margin-top: clamp(40px, 3.4vw, 52px);
  font-size: clamp(20px, 1.3vw, 24px);
}

.page-solutions .platform-category ul {
  margin-top: var(--tk-2);
}

.page-solutions .platform-category li {
  padding: 6px 9px;
  font-size: clamp(11px, .66vw, 13px);
}

.page-solutions .solutions-deployment .split-heading {
  gap: clamp(28px, 3vw, 46px);
  padding-bottom: clamp(38px, 3.6vw, 54px);
}

.page-solutions .solutions-deployment .split-heading h2 {
  font-size: clamp(34px, 2.7vw, 46px);
}

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  min-height: 282px;
  padding: 22px;
  border-radius: 17px;
}

.page-solutions .deployment-grid article::before {
  top: 21px;
  right: 21px;
  width: 32px;
  height: 32px;
}

.page-solutions .deployment-grid h3 {
  margin-top: clamp(54px, 4.8vw, 70px);
  font-size: clamp(19px, 1.25vw, 23px);
  line-height: 1.2;
}

.page-solutions .deployment-grid p {
  margin-top: var(--tk-2);
  font-size: clamp(14px, .82vw, 16px);
  line-height: 1.5;
}

.page-solutions .solutions-roadmap > .shell > h2 {
  margin-bottom: clamp(38px, 3.6vw, 54px);
  font-size: clamp(38px, 3.5vw, 56px);
}

.page-solutions .client-showcase {
  padding: clamp(54px, 4.5vw, 70px) 0 clamp(78px, 6.5vw, 104px);
}

.page-solutions .client-showcase__heading {
  gap: var(--tk-3) clamp(40px, 5vw, 72px);
  margin-bottom: clamp(42px, 4vw, 58px);
}

.page-solutions .client-showcase__heading h2 {
  font-size: clamp(42px, 3.7vw, 58px);
}

.page-solutions .client-showcase__heading > p:last-child {
  font-size: clamp(15px, 1vw, 18px);
}

.page-solutions .client-grid {
  gap: 14px;
}

.page-solutions .client-card {
  height: 190px;
  min-height: 190px;
  padding: 20px 20px 18px;
  border-radius: 14px;
}

@media (min-width: 1180px) {

  .page-solutions .client-card:nth-child(n + 10) {
    height: 140px;
    min-height: 140px;
    padding: 16px 12px;
  }

  .page-solutions .client-grid::after {
    height: 48px;
  }
}

.page-solutions .client-card__tags {
  margin-top: 9px;
  padding-top: 9px;
}

.page-solutions .client-card__tags span {
  padding: 5px 8px;
  font-size: 10px;
}

/* Culture ---------------------------------------------------------------- */

.page-culture main .shell {
  width: min(72vw, 1100px);
}

.page-culture .page-hero--mountain {
  min-height: clamp(620px, 72vh, 700px);
  padding-block: clamp(172px, 18vh, 210px) clamp(70px, 9vh, 96px);
}

.page-culture .page-hero h1 {
  font-size: clamp(48px, 4.6vw, 68px);
}

.page-culture .culture-belief {
  padding-block: clamp(86px, 7.5vw, 112px);
}

.page-culture .culture-belief h2 {
  max-width: 19ch;
  font-size: clamp(46px, 4.35vw, 66px);
  line-height: 1;
}

.page-culture .culture-about > .split-heading {
  gap: clamp(38px, 4vw, 62px);
}

.page-culture .culture-about .split-heading h2,
.page-culture .culture-principles .section-heading h2,
.page-culture .culture-partnership h2 {
  font-size: clamp(44px, 4vw, 62px);
  line-height: .98;
}

.page-culture .culture-about .split-heading__body p:first-child {
  font-size: clamp(18px, 1.2vw, 21px);
}

.page-culture .mission-grid {
  gap: clamp(34px, 3.6vw, 52px);
  margin-top: clamp(46px, 4.2vw, 62px);
}

.page-culture .mission-panel {
  padding-top: clamp(26px, 2.4vw, 34px);
}

.page-culture .mission-panel h3 {
  margin-top: var(--tk-3);
  font-size: clamp(29px, 2.35vw, 38px);
}

.page-culture .culture-principles .section-heading {
  padding-bottom: clamp(44px, 4vw, 58px);
}

@media (min-width: 1100px) {

  .page-culture .principle-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 clamp(22px, 2.2vw, 34px);
  }
}

.page-culture .principle {
  min-height: 290px;
  padding-block: clamp(26px, 2.4vw, 34px);
}

.page-culture .principle h3 {
  margin-top: clamp(34px, 3.2vw, 46px);
  font-size: clamp(25px, 2vw, 32px);
}

.page-culture .principle p {
  font-size: clamp(15px, .9vw, 17px);
  line-height: 1.55;
}

.page-culture .culture-partnership .partnership-grid {
  gap: clamp(38px, 4vw, 60px);
}

.page-solutions .site-footer,
.page-culture .site-footer {
  padding-top: clamp(200px, 16vw, 270px);
}

/* Tablet and mobile retain the same air without inheriting desktop heights. */

@media (max-width: 1024px) {

  .page-culture main .shell {
    width: min(78vw, 860px);
  }

  .page-solutions .solution-detail {
    gap: var(--tk-3);
    padding: clamp(28px, 4vw, 38px);
  }

  .page-solutions .solution-detail__title > p:not(.section-label):not(.outcome),
  .page-solutions .solution-detail__title .outcome {
    min-height: 0;
  }
}

@media (max-width: 680px) {

  .page-culture main .shell {
    width: calc(100vw - 2 * var(--tk-pad-x));
  }

  .page-home .home-hero,
  .page-home .home-hero__inner,
  .page-solutions .page-hero--mountain,
  .page-culture .page-hero--mountain {
    min-height: 620px;
  }

  .page-home .hero-bridge__content,
  .page-home .section-dash-divider__content,
  .page-home .hero-bridge::before,
  .page-home .section-dash-divider::before {
    min-height: 104px;
    height: 104px;
  }

  .page-solutions .page-hero--mountain,
  .page-culture .page-hero--mountain {
    padding-block: 160px 68px;
  }

  .page-solutions .solutions-opening {
    padding-block: 56px 44px;
  }

  .page-solutions .solutions-opening h2 {
    font-size: 48px;
  }

  .page-solutions .solution-detail {
    padding: 24px 22px 28px;
  }

  .page-solutions .feature-list li,
  .page-solutions .feature-list li:last-child:nth-child(odd),
  .page-solutions .platform-category,
  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child,
  .page-solutions .client-card {
    min-height: 0;
    height: auto;
  }

  .page-solutions .feature-list li {
    padding: 13px;
  }

  .page-solutions .platform-category,
  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child {
    padding: 22px;
  }

  .page-solutions .client-card {
    min-height: 184px;
  }

  .page-culture .culture-belief {
    padding-block: 78px;
  }

  .page-culture .culture-belief h2 {
    font-size: 42px;
  }

  .page-culture .principle {
    min-height: 0;
  }

  .page-solutions .site-footer,
  .page-culture .site-footer {
    padding-top: 178px;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / service routes — proportional compression (trunk-134)

   The route composition was structurally right but visually heavy: an over-wide
   shell, generous padding, oversized feature tiles, and min-heights that padded
   the left column to match the right. This block scales the whole thing down
   without changing the structure. Appended last so it wins the cascade.
   --------------------------------------------------------------------------- */

.page-solutions .solution-detail-list {
  width: min(78vw, 1180px);
  max-width: 1180px;
}

@media (min-width: 1025px) {

  .page-solutions .solution-detail {
    gap: clamp(20px, 1.9vw, 30px);
    padding: clamp(22px, 1.9vw, 26px);
    border-radius: 18px;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .045),
      inset 0 -1px 0 rgba(0, 0, 0, .38),
      0 18px 52px rgba(0, 0, 0, .18);
  }

  .page-solutions .solution-detail__title h2 {
    font-size: clamp(25px, 1.82vw, 33px);
  }

  .page-solutions .solution-detail__title > p:not(.section-label):not(.outcome) {
    min-height: 0;
    margin-top: var(--tk-2);
    font-size: clamp(16px, 1.06vw, 18px);
  }

  .page-solutions .solution-detail__title .outcome {
    min-height: 0;
    margin-top: auto;
    padding-top: var(--tk-2);
  }

  .page-solutions .solution-detail .outcome strong {
    margin-bottom: 8px;
  }

  .page-solutions .feature-list {
    gap: 7px 9px;
    margin-top: 10px;
  }

  .page-solutions .feature-list li {
    min-height: 66px;
    padding: 11px 12px;
    border-radius: 9px;
  }

  .page-solutions .feature-list li strong {
    font-size: clamp(13px, .8vw, 15px);
  }

  .page-solutions .feature-list li span {
    margin-top: 4px;
    font-size: clamp(11px, .63vw, 12.5px);
    line-height: 1.36;
  }

  .page-solutions .feature-list li:last-child:nth-child(odd) {
    min-height: 56px;
  }

  .page-solutions .solution-detail > .index-number {
    width: 40px;
    height: 40px;
  }

  .page-solutions .solution-detail > .index-number::after {
    width: 26px;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — editorial system rows (trunk-134)

   Replaces the 2x2 tinted card grid. No per-category accent colour, no glow,
   no pills, no rounded containers: four hairline-separated rows reading
   label -> category -> the systems it covers. Monochrome by design, so the
   route accents upstream stay the only colour on the page.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  max-width: 1120px;
  margin-inline: auto;
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.page-solutions .platform-category {
  --platform-accent: rgba(255, 255, 255, .55);
  position: relative;
  min-height: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, .58fr) minmax(0, 1fr);
  column-gap: clamp(20px, 2.4vw, 40px);
  row-gap: 6px;
  align-items: center;
  overflow: visible;
  padding: clamp(22px, 2vw, 30px) 0;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  border-radius: 0;
  background: none;
  box-shadow: none;
}

.page-solutions .platform-category:nth-child(2),
.page-solutions .platform-category:nth-child(3),
.page-solutions .platform-category:nth-child(4) {
  --platform-accent: rgba(255, 255, 255, .55);
}

.page-solutions .platform-category__icon {
  position: static;
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 30px;
  height: 30px;
  top: auto;
  right: auto;
  display: block;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: rgba(255, 255, 255, .46);
}

.page-solutions .platform-category__icon svg {
  width: 30px;
  height: 30px;
  stroke-width: 1.25;
}

.page-solutions .platform-category h3 {
  grid-column: 2;
  grid-row: 2;
  max-width: 18ch;
  margin-top: 0;
  color: var(--tk-white);
  font-size: clamp(19px, 1.24vw, 24px);
  font-weight: 500;
  line-height: 1.16;
}

.page-solutions .platform-category ul {
  grid-column: 3;
  grid-row: 1 / span 2;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 0;
  margin-top: 0;
  padding: 0;
  list-style: none;
}

.page-solutions .platform-category li {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--tk-gray);
  font-size: clamp(13px, .82vw, 15px);
  font-weight: 400;
  line-height: 1.4;
}

.page-solutions .platform-category li + li::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 3px;
  margin: 0 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .26);
  vertical-align: middle;
}

@media (max-width: 900px) {

  .page-solutions .platform-category {
    grid-template-columns: 28px minmax(0, 1fr);
    row-gap: 8px;
    align-items: start;
  }

  .page-solutions .platform-category__icon,
  .page-solutions .platform-category__icon svg {
    width: 26px;
    height: 26px;
  }

  .page-solutions .platform-category__icon {
    grid-row: 1;
  }

  .page-solutions .platform-category h3 {
    grid-column: 2;
    grid-row: 2;
    max-width: none;
  }

  .page-solutions .platform-category ul {
    grid-column: 2;
    grid-row: 3;
    margin-top: 4px;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — grain tiles (trunk-137)

   Same tile language as the service-route feature lists — bordered, frosted,
   grainy — but strictly monochrome: no per-category accent, no coloured glow.
   Every system gets its own framed card; the category label and title stay as
   plain editorial type on the left of the row.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category {
  grid-template-columns: 34px minmax(0, .44fr) minmax(0, 1fr);
  align-items: start;
  padding: clamp(20px, 1.8vw, 26px) 0;
}

.page-solutions .platform-category__icon {
  margin-top: 2px;
}

.page-solutions .platform-category h3 {
  max-width: 15ch;
  margin-top: 6px;
}

.page-solutions .platform-category ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 0;
}

.page-solutions .platform-category li {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 0;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, .085);
  border-radius: 10px;
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, .038) 0%,
    rgba(255, 255, 255, .012) 68%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035);
  color: var(--tk-white);
  font-size: clamp(13px, .8vw, 15px);
  font-weight: 400;
  line-height: 1.3;
}

.page-solutions .platform-category li::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .34;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

/* the dot separator belonged to the previous list treatment */
.page-solutions .platform-category li + li::before {
  content: none;
  margin: 0;
}

@media (max-width: 900px) {

  .page-solutions .platform-category ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 10px;
  }
}

@media (max-width: 560px) {

  .page-solutions .platform-category ul {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — framed category head (trunk-138)

   The label + title now sit in their own framed, grainy panel so the left of
   each row carries the same card language as the system tiles beside it.
   Still monochrome.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category__head {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 18px;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 12px;
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, .05) 0%,
    rgba(255, 255, 255, .014) 70%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
}

.page-solutions .platform-category__head::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .34;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.page-solutions .platform-category__head h3 {
  grid-column: auto;
  grid-row: auto;
  max-width: none;
  margin-top: 8px;
}

.page-solutions .platform-category ul {
  grid-column: 3;
  grid-row: 1 / span 2;
  align-content: start;
}

@media (max-width: 900px) {

  .page-solutions .platform-category__head {
    grid-column: 2;
    grid-row: 1;
  }

  .page-solutions .platform-category ul {
    grid-column: 2;
    grid-row: 2;
    margin-top: 10px;
  }

  .page-solutions .platform-category__icon {
    grid-row: 1;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — outer frame (trunk-139)

   Frame within a frame: each category row becomes its own panel that holds the
   framed head and the framed system tiles. The outer shell is deliberately
   quieter than what it contains — softer border, lighter grain — so the
   nesting reads as depth rather than noise. Still monochrome.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category-grid {
  gap: 12px;
  border-top: 0;
}

.page-solutions .platform-category {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(16px, 1.4vw, 20px);
  border: 1px solid rgba(255, 255, 255, .07);
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  border-radius: 16px;
  background: linear-gradient(
    150deg,
    rgba(255, 255, 255, .022) 0%,
    rgba(8, 9, 11, .5) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .028);
}

.page-solutions .platform-category::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .22;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.page-solutions .platform-category__icon {
  margin-top: 4px;
  margin-left: 4px;
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — circular accent icons (trunk-140)

   The cards stay monochrome; colour returns only in the icon. Each category
   gets a dark circular chip with the route accent as the glyph stroke, a thin
   accent ring and a low bloom behind it — enough to read as a signal without
   tinting the surrounding surfaces.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category {
  --icon-accent: var(--tk-steel);
  grid-template-columns: 46px minmax(0, .44fr) minmax(0, 1fr);
}

.page-solutions .platform-category:nth-child(2) {
  --icon-accent: var(--tk-green);
}

.page-solutions .platform-category:nth-child(3) {
  --icon-accent: var(--tk-violet);
}

.page-solutions .platform-category:nth-child(4) {
  --icon-accent: var(--tk-amber);
}

.page-solutions .platform-category__icon {
  position: relative;
  width: 46px;
  height: 46px;
  margin: 2px 0 0;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--icon-accent) 30%, rgba(255, 255, 255, .08));
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--icon-accent) 13%, transparent) 0%, transparent 68%),
    rgba(10, 11, 13, .88);
  box-shadow:
    0 0 18px color-mix(in srgb, var(--icon-accent) 16%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, .05);
  color: var(--icon-accent);
}

.page-solutions .platform-category__icon svg {
  width: 22px;
  height: 22px;
  stroke-width: 1.6;
}

@media (max-width: 900px) {

  .page-solutions .platform-category {
    grid-template-columns: 46px minmax(0, 1fr);
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — unframed head (trunk-141)

   The head panel is dropped back to plain editorial type. The nesting now runs
   outer panel -> system tiles only, so the label and title read as the row's
   voice rather than as another competing box.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category__head {
  padding: 0 clamp(12px, 1.2vw, 20px) 0 4px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

.page-solutions .platform-category__head::after {
  content: none;
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — solid icon chip (trunk-142)

   One icon colour across all four categories, no bloom. Contrast comes from a
   flat dark chip and a heavier stroke rather than from glow.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category,
.page-solutions .platform-category:nth-child(2),
.page-solutions .platform-category:nth-child(3),
.page-solutions .platform-category:nth-child(4) {
  --icon-accent: var(--brand-signal);
}

.page-solutions .platform-category__icon {
  border: 1px solid color-mix(in srgb, var(--icon-accent) 46%, rgba(255, 255, 255, .06));
  background: #0B0C0E;
  box-shadow: none;
  color: var(--icon-accent);
}

.page-solutions .platform-category__icon svg {
  stroke-width: 2;
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — icon chip matched to reference (trunk-143)

   Three things separated the chip from the reference: a hard accent ring that
   read louder than the glyph, a chip darker than the page so nothing lifted off
   the background, and a thin outline glyph at 22px. The ring is gone, the chip
   is now a soft grey disc, and the glyph is larger, heavier and lifted a step
   off the brand signal so it actually carries against the surface.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category__icon {
  width: 48px;
  height: 48px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .058);
  box-shadow: none;
  color: color-mix(in srgb, var(--icon-accent) 84%, #FFFFFF);
}

.page-solutions .platform-category__icon svg {
  width: 25px;
  height: 25px;
  stroke-width: 2.1;
}

@media (max-width: 900px) {

  .page-solutions .platform-category {
    grid-template-columns: 48px minmax(0, 1fr);
  }
}

/* ---------------------------------------------------------------------------
   Solutions / service routes — service name promoted (trunk-144)

   The service name is the primary identifier of each route, not a caption.
   Larger, wider tracking, brighter accent, and more room beneath it before the
   headline so it holds its own rank in the composition.
   --------------------------------------------------------------------------- */

.page-solutions .solution-detail__title .section-label {
  margin-bottom: 0;
  color: color-mix(in srgb, var(--route-accent) 88%, #FFFFFF);
  font-size: clamp(14px, .95vw, 17px);
  font-weight: 600;
  letter-spacing: .1em;
  line-height: 1.25;
}

.page-solutions .solution-detail__title .section-label::before {
  width: 6px;
  height: 6px;
  margin-right: 10px;
  vertical-align: middle;
}

@media (min-width: 1025px) {

  .page-solutions .solution-detail__title h2 {
    margin-top: var(--tk-2);
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — category label removed (trunk-145)

   The category names were restating the titles beside them. With the label
   gone the head is a single line of type, so it centres against the tile
   column instead of stacking.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category__head {
  justify-content: center;
}

.page-solutions .platform-category__head h3 {
  margin-top: 0;
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — consistency pass (trunk-146)

   Four fixes for an even read down the section:

   1. Tiles were top-aligned inside a vertically centred panel, so two-row
      categories carried more space below than above. Both columns now centre.
   2. Panel padding is a single symmetric value instead of a clamp that drifted
      against the fixed 8px tile gap.
   3. Every tile gets the same fixed height, so a two-item row and a four-item
      row share one rhythm.
   4. The category title now carries the icon colour, tying the two halves of
      the row together.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category {
  align-items: center;
  padding: 20px;
}

.page-solutions .platform-category__head {
  justify-content: center;
  padding: 0 clamp(16px, 1.6vw, 28px) 0 6px;
}

.page-solutions .platform-category__head h3 {
  margin-top: 0;
  color: color-mix(in srgb, var(--icon-accent) 84%, #FFFFFF);
  font-size: clamp(19px, 1.26vw, 24px);
  font-weight: 500;
  line-height: 1.2;
}

.page-solutions .platform-category ul {
  align-content: center;
  gap: 8px;
}

.page-solutions .platform-category li {
  min-height: 48px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  border-radius: 10px;
  font-size: clamp(13px, .82vw, 15px);
  line-height: 1.25;
}

.page-solutions .platform-category__icon {
  align-self: center;
  margin: 0;
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — optical icon normalisation (trunk-147)

   All four glyphs share a 48-unit viewBox but their drawings fill very
   different amounts of it: the database occupies roughly 26x30 units, the
   chat bubbles 39x29, the document 27x38, the node cluster 38x34. Rendering
   all four at one fixed pixel size therefore produced four different apparent
   sizes and four different apparent line weights.

   Each icon is scaled so its longest drawn edge lands on ~26px, and its
   stroke-width is compensated in viewBox units so every glyph resolves to the
   same ~1.9px line on screen. The chips stay identical; only the artwork is
   normalised.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category__icon {
  width: 48px;
  height: 48px;
  align-self: center;
  display: grid;
  place-items: center;
  line-height: 0;
}

.page-solutions .platform-category__icon svg {
  display: block;
  width: 33px;
  height: 33px;
  stroke-width: 2.76;
}

/* database — tallest-narrowest drawing, needs the largest box */
.page-solutions .platform-category:nth-child(1) .platform-category__icon svg {
  width: 42px;
  height: 42px;
  stroke-width: 2.17;
}

/* chat bubbles */
.page-solutions .platform-category:nth-child(2) .platform-category__icon svg {
  width: 32px;
  height: 32px;
  stroke-width: 2.85;
}

/* document */
.page-solutions .platform-category:nth-child(3) .platform-category__icon svg {
  width: 33px;
  height: 33px;
  stroke-width: 2.76;
}

/* node cluster */
.page-solutions .platform-category:nth-child(4) .platform-category__icon svg {
  width: 33px;
  height: 33px;
  stroke-width: 2.76;
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — single-row alignment (trunk-148)

   The row was still a two-row grid left over from when the category label sat
   above the title, and every child spanned both rows. The 6px row-gap and the
   implicit row sizing meant the icon, the title and the tile column each
   resolved their centre against a slightly different box, which is the drift
   visible down the left edge.

   The grid is now a single row of three cells, all centred on one axis. The
   icon column is also widened to the full chip so the disc centres properly
   instead of being nudged by its own margin.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category {
  grid-template-columns: 48px minmax(0, .44fr) minmax(0, 1fr);
  grid-template-rows: auto;
  row-gap: 0;
  align-items: center;
}

.page-solutions .platform-category__icon,
.page-solutions .platform-category__head,
.page-solutions .platform-category ul {
  grid-row: 1;
  align-self: center;
}

.page-solutions .platform-category__icon {
  grid-column: 1;
  margin: 0;
}

.page-solutions .platform-category__head {
  grid-column: 2;
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 0 clamp(16px, 1.6vw, 28px) 0 6px;
}

.page-solutions .platform-category__head h3 {
  margin: 0;
}

.page-solutions .platform-category ul {
  grid-column: 3;
  align-content: center;
}

@media (max-width: 900px) {

  .page-solutions .platform-category {
    grid-template-columns: 48px minmax(0, 1fr);
    row-gap: 12px;
  }

  .page-solutions .platform-category__icon {
    grid-row: 1;
    grid-column: 1;
  }

  .page-solutions .platform-category__head {
    grid-row: 1;
    grid-column: 2;
  }

  .page-solutions .platform-category ul {
    grid-row: 2;
    grid-column: 1 / -1;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — equal panels (trunk-149)

   The panels were sized by their contents, so the two four-system categories
   stood ~55px taller than the two two-system ones. Nothing was misaligned, but
   four different heights read as four different components.

   Every panel is now the height of the tallest case (two tile rows plus
   padding). The shorter categories keep 48px tiles and simply centre them in
   the extra room, so tile size stays constant down the whole section and only
   the breathing space varies.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category {
  min-height: 144px;
  align-content: center;
}

.page-solutions .platform-category ul {
  min-height: 104px;
  align-content: center;
}

@media (max-width: 900px) {

  .page-solutions .platform-category {
    min-height: 0;
  }

  .page-solutions .platform-category ul {
    min-height: 0;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — colour roles swapped (trunk-150)

   The title was inheriting justify-content:center from when the head was a
   vertical stack; as a flex row that centred the text horizontally. It is now
   flush left.

   Colour roles also swap: the category title returns to white and carries the
   row on weight alone, while the supporting system names take the theme
   colour. The icon keeps the accent, so the accent now reads as "the detail
   layer" rather than as the heading colour.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category__head {
  justify-content: flex-start;
  text-align: left;
}

.page-solutions .platform-category__head h3 {
  color: var(--tk-white);
  text-align: left;
}

.page-solutions .platform-category li {
  color: color-mix(in srgb, var(--icon-accent) 84%, #FFFFFF);
}

/* ---------------------------------------------------------------------------
   Solutions / connected environment — system names promoted (trunk-151)

   These are the concrete systems a reader scans for, so they get real weight:
   larger, semibold, and lifted further off the accent for legibility on the
   frosted tile. Tile height and padding grow with the type so the cards keep
   their proportions.
   --------------------------------------------------------------------------- */

.page-solutions .platform-category li {
  min-height: 54px;
  padding: 0 18px;
  color: color-mix(in srgb, var(--icon-accent) 74%, #FFFFFF);
  font-size: clamp(15px, .98vw, 17px);
  font-weight: 600;
  letter-spacing: -.005em;
  line-height: 1.3;
}

.page-solutions .platform-category ul {
  min-height: 116px;
}

.page-solutions .platform-category {
  min-height: 156px;
}

@media (max-width: 900px) {

  .page-solutions .platform-category,
  .page-solutions .platform-category ul {
    min-height: 0;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / deployment — recomposed (trunk-152)

   Two problems with the old block. The split heading pushed the supporting
   paragraph to the far right of a 4-column-wide row, leaving a large dead void
   between the two, and then a ~120px gap before the cards. And the cards spoke
   a different language from the rest of the page: four accent colours, glossy
   coloured spheres, and a fixed 70px drop before each title that left the body
   copy stranded at the bottom.

   The heading is now centred and larger with the paragraph directly beneath it
   on a readable measure. The cards adopt the connected-environment language:
   monochrome frosted panels, grain, one theme accent, and a numbered index
   rule in place of the spheres. Content is evenly stacked instead of
   bottom-weighted.
   --------------------------------------------------------------------------- */

.page-solutions .solutions-deployment .split-heading {
  display: block;
  max-width: 900px;
  margin-inline: auto;
  padding-bottom: clamp(30px, 2.8vw, 44px);
  text-align: center;
}

.page-solutions .solutions-deployment .split-heading .section-label {
  justify-content: center;
  text-align: center;
}

.page-solutions .solutions-deployment .split-heading h2 {
  max-width: none;
  margin-inline: auto;
  font-size: clamp(38px, 3.4vw, 60px);
  line-height: 1.02;
}

.page-solutions .solutions-deployment .split-heading__body {
  max-width: 660px;
  margin: var(--tk-3) auto 0;
  padding: 0;
  border: 0;
}

.page-solutions .solutions-deployment .split-heading__body p {
  margin: 0;
  color: var(--tk-gray);
  font-size: clamp(15px, .95vw, 17px);
  line-height: 1.55;
  text-align: center;
}

/* cards */

.page-solutions .deployment-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  --deployment-accent: var(--brand-signal);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 16px;
  background: linear-gradient(
    150deg,
    rgba(255, 255, 255, .022) 0%,
    rgba(8, 9, 11, .5) 100%
  );
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .028);
}

.page-solutions .deployment-grid article:nth-child(2),
.page-solutions .deployment-grid article:nth-child(3),
.page-solutions .deployment-grid article:nth-child(4) {
  --deployment-accent: var(--brand-signal);
}

.page-solutions .deployment-grid article::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .22;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

/* the coloured sphere is replaced by a short accent rule */
.page-solutions .deployment-grid article::before {
  content: "";
  position: static;
  width: 26px;
  height: 2px;
  margin-bottom: 16px;
  border: 0;
  border-radius: 0;
  background: color-mix(in srgb, var(--deployment-accent) 84%, #FFFFFF);
  box-shadow: none;
}

.page-solutions .deployment-card__label {
  color: color-mix(in srgb, var(--deployment-accent) 78%, #FFFFFF);
  font-size: clamp(12px, .76vw, 13px);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.page-solutions .deployment-grid h3 {
  margin-top: 10px;
  color: var(--tk-white);
  font-size: clamp(19px, 1.28vw, 23px);
  font-weight: 500;
  line-height: 1.18;
}

.page-solutions .deployment-grid p {
  margin-top: 12px;
  color: var(--tk-gray);
  font-size: clamp(14px, .84vw, 15px);
  font-weight: 400;
  line-height: 1.5;
}

@media (max-width: 1024px) {

  .page-solutions .deployment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {

  .page-solutions .deployment-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-solutions .solutions-deployment .split-heading h2 {
    font-size: clamp(30px, 8vw, 40px);
  }
}

/* ---------------------------------------------------------------------------
   Solutions / deployment — reference card treatment (trunk-155)

   Matches the referenced card: a soft 26px radius, generous padding, a tall
   panel with content held to the top, and a single low bloom bleeding in from
   one corner instead of a flat fill. The accent rule moves to the foot of the
   card as a closing detail, the way the reference ends on its link row.
   --------------------------------------------------------------------------- */

.page-solutions .deployment-grid {
  gap: 14px;
}

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  min-height: 340px;
  padding: clamp(24px, 2vw, 30px);
  border: 1px solid rgba(255, 255, 255, .075);
  border-radius: 26px;
  background:
    radial-gradient(
      120% 90% at 88% 6%,
      color-mix(in srgb, var(--deployment-accent) 14%, transparent) 0%,
      transparent 58%
    ),
    linear-gradient(160deg, rgba(255, 255, 255, .026) 0%, rgba(8, 9, 11, .62) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    0 22px 60px rgba(0, 0, 0, .28);
}

/* accent rule becomes the closing detail at the foot of the card */
.page-solutions .deployment-grid article::before {
  order: 2;
  width: 30px;
  height: 2px;
  margin: auto 0 0;
  background: color-mix(in srgb, var(--deployment-accent) 88%, #FFFFFF);
}

.page-solutions .deployment-card__label {
  order: 0;
  font-size: clamp(12px, .78vw, 13px);
}

.page-solutions .deployment-grid h3 {
  order: 0;
  margin-top: 14px;
  font-size: clamp(21px, 1.45vw, 27px);
  line-height: 1.14;
  letter-spacing: -.015em;
}

.page-solutions .deployment-grid p {
  order: 1;
  margin-top: 14px;
  padding-bottom: 24px;
  font-size: clamp(14px, .86vw, 16px);
  line-height: 1.55;
}

@media (max-width: 1024px) {

  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child {
    min-height: 280px;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / deployment — scaled up (trunk-156)

   Four columns capped each card at roughly 280px, which is why the type had to
   stay small and the cards read as strips rather than as the referenced panel.
   Two columns give each card ~570px, close to the reference proportion, and
   the type scales up with it.
   --------------------------------------------------------------------------- */

.page-solutions .deployment-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  max-width: 1180px;
  margin-inline: auto;
}

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  min-height: 300px;
  padding: clamp(30px, 2.6vw, 40px);
  border-radius: 28px;
}

.page-solutions .deployment-card__label {
  font-size: clamp(13px, .86vw, 15px);
  letter-spacing: .09em;
}

.page-solutions .deployment-grid h3 {
  margin-top: 18px;
  font-size: clamp(26px, 2.05vw, 38px);
  line-height: 1.1;
}

.page-solutions .deployment-grid p {
  max-width: 46ch;
  margin-top: 18px;
  padding-bottom: 30px;
  font-size: clamp(16px, 1.06vw, 19px);
  line-height: 1.5;
}

.page-solutions .deployment-grid article::before {
  width: 36px;
  height: 2px;
}

@media (max-width: 900px) {

  .page-solutions .deployment-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child {
    min-height: 0;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / deployment — reference proportions (trunk-157)

   The reference card is close to square (roughly 700x737, ratio ~0.95) with a
   deliberate hold between the mark at the top and the headline about a third
   of the way down, then the body copy, then the closing row pinned to the
   foot. Locking an aspect-ratio rather than a min-height keeps that shape at
   any column width.
   --------------------------------------------------------------------------- */

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  min-height: 0;
  aspect-ratio: 40 / 42;
  padding: clamp(32px, 3vw, 46px);
}

.page-solutions .deployment-card__label {
  order: 0;
}

.page-solutions .deployment-grid h3 {
  order: 0;
  margin-top: clamp(48px, 8vw, 118px);
  font-size: clamp(26px, 2.15vw, 40px);
}

.page-solutions .deployment-grid p {
  order: 1;
  margin-top: 20px;
  padding-bottom: 0;
}

.page-solutions .deployment-grid article::before {
  order: 2;
  margin-top: auto;
}

@media (max-width: 900px) {

  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child {
    aspect-ratio: auto;
    min-height: 340px;
  }

  .page-solutions .deployment-grid h3 {
    margin-top: 40px;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / transformation roadmap — spine + diagram layout (trunk-158)

   The three phases were three equal columns of bullet text, which flattened a
   sequence into a comparison table. They are now full-width chapters stacked
   down a vertical spine: copy on the left, a node on the spine, and a purpose
   drawn diagram on the right.

   The diagrams are inline SVG built from the same primitives as the rest of
   the page — hairline rects, dashed connectors, one accent — and each one says
   what its phase does:

     01 Enable   loose systems dropping onto a shared foundation rail
     02 Connect  four systems bound through a single intelligence node
     03 Empower  three signal streams resolving into one recommendation

   No raster artwork and no external imagery.
   --------------------------------------------------------------------------- */

.page-solutions .roadmap-track {
  position: relative;
  max-width: 1180px;
  margin: clamp(40px, 4vw, 64px) auto 0;
  display: grid;
  gap: clamp(48px, 5vw, 92px);
}

/* the spine */
.page-solutions .roadmap-track::before {
  content: "";
  position: absolute;
  top: 24px;
  bottom: 24px;
  left: calc(42% + 30px);
  width: 1px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(255, 255, 255, .16) 8%,
    rgba(255, 255, 255, .16) 92%,
    transparent 100%
  );
}

.page-solutions .roadmap-phase {
  position: relative;
  display: grid;
  grid-template-columns: 42% 60px minmax(0, 1fr);
  align-items: center;
  gap: 0;
}

/* node on the spine, plus the connector that reaches back to the copy */
.page-solutions .roadmap-phase::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: calc(42% + 24px);
  top: 50%;
  width: 13px;
  height: 13px;
  margin-top: -6.5px;
  border-radius: 50%;
  background: var(--brand-signal);
  box-shadow: 0 0 0 5px rgba(201, 106, 125, .14);
}

.page-solutions .roadmap-phase::after {
  content: "";
  position: absolute;
  left: calc(42% - 34px);
  top: 50%;
  width: 58px;
  height: 1px;
  background: rgba(255, 255, 255, .16);
}

.page-solutions .roadmap-phase__copy {
  grid-column: 1;
  padding-right: clamp(30px, 3vw, 52px);
}

.page-solutions .roadmap-phase__label {
  display: flex;
  align-items: baseline;
  gap: 12px;
  color: var(--tk-gray-muted);
  font-size: clamp(12px, .78vw, 13px);
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.page-solutions .roadmap-phase__label em {
  color: var(--brand-rose);
  font-size: clamp(13px, .86vw, 15px);
  font-style: normal;
  font-weight: 700;
  letter-spacing: .04em;
}

.page-solutions .roadmap-phase h3 {
  margin-top: 16px;
  color: var(--tk-white);
  font-size: clamp(44px, 4.2vw, 78px);
  font-weight: 500;
  letter-spacing: -.03em;
  line-height: .98;
}

.page-solutions .roadmap-phase h4 {
  max-width: 30ch;
  margin-top: 14px;
  color: var(--tk-gray-blue);
  font-size: clamp(16px, 1.08vw, 20px);
  font-weight: 300;
  line-height: 1.45;
}

.page-solutions .roadmap-phase ul {
  margin: clamp(22px, 2.2vw, 32px) 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(255, 255, 255, .09);
}

.page-solutions .roadmap-phase li {
  padding: 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
  color: var(--tk-gray);
  font-size: clamp(14px, .88vw, 16px);
  font-weight: 400;
  line-height: 1.35;
}

/* diagram panel */

.page-solutions .roadmap-phase__figure {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-column: 3;
  padding: clamp(22px, 2.2vw, 34px);
  border: 1px solid rgba(255, 255, 255, .075);
  border-radius: 24px;
  background:
    radial-gradient(120% 90% at 86% 8%, rgba(201, 106, 125, .1) 0%, transparent 58%),
    linear-gradient(160deg, rgba(255, 255, 255, .024) 0%, rgba(8, 9, 11, .6) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .03),
    0 22px 60px rgba(0, 0, 0, .26);
}

.page-solutions .roadmap-phase__figure::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .22;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.page-solutions .roadmap-phase__figure svg {
  display: block;
  width: 100%;
  height: auto;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-solutions .roadmap-phase__figure .rm-dim {
  stroke: rgba(255, 255, 255, .18);
  stroke-width: 1.25;
}

.page-solutions .roadmap-phase__figure .rm-dash {
  stroke: rgba(255, 255, 255, .22);
  stroke-width: 1.15;
  stroke-dasharray: 4 6;
}

.page-solutions .roadmap-phase__figure .rm-tick {
  stroke: rgba(255, 255, 255, .3);
  stroke-width: 1.15;
}

.page-solutions .roadmap-phase__figure .rm-accent-line {
  stroke: var(--brand-rose);
  stroke-width: 1.6;
}

.page-solutions .roadmap-phase__figure .rm-accent {
  stroke: var(--brand-rose);
  stroke-width: 1.8;
}

.page-solutions .roadmap-phase__figure .rm-accent-dot {
  fill: var(--brand-rose);
  stroke: none;
}

.page-solutions .roadmap-phase__figure .rm-bars {
  stroke: var(--brand-rose);
  stroke-width: 6;
}

.page-solutions .roadmap-phase__figure .rm-out {
  stroke: rgba(255, 255, 255, .34);
  stroke-width: 1.25;
}

/* heading */

.page-solutions .solutions-roadmap > .shell > h2 {
  max-width: none;
  font-size: clamp(40px, 3.8vw, 66px);
}

@media (max-width: 1024px) {

  .page-solutions .roadmap-track::before,
  .page-solutions .roadmap-phase::before,
  .page-solutions .roadmap-phase::after {
    content: none;
  }

  .page-solutions .roadmap-phase {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
  }

  .page-solutions .roadmap-phase__copy {
    grid-column: 1;
    padding-right: 0;
  }

  .page-solutions .roadmap-phase__figure {
    grid-column: 1;
  }

  .page-solutions .roadmap-phase h3 {
    font-size: clamp(38px, 9vw, 56px);
  }
}

/* ---------------------------------------------------------------------------
   Solutions / roadmap spine — braced rail (trunk-159)

   The spine was a 1px hairline crossed by a flat T connector. The reference
   rail is heavier and, more importantly, the trunk itself bends: it runs down,
   curves left to meet the branch, then curves back and continues. So the
   continuous track line is dropped and each phase draws its own rail —
   two straight segments that overrun into the gaps to meet their neighbours,
   plus two radiused corners forming the brace at the junction.

   Weight goes to 2px and the stroke carries the page's noise so it reads as
   drawn rather than as a border.
   --------------------------------------------------------------------------- */

.page-solutions .roadmap-track {
  --rm-gap: clamp(48px, 5vw, 92px);
  --rm-x: calc(42% + 30px);
  --rm-stroke: rgba(255, 255, 255, .34);
  gap: var(--rm-gap);
}

.page-solutions .roadmap-track::before {
  content: none;
}

/* rail segment shared look */
.page-solutions .roadmap-phase::before,
.page-solutions .roadmap-phase::after {
  content: "";
  position: absolute;
  left: var(--rm-x);
  width: 2px;
  margin: 0;
  border-radius: 0;
  background-color: var(--rm-stroke);
  background-image: url("frost-noise.svg");
  background-size: 90px 90px;
  background-blend-mode: overlay;
  box-shadow: none;
}

/* upper segment: from above the phase down to the top of the brace */
.page-solutions .roadmap-phase::before {
  top: calc(var(--rm-gap) / -2 - 1px);
  height: calc(50% + var(--rm-gap) / 2 - 34px);
}

/* lower segment: from the bottom of the brace down past the phase */
.page-solutions .roadmap-phase::after {
  top: calc(50% + 34px);
  height: calc(50% + var(--rm-gap) / 2 - 34px);
}

.page-solutions .roadmap-phase:first-child::before {
  top: 0;
  height: calc(50% - 34px);
}

.page-solutions .roadmap-phase:last-child::after {
  height: calc(50% - 34px);
}

/* the brace: two radiused corners meeting on the phase's centre line */
.page-solutions .rm-brace {
  position: absolute;
  z-index: 1;
  left: calc(var(--rm-x) - 30px);
  top: 50%;
  width: 32px;
  height: 68px;
  margin-top: -34px;
  pointer-events: none;
}

.page-solutions .rm-brace i,
.page-solutions .rm-brace b {
  position: absolute;
  right: 0;
  width: 32px;
  height: 34px;
  border-right: 2px solid var(--rm-stroke);
}

.page-solutions .rm-brace i {
  top: 0;
  border-bottom: 2px solid var(--rm-stroke);
  border-bottom-right-radius: 20px;
}

.page-solutions .rm-brace b {
  bottom: 0;
  border-top: 2px solid var(--rm-stroke);
  border-top-right-radius: 20px;
}

/* the branch running back to the copy */
.page-solutions .rm-brace::before {
  content: "";
  position: absolute;
  right: 30px;
  top: 50%;
  width: clamp(40px, 4vw, 74px);
  height: 2px;
  margin-top: -1px;
  background-color: var(--rm-stroke);
  background-image: url("frost-noise.svg");
  background-size: 90px 90px;
  background-blend-mode: overlay;
}

@media (max-width: 1024px) {

  .page-solutions .rm-brace {
    display: none;
  }

  .page-solutions .roadmap-phase::before,
  .page-solutions .roadmap-phase::after {
    content: none;
  }
}

/* Centre the Transformation Roadmap heading */
.page-solutions .solutions-roadmap > .shell > h2 {
  text-align: center;
  margin-inline: auto;
}

/* ---------------------------------------------------------------------------
   Roadmap rail: one continuous stroke
   Every piece of the rail (straight segments, brace corners, branch) now uses
   the same flat stroke colour and the same 2px weight, and the joints overlap
   by 1px so nothing reads as a cut. The phase number sits inside the brace
   pocket, on the rail itself, instead of above the label.
   --------------------------------------------------------------------------- */

/* drop the noise blend from the straight bars — it was what made the joints
   read lighter than the bordered corners */
.page-solutions .roadmap-phase::before,
.page-solutions .roadmap-phase::after,
.page-solutions .rm-brace::before {
  background-image: none;
  background-blend-mode: normal;
  background-color: var(--rm-stroke);
}

/* overlap the straight segments into the brace corners */
.page-solutions .roadmap-phase::before {
  height: calc(50% + var(--rm-gap) / 2 - 33px);
}

.page-solutions .roadmap-phase::after {
  top: calc(50% + 33px);
  height: calc(50% + var(--rm-gap) / 2 - 33px);
}

.page-solutions .roadmap-phase:first-child::before {
  height: calc(50% - 33px);
}

.page-solutions .roadmap-phase:last-child::after {
  height: calc(50% - 33px);
}

/* corners: both halves now land their horizontal stroke on the exact same
   two pixels, so the brace tip is 2px thick like the rest of the rail
   instead of the 4px double line it used to be */
.page-solutions .rm-brace i,
.page-solutions .rm-brace b {
  box-sizing: border-box;
  height: 35px;
}

.page-solutions .rm-brace i {
  top: 0;
}

.page-solutions .rm-brace b {
  bottom: 0;
}

/* the branch tucks 2px under the corner ends */
.page-solutions .rm-brace::before {
  right: 29px;
  width: calc(clamp(40px, 4vw, 74px) + 1px);
}

/* phase number, seated in the brace pocket on the rail */
.page-solutions .rm-brace::after {
  content: attr(data-phase);
  position: absolute;
  left: 38px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--brand-rose);
  font-size: clamp(12px, .8vw, 15px);
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1;
}

/* the label keeps the number only where the rail is hidden */
.page-solutions .roadmap-phase__label em {
  display: none;
}

@media (max-width: 1024px) {

  .page-solutions .roadmap-phase__label em {
    display: inline;
  }
}

/* opaque stroke: the rail is assembled from several overlapping pieces, and a
   translucent colour makes every overlap read as a brighter nick. This is the
   exact same value composited over the section background, so the joints
   disappear and the rail reads as one stroke. */
.page-solutions .roadmap-track {
  --rm-stroke: rgb(92, 93, 94);
}

/* ---------------------------------------------------------------------------
   Roadmap node: straight rail through a circular number badge
   The brace detour is dropped — the rail now runs dead straight and passes
   through a disc carrying the phase number, with the branch to the copy
   leaving from the disc's left edge.
   --------------------------------------------------------------------------- */

/* rail: two segments meeting on the phase centre line, no gap */
.page-solutions .roadmap-phase::before {
  z-index: 2;
  top: calc(var(--rm-gap) / -2 - 1px);
  height: calc(50% + var(--rm-gap) / 2 + 1px);
}

.page-solutions .roadmap-phase::after {
  z-index: 2;
  top: 50%;
  height: calc(50% + var(--rm-gap) / 2 + 1px);
}

.page-solutions .roadmap-phase:first-child::before {
  top: 0;
  height: 50%;
}

.page-solutions .roadmap-phase:last-child::after {
  height: 50%;
}

/* the disc, centred on the rail */
.page-solutions .rm-brace {
  z-index: 1;
  left: calc(var(--rm-x) - 21px);
  top: 50%;
  width: 44px;
  height: 44px;
  margin-top: -22px;
  border-radius: 50%;
  background: rgb(23, 24, 27);
}

.page-solutions .rm-brace i,
.page-solutions .rm-brace b {
  display: none;
}

/* branch out of the disc's left edge, back to the copy */
.page-solutions .rm-brace::before {
  right: 44px;
  width: clamp(40px, 4vw, 74px);
}

/* the number: letter-spaced so the rail passes cleanly between the digits */
.page-solutions .rm-brace::after {
  content: attr(data-phase);
  position: absolute;
  inset: 0;
  left: 0;
  top: 0;
  transform: none;
  display: grid;
  place-items: center;
  color: var(--brand-rose);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .62em;
  text-indent: .62em;
  line-height: 1;
}

/* ---------------------------------------------------------------------------
   Client showcase: centred heading
   The "Selected clients" eyebrow is gone, so the heading is a single centred
   column rather than a two-column split.
   --------------------------------------------------------------------------- */

.page-solutions .client-showcase__heading {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  text-align: center;
}

.page-solutions .client-showcase__heading h2 {
  max-width: none;
}

/* ---------------------------------------------------------------------------
   Deployment cards: tighter
   The near-square card left a lot of dead air between the label and the
   headline. Shorter proportion, tighter padding and a smaller hold bring the
   block down without changing the layout.
   --------------------------------------------------------------------------- */

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:first-child {
  aspect-ratio: 40 / 24;
  padding: clamp(22px, 1.9vw, 32px);
}

.page-solutions .deployment-grid h3 {
  margin-top: clamp(20px, 2.4vw, 38px);
  font-size: clamp(21px, 1.65vw, 30px);
}

.page-solutions .deployment-grid p {
  margin-top: 14px;
  font-size: clamp(14px, .95vw, 16px);
}

@media (max-width: 900px) {

  .page-solutions .deployment-grid article,
  .page-solutions .deployment-grid article:first-child {
    aspect-ratio: auto;
    min-height: 0;
  }

  .page-solutions .deployment-grid h3 {
    margin-top: 28px;
  }
}

/* pull the grid up under the deployment heading */
.page-solutions .solutions-deployment .split-heading {
  padding-bottom: clamp(26px, 2.6vw, 42px);
}

/* ---------------------------------------------------------------------------
   Roadmap, final arrangement (per reference)
   The brace comes back — the rail curves out to the copy at the phase's
   centre line — and the numbered disc moves down onto a clean straight run of
   the rail, so it no longer sits on top of the branch and the list rules.
   --------------------------------------------------------------------------- */

/* rail: gap at the centre again for the brace */
.page-solutions .roadmap-phase::before {
  z-index: 2;
  top: calc(var(--rm-gap) / -2 - 1px);
  height: calc(50% + var(--rm-gap) / 2 - 33px);
}

.page-solutions .roadmap-phase::after {
  z-index: 2;
  top: calc(50% + 33px);
  height: calc(50% + var(--rm-gap) / 2 - 33px);
}

.page-solutions .roadmap-phase:first-child::before {
  top: 0;
  height: calc(50% - 33px);
}

.page-solutions .roadmap-phase:last-child::after {
  height: calc(50% - 33px);
}

/* brace back to the two radiused corners, no disc, no number */
.page-solutions .rm-brace {
  z-index: 2;
  left: calc(var(--rm-x) - 30px);
  top: 50%;
  width: 32px;
  height: 68px;
  margin-top: -34px;
  border-radius: 0;
  background: none;
}

.page-solutions .rm-brace i,
.page-solutions .rm-brace b {
  display: block;
}

.page-solutions .rm-brace::before {
  right: 29px;
  width: calc(clamp(40px, 4vw, 74px) + 1px);
}

.page-solutions .rm-brace::after {
  content: none;
}

/* the numbered disc, low on the straight rail */
.page-solutions .rm-num {
  position: absolute;
  z-index: 1;
  left: calc(var(--rm-x) - 21px);
  top: 78%;
  width: 44px;
  height: 44px;
  margin-top: -22px;
  border-radius: 50%;
  background: rgb(23, 24, 27);
  pointer-events: none;
}

.page-solutions .rm-num::after {
  content: attr(data-phase);
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--brand-rose);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .62em;
  text-indent: .62em;
  line-height: 1;
}

@media (max-width: 1024px) {

  .page-solutions .rm-num {
    display: none;
  }
}

/* the platform heading is a full sentence now — let it wrap */
.page-solutions .platform-section-header h2 {
  max-width: 18ch;
  font-size: clamp(38px, 3.6vw, 62px);
  line-height: 1;
  white-space: normal;
}

/* ---------------------------------------------------------------------------
   Numbered disc, finished
   The rail now stops at the disc instead of running through the digits, and
   the disc itself carries the page's frost grain plus a soft light falling
   from above, so it reads as an object sitting on the line rather than a hole
   punched in it.
   --------------------------------------------------------------------------- */

.page-solutions .rm-num {
  z-index: 3;
  left: calc(var(--rm-x) - 25px);
  width: 52px;
  height: 52px;
  margin-top: -26px;
  background-color: rgb(19, 20, 23);
  background-image:
    url("frost-noise.svg"),
    radial-gradient(
      124% 124% at 50% 8%,
      rgba(255, 255, 255, .14) 0%,
      rgba(255, 255, 255, .045) 42%,
      rgba(255, 255, 255, 0) 74%
    );
  background-size: 90px 90px, cover;
  background-position: center, center;
  background-blend-mode: overlay, normal;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .10),
    inset 0 0 0 1px rgba(255, 255, 255, .06),
    0 0 26px rgba(255, 255, 255, .05),
    0 8px 24px rgba(0, 0, 0, .55);
}

.page-solutions .rm-num::after {
  letter-spacing: .1em;
  text-indent: .1em;
  font-size: 14px;
  color: var(--brand-rose);
}

/* platform heading: two fixed lines, centred */
.page-solutions .platform-section-header h2 {
  max-width: none;
  font-size: clamp(34px, 3.2vw, 56px);
  line-height: 1.04;
}

.page-solutions .platform-section-header h2 .section-heading-line {
  display: block;
  white-space: nowrap;
}

@media (max-width: 720px) {

  .page-solutions .platform-section-header h2 .section-heading-line {
    white-space: normal;
  }
}

/* close the gap under the deployment heading */
.page-solutions .solutions-deployment .split-heading {
  padding-bottom: 0;
}

.page-solutions .solutions-deployment .split-heading h2 {
  margin-bottom: 0;
}

.page-solutions .solutions-deployment .deployment-grid {
  margin-top: clamp(30px, 3vw, 48px);
}

/* ---------------------------------------------------------------------------
   Solutions CTA: same centred stack as the home page
   The markup now matches the home CTA exactly, so the shared rules centre the
   eyebrow, headline, copy and actions. The only difference is the copy itself:
   this one is a full sentence rather than home's short display line, so it
   keeps body scale instead of the amber display treatment.
   --------------------------------------------------------------------------- */

.page-solutions .final-cta p.final-cta__copy {
  max-width: 54ch;
  margin: var(--tk-2) auto 0;
  color: var(--tk-gray-blue);
  font-size: clamp(16px, 1.15vw, 19px);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.6;
}

/* ---------------------------------------------------------------------------
   Brace geometry, refined (per reference)
   The old brace was wider than its corner radius, so the two curves flattened
   out into a plateau before the branch met them. Making the width equal to
   the radius turns each corner into a true quarter circle, and the two of
   them meet at a point — the branch leaves from that point.
   --------------------------------------------------------------------------- */

.page-solutions .roadmap-phase::before {
  height: calc(50% + var(--rm-gap) / 2 - 25px);
}

.page-solutions .roadmap-phase::after {
  top: calc(50% + 25px);
  height: calc(50% + var(--rm-gap) / 2 - 25px);
}

.page-solutions .roadmap-phase:first-child::before {
  height: calc(50% - 25px);
}

.page-solutions .roadmap-phase:last-child::after {
  height: calc(50% - 25px);
}

.page-solutions .rm-brace {
  left: calc(var(--rm-x) - 24px);
  width: 26px;
  height: 52px;
  margin-top: -26px;
}

.page-solutions .rm-brace i,
.page-solutions .rm-brace b {
  width: 26px;
  height: 27px;
}

.page-solutions .rm-brace i {
  border-bottom-right-radius: 26px;
}

.page-solutions .rm-brace b {
  border-top-right-radius: 26px;
}

.page-solutions .rm-brace::before {
  right: 25px;
  width: calc(clamp(40px, 4vw, 74px) + 1px);
}

/* client heading: two fixed lines */
.page-solutions .client-showcase__heading h2 .section-heading-line {
  display: block;
  white-space: nowrap;
}

@media (max-width: 560px) {

  .page-solutions .client-showcase__heading h2 .section-heading-line {
    white-space: normal;
  }
}

/* ---------------------------------------------------------------------------
   Solutions CTA = the home CTA
   Same markup, same word-switch animation, same closing landscape. The
   solutions-specific overrides that flattened this section (no artwork, own
   background, own copy scale) are undone here.
   --------------------------------------------------------------------------- */

.page-solutions .final-cta {
  padding-block: clamp(48px, 4vw, 64px);
  border-top: 0;
  background-color: var(--tk-gray-darkest);
}

.page-solutions .final-cta::before {
  display: block;
}

.page-solutions .final-cta__grid {
  padding-bottom: 0;
}

/* the copy line goes back to the shared display treatment */
.page-solutions .final-cta p.final-cta__copy {
  max-width: 26ch;
  margin: var(--tk-3) auto 0;
  font-size: var(--tk-fs-h1-sub);
  font-weight: 500;
  letter-spacing: -1px;
  line-height: 1.1;
}

.page-solutions .final-cta__actions {
  margin-top: var(--tk-3);
}

/* ---------------------------------------------------------------------------
   Deployment cards: no hover state
   --------------------------------------------------------------------------- */

.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:hover,
.page-solutions .deployment-grid article:focus-within {
  transform: none;
  transition: none;
  border-color: rgba(255, 255, 255, .075);
  background:
    radial-gradient(
      120% 90% at 88% 6%,
      color-mix(in srgb, var(--deployment-accent) 14%, transparent) 0%,
      transparent 58%
    ),
    linear-gradient(160deg, rgba(255, 255, 255, .026) 0%, rgba(8, 9, 11, .62) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .035),
    0 22px 60px rgba(0, 0, 0, .28);
}

.page-solutions .site-footer--solutions {
  padding-top: clamp(250px, 20vw, 340px);
}

/* footer drawing removed on solutions — the footer no longer needs the
   clearance it was reserving for the artwork */
.page-solutions .site-footer--solutions {
  padding-top: clamp(72px, 6vw, 112px);
}

/* ---------------------------------------------------------------------------
   Section order on Solutions
   `.page-solutions main` is a flex column and the client wall carries
   `order: 90`, so its position in the markup has no effect — the CTA needs an
   explicit order to close the page. (The old CTA got this from the
   `solutions-final-cta` class, which went away when it was rebuilt to match
   the home CTA.)
   --------------------------------------------------------------------------- */

.page-solutions .final-cta {
  order: 100;
}

/* more air above the closing CTA */
.page-solutions .final-cta {
  padding-block: clamp(112px, 9.5vw, 180px) clamp(48px, 4vw, 64px);
}

/* the rail ends at the last phase's number instead of running past it */
.page-solutions .roadmap-phase:last-child::after {
  height: 28%;
}

/* the disc moves up to the brace, level with the branch that runs to the copy,
   seated in the mouth of the bracket just right of the rail */
.page-solutions .rm-num {
  top: 50%;
  left: calc(var(--rm-x) + 6px);
  width: 44px;
  height: 44px;
  margin-top: -22px;
}

.page-solutions .rm-num::after {
  font-size: 13px;
}

/* the rail runs the full height of the last phase again */
.page-solutions .roadmap-phase:last-child::after {
  height: calc(50% - 25px);
}

/* the disc sits on the rail level with the phase headline — the same 65px
   from each phase's top, so all three line up */
.page-solutions .rm-num {
  top: 65px;
  left: calc(var(--rm-x) - 21px);
  margin-top: -22px;
}

/* each number sits at the end of its own phase's run of rail: phase 3's is the
   tail of the whole line, and 1 and 2 land on the same relative spot, which
   keeps the three evenly spaced instead of two at the top and one at the foot */
.page-solutions .rm-num {
  top: auto;
  bottom: -22px;
  margin-top: 0;
}

/* home friction list: amber index numbers, white item text */
.page-home .intelligence-gap .friction-grid p {
  color: var(--tk-white);
}

.page-home .intelligence-gap .friction-grid small {
  color: var(--tk-amber);
}

/* ---------------------------------------------------------------------------
   Home: grain across the whole page
   The fixed overlay was there but too faint to register. Raising it and
   tightening the tile gives every section — the cream hero as well as the
   black ones — the same tooth the friction cards have.
   --------------------------------------------------------------------------- */

.page-home::after {
  background-size: 140px 140px;
  opacity: .26;
}

@media (max-width: 680px) {

  .page-home::after {
    opacity: .2;
  }
}

/* the hero stays clean: it is lifted above both fixed grain layers (which sit
   at 89 and 90) but still below the header at 100, so no noise lands on the
   drawn scene */
.page-home .hero-world {
  z-index: 95;
}

/* Grain that reads on the black sections. The existing soft-light pass does
   almost nothing against #08090B — soft-light leaves near-black near-black —
   so this second fixed pass uses screen at very low opacity to lift a few
   percent of luminance in a random pattern. On the cream hero screen barely
   registers, so one layer serves the whole page. */
.page-home::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 89;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .075;
  mix-blend-mode: screen;
  pointer-events: none;
}

@media (max-width: 680px) {

  .page-home::before {
    opacity: .06;
  }
}

.page-home .hero-bridge {
  padding-bottom: clamp(14px, 1.3vw, 22px);
}

.page-home .intelligence-gap {
  padding-top: clamp(30px, 2.8vw, 46px);
}

/* ---------------------------------------------------------------------------
   Home section headers
   Every header — the intelligence bridge and each dashed divider — carries its
   lead sentence inside the strip, directly under the heading, instead of as a
   separate block of body copy below.
   --------------------------------------------------------------------------- */

.page-home .hero-bridge__sub,
.page-home .section-dash-divider__sub {
  max-width: 66ch;
  margin: clamp(10px, .9vw, 16px) auto 0;
  color: color-mix(in srgb, var(--tk-white) 78%, transparent);
  font-size: clamp(15px, 1.05vw, 19px);
  font-weight: 500;
  line-height: 1.45;
  text-align: center;
}

.page-home .section-dash-divider__content {
  text-align: center;
}

/* ---------------------------------------------------------------------------
   Home: seamless clean-hero to grain-black transition
   The hero-world sits above the page-wide grain to keep the illustrated hero
   clean. Fade the same viewport-anchored screen grain into its dark bridge so
   it reaches full strength before the following black section begins. Because
   the tile is fixed to the viewport, the pattern continues across the boundary
   instead of restarting there.
   --------------------------------------------------------------------------- */

.page-home .hero-bridge::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url("frost-noise.svg") repeat;
  background-attachment: fixed;
  background-size: 150px 150px;
  opacity: .075;
  mix-blend-mode: screen;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .18) 22%,
    #000 68%,
    #000 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .18) 22%,
    #000 68%,
    #000 100%
  );
  pointer-events: none;
}

@media (max-width: 680px) {

  .page-home .hero-bridge::after {
    opacity: .06;
  }
}

/* ---------------------------------------------------------------------------
   Home: expanded editorial rhythm
   Give each major idea its own field of space. The matrix headers become
   slower chapter transitions, content sections gain generous top and bottom
   breathing room, and the closing CTA has a longer approach.
   --------------------------------------------------------------------------- */

.page-home {
  --home-section-space: clamp(88px, 7.2vw, 138px);
  --home-chapter-height: clamp(144px, 10vw, 192px);
}

.page-home .content-section {
  padding-block: var(--home-section-space);
}

.page-home .hero-bridge,
.page-home .section-dash-divider {
  padding-bottom: clamp(38px, 3.2vw, 62px);
}

.page-home .hero-bridge__content,
.page-home .section-dash-divider__content {
  min-height: var(--home-chapter-height);
}

.page-home .hero-bridge::before,
.page-home .section-dash-divider::before {
  height: var(--home-chapter-height);
}

.page-home .intelligence-gap {
  padding-top: var(--home-section-space);
}

.page-home .final-cta {
  padding-block:
    clamp(112px, 9vw, 172px)
    clamp(72px, 5.2vw, 100px);
}

@media (max-width: 680px) {

  .page-home {
    --home-section-space: clamp(64px, 18vw, 82px);
    --home-chapter-height: 132px;
  }

  .page-home .hero-bridge,
  .page-home .section-dash-divider {
    padding-bottom: 30px;
  }

  .page-home .final-cta {
    padding-block: 88px 64px;
  }
}

/* ---------------------------------------------------------------------------
   Home: Trunk-informed internal pacing
   Trunk's strongest rhythm comes from alternating broad pauses with tall,
   deliberate information rows. Keep Infinitas' own editorial system while
   giving its text-heavy sections the same sense of measured progression.
   --------------------------------------------------------------------------- */

.page-home .intelligence-gap p.friction-lead {
  margin-bottom: clamp(28px, 2.4vw, 46px);
}

.page-home .intelligence-gap .friction-grid article,
.page-home #enterprise-intelligence .benefit-list li,
.page-home #platform .system-list li {
  padding-block: clamp(22px, 1.9vw, 32px);
}

.page-home .intelligence-gap .friction-grid {
  margin-bottom: clamp(58px, 5vw, 92px);
}

.page-home #enterprise-intelligence p.benefit-lead {
  margin-top: 0;
  margin-bottom: clamp(28px, 2.4vw, 46px);
}

.page-home #enterprise-intelligence .benefit-list {
  margin-top: 0;
}

.page-home #platform .system-list {
  margin-top: 0;
}

.page-home #capabilities .solution-row {
  grid-template-columns: auto minmax(0, 21ch) minmax(0, 1fr) auto;
  column-gap: clamp(24px, 2.6vw, 50px);
  padding-block: clamp(30px, 2.7vw, 48px);
}

.page-home #capabilities .solution-row p {
  max-width: 58ch;
}

.page-home #capabilities .solution-row > span {
  transition:
    color var(--tk-fast) var(--tk-ease-soft),
    transform var(--tk-fast) var(--tk-ease-soft);
}

.page-home #capabilities .solution-row:hover > span {
  color: var(--tk-white);
  transform: translate(4px, -4px);
}

.page-home .capabilities-outro {
  display: flex;
  justify-content: flex-end;
  margin-top: clamp(60px, 5vw, 92px);
}

.page-home #trust .trust-grid {
  margin-top: 0;
}

.page-home #trust .trust-card {
  grid-template-columns: auto minmax(0, 25ch) minmax(0, 1fr);
  column-gap: clamp(24px, 2.8vw, 54px);
  padding-block: clamp(42px, 3.8vw, 68px);
}

.page-home #trust .trust-card p {
  max-width: 62ch;
}

@media (max-width: 680px) {

  .page-home #capabilities .solution-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
    column-gap: var(--tk-2);
    padding-block: 28px;
  }

  .page-home .capabilities-outro {
    justify-content: flex-start;
    margin-top: 48px;
  }

  .page-home #trust .trust-card {
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: var(--tk-2);
    padding-block: 34px;
  }
}

/* ---------------------------------------------------------------------------
   Solutions / roadmap CTA — enterprise intelligence conduit
   Structured system rails enter from the left, resolve through an
   infinity-shaped intelligence core, and leave as connected decision signals.
   --------------------------------------------------------------------------- */

.page-solutions .roadmap-cta {
  position: relative;
  min-height: clamp(620px, 74vw, 820px);
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  padding-block: clamp(112px, 10vw, 174px);
  border-block: 1px solid rgba(255, 255, 255, .06);
  background:
    radial-gradient(circle at 50% 50%, rgba(30, 40, 44, .22), transparent 48%),
    #050607;
}

.page-solutions .roadmap-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("frost-noise.svg") repeat;
  background-size: 150px 150px;
  opacity: .14;
  mix-blend-mode: screen;
  pointer-events: none;
}

.page-solutions .roadmap-cta .section-label {
  margin-bottom: clamp(18px, 1.8vw, 28px);
  color: #8fb5c3;
}

.page-solutions .roadmap-cta h2 {
  max-width: 18ch;
  margin: 0;
  color: var(--tk-white);
  font-size: clamp(44px, 5vw, 82px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: .98;
  text-wrap: balance;
}

.page-solutions .roadmap-cta .button {
  margin-top: clamp(30px, 2.8vw, 46px);
}

@media (max-width: 680px) {

  .page-solutions .roadmap-cta {
    min-height: 650px;
    padding-block: 104px;
  }

  .page-solutions .roadmap-cta h2 {
    font-size: clamp(40px, 11vw, 56px);
  }

  .page-solutions .roadmap-cta h2 br {
    display: none;
  }
}

/* Roadmap interlude, polished: drawing only, one continuous page surface. */

.page-solutions .solutions-deployment,
.page-solutions .roadmap-cta,
.page-solutions .solutions-roadmap {
  background: var(--tk-gray-darkest);
}

.page-solutions .roadmap-cta {
  min-height: clamp(540px, 42vw, 720px);
  display: block;
  padding: 0;
  border: 0;
}

.page-solutions .roadmap-cta::before {
  content: none;
}

@media (max-width: 680px) {

  .page-solutions .roadmap-cta {
    min-height: 500px;
  }
}

/* Solutions interlude — ambient intelligence field */

.page-solutions .roadmap-cta--flow {
  --roadmap-flow-field:
    radial-gradient(ellipse at 66% 56%, rgba(64, 42, 142, .34), transparent 39%),
    radial-gradient(ellipse at 104% 54%, rgba(28, 99, 121, .5), transparent 47%),
    linear-gradient(112deg, var(--tk-gray-darkest) 0%, #0a0b13 30%, #131744 66%, #0e4052 100%);
  position: relative;
  min-height: clamp(520px, 42vw, 720px);
  margin-block: clamp(144px, 11vw, 220px);
  overflow: hidden;
  background: var(--tk-gray-darkest);
}

.page-solutions .roadmap-cta--flow::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: var(--roadmap-flow-field);
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 22%,
    #000 78%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 22%,
    #000 78%,
    transparent 100%
  );
  pointer-events: none;
}

.page-solutions .roadmap-cta--flow::after {
  content: none;
}

.page-solutions .roadmap-flow {
  position: absolute;
  inset: 0;
  z-index: 1;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 22%,
    #000 78%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 22%,
    #000 78%,
    transparent 100%
  );
}

.page-solutions .roadmap-flow svg {
  width: 100%;
  height: 100%;
}

.page-solutions .roadmap-flow .flow-shape {
  stroke: none;
}

.page-solutions .roadmap-flow .flow-shape--silver {
  fill: url("#flow-silver");
  filter: url("#flow-blur");
}

.page-solutions .roadmap-flow .flow-shape--indigo-back,
.page-solutions .roadmap-flow .flow-shape--indigo {
  fill: url("#flow-indigo");
}

.page-solutions .roadmap-flow .flow-shape--indigo-back {
  opacity: .56;
  filter: url("#flow-blur");
}

.page-solutions .roadmap-flow .flow-shape--indigo {
  opacity: .74;
}

.page-solutions .roadmap-flow .flow-shape--steel {
  fill: url("#flow-steel");
  opacity: .58;
  filter: url("#flow-blur");
}

.page-solutions .roadmap-flow .flow-shape--veil {
  fill: rgba(198, 198, 207, .09);
}

.page-solutions .roadmap-flow .flow-highlight {
  fill: none;
  stroke: rgba(124, 129, 198, .15);
  stroke-width: 12;
  filter: url("#flow-blur");
}

.page-solutions .roadmap-flow .flow-highlight--soft {
  stroke: rgba(100, 157, 174, .13);
  stroke-width: 22;
}

.page-solutions .roadmap-flow__statement {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  text-align: center;
}

.page-solutions .roadmap-flow__statement h2 {
  max-width: 18ch;
  margin: 0;
  color: var(--tk-white);
  font-size: clamp(44px, 4.8vw, 78px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: .98;
  text-wrap: balance;
  text-shadow: 0 4px 40px rgba(0, 0, 0, .52);
}

.page-solutions .roadmap-flow__statement span {
  display: block;
}

.page-solutions .roadmap-flow__statement span + span {
  margin-top: .12em;
  color: #8fb5c3;
}

/* Closing chapter order: roadmap first, ambient statement second. */

.page-solutions .solutions-roadmap {
  order: 20;
}

.page-solutions .roadmap-cta--flow {
  order: 30;
}

@media (max-width: 680px) {

  .page-solutions .roadmap-cta--flow {
    --roadmap-flow-field:
      radial-gradient(ellipse at 62% 52%, rgba(64, 42, 142, .34), transparent 44%),
      radial-gradient(ellipse at 116% 54%, rgba(28, 99, 121, .48), transparent 58%),
      linear-gradient(112deg, var(--tk-gray-darkest) 0%, #0d1022 48%, #103b4a 100%);
    min-height: 460px;
    margin-block: 96px;
  }

  .page-solutions .roadmap-flow svg {
    width: 142%;
    max-width: none;
    transform: translateX(-18%);
  }

  .page-solutions .roadmap-flow__statement h2 {
    max-width: 11ch;
    font-size: clamp(40px, 11vw, 56px);
  }
}

/* ==========================================================================
   Culture Hero / protected intelligence landscape
   Original line-drawn forest composition inspired by the Security reference:
   glass dome, misted trees, and a bottom editorial split.
   ========================================================================== */

.page-culture .page-hero--security {
  position: relative;
  isolation: isolate;
  min-height: clamp(760px, 94vh, 920px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding-block: clamp(150px, 16vh, 190px) clamp(64px, 7vh, 92px);
  border: 0;
  background: #fff;
  color: #090a0b;
}

.page-culture .page-hero--security::before,
.page-culture .page-hero--security::after {
  content: none;
}

.page-culture .culture-hero-scene {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page-culture .culture-hero-scene svg {
  width: 100%;
  height: 100%;
}

.page-culture .page-hero--security .page-hero__grid {
  position: relative;
  z-index: 2;
  width: min(calc(100vw - 2 * var(--tk-pad-x)), 1240px);
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
  align-items: end;
  gap: clamp(52px, 7vw, 120px);
  padding-bottom: clamp(24px, 2vw, 34px);
  border-bottom: 1px solid rgba(9, 10, 11, .14);
}

.page-culture .page-hero--security h1 {
  max-width: 11ch;
  margin: 0;
  color: #090a0b;
  font-size: clamp(58px, 5.6vw, 96px);
  font-weight: 600;
  letter-spacing: -.06em;
  line-height: .92;
  text-wrap: balance;
}

.page-culture .page-hero--security h1 em {
  color: var(--tk-green);
  font-style: normal;
}

.page-culture .page-hero--security .page-hero__body {
  max-width: 34ch;
  margin: 0;
  padding: 0 0 4px;
  color: rgba(9, 10, 11, .58);
  font-size: clamp(16px, 1.08vw, 20px);
  font-weight: 400;
  line-height: 1.5;
}

.page-culture .page-hero--security .page-hero__body p + p {
  margin-top: .65em;
}

@media (max-width: 760px) {

  .page-culture .page-hero--security {
    min-height: 760px;
    padding-block: 126px 54px;
  }

  .page-culture .culture-hero-scene svg {
    width: 168%;
    max-width: none;
    transform: translateX(-34%);
  }

  .page-culture .page-hero--security .page-hero__grid {
    width: calc(100vw - 2 * var(--tk-pad-x));
    grid-template-columns: 1fr;
    gap: 22px;
    padding-bottom: 24px;
  }

  .page-culture .page-hero--security h1 {
    max-width: 9ch;
    font-size: clamp(50px, 13.5vw, 68px);
  }

  .page-culture .page-hero--security .page-hero__body {
    max-width: 38ch;
    font-size: 16px;
  }
}

/* Culture Principles / open editorial heading */

.page-culture .culture-principles .section-heading {
  grid-template-columns: 1fr;
  gap: clamp(8px, 1vw, 14px);
  justify-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  text-align: center;
}

.page-culture .culture-principles .section-heading h2,
.page-culture .culture-principles .section-heading > p {
  margin-inline: auto;
  text-align: center;
}

/* Home Hero / final desktop placement */

@media (min-width: 681px) {

  .page-home .home-hero__copy {
    left: clamp(28px, 3vw, 56px);
    top: clamp(58px, 5vw, 92px);
  }
}

/* ==========================================================================
   Culture / one continuous paper landscape

   The forest remains the single illustrative moment. Everything below it is
   treated as one editorial document: no alternating bands, no card stack and
   no section-edge colour changes. Graphite rules organise the reading rhythm;
   green is reserved for meaning and navigation.
   ========================================================================== */

.page-culture {
  --culture-paper: #f1f1ef;
  --culture-ink: #111214;
  --culture-muted: #696c6a;
  --culture-line: rgba(17, 18, 20, .16);
  --culture-line-strong: rgba(17, 18, 20, .28);
  --culture-green: var(--brand-burgundy);
  background: var(--culture-paper);
  color: var(--culture-ink);
}

.page-culture main {
  position: relative;
  overflow: hidden;
  background: var(--culture-paper);
}

.page-culture main::before {
  content: none;
}

.page-culture main > section {
  position: relative;
  z-index: 1;
  border: 0;
  background: transparent;
  color: var(--culture-ink);
}

.page-culture main .shell {
  width: min(1280px, calc(100vw - 2 * var(--tk-pad-x)));
}

.page-culture main p {
  color: var(--culture-muted);
}

.page-culture main .section-label,
.page-culture .final-cta p.section-label {
  color: var(--culture-green);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .04em;
  text-transform: none;
}

/* Hero: a calmer, larger reading field that dissolves into the page. */

.page-culture .page-hero--security {
  min-height: clamp(820px, 100vh, 980px);
  padding-block: clamp(160px, 16vh, 196px) clamp(74px, 8vh, 104px);
  background: transparent;
}

.page-culture .page-hero--security .page-hero__grid {
  width: min(1280px, calc(100vw - 2 * var(--tk-pad-x)));
  grid-template-columns: minmax(0, 1.28fr) minmax(300px, .72fr);
  gap: clamp(68px, 8vw, 140px);
  border-bottom-color: var(--culture-line);
}

.page-culture .page-hero--security h1 {
  font-weight: 650;
}

.page-culture .page-hero--security h1 em {
  color: var(--culture-green);
}

/* Defining belief: one generous manifesto, not a separate colour band. */

.page-culture .culture-belief {
  padding-block: clamp(150px, 15vw, 260px);
  overflow: visible;
  border: 0;
  background: transparent;
}

.page-culture .culture-belief::before,
.page-culture .culture-belief::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(1280px, calc(100vw - 2 * var(--tk-pad-x)));
  height: 1px;
  background: var(--culture-line);
  transform: translateX(-50%);
}

.page-culture .culture-belief::before {
  top: 0;
}

.page-culture .culture-belief::after {
  top: auto;
  bottom: 0;
  opacity: 1;
}

.page-culture .culture-belief h2 {
  max-width: 16ch;
  margin: 0;
  color: var(--culture-ink);
  font-size: clamp(56px, 6.2vw, 108px);
  font-weight: 560;
  letter-spacing: -.055em;
  line-height: .94;
  text-align: left;
}

/* About: narrative at left, considered reading measure at right. */

.page-culture .culture-about {
  padding-block: clamp(130px, 11vw, 190px);
  background: transparent;
}

.page-culture .culture-about > .split-heading {
  grid-template-columns: minmax(0, .84fr) minmax(420px, 1.16fr);
  gap: clamp(72px, 10vw, 170px);
}

.page-culture .culture-about .split-heading h2,
.page-culture .culture-principles .section-heading h2,
.page-culture .culture-partnership h2 {
  max-width: 10ch;
  margin-top: clamp(18px, 1.6vw, 26px);
  color: var(--culture-ink);
  font-size: clamp(52px, 5vw, 80px);
  font-weight: 560;
  letter-spacing: -.05em;
  line-height: .96;
}

.page-culture .culture-about .split-heading__body {
  max-width: 58ch;
  padding-top: 38px;
}

.page-culture .culture-about .split-heading__body p {
  color: var(--culture-muted);
  font-size: clamp(17px, 1.05vw, 20px);
  line-height: 1.65;
}

.page-culture .culture-about .split-heading__body p:first-child {
  color: var(--culture-ink);
  font-size: clamp(23px, 1.65vw, 30px);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.38;
}

.page-culture .culture-about .split-heading__body p + p {
  margin-top: 1.3em;
}

/* Vision and mission are paired editorial columns rather than panels. */

.page-culture .mission-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-top: clamp(120px, 11vw, 190px);
  border-top: 1px solid var(--culture-line-strong);
}

.page-culture .mission-panel {
  padding: clamp(42px, 4.5vw, 68px) clamp(52px, 6vw, 96px) 0 0;
  border: 0;
  background: transparent;
}

.page-culture .mission-panel:nth-child(2) {
  padding-right: 0;
  padding-left: clamp(52px, 6vw, 96px);
  border: 0;
  border-left: 1px solid var(--culture-line);
}

.page-culture .mission-panel h3 {
  max-width: 17ch;
  margin-top: clamp(44px, 5vw, 76px);
  color: var(--culture-ink);
  font-size: clamp(34px, 3.2vw, 50px);
  font-weight: 540;
  letter-spacing: -.04em;
  line-height: 1.05;
}

.page-culture .mission-panel > p:last-child {
  max-width: 51ch;
  margin-top: clamp(28px, 2.6vw, 42px);
  color: var(--culture-muted);
  font-size: clamp(16px, 1vw, 19px);
  line-height: 1.65;
}

/* Principles: a six-row culture ledger. */

.page-culture .culture-principles {
  padding-block: clamp(150px, 13vw, 220px);
  border: 0;
  background: transparent;
}

.page-culture .culture-principles .section-heading {
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .72fr);
  gap: clamp(72px, 10vw, 160px);
  align-items: end;
  padding-bottom: clamp(86px, 8vw, 128px);
}

.page-culture .culture-principles .section-heading > p {
  max-width: 39ch;
  color: var(--culture-muted);
  font-size: clamp(18px, 1.2vw, 22px);
  line-height: 1.55;
}

.page-culture .principle-grid {
  display: block;
  border-top: 1px solid var(--culture-line-strong);
}

.page-culture .principle {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(120px, .34fr) minmax(260px, .78fr) minmax(0, 1.12fr);
  gap: clamp(34px, 4vw, 72px);
  align-items: start;
  padding: clamp(40px, 4vw, 64px) 0;
  border: 0;
  border-bottom: 1px solid var(--culture-line);
  border-radius: 0;
  background: transparent;
}

.page-culture .principle:hover {
  background: transparent;
  transform: none;
}

.page-culture .principle .index-number {
  color: var(--culture-green);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .06em;
  line-height: 1.4;
}

.page-culture .principle h3 {
  max-width: 16ch;
  margin: 0;
  color: var(--culture-ink);
  font-size: clamp(27px, 2.25vw, 38px);
  font-weight: 540;
  letter-spacing: -.035em;
  line-height: 1.06;
}

.page-culture .principle p {
  max-width: 58ch;
  margin: 0;
  color: var(--culture-muted);
  font-size: clamp(16px, 1vw, 19px);
  line-height: 1.65;
}

/* Partnership and CTA continue on the same sheet of paper. */

.page-culture .culture-partnership {
  padding-block: clamp(150px, 13vw, 220px);
  overflow: visible;
  background: transparent;
}

.page-culture .culture-partnership::after {
  content: none;
}

.page-culture .culture-partnership .partnership-grid {
  grid-template-columns: minmax(0, .88fr) minmax(420px, 1.12fr);
  gap: clamp(72px, 10vw, 170px);
  padding-top: clamp(64px, 6vw, 90px);
  border-top: 1px solid var(--culture-line-strong);
}

.page-culture .culture-partnership .partnership-grid__body {
  padding-top: 40px;
}

.page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
  max-width: 59ch;
  color: var(--culture-muted);
  font-size: clamp(17px, 1.05vw, 20px);
  line-height: 1.65;
}

/* Solutions Flow / single-line statement with supporting copy */

.page-solutions .roadmap-flow__statement {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.page-solutions .roadmap-flow__statement h2 {
  max-width: none;
  font-size: clamp(38px, 3.35vw, 64px);
}

.page-solutions .roadmap-flow__statement h2 .roadmap-flow__headline-accent {
  display: block;
  margin-top: 0;
  color: #8fb5c3;
  white-space: nowrap;
}

.page-solutions .roadmap-flow__statement > p {
  max-width: 62ch;
  margin-top: clamp(20px, 2vw, 30px);
  color: rgba(255, 255, 255, .68);
  font-size: clamp(16px, 1.05vw, 20px);
  font-weight: 400;
  letter-spacing: -.015em;
  line-height: 1.5;
  text-align: center;
}

@media (max-width: 680px) {

  .page-solutions .roadmap-flow__statement h2 {
    max-width: 12ch;
    font-size: clamp(38px, 10.5vw, 52px);
  }

  .page-solutions .roadmap-flow__statement h2 .roadmap-flow__headline-accent {
    white-space: normal;
  }

  .page-solutions .roadmap-flow__statement > p {
    max-width: 34ch;
    font-size: 16px;
  }
}

.page-culture .culture-partnership .partnership-grid__body > p + p {
  margin-top: 1.5em;
}

.page-culture .culture-final-cta {
  padding-block: clamp(120px, 10vw, 170px);
  border: 0;
  background: transparent;
}

.page-culture .culture-final-cta::before,
.page-culture .culture-final-cta::after {
  content: none;
}

.page-culture .culture-final-cta .final-cta__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .72fr);
  gap: clamp(72px, 10vw, 170px);
  padding-top: clamp(68px, 7vw, 108px);
  border-top: 1px solid var(--culture-line-strong);
  text-align: left;
}

.page-culture .culture-final-cta h2 {
  max-width: 14ch;
  margin: clamp(20px, 2vw, 30px) 0 0;
  color: var(--culture-ink);
  font-size: clamp(50px, 4.6vw, 76px);
  font-weight: 560;
  letter-spacing: -.05em;
  line-height: .98;
}

.page-culture .culture-final-cta .final-cta__copy {
  max-width: none;
  margin: 48px 0 0;
  color: var(--culture-muted);
  font-size: clamp(18px, 1.2vw, 22px);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.55;
  text-align: left;
}

.page-culture .culture-final-cta .final-cta__actions {
  justify-content: flex-start;
  margin-top: clamp(34px, 3.5vw, 52px);
}

.page-culture .culture-final-cta .button--light {
  border-color: var(--culture-ink);
  background: var(--culture-ink);
  color: var(--culture-paper);
}

.page-culture .culture-final-cta .button--light:hover {
  border-color: var(--culture-green);
  background: var(--culture-green);
  color: var(--culture-ink);
}

.page-culture .culture-final-cta .text-link {
  border-color: var(--culture-line-strong);
  color: var(--culture-ink);
}

.page-culture .culture-final-cta .text-link:hover {
  border-color: var(--culture-ink);
  color: var(--culture-ink);
}

/* Footer: the final chapter, not a black band. */

.page-culture .site-footer {
  margin-top: 0;
  padding-top: clamp(210px, 17vw, 300px);
  border: 0;
  background: var(--culture-paper);
  color: var(--culture-ink);
}

.page-culture .site-footer::before,
.page-culture .site-footer::after {
  content: none;
}

.page-culture .footer-brand__asset img {
  filter: none;
  mix-blend-mode: multiply;
}

.page-culture .site-footer .footer-label,
.page-culture .footer-contact h3,
.page-culture .site-footer .footer-contact .text-link {
  color: var(--culture-ink);
}

.page-culture .site-footer .footer-column a,
.page-culture .site-footer .footer-contact p,
.page-culture .site-footer .footer-bottom span {
  color: var(--culture-muted);
}

.page-culture .site-footer .footer-column a:hover,
.page-culture .site-footer .footer-contact .text-link:hover {
  color: var(--culture-green);
}

.page-culture .site-footer .footer-bottom {
  border-top-color: var(--culture-line);
}

@media (max-width: 1024px) {

  .page-culture .page-hero--security .page-hero__grid,
  .page-culture .culture-about > .split-heading,
  .page-culture .culture-principles .section-heading,
  .page-culture .culture-partnership .partnership-grid,
  .page-culture .culture-final-cta .final-cta__grid {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .page-culture .culture-about .split-heading__body,
  .page-culture .culture-partnership .partnership-grid__body,
  .page-culture .culture-final-cta .final-cta__copy {
    padding-top: 0;
    margin-top: 0;
  }

  .page-culture .principle {
    grid-template-columns: 120px minmax(220px, .8fr) minmax(0, 1fr);
    gap: 30px;
  }
}

@media (max-width: 760px) {

  .page-culture .page-hero--security {
    min-height: 790px;
    padding-block: 132px 54px;
  }

  .page-culture .culture-belief {
    padding-block: 110px;
  }

  .page-culture .culture-belief h2 {
    font-size: clamp(46px, 12vw, 62px);
  }

  .page-culture .culture-about,
  .page-culture .culture-principles,
  .page-culture .culture-partnership {
    padding-block: 104px;
  }

  .page-culture .culture-about .split-heading h2,
  .page-culture .culture-principles .section-heading h2,
  .page-culture .culture-partnership h2,
  .page-culture .culture-final-cta h2 {
    font-size: clamp(42px, 11vw, 56px);
  }

  .page-culture .mission-grid {
    grid-template-columns: 1fr;
    margin-top: 96px;
  }

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    padding: 42px 0 68px;
    border: 0;
    border-bottom: 1px solid var(--culture-line);
  }

  .page-culture .mission-panel h3 {
    margin-top: 52px;
  }

  .page-culture .culture-principles .section-heading {
    padding-bottom: 72px;
  }

  .page-culture .principle {
    grid-template-columns: 1fr;
    gap: 22px;
    padding-block: 42px;
  }

  .page-culture .principle h3 {
    max-width: 18ch;
  }

  .page-culture .culture-partnership .partnership-grid,
  .page-culture .culture-final-cta .final-cta__grid {
    padding-top: 54px;
  }

  .page-culture .culture-final-cta {
    padding-block: 88px 110px;
  }

  .page-culture .culture-final-cta .final-cta__actions {
    align-items: stretch;
  }

  .page-culture .site-footer {
    padding-top: 180px;
  }
}

/* Culture Hero / original Trunk woods artwork
   Downloaded locally from Trunk's public Security page and kept as one image
   so the authored pencil work, mist and glass dome retain their exact detail. */

.page-culture .culture-hero-scene {
  inset: 0;
  overflow: hidden;
}

.page-culture .culture-hero-scene img {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  transform: translateX(-50%);
  user-select: none;
}

.page-culture .culture-hero-scene::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 34%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0),
    rgba(255, 255, 255, .82) 66%,
    var(--culture-paper) 100%
  );
}

/* The Culture opening reads as one uninterrupted white field. */

.page-culture .page-hero--security .page-hero__grid {
  grid-template-columns: 1fr;
  justify-items: center;
  gap: clamp(24px, 2.4vw, 36px);
  border-bottom: 0;
  text-align: center;
}

.page-culture .page-hero--security h1 {
  max-width: none;
  margin-inline: auto;
  color: var(--culture-ink);
  font-family: var(--font-neue);
  font-size: min(var(--tk-fs-h1), 6vw);
  font-style: normal;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: .94;
  text-align: center;
}

.page-culture .page-hero--security h1 > span,
.page-culture .page-hero--security h1 > em {
  display: block;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.page-culture .page-hero--security h1 > span {
  color: inherit;
}

.page-culture .page-hero--security h1 > em {
  color: #6C1D2D;
}

.page-culture .page-hero--security .page-hero__body {
  max-width: 64ch;
  margin-inline: auto;
  padding-bottom: 0;
  text-align: center;
}

@media (max-width: 680px) {

  .page-culture .page-hero--security h1 {
    font-size: min(44px, 8.4vw);
  }
}

.page-culture .culture-belief::before,
.page-culture .culture-belief::after {
  content: none;
}

/* Founder belief / testimonial composition */

.page-culture .culture-belief {
  padding-block: clamp(46px, 4.5vw, 70px);
}

.page-culture .founder-quote {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: clamp(108px, 7.2vw, 120px) minmax(0, 1fr);
  gap: clamp(38px, 3vw, 46px);
  align-items: center;
  min-height: 276px;
  padding: clamp(44px, 3.4vw, 52px) clamp(42px, 3.5vw, 56px);
  border: 1px solid rgba(17, 18, 20, .16);
  border-radius: 22px;
  background: #fbfbfa;
}

.page-culture .founder-quote::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: .16;
  background: url("frost-noise.svg") center / 150px 150px repeat;
  mix-blend-mode: multiply;
  filter: contrast(1.18);
  pointer-events: none;
}

.page-culture .founder-quote::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(circle at 34% 30%, rgba(255, 255, 255, .72), transparent 45%),
    radial-gradient(ellipse at 50% 115%, rgba(17, 18, 20, .045), transparent 68%);
  pointer-events: none;
}

.page-culture .founder-quote > * {
  position: relative;
  z-index: 1;
}

.page-culture .founder-quote__monogram {
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  background: var(--culture-ink);
}

.page-culture .founder-quote__monogram img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 31%;
  filter: grayscale(1) contrast(1.04);
}

.page-culture .founder-quote__content {
  align-self: center;
}

.page-culture .founder-quote blockquote {
  margin: 0;
}

.page-culture .founder-quote blockquote p {
  max-width: 52ch;
  margin: 0;
  color: var(--culture-ink);
  font-family: var(--font-neue);
  font-size: clamp(23px, 1.48vw, 27px);
  font-style: italic;
  font-weight: 500;
  letter-spacing: -.03em;
  line-height: 1.42;
  text-wrap: pretty;
}

.page-culture .founder-quote figcaption {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
  margin-top: clamp(24px, 2vw, 31px);
  color: var(--culture-ink);
}

.page-culture .founder-quote figcaption strong {
  font-family: var(--font-neue);
  font-size: clamp(16px, 1vw, 18px);
  font-weight: 750;
  letter-spacing: -.025em;
  line-height: 1.15;
}

.page-culture .founder-quote figcaption span {
  color: rgba(17, 18, 20, .6);
  font-family: var(--font-neue);
  font-size: clamp(15px, .9vw, 17px);
  font-weight: 400;
  letter-spacing: -.018em;
  line-height: 1.3;
}

@media (max-width: 760px) {

  .page-culture .culture-hero-scene img {
    width: 230%;
  }

  .page-culture .culture-hero-scene::after {
    height: 42%;
  }

  .page-culture .founder-quote {
    grid-template-columns: 1fr;
    gap: 26px;
    min-height: 0;
    padding: 30px 24px 34px;
    border-radius: 18px;
  }

  .page-culture .founder-quote__monogram {
    width: 78px;
    border-radius: 14px;
  }

  .page-culture .founder-quote blockquote p {
    max-width: 31ch;
    font-size: clamp(23px, 6.8vw, 30px);
  }
}

/* Culture / Trunk-inspired card architecture */

.page-culture {
  --culture-card: #f8f8f6;
  --culture-card-raised: #fcfcfb;
  --culture-card-border: rgba(17, 18, 20, .14);
  --culture-card-radius: 26px;
}

.page-culture .culture-about,
.page-culture .culture-principles,
.page-culture .culture-partnership,
.page-culture .culture-final-cta {
  padding-block: clamp(54px, 5vw, 78px);
}

.page-culture .culture-about > .split-heading,
.page-culture .mission-panel,
.page-culture .culture-principles .section-heading,
.page-culture .principle,
.page-culture .culture-partnership .partnership-grid {
  border: 1px solid var(--culture-card-border);
  background-color: var(--culture-card);
  background-image:
    radial-gradient(circle at 22% 12%, rgba(255, 255, 255, .82), transparent 42%),
    url("frost-noise.svg");
  background-position: center, center;
  background-size: auto, 180px 180px;
  background-blend-mode: normal, multiply;
}

.page-culture .culture-about > .split-heading {
  gap: clamp(52px, 7vw, 112px);
  padding: clamp(48px, 5.2vw, 82px);
  border-radius: var(--culture-card-radius);
}

.page-culture .culture-about .split-heading__body {
  padding-top: 20px;
}

.page-culture .mission-grid {
  gap: clamp(22px, 2vw, 30px);
  margin-top: clamp(22px, 2vw, 30px);
  border: 0;
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2) {
  min-height: clamp(430px, 37vw, 560px);
  padding: clamp(44px, 4.8vw, 72px);
  border: 1px solid var(--culture-card-border);
  border-radius: var(--culture-card-radius);
}

.page-culture .mission-panel h3 {
  margin-top: clamp(64px, 6vw, 94px);
}

.page-culture .culture-principles .section-heading {
  gap: clamp(52px, 7vw, 112px);
  align-items: end;
  padding: clamp(48px, 5.2vw, 82px);
  border-radius: var(--culture-card-radius);
}

.page-culture .principle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(22px, 2vw, 30px);
  margin-top: clamp(22px, 2vw, 30px);
  border: 0;
}

.page-culture .principle {
  min-height: clamp(360px, 30vw, 448px);
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: clamp(38px, 4vw, 60px);
  border-radius: var(--culture-card-radius);
}

.page-culture .principle:hover {
  border-color: rgba(17, 18, 20, .22);
  background-color: var(--culture-card-raised);
}

.page-culture .principle h3 {
  max-width: 15ch;
  margin-top: clamp(50px, 5vw, 76px);
}

.page-culture .principle p {
  margin-top: auto;
  padding-top: 38px;
}

.page-culture .culture-partnership .partnership-grid {
  gap: clamp(52px, 7vw, 112px);
  padding: clamp(48px, 5.2vw, 82px);
  border-radius: var(--culture-card-radius);
}

.page-culture .culture-partnership .partnership-grid__body {
  padding-top: 20px;
}

.page-culture .culture-final-cta .final-cta__grid {
  overflow: hidden;
  gap: clamp(52px, 7vw, 112px);
  padding: clamp(52px, 5.6vw, 88px);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: var(--culture-card-radius);
  background:
    radial-gradient(circle at 80% 20%, rgba(99, 189, 114, .16), transparent 36%),
    url("frost-noise.svg") center / 170px 170px repeat,
    #111214;
  background-blend-mode: screen, soft-light, normal;
}

.page-culture .culture-final-cta h2,
.page-culture .culture-final-cta .final-cta__copy,
.page-culture .culture-final-cta .text-link {
  color: #fff;
}

.page-culture .culture-final-cta .section-label {
  color: var(--culture-green);
}

.page-culture .culture-final-cta .button--light {
  border-color: #fff;
  background: #fff;
  color: var(--culture-ink);
}

.page-culture .culture-final-cta .text-link {
  border-color: rgba(255, 255, 255, .42);
}

@media (max-width: 1024px) {

  .page-culture .principle-grid {
    grid-template-columns: 1fr;
  }

  .page-culture .principle {
    min-height: 340px;
  }
}

@media (max-width: 760px) {

  .page-culture .culture-about,
  .page-culture .culture-principles,
  .page-culture .culture-partnership,
  .page-culture .culture-final-cta {
    padding-block: 34px;
  }

  .page-culture .culture-about > .split-heading,
  .page-culture .culture-principles .section-heading,
  .page-culture .culture-partnership .partnership-grid,
  .page-culture .culture-final-cta .final-cta__grid {
    gap: 42px;
    padding: 34px 26px 38px;
    border-radius: 20px;
  }

  .page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2),
.page-culture .principle {
    border-radius: 20px;
  }

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    min-height: 400px;
    padding: 36px 28px;
  }

  .page-culture .principle {
    min-height: 370px;
    padding: 34px 28px;
  }
}

/* Culture closing CTA / Home-page treatment */

.page-culture .culture-final-cta {
  --cta-art-y: 0%;
  min-height: clamp(420px, 34vw, 560px);
  display: grid;
  align-items: center;
  padding-block: clamp(76px, 7vw, 112px);
  isolation: isolate;
  overflow: hidden;
  background: #08090b;
  color: var(--white);
}

.page-culture .culture-final-cta .final-cta__grid {
  display: block;
  overflow: visible;
  padding: 0 0 clamp(62px, 5vw, 84px);
  border: 0;
  border-radius: 0;
  background: none;
  text-align: center;
}

.page-culture .culture-final-cta h2 {
  max-width: 22ch;
  margin: 0 auto;
  color: var(--white);
  font-size: var(--tk-fs-h2);
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.05;
}

.page-culture .culture-final-cta p.final-cta__copy {
  max-width: 26ch;
  margin: var(--tk-2) auto 0;
  padding-block: .1em .18em;
  color: #306ae2;
  font-size: var(--tk-fs-h1-sub);
  font-weight: 500;
  letter-spacing: -1px;
  line-height: 1.1;
  text-align: center;
}

.page-culture .culture-final-cta .final-cta__actions {
  justify-content: center;
  margin-top: var(--tk-4);
}

.page-culture .culture-final-cta .button--light {
  border-color: var(--white);
  background: var(--white);
  color: var(--tk-gray-darkest);
}

.page-culture .culture-final-cta .text-link {
  border-color: rgba(255, 255, 255, .36);
  color: var(--white);
}

.page-culture .culture-final-cta::before {
  content: "";
  display: block;
}

.page-culture .culture-final-cta::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: 0;
  height: 110px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(8, 9, 11, .72) 58%,
    var(--tk-gray-darkest) 100%
  );
  pointer-events: none;
}

.page-culture .culture-final-cta .final-cta__grid {
  position: relative;
  z-index: 2;
}

.page-culture .site-footer {
  padding-top: clamp(72px, 6vw, 104px);
}

@media (max-width: 760px) {

  .page-culture .culture-final-cta {
    min-height: 450px;
    padding-block: 72px 58px;
  }

  .page-culture .culture-final-cta p.final-cta__copy {
    font-size: 22px;
  }

  .page-culture .culture-final-cta .final-cta__actions {
    align-items: stretch;
  }

  .page-culture .site-footer {
    padding-top: 72px;
  }
}

/* Culture CTA + footer / one continuous breathing-black canvas */

.page-culture .site-footer {
  isolation: isolate;
  overflow: hidden;
  margin-top: -1px;
  padding-block: clamp(72px, 6vw, 104px) var(--tk-4);
  border: 0;
  background: #08090b;
  color: var(--tk-gray-light);
}

.page-culture .site-footer::before {
  content: "";
  position: absolute;
  inset: auto -10% -12%;
  z-index: 0;
  height: 92%;
  background: radial-gradient(
    58% 94% at 50% 112%,
    rgba(255, 255, 255, .72) 0%,
    rgba(255, 255, 255, .4) 28%,
    rgba(255, 255, 255, .18) 50%,
    rgba(255, 255, 255, .065) 66%,
    transparent 82%
  );
  filter: blur(10px);
  transform-origin: 50% 100%;
  animation: footer-breathe 3.8s var(--tk-ease-soft) infinite;
  pointer-events: none;
}

.page-culture .site-footer::after {
  content: none;
}

.page-culture .site-footer .footer-grid,
.page-culture .site-footer .footer-bottom {
  position: relative;
  z-index: 1;
}

.page-culture .footer-brand__asset img {
  filter: grayscale(1) brightness(3) contrast(2);
  mix-blend-mode: screen;
}

.page-culture .site-footer .footer-label,
.page-culture .footer-contact h3,
.page-culture .site-footer .footer-contact .text-link {
  color: var(--tk-white);
}

.page-culture .site-footer .footer-column a,
.page-culture .site-footer .footer-contact p {
  color: var(--tk-gray-light);
}

.page-culture .site-footer .footer-bottom span {
  color: var(--tk-gray);
}

.page-culture .site-footer .footer-column a:hover,
.page-culture .site-footer .footer-contact .text-link:hover {
  color: var(--culture-green);
}

.page-culture .site-footer .footer-bottom {
  border-top-color: var(--border-soft);
}

@media (max-width: 760px) {

  .page-culture .site-footer {
    padding-block: 72px var(--tk-3);
  }

  .page-culture .site-footer::before {
    inset-inline: -30%;
    height: 76%;
    filter: blur(14px);
  }
}

@media (prefers-reduced-motion: reduce) {

  .page-culture .site-footer::before {
    animation-name: footer-breathe !important;
    animation-duration: 3.8s !important;
    animation-delay: 0s !important;
    animation-timing-function: var(--tk-ease-soft) !important;
    animation-iteration-count: infinite !important;
  }
}

/* Culture About / narrative-left, intelligence drawing-right */

.page-culture .culture-about > .split-heading {
  grid-template-columns: 1fr;
  gap: 0;
  align-items: center;
  padding: clamp(42px, 4vw, 64px) 0;
  border: 0;
  border-radius: 0;
  background: none;
}

.page-culture .culture-about__copy {
  min-width: 0;
  max-width: 980px;
}

.page-culture .culture-about .culture-about__copy h2 {
  max-width: none;
  color: #111214;
  font-size: clamp(58px, 5.7vw, 92px);
  font-weight: 700;
  line-height: 1.02;
  overflow: visible;
}

.page-culture .culture-about .culture-about__copy h2 span {
  display: inline-block;
  overflow: visible;
  padding-block: .025em .085em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  white-space: normal;
  text-wrap: pretty;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {

  .page-culture .culture-about .culture-about__copy h2 span {
    background-image:
      url("frost-noise.svg"),
      linear-gradient(112deg, #08090b 0%, #35373b 46%, #101114 100%);
    background-size: 120px 120px, 100% 100%;
    background-blend-mode: soft-light, normal;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .24));
  }
}

.page-culture .culture-about .culture-about__copy h2 span:nth-child(2) {
  color: #6C1D2D;
  background-image: none;
  font-size: min(var(--tk-fs-h1), 5vw);
  -webkit-text-fill-color: #6C1D2D;
}

.page-culture .culture-about .culture-about__copy h2 span:first-child {
  font-size: min(var(--tk-fs-h1), 5.2vw);
}

.page-culture .culture-about .culture-about__copy .split-heading__body {
  max-width: 840px;
  margin-top: 24px;
  padding-top: 0;
}

.page-culture .culture-about .culture-about__copy .split-heading__body p {
  color: #5F5F63;
  font-size: clamp(16px, 1.1vw, 19px);
  line-height: 1.65;
  margin-bottom: 1.25rem;
}

.page-culture .culture-about .culture-about__copy .split-heading__body p.about-mission-statement {
  color: #6C1D2D;
  font-family: "Newsreader", serif;
  font-size: clamp(1.4rem, 2.2vw, 2.2rem);
  font-weight: 500;
  line-height: 1.25;
  margin-top: 1.75rem;
  margin-bottom: 0;
  letter-spacing: -0.02em;
}

.page-culture .mission-grid {
  margin-top: clamp(48px, 4.5vw, 70px);
}

@media (max-width: 1024px) {

  .page-culture .culture-about > .split-heading {
    grid-template-columns: 1fr;
    padding-block: 32px;
  }
}

@media (max-width: 760px) {

  .page-culture .culture-about .culture-about__copy .split-heading__body {
    margin-top: 16px;
  }

  .page-culture .culture-about .culture-about__copy h2 span {
    white-space: normal;
  }

  .page-culture .culture-about .culture-about__copy .split-heading__body p span {
    display: inline;
    white-space: normal;
  }

  .page-culture .culture-about .culture-about__copy .split-heading__body p span + span::before {
    content: " ";
  }

  .page-culture .mission-grid {
    margin-top: 38px;
  }
}

@media (max-width: 680px) {

  .page-culture .culture-about .culture-about__copy h2 span:first-child,
  .page-culture .culture-about .culture-about__copy h2 span:nth-child(2) {
    font-size: min(44px, 8.4vw);
  }
}

/* Culture Vision + Mission / stacked editorial panels */

.page-culture .mission-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin-top: clamp(38px, 3.6vw, 56px);
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2) {
  position: relative;
  min-height: clamp(280px, 22vw, 330px);
  display: grid;
  grid-template-columns: minmax(340px, .9fr) minmax(390px, 1.1fr);
  gap: clamp(42px, 5vw, 78px);
  align-items: center;
  overflow: hidden;
  padding: clamp(34px, 3.2vw, 50px);
  border: 1px solid rgba(17, 18, 20, .2);
  border-radius: 30px;
  background-color: #f6f6f3;
  background-image:
    radial-gradient(circle at 18% 8%, rgba(255, 255, 255, .9), transparent 44%),
    url("frost-noise.svg");
  background-size: auto, 150px 150px;
  box-shadow: 0 18px 50px rgba(17, 18, 20, .04);
}

.page-culture .mission-panel--mission {
  z-index: 2;
  grid-template-columns: minmax(390px, 1.1fr) minmax(340px, .9fr);
  margin-top: -18px;
  background-color: #f9f9f6;
}

.page-culture .mission-panel--mission .mission-panel__content {
  grid-column: 2;
}

.page-culture .mission-panel__content {
  position: relative;
  z-index: 2;
}

.page-culture .mission-panel .section-label {
  color: var(--culture-green);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}

.page-culture .mission-panel h3 {
  max-width: 15ch;
  margin-top: clamp(24px, 2.2vw, 34px);
  color: var(--culture-ink);
  font-size: clamp(30px, 2.65vw, 42px);
  font-weight: 600;
  letter-spacing: -.045em;
  line-height: 1;
}

.page-culture .mission-panel--vision h3 {
  max-width: none;
  font-weight: 700;
}

.page-culture .mission-panel--vision h3 span {
  display: block;
  white-space: nowrap;
}

.page-culture .mission-panel--mission h3 {
  max-width: none;
}

.page-culture .mission-panel--mission h3 span {
  display: block;
  white-space: nowrap;
}

.page-culture .mission-panel__content > p:last-child {
  max-width: 50ch;
  margin-top: clamp(22px, 2vw, 30px);
  color: var(--culture-muted);
  font-size: clamp(14px, .9vw, 16px);
  line-height: 1.58;
}

@media (max-width: 1024px) {

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .page-culture .mission-panel__content {
    order: 1;
  }

  .page-culture .mission-panel--mission .mission-panel__content {
    grid-column: 1;
  }
}

@media (max-width: 760px) {

  .page-culture .mission-grid {
    margin-top: 42px;
  }

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    gap: 34px;
    padding: 34px 26px 38px;
    border-radius: 22px;
  }

  .page-culture .mission-panel--mission {
    margin-top: -14px;
  }

  .page-culture .mission-panel h3 {
    margin-top: 24px;
    font-size: clamp(30px, 9vw, 40px);
  }

  .page-culture .mission-panel--vision h3 span {
    display: inline;
    white-space: normal;
  }

  .page-culture .mission-panel--vision h3 span + span::before {
    content: " ";
  }

  .page-culture .mission-panel--mission h3 span {
    display: inline;
    white-space: normal;
  }

  .page-culture .mission-panel--mission h3 span + span::before {
    content: " ";
  }

  .page-culture .mission-panel__content > p:last-child {
    margin-top: 22px;
    font-size: 15px;
  }
}

/* Culture Principles / compact reading layout */

.page-culture .culture-principles .section-heading {
  grid-template-columns: 1fr;
  gap: clamp(18px, 2vw, 28px);
  justify-items: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  text-align: center;
}

.page-culture .culture-principles .section-heading h2 {
  max-width: none;
  margin-inline: auto;
}

.page-culture .culture-principles .section-heading > p {
  max-width: none;
  margin-inline: auto;
}

.page-culture .principle-grid {
  gap: clamp(16px, 1.5vw, 22px);
  margin-top: clamp(16px, 1.5vw, 22px);
}

.page-culture .principle {
  min-height: 0;
  padding: clamp(28px, 2.7vw, 40px);
}

.page-culture .principle h3 {
  margin-top: clamp(22px, 2vw, 30px);
}

.page-culture .principle p {
  margin-top: clamp(18px, 1.7vw, 26px);
  padding-top: 0;
}

@media (max-width: 1024px) {

  .page-culture .principle {
    min-height: 0;
  }
}

@media (max-width: 760px) {

  .page-culture .culture-principles .section-heading {
    gap: 20px;
    padding: 0;
    border-radius: 0;
  }

  .page-culture .principle {
    min-height: 0;
    padding: 28px 24px 30px;
  }
}

/* Culture Principles / roadmap-inspired continuous rail */

.page-culture .principle-grid {
  display: block;
  overflow: hidden;
  border: 1px solid var(--culture-card-border);
  border-radius: var(--culture-card-radius);
  background-color: var(--culture-card);
  background-image:
    radial-gradient(circle at 22% 12%, rgba(255, 255, 255, .82), transparent 42%),
    url("frost-noise.svg");
  background-position: center, center;
  background-size: auto, 180px 180px;
  background-blend-mode: normal, multiply;
}

.page-culture .principle {
  position: relative;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(270px, .85fr) 72px minmax(320px, 1.15fr);
  grid-template-rows: 1fr;
  column-gap: 0;
  row-gap: 12px;
  align-items: start;
  padding: clamp(28px, 2.6vw, 40px);
  border: 0;
  border-bottom: 1px solid var(--culture-card-border);
  border-radius: 0;
  background: transparent;
}

.page-culture .principle:last-child {
  border-bottom: 0;
}

.page-culture .principle:hover {
  border-color: var(--culture-card-border);
  background-color: rgba(255, 255, 255, .28);
}

.page-culture .principle::before {
  content: "";
  grid-column: 2;
  grid-row: 1;
  width: 2px;
  height: calc(100% + 80px);
  align-self: center;
  justify-self: center;
  background: rgba(17, 18, 20, .22);
}

.page-culture .principle::after {
  content: none;
  z-index: 1;
  grid-column: 2;
  grid-row: 1 / span 2;
  width: 11px;
  height: 11px;
  align-self: center;
  justify-self: center;
  border: 3px solid var(--culture-card);
  border-radius: 50%;
  background: var(--culture-green);
  box-shadow: 0 0 0 1px rgba(85, 185, 105, .34);
}

.page-culture .principle .index-number {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
}

.page-culture .principle h3 {
  grid-column: 1;
  grid-row: 1;
  max-width: 18ch;
  margin: 0;
  align-self: center;
}

.page-culture .principle p {
  grid-column: 3;
  grid-row: 1;
  max-width: 58ch;
  margin: 0;
  padding: 0;
  align-self: center;
}

@media (max-width: 760px) {

  .page-culture .principle-grid {
    border-radius: 20px;
  }

  .page-culture .principle {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    row-gap: 18px;
    padding: 28px 24px 30px;
  }

  .page-culture .principle::before,
  .page-culture .principle::after {
    content: none;
  }

  .page-culture .principle .index-number,
  .page-culture .principle h3,
  .page-culture .principle p {
    grid-column: 1;
    grid-row: auto;
  }
}

/* Culture Principles / centered open heading */

.page-culture .culture-principles .section-heading {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 1.2vw, 20px);
  text-align: center;
}

.page-culture .culture-principles .section-heading > div,
.page-culture .culture-principles .section-heading h2,
.page-culture .culture-principles .section-heading > p {
  width: 100%;
  max-width: none;
  margin-inline: auto;
  text-align: center;
}

.page-culture .culture-principles .section-heading h2 {
  margin-block: 0;
  font-size: min(var(--tk-fs-h1), 6vw);
}

.page-culture .culture-principles .section-heading h2 > span {
  color: #6C1D2D;
}

.page-culture .culture-principles .section-heading > p {
  margin-block: 0;
}

/* Home friction summary removed: close the space previously reserved for it. */

.page-home .intelligence-gap .friction-grid {
  margin-bottom: 0;
}

@media (max-width: 680px) {

  .page-culture .culture-principles .section-heading h2 {
    font-size: min(44px, 8.4vw);
  }
}

/* Culture cards / reference-calibrated neutral typography */

.page-culture {
  --culture-card: #f7f7f7;
  --culture-card-raised: #fafafa;
  --culture-card-border: #dadadd;
  --culture-card-title: #171719;
  --culture-card-copy: #929296;
  --culture-card-radius: 30px;
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2),
.page-culture .principle-grid,
.page-culture .culture-partnership .partnership-grid {
  border-color: var(--culture-card-border);
  border-radius: var(--culture-card-radius);
  background: var(--culture-card);
  background-image: none;
  box-shadow: none;
}

.page-culture .mission-panel .section-label,
.page-culture .culture-partnership .section-label {
  color: var(--culture-card-copy);
  font-family: var(--font-neue);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
}

.page-culture .mission-panel h3 {
  color: var(--culture-card-title);
  font-family: var(--font-neue);
  font-size: clamp(28px, 2.15vw, 34px);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.06;
}

.page-culture .mission-panel--vision h3 {
  font-weight: 500;
}

.page-culture .mission-panel__content > p:last-child {
  color: var(--culture-card-copy);
  font-family: var(--font-neue);
  font-size: clamp(18px, 1.35vw, 22px);
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.56;
}

.page-culture .principle {
  border-bottom-color: var(--culture-card-border);
}

.page-culture .principle:hover {
  border-color: var(--culture-card-border);
  background-color: var(--culture-card-raised);
}

.page-culture .principle::before {
  background: #d0d0d3;
}

.page-culture .principle h3 {
  color: var(--culture-card-title);
  font-family: var(--font-neue);
  font-size: clamp(22px, 1.65vw, 27px);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.08;
}

.page-culture .principle p {
  color: var(--culture-card-copy);
  font-family: var(--font-neue);
  font-size: clamp(17px, 1.25vw, 21px);
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 1.56;
}

.page-culture .culture-partnership h2 {
  color: var(--culture-card-title);
  font-family: var(--font-neue);
  font-size: clamp(34px, 3vw, 48px);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1.04;
}

.page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
  color: var(--culture-card-copy);
  font-family: var(--font-neue);
  font-size: clamp(18px, 1.3vw, 22px);
  font-weight: 400;
  letter-spacing: -.02em;
  line-height: 1.56;
}

@media (max-width: 760px) {

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2),
  .page-culture .principle-grid,
  .page-culture .culture-partnership .partnership-grid {
    border-radius: 22px;
  }

  .page-culture .mission-panel h3 {
    font-size: 30px;
  }

  .page-culture .mission-panel__content > p:last-child,
  .page-culture .principle p,
  .page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
    font-size: 17px;
  }
}

/* Culture Partnership / red transformation flow */

.page-culture .culture-partnership {
  position: relative;
  min-height: clamp(680px, 52vw, 860px);
  display: grid;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
  padding-block: 0;
  margin-block: -1px;
  border: 0;
  border-radius: 0;
  outline: 0;
  box-shadow: none;
  clip-path: none;
  mask: none;
  -webkit-mask: none;
  background: linear-gradient(
    180deg,
    var(--culture-paper) 0%,
    #eadbdc 12%,
    #cb9299 27%,
    #9a3a4e 43%,
    #68182b 61%,
    #321018 79%,
    #08090b 100%
  );
}

.page-culture .culture-partnership__backdrop {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .18) 8%,
    rgba(0, 0, 0, .62) 20%,
    #000 32%,
    #000 76%,
    rgba(0, 0, 0, .64) 88%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 0, 0, .18) 8%,
    rgba(0, 0, 0, .62) 20%,
    #000 32%,
    #000 76%,
    rgba(0, 0, 0, .64) 88%,
    transparent 100%
  );
  pointer-events: none;
}

.page-culture .culture-partnership__backdrop svg {
  width: 100%;
  height: 100%;
  max-width: none;
}

.page-culture .culture-flow-shape {
  stroke: none;
}

.page-culture .culture-flow-shape--wine {
  fill: url("#culture-flow-wine");
  opacity: .86;
  filter: url("#culture-flow-blur-wide");
}

.page-culture .culture-flow-shape--crimson-back,
.page-culture .culture-flow-shape--crimson {
  fill: url("#culture-flow-crimson");
}

.page-culture .culture-flow-shape--crimson-back {
  opacity: .56;
  filter: url("#culture-flow-blur");
}

.page-culture .culture-flow-shape--crimson {
  opacity: .86;
  filter: url("#culture-flow-blur-wide");
}

.page-culture .culture-flow-shape--coral {
  fill: url("#culture-flow-coral");
  opacity: .62;
  filter: url("#culture-flow-blur");
}

.page-culture .culture-flow-shape--veil {
  fill: rgba(255, 221, 211, .1);
  opacity: .5;
}

.page-culture .culture-flow-highlight {
  fill: none;
  stroke: rgba(255, 92, 82, .18);
  stroke-width: 14;
  filter: url("#culture-flow-blur");
}

.page-culture .culture-flow-highlight--soft {
  stroke: rgba(255, 176, 151, .14);
  stroke-width: 24;
}

.page-culture .culture-partnership::before,
.page-culture .culture-partnership::after {
  content: none !important;
  display: none !important;
}

.page-culture .culture-partnership + .culture-final-cta {
  margin-top: -1px;
}

.page-culture .culture-partnership .partnership-grid {
  position: relative;
  z-index: 2;
  width: calc(100vw - 2 * var(--tk-pad-x));
  display: block;
  padding: clamp(72px, 7vw, 108px) 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  transform: none;
}

.page-culture .culture-partnership .partnership-grid > div:first-child,
.page-culture .culture-partnership .partnership-grid__body {
  max-width: min(660px, 52vw);
}

.page-culture .culture-partnership .section-label {
  color: rgba(255, 255, 255, .58);
  font-size: 13px;
}

.page-culture .culture-partnership h2 {
  max-width: none;
  margin-top: 0;
  color: #6C1D2D;
  font-size: clamp(38px, 3.35vw, 64px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: .98;
}

.page-culture .culture-partnership h2 span {
  display: block;
  white-space: nowrap;
}

.page-culture .culture-partnership .partnership-grid > div:first-child {
  width: 100vw;
  max-width: none;
  margin-right: 0;
  margin-left: calc(50% - 50vw);
  text-align: center;
}

.page-culture .culture-partnership .partnership-grid > div:first-child h2 {
  width: 100%;
  margin-inline: auto;
  text-align: center;
}

.page-culture .culture-partnership .partnership-grid__body {
  max-width: min(760px, 72vw);
  margin-top: clamp(28px, 2.8vw, 42px);
  margin-inline: auto;
  padding-top: 0;
  text-align: center;
}

.page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
  max-width: 58ch;
  margin-inline: auto;
  color: rgba(255, 255, 255, .72);
  font-size: clamp(15px, 1vw, 18px);
  font-weight: 400;
  letter-spacing: -.01em;
  line-height: 1.55;
}

.page-culture .culture-partnership .partnership-statement {
  max-width: min(1000px, 92vw) !important;
}

.page-culture .culture-partnership .partnership-statement > span {
  display: block;
  white-space: nowrap;
}

.page-culture .culture-client-watermarks {
  position: relative;
  isolation: isolate;
  width: 100vw;
  margin: clamp(54px, 5vw, 82px) auto 0;
  margin-left: calc(50% - 50vw);
  display: grid;
  gap: clamp(22px, 2vw, 32px);
  overflow: hidden;
}

.page-culture .culture-client-watermarks::before {
  content: none;
}

.page-culture .culture-client-lane {
  width: 100%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent,
    #000 7%,
    #000 93%,
    transparent
  );
  mask-image: linear-gradient(
    90deg,
    transparent,
    #000 7%,
    #000 93%,
    transparent
  );
}

.page-culture .culture-client-track {
  --culture-client-speed: 38s;
  width: max-content;
  display: flex;
  will-change: transform;
}

.page-culture .culture-client-track.is-ready {
  animation: culture-client-carousel var(--culture-client-speed) linear infinite;
}

.page-culture .culture-client-group {
  --culture-client-gap: clamp(28px, 3vw, 54px);
  --culture-client-half-gap: clamp(14px, 1.5vw, 27px);
  display: grid;
  grid-template-rows: repeat(2, 82px);
  grid-auto-flow: column;
  grid-auto-columns: clamp(210px, 18vw, 285px);
  align-items: center;
  gap: clamp(20px, 1.8vw, 28px) var(--culture-client-gap);
  padding-right: var(--culture-client-gap);
}

.page-culture .culture-client-watermark {
  width: 100%;
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: rgba(255, 250, 249, .7);
  font-family: var(--font-neue);
  line-height: .92;
  text-align: left;
  filter: none;
  text-shadow: none;
}

.page-culture .culture-client-group > .culture-client-watermark:nth-child(even) {
  transform: translateX(calc(50% + var(--culture-client-half-gap)));
}

.page-culture .culture-client-mark {
  width: 58px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  font-size: 21px;
  font-weight: 750;
  letter-spacing: -.08em;
}

.page-culture .culture-client-name {
  display: block;
  font-size: clamp(17px, 1.4vw, 24px);
  font-weight: 680;
  letter-spacing: -.055em;
}

.page-culture .culture-client-sub {
  display: block;
  margin-top: 4px;
  font-size: clamp(7px, .55vw, 10px);
  font-weight: 700;
  letter-spacing: .07em;
}

.page-culture .culture-client-watermark--country,
.page-culture .culture-client-watermark--pinewood,
.page-culture .culture-client-watermark--ams,
.page-culture .culture-client-watermark--hhn,
.page-culture .culture-client-watermark--maybank,
.page-culture .culture-client-watermark--pys,
.page-culture .culture-client-watermark--papparich,
.page-culture .culture-client-watermark--mrt {
  display: block;
  text-align: center;
}

.page-culture .culture-client-watermark--seal .culture-client-name,
.page-culture .culture-client-watermark--forest .culture-client-name {
  font-size: clamp(16px, 1.25vw, 22px);
  line-height: 1;
}

.page-culture .culture-client-watermark--ame .culture-client-name,
.page-culture .culture-client-watermark--ams .culture-client-name,
.page-culture .culture-client-watermark--bhp .culture-client-name,
.page-culture .culture-client-watermark--pys .culture-client-name,
.page-culture .culture-client-watermark--mrt .culture-client-name {
  font-size: clamp(25px, 2.15vw, 38px);
  font-weight: 800;
}

.page-culture .culture-client-watermark--pinewood .culture-client-name {
  letter-spacing: .02em;
}

.page-culture .culture-client-watermark--hhn .culture-client-name {
  font-size: clamp(14px, 1.2vw, 21px);
  letter-spacing: .02em;
}

.page-culture .culture-client-watermark--bhp {
  display: flex;
  align-items: baseline;
  gap: 2px;
  font-style: italic;
}

.page-culture .culture-client-watermark--bhp .culture-client-sub {
  display: inline;
  margin: 0;
  font-size: clamp(14px, 1.25vw, 22px);
  font-weight: 650;
  letter-spacing: -.04em;
}

.page-culture .culture-client-watermark--papparich .culture-client-name {
  font-family: "Newsreader", serif;
  font-size: clamp(25px, 2.2vw, 39px);
  font-style: italic;
  font-weight: 600;
}

.page-culture .culture-client-watermark--mrt {
  font-style: italic;
}

@keyframes culture-client-carousel {

  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-50%, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {

  .page-culture .culture-client-track.is-ready {
    animation-name: culture-client-carousel !important;
    animation-duration: var(--culture-client-speed) !important;
    animation-delay: 0s !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
  }
}

.page-culture .culture-partnership .partnership-grid__body > p + p {
  margin-top: 1.1em;
}

@media (max-width: 760px) {

  .page-culture .culture-partnership {
    min-height: 760px;
  }

  .page-culture .culture-partnership__backdrop svg {
    width: 142%;
    transform: translateX(-18%);
  }

  .page-culture .culture-partnership .partnership-grid {
    width: calc(100vw - 2 * var(--tk-pad-x));
    padding-block: 64px;
  }

  .page-culture .culture-partnership .partnership-statement > span {
    white-space: normal;
  }

  .page-culture .culture-client-watermarks {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-top: 48px;
    gap: 18px;
  }

  .page-culture .culture-client-watermark {
    min-height: 58px;
    gap: 8px;
  }

  .page-culture .culture-client-group {
    grid-template-rows: repeat(2, 58px);
    grid-auto-flow: column;
    grid-auto-columns: 190px;
  }

  .page-culture .culture-client-mark {
    width: 38px;
    font-size: 15px;
  }

  .page-culture .culture-client-name {
    font-size: clamp(12px, 3.5vw, 16px);
  }

  .page-culture .culture-client-watermark--ame .culture-client-name,
  .page-culture .culture-client-watermark--ams .culture-client-name,
  .page-culture .culture-client-watermark--bhp .culture-client-name {
    font-size: clamp(18px, 5vw, 24px);
  }

  .page-culture .culture-partnership .partnership-grid > div:first-child,
  .page-culture .culture-partnership .partnership-grid__body {
    max-width: 100%;
  }

  .page-culture .culture-partnership .partnership-grid > div:first-child {
    width: 100vw;
    max-width: none;
  }

  .page-culture .culture-partnership h2 {
    font-size: clamp(38px, 10.5vw, 52px);
  }
}

/* Culture Vision + Mission / one shared panel */

.page-culture .culture-about > .split-heading {
  padding-bottom: 0;
}

.page-culture .mission-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin-top: clamp(24px, 2.4vw, 34px);
  overflow: hidden;
  border: 1px solid var(--culture-card-border);
  border-radius: var(--culture-card-radius);
  background: var(--culture-card);
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2) {
  min-height: clamp(390px, 32vw, 500px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 0;
  padding: clamp(44px, 4.5vw, 68px);
  border: 0;
  border-radius: 0;
  background: transparent;
  background-image: none;
  box-shadow: none;
}

.page-culture .mission-panel--mission {
  border-left: 1px solid var(--culture-card-border);
}

.page-culture .mission-panel--mission .mission-panel__content {
  grid-column: auto;
}

.page-culture .mission-panel__content {
  width: 100%;
  display: grid;
  grid-template-rows: auto auto auto;
  align-content: start;
}

.page-culture .mission-panel .section-label {
  margin: 0;
  color: #6C1D2D;
  font-size: clamp(20px, 1.45vw, 24px);
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1.1;
}

.page-culture .mission-panel h3 {
  min-height: 2.12em;
  margin-top: clamp(34px, 3.4vw, 52px);
  margin-bottom: 0;
}

.page-culture .mission-panel__content > p:last-child {
  width: 100%;
  max-width: 44ch;
  margin-top: clamp(24px, 2.2vw, 34px);
  margin-bottom: 0;
}

@media (max-width: 900px) {

  .page-culture .mission-grid {
    grid-template-columns: 1fr;
  }

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    min-height: 0;
    padding: clamp(34px, 7vw, 52px);
  }

  .page-culture .mission-panel--mission {
    border-top: 1px solid var(--culture-card-border);
    border-left: 0;
  }

  .page-culture .mission-panel h3 {
    min-height: 0;
    margin-top: 28px;
  }
}

/* Shared navigation / directional scroll reveal */

.site-header {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: 50% 0;
  transition:
    transform 520ms cubic-bezier(.22, 1, .36, 1),
    opacity 360ms ease,
    filter 420ms ease;
  will-change: transform, opacity, filter;
}

.site-header.is-hidden {
  opacity: 0;
  filter: blur(5px);
  transform: translate3d(0, calc(-100% - 14px), 0) scale(.985);
}

.site-header.is-hidden .header-inner {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {

  .site-header {
    transition-property: transform, opacity, filter !important;
    transition-duration: 520ms, 360ms, 420ms !important;
    transition-delay: 0ms !important;
    transition-timing-function:
      cubic-bezier(.22, 1, .36, 1),
      ease,
      ease !important;
  }
}

/* Unified footer breathing light across Home, Solutions, and Culture. */

.page-home .site-footer::before,
.page-solutions .site-footer::before,
.page-culture .site-footer::before {
  content: "";
  position: absolute;
  inset: auto -10% -12%;
  z-index: 0;
  height: 92%;
  background: radial-gradient(
    58% 94% at 50% 112%,
    rgba(255, 255, 255, .72) 0%,
    rgba(255, 255, 255, .4) 28%,
    rgba(255, 255, 255, .18) 50%,
    rgba(255, 255, 255, .065) 66%,
    transparent 82%
  );
  filter: blur(10px);
  transform-origin: 50% 100%;
  animation: footer-breathe 3.8s var(--tk-ease-soft) 0s infinite both;
  pointer-events: none;
  will-change: opacity, transform;
}

@media (max-width: 760px) {

  .page-home .site-footer::before,
  .page-solutions .site-footer::before,
  .page-culture .site-footer::before {
    inset-inline: -30%;
    height: 76%;
    filter: blur(14px);
  }
}

/* ==========================================================================
   AUDIT REMEDIATION — 2026-07-28
   Final scoped overrides. Every rule below fixes one numbered finding from
   AUDIT-2026-07-28.md and is deliberately the last matching selector so it
   wins over the historical layers above. Do not move this block upward.
   ========================================================================== */

/* --- P0-3 -----------------------------------------------------------------
   `.mission-panel h3 span` is nowrap by design (the two-line break is
   intentional). At 1440px the vision line needed 409px inside a 338px content
   box, so the trailing "e" of "Intelligence" was clipped; at 1024px the
   mission column overflowed too. Both panels get the same slightly tighter
   inline padding and the same type scale, so the columns stay optically
   identical — the fix must never make vision smaller than mission.
   -------------------------------------------------------------------------- */
/* Tighter inline padding buys the heading the width it needs — but only in the
   two-column band, and only at a specificity that also beats the historical
   `:nth-child(2)` rule, so both panels stay optically identical. In the stacked
   band the original padding is left alone; overriding only one panel there was
   what pulled "Our mission" 8-25px to the right of "Our vision". */
@media (min-width: 1001px) {

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    padding-inline: clamp(26px, 3.1vw, 46px);
  }
}

/* The two-column region only survives while each panel can still hold the
   longest nowrap line ("Powering Enterprise Intelligence"). Below that it
   stacks, exactly as it already did on phones. */
@media (max-width: 1000px) {

  .page-culture .mission-grid {
    grid-template-columns: 1fr;
  }

  .page-culture .mission-panel--mission .mission-panel__content {
    grid-column: 1;
  }
}

/* Stacked band keeps the original presence; the two-column band is sized to
   what the narrower column can actually hold. Both panels always share one
   scale — vision must never render smaller than mission. */
.page-culture .mission-panel--vision h3,
.page-culture .mission-panel--mission h3 {
  font-size: clamp(26px, 3.1vw, 34px);
}

@media (min-width: 1001px) {

  .page-culture .mission-panel--vision h3,
  .page-culture .mission-panel--mission h3 {
    font-size: clamp(18px, 1.88vw, 27px);
  }
}

/* --- P0-4 -----------------------------------------------------------------
   `1fr` resolves to `minmax(auto, 1fr)`, so the track floor is min-content and
   the longest feature-list item pushed the Decision Intelligence article 13px
   past a 375px viewport (silently clipped by body{overflow-x:hidden}). The
   desktop base rule already used minmax(0, 1fr); these two overrides had
   dropped back to the unbounded form.
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {

  .page-solutions .solution-detail {
    grid-template-columns: 56px minmax(0, 1fr);
  }
}

@media (max-width: 680px) {

  .page-solutions .solution-detail {
    grid-template-columns: 44px minmax(0, 1fr);
  }
}

/* --- P0-5 -----------------------------------------------------------------
   The partnership statement already released nowrap at <=760px; its heading
   never did, so "We Don't Just Implement Solution" asked for 534px inside a
   375px screen and was cut mid-word.
   -------------------------------------------------------------------------- */
@media (max-width: 760px) {

  .page-culture .culture-partnership h2 span {
    white-space: normal;
  }
}

/* --- P1-1 -----------------------------------------------------------------
   Dark-theme greys had been reused on the paper-white surfaces. Measured
   before/after (WCAG AA body text needs 4.5:1):
     culture-about lead    #B3B3B5 on #F1F1EF  1.85:1  ->  #5F5F63  6.06:1
     mission + principles  #929296 on #F7F7F7  2.89:1  ->  #5F5F63  6.31:1
   The dark surfaces keep their original greys — those already pass.
   -------------------------------------------------------------------------- */
.page-culture .culture-about .culture-about__copy .split-heading__body p:first-child,
.page-culture .culture-about .culture-about__copy .split-heading__body p:first-child span {
  color: #5F5F63;
}

.page-culture .mission-panel__content > p:last-child,
.page-culture .principle p {
  color: #5F5F63;
}

/* Client watermarks sit on the red ribbon; near-white at low opacity was
   illegible over the light end of the gradient. */
.page-culture .culture-client-watermark {
  color: #FFFFFF;
}

.page-culture .culture-client-name,
.page-culture .culture-client-sub,
.page-culture .culture-client-mark {
  text-shadow: 0 1px 10px rgba(58, 8, 20, .55);
}

/* Skip link: white on #89898d was 3.48:1. Theme red gives 11.34:1. */
.skip-link {
  background: #6C1D2D;
  color: #FFFFFF;
  border-radius: 4px;
  font-weight: 600;
  text-decoration: none;
}

/* CTA word switcher: two of the three words missed AA on #08090b
   (#97603D 3.85:1, #306AE2 4.07:1). Lightened to 5.4:1 and 5.6:1,
   hue and character unchanged. */
.final-cta__word--decisions {
  color: #C08050;
}

.final-cta__word--efficiency {
  color: #6E9BF0;
}

/* --- P1-2 -----------------------------------------------------------------
   The footer mark was the light-background reference JPEG pushed through
   `brightness(3)` + `mix-blend-mode: screen`, which blew its white plate to
   pure white on the black footer — a solid white rectangle on all three
   pages. It is now a real transparent PNG (white for dark surfaces, ink for
   the light header pill), so every filter and blend hack has to come off.
   -------------------------------------------------------------------------- */
.logo-crop {
  overflow: visible;
}

.logo-crop img,
.page-culture .logo-crop img {
  position: static;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
  transform: none;
  filter: none;
  mix-blend-mode: normal;
}

.footer-brand__asset,
.page-culture .footer-brand__asset {
  overflow: visible;
  background: none;
}

.footer-brand__asset img,
.page-culture .footer-brand__asset img {
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: none;
  mix-blend-mode: normal;
  opacity: .92;
}

/* --- P1-3 -----------------------------------------------------------------
   >=1180px promoted cards 10+ to a half-width "secondary tier" at 72% opacity
   with their tags hidden. With real wordmarks in them the PappaRich and
   MAYBANK lettering overflowed the narrower card and read as truncated, and
   the row looked like a rendering fault rather than a hierarchy. One uniform
   grid instead: 3 up, every card equal, nothing dimmed.
   -------------------------------------------------------------------------- */
@media (min-width: 1180px) {

  .page-solutions .client-grid {
    grid-template-columns: repeat(3, minmax(0, 396px));
    max-width: 1232px;
  }

  .page-solutions .client-card,
  .page-solutions .client-card:nth-child(n + 10) {
    grid-column: auto;
    height: 190px;
    min-height: 190px;
    padding: 20px 20px 18px;
    justify-content: flex-start;
    opacity: 1;
  }

  .page-solutions .client-card:nth-child(n + 10) > p {
    margin-top: 0;
    font-size: 13px;
  }

  .page-solutions .client-card:nth-child(n + 10) .client-card__tags {
    display: flex;
  }
}

/* Keep every wordmark inside its card at any width. */
.page-solutions .client-logo {
  max-width: 100%;
  overflow: hidden;
}

.page-solutions .client-logo span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: clip;
  white-space: nowrap;
}

/* Tag pills were 1.94:1 (green on green) and 2.23:1 (grey on grey) at 10px. */
.page-solutions .client-card__tags span {
  color: #E6E7E8;
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .16);
}

.page-solutions .client-card__tags span:first-child {
  color: #8FE3B4;
  background: rgba(73, 211, 145, .12);
  border-color: rgba(73, 211, 145, .28);
}

/* --- P2-4 -----------------------------------------------------------------
   40+ interactive elements shared 2 `:focus-visible` declarations in 15k
   lines, so keyboard users had no visible focus. One ring, both themes.
   -------------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid #6C1D2D;
  outline-offset: 3px;
  border-radius: 3px;
}

.page-home a:focus-visible,
.page-solutions a:focus-visible,
.page-home summary:focus-visible,
.page-solutions summary:focus-visible,
.site-footer a:focus-visible,
.final-cta a:focus-visible,
.content-section--dark a:focus-visible {
  outline-color: #E8B4BE;
}

.skip-link:focus-visible {
  outline-offset: 2px;
}

/* --- P0-6 (found during remediation) ---------------------------------------
   Pre-existing, not in the original audit: `.page-culture .principle` is a
   three-track grid whose floors total 270 + 72 + 320 = 662px before padding,
   but it only collapsed to one column at <=760px. Between 761px and ~900px —
   iPad portrait at 768px included — the description column overflowed the
   shell by up to 66px and was clipped by body{overflow-x:hidden}. The collapse
   now happens while the tracks still fit, mirroring the existing <=760px rules.
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {

  .page-culture .principle {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    row-gap: 18px;
    padding: 28px 24px 30px;
  }

  .page-culture .principle::before,
  .page-culture .principle::after {
    content: none;
  }

  .page-culture .principle .index-number,
  .page-culture .principle h3,
  .page-culture .principle p {
    grid-column: 1;
    grid-row: auto;
    max-width: 58ch;
  }

  .page-culture .principle h3 {
    max-width: 22ch;
  }
}

/* Original hero sketches / approved 2026-07-28
   These complete compositions replace the downloaded Trunk hero layers. */

.page-home .hero-world {
  background-color: #F6F6F6;
  background-image: url("home-hero-reference-view-v9.webp");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.page-home .hero-world::before {
  content: none;
  background-image: none;
}

.page-home .home-hero h1,
.page-home .home-hero h1 em,
.page-home .home-hero__declaration {
  color: #111214;
}

.page-home .home-hero .button {
  border-color: #08090B;
  background: #08090B;
  color: #FFFFFF;
}

.page-home .home-hero .button:hover {
  border-color: #6C1D2D;
  background: #6C1D2D;
  color: #FFFFFF;
}

.page-home .hero-world::after {
  background: linear-gradient(
    to bottom,
    rgba(8, 9, 11, 0) 0%,
    rgba(8, 9, 11, 0) 56%,
    rgba(8, 9, 11, .18) 63%,
    rgba(8, 9, 11, .72) 70%,
    #08090B 76%,
    #08090B 100%
  );
}

@media (max-width: 680px) {

  .page-home .hero-world {
    background-position: center top;
    background-size: auto max(720px, 100svh);
  }
}

/* Home Hero / requested vertical rhythm
   Keep the image-to-black gradient, give it room to finish, then introduce the
   complete first matrix chapter—lines, label, heading and supporting copy. */

.page-home .hero-bridge {
  padding-top: clamp(56px, 4vw, 80px);
}

.page-home .hero-bridge::before {
  inset: clamp(56px, 4vw, 80px) 0 auto;
}

@media (min-width: 681px) {

  .page-home .home-hero__copy {
    top: clamp(52px, 4.5vw, 82px);
  }
}

@media (max-width: 680px) {

  .page-home .home-hero__copy {
    top: clamp(58px, 13vw, 82px);
  }
}

/* Culture Hero / copy legibility
   Strengthen the existing mist instead of introducing a visible text card. */

.page-culture .culture-hero-scene::after {
  height: 50%;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, .7) 46%,
    rgba(255, 255, 255, .94) 72%,
    var(--culture-paper) 100%
  );
}

.page-culture .page-hero--security .page-hero__body {
  color: rgba(17, 18, 20, .86);
  font-weight: 500;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
}

@media (max-width: 760px) {

  .page-culture .culture-hero-scene::after {
    height: 58%;
  }
}

/* Home Hero / cliff-to-black transition
   Carry a faint inverted echo of the cliff drawing into the charcoal field,
   then let the matrix chapter enter only after the background is nearly black. */

.page-home .hero-world::after {
  z-index: 0;
  background: linear-gradient(
    to bottom,
    rgba(8, 9, 11, 0) 0%,
    rgba(8, 9, 11, 0) 42%,
    rgba(8, 9, 11, .05) 47%,
    rgba(8, 9, 11, .16) 53%,
    rgba(8, 9, 11, .34) 60%,
    rgba(8, 9, 11, .58) 67%,
    rgba(8, 9, 11, .79) 74%,
    rgba(8, 9, 11, .94) 81%,
    #08090B 87%,
    #08090B 100%
  );
}

.page-home .hero-world::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-image: url("home-hero-reference-view-v9.webp");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
  filter: invert(1) grayscale(1) contrast(1.12);
  opacity: .13;
  mix-blend-mode: screen;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 48%,
    rgba(0, 0, 0, .32) 57%,
    #000 69%,
    rgba(0, 0, 0, .66) 80%,
    transparent 91%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    transparent 48%,
    rgba(0, 0, 0, .32) 57%,
    #000 69%,
    rgba(0, 0, 0, .66) 80%,
    transparent 91%,
    transparent 100%
  );
  pointer-events: none;
}

.page-home .hero-world .home-hero,
.page-home .hero-world .hero-bridge {
  z-index: 2;
}

@media (max-width: 680px) {

  .page-home .hero-world::after {
    background: linear-gradient(
      to bottom,
      rgba(8, 9, 11, 0) 0%,
      rgba(8, 9, 11, 0) 38%,
      rgba(8, 9, 11, .08) 44%,
      rgba(8, 9, 11, .24) 52%,
      rgba(8, 9, 11, .5) 61%,
      rgba(8, 9, 11, .76) 70%,
      rgba(8, 9, 11, .94) 79%,
      #08090B 86%,
      #08090B 100%
    );
  }

  .page-home .hero-world::before {
    background-position: center top;
    background-size: auto max(720px, 100svh);
    opacity: .11;
  }
}

/* ==========================================================================
   2026-07-29 Company Profile Enhancements: Journey, Industries & Looking Ahead
   ========================================================================== */

/* Journey 5-stage timeline grid */
.journey-section {
  padding-block: var(--space-6);
}

.journey-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-5);
}

.journey-step {
  background: var(--surface-soft);
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  padding: var(--space-4);
  transition: transform var(--motion-standard) var(--ease), border-color var(--motion-standard) var(--ease);
}

.journey-step:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 255, 255, 0.3);
}

.journey-step__num {
  font-family: "Newsreader", serif;
  font-size: 1.8rem;
  color: rgba(255, 255, 255, 0.35);
  font-weight: 500;
  display: block;
  margin-bottom: var(--space-2);
}

.journey-step h3 {
  font-size: 1.5rem;
  margin-bottom: var(--space-2);
  color: var(--text-primary);
}

.journey-step ul {
  list-style: none;
  padding: 0;
  margin: 0;
  color: var(--tk-gray-light);
  font-size: 0.95rem;
}

.journey-step ul li {
  position: relative;
  padding-left: 14px;
  margin-bottom: 6px;
}

.journey-step ul li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: rgba(255, 255, 255, 0.3);
}

/* Industries We Serve Grid */
.industries-section {
  padding-block: var(--space-6);
}

.industries-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.industry-card {
  background: rgba(137, 137, 141, 0.08);
  border: 1px solid rgba(137, 137, 141, 0.2);
  border-radius: 8px;
  padding: var(--space-3) var(--space-4);
  font-weight: 500;
  color: var(--ink);
  transition: background var(--motion-fast) var(--ease), border-color var(--motion-fast) var(--ease);
}

.page-solutions .industry-card,
.page-home .industry-card {
  color: var(--text-primary);
}

.industry-card:hover {
  background: rgba(108, 29, 45, 0.12);
  border-color: #6C1D2D;
}

/* Looking Ahead section */
.looking-ahead {
  background: linear-gradient(180deg, rgba(8,9,11,0.95) 0%, rgba(108,29,45,0.2) 100%);
  border-top: 1px solid rgba(108,29,45,0.4);
  border-bottom: 1px solid rgba(108,29,45,0.4);
  padding-block: var(--space-6);
  text-align: center;
  color: #ffffff;
}

.looking-ahead__quote {
  font-family: "Newsreader", serif;
  font-size: clamp(1.8rem, 3.2vw, 3rem);
  line-height: 1.2;
  margin-bottom: var(--space-4);
  font-weight: 400;
  letter-spacing: -0.02em;
}

.looking-ahead__sub {
  max-width: 800px;
  margin-inline: auto;
  color: var(--tk-gray-light);
  font-size: clamp(1rem, 1.3vw, 1.25rem);
}

/* Fine-tuned Responsive Breakpoints */
@media (max-width: 768px) {
  .journey-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 16px;
  }

  .industries-grid {
    grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr));
    gap: 10px;
  }

  .industry-card {
    padding: 10px 14px;
    font-size: 0.92rem;
  }
}

@media (max-width: 480px) {
  .journey-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .journey-step {
    padding: var(--space-3);
  }

  .industries-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .looking-ahead {
    padding-block: 40px;
  }

  .looking-ahead__quote {
    font-size: clamp(1.35rem, 5.5vw, 1.9rem);
  }
}

/* Sector Grouping for Client Showcase */
.sector-group-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  margin-top: var(--space-5);
}

.sector-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.sector-group__title {
  margin-bottom: var(--space-1);
}

.sector-badge {
  display: inline-block;
  font-family: "Manrope", sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6C1D2D;
  background: rgba(108, 29, 45, 0.08);
  border: 1px solid rgba(108, 29, 45, 0.22);
  border-radius: 999px;
  padding: 6px 16px;
}

.page-solutions .sector-group .client-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: var(--space-3);
  justify-content: stretch;
}

.page-solutions .sector-group .client-card {
  grid-column: auto !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: 150px;
  padding: var(--space-3) var(--space-4);
}

@media (max-width: 680px) {
  .sector-group-wrapper {
    gap: var(--space-4);
    margin-top: var(--space-4);
  }

  .sector-badge {
    font-size: 0.78rem;
    padding: 4px 12px;
  }

  .page-solutions .sector-group .client-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

/* ─── Sector Showcase (Organisations We've Worked With) ─── */
.sector-showcase {
  text-align: center;
}

.sector-showcase__head {
  max-width: 720px;
  margin-inline: auto;
  margin-bottom: clamp(40px, 5vw, 72px);
}

.sector-showcase__head .section-label {
  margin-bottom: 16px;
}

.sector-showcase__head h2 {
  font-size: clamp(36px, 4vw, 64px);
  line-height: 1.05;
  letter-spacing: -0.04em;
  margin-bottom: 20px;
}

.sector-showcase__head h2 em {
  font-style: normal;
}

.sector-showcase__sub {
  font-size: clamp(15px, 1.1vw, 17px);
  color: var(--tk-gray-blue, rgba(255,255,255,0.55));
  line-height: 1.65;
  max-width: 600px;
  margin-inline: auto;
  margin-bottom: 36px;
}

.sector-showcase__divider {
  width: 64px;
  height: 2px;
  background: linear-gradient(90deg, #6C1D2D, rgba(108,29,45,0.2));
  border-radius: 2px;
  margin-inline: auto;
}

/* Pill cloud */
.sector-pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 0;
  padding-top: 0;
}

.sector-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Manrope", sans-serif;
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.82);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  padding: 11px 22px;
  cursor: default;
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.2s ease;
}

.sector-pill:hover {
  background: rgba(108, 29, 45, 0.25);
  border-color: rgba(108, 29, 45, 0.6);
  color: #fff;
  transform: translateY(-2px);
}

.sector-pill__icon {
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  stroke-width: 1.8;
}

.page-culture .culture-industry-pills {
  grid-column: 1 / -1;
  width: min(1120px, 100%);
  margin: clamp(40px, 5vw, 72px) auto 0;
}

.page-culture .culture-industry-pills .sector-pill {
  color: rgba(255, 255, 255, .88);
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .16);
  backdrop-filter: blur(8px);
}

.page-culture .culture-industry-pills .sector-pill:hover {
  color: #fff;
  background: rgba(108, 29, 45, .34);
  border-color: rgba(255, 255, 255, .34);
}

/* Stats row */
.sector-stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  background: rgba(255,255,255,0.03);
  padding: 32px 48px;
  max-width: 680px;
  margin-inline: auto;
}

.sector-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
}

.sector-stat__num {
  font-family: "Manrope", sans-serif;
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #fff;
  line-height: 1;
}

.sector-stat__label {
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}

.sector-stat__sep {
  width: 1px;
  height: 48px;
  background: rgba(255,255,255,0.1);
  flex-shrink: 0;
  margin: 0 32px;
}

@media (max-width: 680px) {
  .sector-pills {
    gap: 10px;
  }

  .sector-pill {
    font-size: 0.82rem;
    padding: 9px 16px;
    gap: 6px;
  }

  .sector-stats {
    flex-direction: column;
    gap: 28px;
    padding: 28px 24px;
    border-radius: 12px;
  }

.sector-stat__sep {
    width: 48px;
    height: 1px;
    margin: 0;
  }
}

/* Scroll motion and progress-aware back-to-top control. */

.reveal {
  opacity: 0;
  filter: blur(6px);
  transform: translate3d(0, 34px, 0);
  transition:
    opacity 720ms cubic-bezier(.22, 1, .36, 1),
    filter 720ms cubic-bezier(.22, 1, .36, 1),
    transform 720ms cubic-bezier(.22, 1, .36, 1);
  will-change: opacity, filter, transform;
}

.reveal.is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0);
}

.reveal-stagger > * {
  opacity: 0;
  transform: translate3d(0, 22px, 0);
  transition:
    opacity 560ms cubic-bezier(.22, 1, .36, 1),
    transform 620ms cubic-bezier(.22, 1, .36, 1);
  transition-delay: calc(var(--stagger-index, 0) * 65ms + 90ms);
}

.reveal-stagger.is-visible > * {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.back-to-top {
  --scroll-progress: 0%;
  position: fixed;
  right: clamp(18px, 2.2vw, 34px);
  bottom: clamp(18px, 2.2vw, 34px);
  z-index: 90;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  padding: 2px;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  background:
    conic-gradient(
      #6c1d2d var(--scroll-progress),
      rgba(108, 29, 45, .16) 0
    );
  color: #fff;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 18px, 0) scale(.88);
  box-shadow: 0 12px 32px rgba(8, 9, 11, .2);
  transition:
    opacity 260ms ease,
    transform 420ms cubic-bezier(.22, 1, .36, 1),
    box-shadow 220ms ease;
}

.back-to-top::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: inherit;
  background: rgba(8, 9, 11, .94);
  backdrop-filter: blur(12px);
}

.back-to-top__arrow {
  position: relative;
  z-index: 1;
  font-size: 22px;
  font-weight: 450;
  line-height: 1;
  transform: translateY(-1px);
  transition: transform 220ms cubic-bezier(.22, 1, .36, 1);
}

.back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
}

.back-to-top:hover {
  box-shadow: 0 16px 38px rgba(8, 9, 11, .28);
  transform: translate3d(0, -3px, 0) scale(1);
}

.back-to-top:hover .back-to-top__arrow {
  transform: translateY(-4px);
}

.back-to-top:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
}

@media (max-width: 680px) {
  .back-to-top {
    right: 16px;
    bottom: 16px;
    width: 50px;
    height: 50px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-stagger > *,
  .reveal.is-visible,
  .reveal-stagger.is-visible > * {
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }

  .back-to-top,
  .back-to-top__arrow {
    transition-duration: .01ms !important;
  }
}

/* Culture principles / open editorial ledger. */

.page-culture .culture-principles {
  padding-block: clamp(104px, 10vw, 160px);
}

.page-culture .principle-grid {
  display: block;
  margin-top: clamp(56px, 6vw, 84px);
  overflow: visible;
  border: 0;
  border-top: 1px solid var(--culture-line-strong);
  border-radius: 0;
  background: transparent;
  background-image: none;
}

.page-culture .principle {
  position: relative;
  min-height: 0;
  display: grid;
  grid-template-columns: 54px minmax(250px, .78fr) minmax(0, 1.22fr);
  gap: clamp(34px, 4vw, 68px);
  align-items: center;
  padding: clamp(38px, 4vw, 58px) clamp(18px, 2vw, 28px);
  border: 0;
  border-bottom: 1px solid var(--culture-line);
  border-radius: 0;
  background: transparent;
  cursor: default;
  transition:
    opacity 560ms cubic-bezier(.22, 1, .36, 1),
    transform 620ms cubic-bezier(.22, 1, .36, 1),
    background-color 280ms var(--ease),
    padding-inline 320ms var(--ease);
  transition-delay:
    calc(var(--stagger-index, 0) * 65ms + 90ms),
    calc(var(--stagger-index, 0) * 65ms + 90ms),
    0ms,
    0ms;
}

.page-culture .principle::before,
.page-culture .principle::after {
  content: none;
}

.page-culture .principle:hover {
  padding-inline: clamp(24px, 2.5vw, 36px);
  border-color: var(--culture-line);
  background: rgba(108, 29, 45, .045);
  transform: none;
}

.page-culture .principle__meta {
  grid-column: 1;
  display: flex;
  align-items: flex-start;
  color: #6c1d2d;
}

.page-culture .principle__number {
  font-size: 11px;
  font-weight: 720;
  letter-spacing: .12em;
  line-height: 1;
}

.page-culture .principle h3 {
  grid-column: 2;
  grid-row: 1;
  max-width: 16ch;
  margin: 0;
  color: var(--culture-card-title);
  font-size: clamp(27px, 2.2vw, 36px);
  font-weight: 540;
  letter-spacing: -.035em;
  line-height: 1.08;
  transition: color 240ms var(--ease), transform 280ms var(--ease);
}

.page-culture .principle p {
  grid-column: 3;
  grid-row: 1;
  max-width: 57ch;
  margin: 0;
  padding: 0;
  color: #5f5f63;
  font-size: clamp(16px, 1vw, 18px);
  line-height: 1.65;
}

.page-culture .principle:hover h3 {
  color: #6c1d2d;
  transform: translateX(4px);
}

@media (max-width: 1024px) {
  .page-culture .principle {
    grid-template-columns: 46px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 18px 28px;
    align-items: start;
  }

  .page-culture .principle__meta {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .page-culture .principle h3 {
    grid-column: 2;
    grid-row: 1;
    max-width: none;
  }

  .page-culture .principle p {
    grid-column: 2;
    grid-row: 2;
    max-width: 62ch;
  }
}

@media (max-width: 680px) {
  .page-culture .culture-principles {
    padding-block: 84px;
  }

  .page-culture .principle-grid {
    margin-top: 46px;
  }

  .page-culture .principle {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 16px 18px;
    padding: 30px 6px;
  }

  .page-culture .principle:hover {
    padding-inline: 6px;
  }

  .page-culture .principle h3 {
    font-size: clamp(25px, 7.2vw, 31px);
  }

  .page-culture .principle p {
    font-size: 15px;
    line-height: 1.6;
  }
}

/* Home intelligence gap / regional editorial chapter. */

.page-home .hero-bridge {
  min-height: clamp(390px, 34vw, 560px);
  padding: clamp(96px, 8vw, 150px) 0 clamp(82px, 7vw, 126px);
  overflow: hidden;
}

.page-home .hero-bridge::before {
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .46;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 16%,
    #000 80%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    #000 16%,
    #000 80%,
    transparent 100%
  );
}

.page-home .hero-bridge__content {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(300px, .78fr);
  gap: clamp(64px, 8vw, 132px);
  align-items: end;
  text-align: left;
}

.page-home .hero-bridge__heading {
  min-width: 0;
}

.page-home .hero-bridge__content p.section-label {
  width: fit-content;
  margin: 0 0 clamp(24px, 2.2vw, 36px);
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  color: rgba(255, 255, 255, .68);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .14em;
  line-height: 1.2;
  text-transform: uppercase;
}

.page-home .hero-bridge__content h2 {
  max-width: 12ch;
  margin: 0;
  color: #fff;
  font-size: clamp(54px, 5.8vw, 94px);
  font-weight: 520;
  letter-spacing: -.055em;
  line-height: .92;
  text-align: left;
}

.page-home .hero-bridge__region {
  max-width: 18ch;
  margin: clamp(22px, 2vw, 34px) 0 0;
  color: #d7a1ac;
  font-family: "Newsreader", serif;
  font-size: clamp(30px, 3.1vw, 50px);
  font-style: italic;
  font-weight: 480;
  letter-spacing: -.035em;
  line-height: 1.02;
  text-align: left;
}

.page-home .hero-bridge__aside {
  max-width: 470px;
  padding-bottom: clamp(6px, .8vw, 14px);
}

.page-home .hero-bridge__rule {
  width: 72px;
  height: 2px;
  display: block;
  margin-bottom: clamp(24px, 2vw, 34px);
  background: #6c1d2d;
}

.page-home .hero-bridge__aside .hero-bridge__sub {
  max-width: 38ch;
  margin: 0;
  color: rgba(255, 255, 255, .72);
  font-size: clamp(17px, 1.15vw, 20px);
  font-weight: 450;
  line-height: 1.62;
  text-align: left;
}

@media (max-width: 900px) {
  .page-home .hero-bridge__content {
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: start;
  }

  .page-home .hero-bridge__content h2 {
    max-width: 13ch;
  }

  .page-home .hero-bridge__aside {
    max-width: 620px;
  }
}

@media (max-width: 680px) {
  .page-home .hero-bridge {
    min-height: 0;
    padding: 88px 0 78px;
  }

  .page-home .hero-bridge__content {
    gap: 38px;
  }

  .page-home .hero-bridge__content p.section-label {
    margin-bottom: 24px;
  }

  .page-home .hero-bridge__content h2 {
    max-width: 11ch;
    font-size: clamp(43px, 12.8vw, 58px);
    line-height: .94;
  }

  .page-home .hero-bridge__region {
    max-width: 15ch;
    margin-top: 20px;
    font-size: clamp(27px, 8vw, 36px);
  }

  .page-home .hero-bridge__rule {
    width: 54px;
    margin-bottom: 22px;
  }

  .page-home .hero-bridge__aside .hero-bridge__sub {
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-culture .principle,
  .page-culture .principle h3 {
    transition: none;
  }
}

/* Culture vision and mission / balanced shared editorial panel. */

.page-culture .mission-grid {
  margin-top: clamp(42px, 4.5vw, 68px);
  overflow: hidden;
  border: 1px solid rgba(17, 18, 20, .15);
  border-radius: 26px;
  background: rgba(255, 255, 255, .52);
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2) {
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: clamp(38px, 3.8vw, 58px) clamp(38px, 4vw, 62px) clamp(42px, 4.2vw, 66px);
  background: transparent;
}

.page-culture .mission-panel--mission {
  border-left-color: rgba(17, 18, 20, .13);
}

.page-culture .mission-panel__content {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.page-culture .mission-panel .section-label {
  margin: 0;
  color: #6c1d2d;
  font-size: clamp(18px, 1.2vw, 21px);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.1;
}

.page-culture .mission-panel h3,
.page-culture .mission-panel--vision h3,
.page-culture .mission-panel--mission h3 {
  min-height: 2.12em;
  max-width: 18ch;
  margin: clamp(26px, 2.4vw, 36px) 0 0;
  color: #171719;
  font-size: clamp(27px, 1.8vw, 34px);
  font-weight: 540;
  letter-spacing: -.04em;
  line-height: 1.06;
}

.page-culture .mission-panel h3 span {
  display: block;
  white-space: normal;
}

.page-culture .mission-panel__content > p:last-child {
  width: 100%;
  max-width: 47ch;
  margin: clamp(22px, 2vw, 30px) 0 0;
  color: #5f5f63;
  font-size: clamp(16px, 1.05vw, 19px);
  font-weight: 400;
  letter-spacing: -.015em;
  line-height: 1.58;
}

@media (max-width: 1000px) {
  .page-culture .mission-grid {
    grid-template-columns: 1fr;
    border-radius: 22px;
  }

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    padding: clamp(34px, 6vw, 52px);
  }

  .page-culture .mission-panel--mission {
    border-top: 1px solid rgba(17, 18, 20, .13);
    border-left: 0;
  }

  .page-culture .mission-panel h3,
  .page-culture .mission-panel--vision h3,
  .page-culture .mission-panel--mission h3 {
    min-height: 0;
    max-width: 20ch;
  }

  .page-culture .mission-panel__content > p:last-child {
    max-width: 58ch;
  }
}

@media (max-width: 680px) {
  .page-culture .mission-grid {
    margin-top: 34px;
  }

  .page-culture .mission-panel,
  .page-culture .mission-panel:nth-child(2) {
    padding: 32px 26px 36px;
  }

  .page-culture .mission-panel .section-label {
    font-size: 17px;
  }

  .page-culture .mission-panel h3,
  .page-culture .mission-panel--vision h3,
  .page-culture .mission-panel--mission h3 {
    margin-top: 22px;
    font-size: clamp(27px, 8vw, 33px);
  }

  .page-culture .mission-panel__content > p:last-child {
    margin-top: 20px;
    font-size: 16px;
  }
}

/* Culture: founder statement as the transition into company principles */
.page-culture .culture-belief {
  padding-block: clamp(72px, 7vw, 112px);
  background: var(--culture-paper);
}

.page-culture .culture-belief::before,
.page-culture .culture-belief::after,
.page-culture .founder-quote::before,
.page-culture .founder-quote::after {
  content: none;
}

.page-culture .founder-quote {
  display: grid;
  grid-template-columns: clamp(156px, 14vw, 216px) minmax(0, 1fr);
  gap: clamp(48px, 7vw, 112px);
  align-items: start;
  min-height: 0;
  padding: clamp(50px, 5vw, 76px) 0;
  overflow: visible;
  border: 0;
  border-top: 1px solid rgba(17, 18, 20, .24);
  border-bottom: 1px solid rgba(17, 18, 20, .14);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.page-culture .founder-quote__monogram {
  width: 100%;
  aspect-ratio: 1;
  border: 1px solid rgba(17, 18, 20, .12);
  border-radius: 18px;
  background: #e9e7e2;
}

.page-culture .founder-quote__monogram img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-culture .founder-quote__content {
  width: 100%;
  padding-top: 2px;
}

.page-culture .founder-quote__eyebrow {
  margin: 0 0 clamp(24px, 2.6vw, 38px);
  color: #6c1d2d;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  line-height: 1.2;
  text-transform: uppercase;
}

.page-culture .founder-quote blockquote {
  margin: 0;
}

.page-culture .founder-quote blockquote p {
  max-width: 25ch;
  margin: 0;
  color: #171719;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(34px, 3.4vw, 57px);
  font-style: normal;
  font-weight: 450;
  letter-spacing: -.045em;
  line-height: 1.04;
}

.page-culture .founder-quote blockquote .founder-quote__statement {
  max-width: 34ch;
  margin-top: clamp(24px, 2.5vw, 36px);
  color: #6c1d2d;
  font-family: var(--font-neue);
  font-size: clamp(22px, 1.75vw, 30px);
  font-weight: 500;
  letter-spacing: -.03em;
  line-height: 1.25;
}

.page-culture .founder-quote figcaption {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 12px;
  margin-top: clamp(30px, 3vw, 44px);
}

.page-culture .founder-quote figcaption strong,
.page-culture .founder-quote figcaption span {
  margin: 0;
  font-family: var(--font-neue);
  font-style: normal;
  line-height: 1.35;
}

.page-culture .founder-quote figcaption strong {
  color: #171719;
  font-size: 15px;
  font-weight: 650;
}

.page-culture .founder-quote figcaption span {
  color: #6d6d70;
  font-size: 14px;
  font-weight: 450;
}

@media (max-width: 800px) {
  .page-culture .culture-belief {
    padding-block: 60px;
  }

  .page-culture .founder-quote {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 28px;
    padding: 42px 0 46px;
  }

  .page-culture .founder-quote__monogram {
    border-radius: 14px;
  }

  .page-culture .founder-quote blockquote p {
    font-size: clamp(30px, 5.5vw, 42px);
  }
}

@media (max-width: 560px) {
  .page-culture .founder-quote {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .page-culture .founder-quote__monogram {
    width: 88px;
  }

  .page-culture .founder-quote__eyebrow {
    margin-bottom: 22px;
  }

  .page-culture .founder-quote blockquote p {
    max-width: none;
    font-size: clamp(31px, 9vw, 39px);
  }

  .page-culture .founder-quote blockquote .founder-quote__statement {
    max-width: none;
    font-size: 21px;
  }

  .page-culture .founder-quote figcaption {
    flex-direction: column;
    gap: 2px;
  }
}

/* Closing CTA: larger, clearer statement while preserving the word carousel */
.page-home .final-cta,
.page-solutions .final-cta,
.page-culture .culture-final-cta {
  min-height: clamp(520px, 42vw, 660px);
  display: grid;
  align-items: center;
  padding-block: clamp(104px, 8.5vw, 150px);
}

.page-home .final-cta h2,
.page-solutions .final-cta h2,
.page-culture .culture-final-cta h2 {
  width: 100%;
  max-width: none;
  color: #fff;
  font-size: clamp(50px, 4.25vw, 82px);
  font-weight: 520;
  letter-spacing: -.045em;
  line-height: .98;
  text-wrap: balance;
}

.page-home .final-cta p.final-cta__word-switch,
.page-solutions .final-cta p.final-cta__word-switch,
.page-culture .culture-final-cta p.final-cta__word-switch {
  width: 100%;
  max-width: none;
  min-height: 1.42em;
  margin-top: clamp(24px, 2.3vw, 38px);
  padding-block: .12em .2em;
  color: #7faaff;
  font-size: clamp(32px, 2.85vw, 55px);
  font-weight: 560;
  letter-spacing: -.04em;
  line-height: 1.1;
}

.final-cta__word--fragmented {
  color: #76d887;
}

.final-cta__word--efficiency {
  color: #7faaff;
}

.final-cta__word--decisions {
  color: #d49a73;
}

.page-home .final-cta__actions,
.page-solutions .final-cta__actions,
.page-culture .culture-final-cta .final-cta__actions {
  margin-top: clamp(34px, 3vw, 50px);
}

@media (max-width: 680px) {
  .page-home .final-cta,
  .page-solutions .final-cta,
  .page-culture .culture-final-cta {
    min-height: 500px;
    padding-block: 84px 76px;
  }

  .page-home .final-cta h2,
  .page-solutions .final-cta h2,
  .page-culture .culture-final-cta h2 {
    max-width: 12ch;
    font-size: clamp(40px, 11.5vw, 48px);
    line-height: 1;
  }

  .page-home .final-cta p.final-cta__word-switch,
  .page-solutions .final-cta p.final-cta__word-switch,
  .page-culture .culture-final-cta p.final-cta__word-switch {
    min-height: 1.5em;
    margin-top: 24px;
    font-size: clamp(27px, 7.5vw, 32px);
  }
}

/* Accessible palette / final cascade activation */

.site-preloader {
  background:
    radial-gradient(circle at 50% 46%, rgba(201, 106, 125, .2), transparent 38%),
    var(--color-dark-canvas);
  color: var(--color-dark-text-primary);
}

.site-preloader::after {
  border-color: rgba(232, 180, 190, .14);
  box-shadow:
    0 0 0 12vw rgba(201, 106, 125, .035),
    inset 0 0 100px rgba(201, 106, 125, .11);
}

.site-preloader__eyebrow {
  color: var(--brand-focus);
}

.site-preloader__brand {
  color: var(--color-dark-text-primary);
}

.site-preloader__message {
  color: var(--color-dark-text-secondary);
}

.site-preloader__industries::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(201, 106, 125, .08) 20%,
    rgba(232, 180, 190, .2) 50%,
    rgba(201, 106, 125, .08) 80%,
    transparent
  );
}

.site-preloader__industry {
  color: var(--brand-rose);
}

.site-preloader__industry small {
  color: var(--color-dark-text-muted);
}

.site-preloader__progress i {
  background: linear-gradient(90deg, var(--brand-signal), var(--brand-focus));
  box-shadow: 0 0 16px rgba(201, 106, 125, .62);
}

.page-home,
.page-solutions,
.page-home main,
.page-solutions main {
  background-color: var(--color-dark-canvas);
  color: var(--color-dark-text-primary);
}

.page-home main p,
.page-solutions main p,
.page-home main li,
.page-solutions main li {
  color: var(--color-dark-text-secondary);
}

.page-home main .section-label,
.page-solutions main .section-label,
.page-home .friction-grid small,
.page-solutions .outcome strong,
.page-home .hero-bridge__region,
.page-solutions .roadmap-flow__statement span + span {
  color: var(--brand-rose);
}

.page-home .hero-bridge__rule {
  background: var(--brand-signal);
}

.site-footer,
.site-footer .footer-label,
.site-footer .footer-bottom {
  color: var(--color-dark-text-muted);
}

.site-footer a,
.site-footer p {
  color: var(--color-dark-text-secondary);
}

.page-solutions .solution-detail,
.page-solutions .solution-detail:nth-child(n),
.page-solutions .platform-category,
.page-solutions .platform-category:nth-child(n),
.page-solutions .deployment-grid article,
.page-solutions .deployment-grid article:nth-child(n) {
  --route-accent: var(--brand-rose);
  --icon-accent: var(--brand-signal);
  --deployment-accent: var(--brand-signal);
}

.page-solutions .solution-detail__title .section-label,
.page-solutions .platform-category__icon,
.page-solutions .platform-category h3,
.page-solutions .deployment-card__label,
.page-solutions .roadmap-phase__label em,
.page-solutions .rm-brace::after,
.page-solutions .rm-num::after {
  color: var(--brand-rose);
}

.page-solutions .roadmap-phase__figure {
  background:
    radial-gradient(120% 90% at 86% 8%, rgba(201, 106, 125, .12) 0%, transparent 58%),
    linear-gradient(160deg, rgba(255, 255, 255, .024) 0%, rgba(8, 9, 11, .6) 100%);
}

.page-solutions .roadmap-phase__figure .rm-accent-line,
.page-solutions .roadmap-phase__figure .rm-accent,
.page-solutions .roadmap-phase__figure .rm-bars {
  stroke: var(--brand-rose);
}

.page-solutions .roadmap-phase__figure .rm-accent-dot {
  fill: var(--brand-rose);
}

.page-solutions .roadmap-phase li,
.page-solutions .deployment-grid p,
.page-solutions .solutions-deployment .split-heading__body p {
  color: var(--color-dark-text-secondary);
}

.page-solutions .journey-step__num,
.page-solutions .journey-step ul {
  color: var(--color-dark-text-muted);
}

.page-solutions .journey-step ul li::before {
  color: var(--brand-rose);
}

.page-culture {
  --culture-paper: var(--color-paper-canvas);
  --culture-ink: var(--color-light-text-primary);
  --culture-muted: var(--color-light-text-muted);
  --culture-green: var(--brand-burgundy);
  --culture-card: var(--color-paper-surface);
  --culture-card-raised: var(--color-paper-surface);
  background: var(--color-paper-canvas);
  color: var(--color-light-text-primary);
}

.page-culture main,
.page-culture .culture-belief {
  background-color: var(--color-paper-canvas);
}

.page-culture main h1,
.page-culture main h2,
.page-culture main h3,
.page-culture .mission-panel h3,
.page-culture .principle h3,
.page-culture .founder-quote blockquote p {
  color: var(--color-light-text-primary);
}

.page-culture main p,
.page-culture .culture-about .culture-about__copy .split-heading__body p,
.page-culture .mission-panel__content > p:last-child,
.page-culture .principle p {
  color: var(--color-light-text-secondary);
}

.page-culture main .section-label,
.page-culture .mission-panel .section-label,
.page-culture .principle__meta,
.page-culture .founder-quote__eyebrow,
.page-culture .founder-quote blockquote .founder-quote__statement {
  color: var(--brand-burgundy);
}

.page-culture .mission-grid {
  background: rgba(250, 249, 246, .72);
}

.page-culture .mission-panel,
.page-culture .mission-panel:nth-child(2) {
  background-color: transparent;
}

.page-culture .principle:hover {
  background: rgba(108, 29, 45, .055);
}

.page-culture .principle:hover h3 {
  color: var(--brand-burgundy);
}

.page-culture .founder-quote figcaption span {
  color: var(--color-light-text-muted);
}

.page-culture .culture-partnership h2 {
  color: var(--color-dark-text-primary);
}

.page-culture .culture-partnership .section-label {
  color: var(--brand-focus);
}

.page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
  color: var(--color-dark-text-secondary);
}

.page-culture .culture-industry-pills .sector-pill {
  color: var(--color-dark-text-secondary);
}

.page-culture .culture-industry-pills .sector-pill:hover {
  border-color: rgba(232, 180, 190, .58);
  background: rgba(201, 106, 125, .2);
  color: var(--color-dark-text-primary);
}

.final-cta__word--fragmented {
  color: var(--accent-positive);
}

.final-cta__word--efficiency {
  color: var(--accent-info);
}

.final-cta__word--decisions {
  color: var(--accent-caution);
}

.header-inner > .button {
  border-color: var(--brand-burgundy);
  background: var(--brand-burgundy);
  color: #fff;
}

.header-inner > .button:hover {
  border-color: #541623;
  background: #541623;
  color: #fff;
}

.page-culture .looking-ahead {
  color: var(--color-dark-text-primary);
}

.page-culture .looking-ahead__sub {
  color: var(--color-dark-text-secondary);
}

.page-solutions .industry-card:hover {
  border-color: var(--brand-signal);
  background: rgba(201, 106, 125, .12);
}

.page-solutions .solution-detail__body p,
.page-solutions .solution-detail__title > p:not(.section-label):not(.outcome) {
  color: var(--color-dark-text-secondary);
}

/* Home matrix chapters / balanced readability refinement
   Preserve the breathing matrix artwork while creating quieter, borderless
   reading fields behind the editorial content. */

.page-home .hero-bridge__content,
.page-home .section-dash-divider__content {
  position: relative;
  isolation: isolate;
}

.page-home .hero-bridge__content::before,
.page-home .section-dash-divider__content::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.page-home .hero-bridge__content::before {
  inset: -22% -5%;
  background: radial-gradient(
    ellipse at 48% 54%,
    rgba(8, 9, 11, .94) 0%,
    rgba(8, 9, 11, .84) 32%,
    rgba(8, 9, 11, .58) 54%,
    rgba(8, 9, 11, .18) 72%,
    transparent 88%
  );
  filter: blur(10px);
}

.page-home .hero-bridge__content {
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: clamp(58px, 7vw, 112px);
}

.page-home .hero-bridge__content h2 {
  max-width: none;
  font-size: clamp(48px, 3.7vw, 76px);
  line-height: .98;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .36);
}

.page-home .hero-bridge__content h2 span {
  display: block;
  white-space: nowrap;
}

.page-home .hero-bridge__region {
  font-size: clamp(30px, 2.7vw, 44px);
}

.page-home .hero-bridge__aside {
  max-width: 520px;
}

.page-home .hero-bridge__aside .hero-bridge__sub {
  max-width: 36ch;
  color: var(--color-dark-text-secondary);
  font-size: clamp(18px, 1.15vw, 20px);
  line-height: 1.65;
}

.page-home .section-dash-divider__content::before {
  top: 50%;
  left: 50%;
  width: min(1180px, 104vw);
  height: clamp(300px, 28vw, 430px);
  transform: translate(-50%, -50%);
  background: radial-gradient(
    ellipse at 46% 52%,
    rgba(8, 9, 11, .97) 0%,
    rgba(8, 9, 11, .9) 38%,
    rgba(8, 9, 11, .62) 60%,
    rgba(8, 9, 11, .2) 78%,
    transparent 91%
  );
  filter: blur(10px);
}

.page-home .section-dash-divider {
  padding-block: clamp(72px, 6vw, 104px);
}

.page-home .section-dash-divider::before {
  height: 100%;
}

.page-home .section-dash-divider__content {
  min-height: clamp(230px, 18vw, 310px);
  display: grid;
  grid-template:
    "label label" auto
    "title copy" 1fr
    / minmax(0, 1.12fr) minmax(280px, .88fr);
  column-gap: clamp(56px, 7vw, 112px);
  row-gap: clamp(28px, 2.6vw, 42px);
  align-items: end;
  text-align: left;
}

.page-home .section-dash-divider__content .section-label {
  grid-area: label;
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--brand-rose);
  font-family: "Manrope", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.page-home .section-dash-divider__content .section-label::after {
  content: "";
  width: 68px;
  height: 1px;
  display: block;
  background: rgba(215, 161, 172, .54);
}

.page-home .section-dash-divider__content h2 {
  grid-area: title;
  max-width: 16ch;
  margin: 0;
  color: var(--color-dark-text-primary);
  font-family: "Manrope", sans-serif;
  font-size: clamp(40px, 3.15vw, 54px);
  font-style: normal;
  font-weight: 570;
  letter-spacing: -.04em;
  line-height: 1;
  text-align: left;
  text-wrap: balance;
  text-shadow: 0 2px 20px rgba(0, 0, 0, .34);
}

.page-home .section-dash-divider__content h2 > span,
.page-home .section-dash-divider__content h2 > em {
  display: block;
}

.page-home .section-dash-divider__content h2 > em {
  max-width: 17ch;
  margin-top: .16em;
  color: var(--brand-rose);
  font-family: "Newsreader", Georgia, serif;
  font-size: .92em;
  font-style: italic;
  font-weight: 430;
  letter-spacing: -.035em;
  line-height: 1.02;
}

.page-home .section-dash-divider__sub {
  grid-area: copy;
  max-width: 36ch;
  margin: 0 0 .28em;
  color: var(--color-dark-text-secondary);
  font-family: "Manrope", sans-serif;
  font-size: clamp(17px, 1.08vw, 19px);
  font-weight: 450;
  line-height: 1.65;
  text-align: left;
}

.page-home .section-dash-divider::before {
  animation-name: home-matrix-breathing-readable;
}

@keyframes home-matrix-breathing-readable {
  0%,
  100% {
    opacity: .3;
    filter: brightness(.88) saturate(.82);
  }

  46% {
    opacity: .54;
    filter: brightness(1.14) saturate(.94);
  }

  66% {
    opacity: .43;
    filter: brightness(1.02) saturate(.88);
  }
}

/* The Trunk content shell is intentionally narrow on laptop-sized screens.
   Stack this editorial composition before its fixed three-line headline can
   intrude into the supporting-copy column. */
@media (max-width: 1320px) {
  .page-home .hero-bridge__content {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .page-home .hero-bridge__content::before {
    inset: -12% -8%;
    background: radial-gradient(
      ellipse at 38% 50%,
      rgba(8, 9, 11, .95) 0%,
      rgba(8, 9, 11, .82) 42%,
      rgba(8, 9, 11, .42) 68%,
      transparent 88%
    );
  }

  .page-home .hero-bridge__content h2 {
    max-width: none;
    font-size: clamp(40px, 6.2vw, 52px);
  }

  .page-home .hero-bridge__aside {
    max-width: 620px;
  }

  .page-home .section-dash-divider__content {
    min-height: clamp(300px, 34vw, 390px);
    grid-template:
      "label" auto
      "title" auto
      "copy" auto
      / minmax(0, 1fr);
    row-gap: 26px;
    align-content: center;
  }

  .page-home .section-dash-divider__content h2 {
    max-width: 18ch;
  }

  .page-home .section-dash-divider__sub {
    max-width: 44ch;
  }
}

@media (max-width: 680px) {
  .page-home .hero-bridge__content {
    gap: 38px;
  }

  .page-home .hero-bridge__content::before {
    inset: -8% -14%;
  }

  .page-home .hero-bridge__content h2 {
    max-width: none;
    font-size: clamp(36px, 10.5vw, 48px);
    line-height: .98;
  }

  .page-home .hero-bridge__region {
    font-size: clamp(30px, 8vw, 36px);
  }

  .page-home .hero-bridge__aside .hero-bridge__sub {
    font-size: 16px;
    line-height: 1.6;
  }

  .page-home .section-dash-divider__content::before {
    width: 112vw;
    height: 118%;
  }

  .page-home .section-dash-divider__content .section-label {
    gap: 12px;
  }

  .page-home .section-dash-divider__content .section-label::after {
    width: 42px;
  }

  .page-home .section-dash-divider__content h2 {
    max-width: 16ch;
    font-size: clamp(34px, 10vw, 44px);
    line-height: 1.02;
  }

  .page-home .section-dash-divider__sub {
    max-width: 34ch;
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
  }
}

@media (max-width: 430px) {
  .page-home .hero-bridge__content h2 {
    font-size: clamp(32px, 8.8vw, 38px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .section-dash-divider::before {
    animation: none !important;
    opacity: .5;
    filter: brightness(1) saturate(.92);
  }
}

/* Solutions + Culture / restrained one-time scroll motion
   The existing IntersectionObserver supplies .is-visible and unobserves each
   element after entry. .motion-ready keeps this layer progressive: without
   JavaScript, the page retains its normal fully visible presentation. */

.motion-ready .scroll-scene.reveal,
.motion-ready .scroll-scene.reveal.is-visible {
  opacity: 1;
  filter: none;
  transform: none;
  transition: none;
}

/* Solutions / service route sequencing */

.motion-ready .page-solutions .solution-detail__title .section-label,
.motion-ready .page-solutions .solution-detail__title h2,
.motion-ready .page-solutions .solution-detail__title > p:not(.section-label),
.motion-ready .page-solutions .solution-detail__body > p:first-child,
.motion-ready .page-solutions .solution-detail .feature-list li {
  opacity: 0;
  transition:
    opacity 620ms cubic-bezier(.22, 1, .36, 1),
    transform 680ms cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .page-solutions .solution-detail__title .section-label,
.motion-ready .page-solutions .solution-detail__title h2 {
  transform: translate3d(-18px, 0, 0);
}

.motion-ready .page-solutions .solution-detail__title > p:not(.section-label) {
  transform: translate3d(0, 12px, 0);
}

.motion-ready .page-solutions .solution-detail__body {
  position: relative;
}

.motion-ready .page-solutions .solution-detail__body::before {
  content: "";
  position: absolute;
  top: -18px;
  right: 0;
  left: 0;
  height: 1px;
  background: color-mix(in srgb, var(--route-accent) 46%, transparent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 760ms cubic-bezier(.22, 1, .36, 1) 150ms;
}

.motion-ready .page-solutions .solution-detail__body > p:first-child,
.motion-ready .page-solutions .solution-detail .feature-list li {
  transform: translate3d(18px, 0, 0);
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(1) {
  --route-item: 0;
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(2) {
  --route-item: 1;
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(3) {
  --route-item: 2;
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(4) {
  --route-item: 3;
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(5) {
  --route-item: 4;
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(6) {
  --route-item: 5;
}

.motion-ready .page-solutions .solution-detail .feature-list li:nth-child(7) {
  --route-item: 6;
}

.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__title .section-label,
.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__title h2,
.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__title > p:not(.section-label),
.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__body > p:first-child,
.motion-ready .page-solutions .solution-detail.is-visible .feature-list li {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__title .section-label {
  transition-delay: 90ms;
}

.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__title h2 {
  transition-delay: 130ms;
}

.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__title > p:not(.section-label) {
  transition-delay: 190ms;
}

.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__body::before {
  transform: scaleX(1);
}

.motion-ready .page-solutions .solution-detail.is-visible .solution-detail__body > p:first-child {
  transition-delay: 170ms;
}

.motion-ready .page-solutions .solution-detail.is-visible .feature-list li {
  transition-delay: calc(210ms + var(--route-item, 0) * 28ms);
}

/* Solutions / platform, deployment, journey and industry groups */

.motion-ready .page-solutions .platform-category__icon,
.motion-ready .page-solutions .platform-category__head,
.motion-ready .page-solutions .platform-category li,
.motion-ready .page-solutions .deployment-grid article > *,
.motion-ready .page-solutions .journey-step__num,
.motion-ready .page-solutions .journey-step h3,
.motion-ready .page-solutions .journey-step p,
.motion-ready .page-solutions .journey-step ul {
  opacity: 0;
  transition:
    opacity 560ms cubic-bezier(.22, 1, .36, 1),
    transform 620ms cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .page-solutions .platform-category__icon {
  transform: translate3d(0, 12px, 0) scale(.96);
}

.motion-ready .page-solutions .platform-category__head,
.motion-ready .page-solutions .platform-category li {
  transform: translate3d(12px, 0, 0);
}

.motion-ready .page-solutions .platform-category li:nth-child(1) {
  --platform-item: 0;
}

.motion-ready .page-solutions .platform-category li:nth-child(2) {
  --platform-item: 1;
}

.motion-ready .page-solutions .platform-category li:nth-child(3) {
  --platform-item: 2;
}

.motion-ready .page-solutions .platform-category li:nth-child(4) {
  --platform-item: 3;
}

.motion-ready .page-solutions .platform-category-grid.is-visible .platform-category__icon,
.motion-ready .page-solutions .platform-category-grid.is-visible .platform-category__head,
.motion-ready .page-solutions .platform-category-grid.is-visible .platform-category li {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.motion-ready .page-solutions .platform-category-grid.is-visible .platform-category__icon {
  transition-delay: calc(110ms + var(--stagger-index, 0) * 65ms);
}

.motion-ready .page-solutions .platform-category-grid.is-visible .platform-category__head {
  transition-delay: calc(150ms + var(--stagger-index, 0) * 65ms);
}

.motion-ready .page-solutions .platform-category-grid.is-visible .platform-category li {
  transition-delay: calc(
    190ms + var(--stagger-index, 0) * 45ms + var(--platform-item, 0) * 24ms
  );
}

.motion-ready .page-solutions .deployment-grid article {
  border-color: transparent;
  transition:
    opacity 560ms cubic-bezier(.22, 1, .36, 1),
    transform 620ms cubic-bezier(.22, 1, .36, 1),
    border-color 620ms ease;
}

.motion-ready .page-solutions .deployment-grid article::before {
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 620ms cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .page-solutions .deployment-grid article > * {
  transform: translate3d(0, 12px, 0);
}

.motion-ready .page-solutions .deployment-grid.is-visible article {
  border-color: rgba(255, 255, 255, .07);
}

.motion-ready .page-solutions .deployment-grid.is-visible article::before {
  transform: scaleX(1);
  transition-delay: calc(130ms + var(--stagger-index, 0) * 65ms);
}

.motion-ready .page-solutions .deployment-grid.is-visible article > * {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition-delay: calc(180ms + var(--stagger-index, 0) * 65ms);
}

.motion-ready .page-solutions .journey-grid.reveal-stagger > .journey-step,
.motion-ready .page-solutions .sector-pills.reveal-stagger > .sector-pill {
  transform: translate3d(0, 16px, 0) scale(.97);
}

.motion-ready .page-solutions .journey-grid.reveal-stagger.is-visible > .journey-step,
.motion-ready .page-solutions .sector-pills.reveal-stagger.is-visible > .sector-pill {
  transform: translate3d(0, 0, 0) scale(1);
}

.motion-ready .page-solutions .journey-step__num,
.motion-ready .page-solutions .journey-step h3,
.motion-ready .page-solutions .journey-step p,
.motion-ready .page-solutions .journey-step ul {
  transform: translate3d(0, 10px, 0);
}

.motion-ready .page-solutions .journey-grid.is-visible .journey-step__num,
.motion-ready .page-solutions .journey-grid.is-visible .journey-step h3,
.motion-ready .page-solutions .journey-grid.is-visible .journey-step p,
.motion-ready .page-solutions .journey-grid.is-visible .journey-step ul {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-solutions .journey-grid.is-visible .journey-step__num {
  transition-delay: calc(120ms + var(--stagger-index, 0) * 45ms);
}

.motion-ready .page-solutions .journey-grid.is-visible .journey-step h3 {
  transition-delay: calc(160ms + var(--stagger-index, 0) * 45ms);
}

.motion-ready .page-solutions .journey-grid.is-visible .journey-step p,
.motion-ready .page-solutions .journey-grid.is-visible .journey-step ul {
  transition-delay: calc(205ms + var(--stagger-index, 0) * 45ms);
}

.motion-ready .page-solutions .sector-pills.reveal-stagger > .sector-pill {
  transition-delay: calc(80ms + var(--stagger-index, 0) * 35ms);
}

/* Solutions / one-time roadmap ribbon entry */

.motion-ready .page-solutions .roadmap-cta--flow .flow-shape,
.motion-ready .page-solutions .roadmap-cta--flow .flow-highlight {
  transform-box: fill-box;
  transform-origin: center;
  transition:
    transform 850ms cubic-bezier(.22, 1, .36, 1),
    stroke-dashoffset 850ms cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .page-solutions .roadmap-cta--flow .flow-shape--silver,
.motion-ready .page-solutions .roadmap-cta--flow .flow-shape--indigo-back {
  transform: translate3d(-18px, 0, 0);
}

.motion-ready .page-solutions .roadmap-cta--flow .flow-shape--indigo,
.motion-ready .page-solutions .roadmap-cta--flow .flow-shape--steel {
  transform: translate3d(16px, 0, 0);
}

.motion-ready .page-solutions .roadmap-cta--flow .flow-shape--veil {
  transform: translate3d(0, 12px, 0);
}

.motion-ready .page-solutions .roadmap-cta--flow .flow-highlight {
  stroke-dasharray: 1600;
  stroke-dashoffset: 1600;
}

.motion-ready .page-solutions .roadmap-cta--flow.is-visible .flow-shape {
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-solutions .roadmap-cta--flow.is-visible .flow-highlight {
  stroke-dashoffset: 0;
}

/* Culture / introduction and shared mission panel */

.motion-ready .page-culture .culture-about > .split-heading h2,
.motion-ready .page-culture .culture-about > .split-heading .split-heading__body > p,
.motion-ready .page-culture .mission-panel,
.motion-ready .page-culture .mission-panel__content > *,
.motion-ready .page-culture .founder-quote__content > *,
.motion-ready .page-culture .founder-quote blockquote > *,
.motion-ready .page-culture .founder-quote figcaption,
.motion-ready .page-culture .principle__meta,
.motion-ready .page-culture .principle h3,
.motion-ready .page-culture .principle p,
.motion-ready .page-culture .partnership-grid h2 span,
.motion-ready .page-culture .partnership-statement span,
.motion-ready .page-culture .looking-ahead__quote,
.motion-ready .page-culture .looking-ahead__sub {
  opacity: 0;
  transition:
    opacity 620ms cubic-bezier(.22, 1, .36, 1),
    transform 700ms cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .page-culture .culture-about > .split-heading h2 {
  transform: translate3d(-18px, 0, 0);
}

.motion-ready .page-culture .culture-about > .split-heading .split-heading__body > p {
  transform: translate3d(0, 12px, 0);
}

.motion-ready .page-culture .culture-about > .split-heading.is-visible h2,
.motion-ready .page-culture .culture-about > .split-heading.is-visible .split-heading__body > p {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .culture-about > .split-heading.is-visible .split-heading__body > p:nth-child(1) {
  transition-delay: 110ms;
}

.motion-ready .page-culture .culture-about > .split-heading.is-visible .split-heading__body > p:nth-child(2) {
  transition-delay: 150ms;
}

.motion-ready .page-culture .culture-about > .split-heading.is-visible .split-heading__body > p:nth-child(3) {
  transition-delay: 190ms;
}

.motion-ready .page-culture .culture-about > .split-heading.is-visible .split-heading__body > p:nth-child(4) {
  transition-delay: 230ms;
}

.motion-ready .page-culture .culture-about > .split-heading.is-visible .split-heading__body > p:nth-child(5) {
  transition-delay: 270ms;
}

.motion-ready .page-culture .mission-grid {
  position: relative;
}

.motion-ready .page-culture .mission-panel {
  transform: translate3d(-18px, 0, 0);
}

.motion-ready .page-culture .mission-panel--mission {
  position: relative;
  border-left-color: transparent;
  transform: translate3d(18px, 0, 0);
}

.motion-ready .page-culture .mission-panel--mission::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  background: var(--culture-card-border);
  transform: scaleY(0);
  transform-origin: center top;
  transition: transform 760ms cubic-bezier(.22, 1, .36, 1) 150ms;
}

.motion-ready .page-culture .mission-panel__content > * {
  transform: translate3d(0, 12px, 0);
}

.motion-ready .page-culture .mission-grid.is-visible .mission-panel,
.motion-ready .page-culture .mission-grid.is-visible .mission-panel__content > * {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .mission-grid.is-visible .mission-panel--mission::before {
  transform: scaleY(1);
}

.motion-ready .page-culture .mission-grid.is-visible .mission-panel__content > .section-label {
  transition-delay: 150ms;
}

.motion-ready .page-culture .mission-grid.is-visible .mission-panel__content > h3 {
  transition-delay: 210ms;
}

.motion-ready .page-culture .mission-grid.is-visible .mission-panel__content > p:last-child {
  transition-delay: 270ms;
}

/* Culture / founder rules, portrait and quote */

.motion-ready .page-culture .founder-quote {
  border-color: transparent;
}

.motion-ready .page-culture .founder-quote::before,
.motion-ready .page-culture .founder-quote::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  z-index: 0;
  width: auto;
  height: 1px;
  border: 0;
  border-radius: 0;
  background: rgba(17, 18, 20, .2);
  box-shadow: none;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 780ms cubic-bezier(.22, 1, .36, 1);
  pointer-events: none;
}

.motion-ready .page-culture .founder-quote::before {
  top: 0;
  bottom: auto;
}

.motion-ready .page-culture .founder-quote::after {
  top: auto;
  bottom: 0;
  transition-delay: 70ms;
}

.motion-ready .page-culture .founder-quote__monogram {
  clip-path: inset(0 100% 0 0 round 18px);
  transition: clip-path 760ms cubic-bezier(.22, 1, .36, 1) 90ms;
}

.motion-ready .page-culture .founder-quote__content > *,
.motion-ready .page-culture .founder-quote blockquote > *,
.motion-ready .page-culture .founder-quote figcaption {
  transform: translate3d(18px, 0, 0);
}

.motion-ready .page-culture .founder-quote.is-visible::before,
.motion-ready .page-culture .founder-quote.is-visible::after {
  transform: scaleX(1);
}

.motion-ready .page-culture .founder-quote.is-visible .founder-quote__monogram {
  clip-path: inset(0 0 0 0 round 18px);
}

.motion-ready .page-culture .founder-quote.is-visible .founder-quote__content > *,
.motion-ready .page-culture .founder-quote.is-visible blockquote > *,
.motion-ready .page-culture .founder-quote.is-visible figcaption {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .founder-quote.is-visible .founder-quote__eyebrow {
  transition-delay: 120ms;
}

.motion-ready .page-culture .founder-quote.is-visible blockquote > p:first-child {
  transition-delay: 180ms;
}

.motion-ready .page-culture .founder-quote.is-visible .founder-quote__statement {
  transition-delay: 240ms;
}

.motion-ready .page-culture .founder-quote.is-visible figcaption {
  transition-delay: 300ms;
}

/* Culture / open principles ledger */

.motion-ready .page-culture .principle {
  border-bottom-color: transparent;
  transition-delay:
    calc(70ms + var(--stagger-index, 0) * 45ms),
    calc(70ms + var(--stagger-index, 0) * 45ms),
    0ms,
    0ms;
}

.motion-ready .page-culture .principle::after {
  content: "";
  position: absolute;
  top: auto;
  right: auto;
  bottom: 0;
  left: 0;
  z-index: 1;
  grid-column: auto;
  grid-row: auto;
  width: 100%;
  height: 1px;
  align-self: auto;
  justify-self: auto;
  border: 0;
  border-radius: 0;
  background: var(--culture-line);
  box-shadow: none;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 720ms cubic-bezier(.22, 1, .36, 1);
  transition-delay: calc(90ms + var(--stagger-index, 0) * 45ms);
}

.motion-ready .page-culture .principle__meta,
.motion-ready .page-culture .principle h3,
.motion-ready .page-culture .principle p {
  transform: translate3d(12px, 0, 0);
}

.motion-ready .page-culture .principle-grid.is-visible .principle::after {
  transform: scaleX(1);
}

.motion-ready .page-culture .principle-grid.is-visible .principle__meta,
.motion-ready .page-culture .principle-grid.is-visible .principle h3,
.motion-ready .page-culture .principle-grid.is-visible .principle p {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .principle-grid.is-visible .principle__meta {
  transition-delay: calc(110ms + var(--stagger-index, 0) * 40ms);
}

.motion-ready .page-culture .principle-grid.is-visible .principle h3 {
  transition-delay: calc(150ms + var(--stagger-index, 0) * 40ms);
}

.motion-ready .page-culture .principle-grid.is-visible .principle p {
  transition-delay: calc(190ms + var(--stagger-index, 0) * 40ms);
}

/* Culture / partnership ribbon and closing statement */

.motion-ready .page-culture .culture-partnership .culture-flow-shape,
.motion-ready .page-culture .culture-partnership .culture-flow-highlight {
  transform-box: fill-box;
  transform-origin: center;
  transition:
    transform 850ms cubic-bezier(.22, 1, .36, 1),
    stroke-dashoffset 850ms cubic-bezier(.22, 1, .36, 1);
}

.motion-ready .page-culture .culture-partnership .culture-flow-shape--wine,
.motion-ready .page-culture .culture-partnership .culture-flow-shape--crimson-back {
  transform: translate3d(-16px, 0, 0);
}

.motion-ready .page-culture .culture-partnership .culture-flow-shape--crimson,
.motion-ready .page-culture .culture-partnership .culture-flow-shape--coral {
  transform: translate3d(16px, 0, 0);
}

.motion-ready .page-culture .culture-partnership .culture-flow-shape--veil {
  transform: translate3d(0, 12px, 0);
}

.motion-ready .page-culture .culture-partnership .culture-flow-highlight {
  stroke-dasharray: 1600;
  stroke-dashoffset: 1600;
}

.motion-ready .page-culture .culture-partnership.is-visible .culture-flow-shape {
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .culture-partnership.is-visible .culture-flow-highlight {
  stroke-dashoffset: 0;
}

.motion-ready .page-culture .partnership-grid h2 span,
.motion-ready .page-culture .partnership-statement span {
  display: block;
  transform: translate3d(0, 14px, 0);
}

.motion-ready .page-culture .partnership-grid.is-visible h2 span,
.motion-ready .page-culture .partnership-grid.is-visible .partnership-statement span {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .partnership-grid.is-visible h2 span:nth-child(2),
.motion-ready .page-culture .partnership-grid.is-visible .partnership-statement span:nth-child(1) {
  transition-delay: 90ms;
}

.motion-ready .page-culture .partnership-grid.is-visible .partnership-statement span:nth-child(2) {
  transition-delay: 150ms;
}

.motion-ready .page-culture .looking-ahead__quote,
.motion-ready .page-culture .looking-ahead__sub {
  transform: translate3d(0, 16px, 0);
}

.motion-ready .page-culture .looking-ahead.is-visible .looking-ahead__quote,
.motion-ready .page-culture .looking-ahead.is-visible .looking-ahead__sub {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.motion-ready .page-culture .looking-ahead.is-visible .looking-ahead__sub {
  transition-delay: 140ms;
}

@media (max-width: 900px) {
  .motion-ready .page-culture .mission-panel,
  .motion-ready .page-culture .mission-panel--mission {
    transform: translate3d(0, 14px, 0);
  }

  .motion-ready .page-culture .mission-panel--mission {
    border-top-color: transparent;
    border-left: 0;
  }

  .motion-ready .page-culture .mission-panel--mission::before {
    top: 0;
    right: 0;
    bottom: auto;
    left: 0;
    width: auto;
    height: 1px;
    transform: scaleX(0);
    transform-origin: left center;
  }

  .motion-ready .page-culture .mission-grid.is-visible .mission-panel--mission::before {
    transform: scaleX(1);
  }
}

@media (max-width: 680px) {
  .motion-ready .page-solutions .solution-detail__title .section-label,
  .motion-ready .page-solutions .solution-detail__title h2,
  .motion-ready .page-solutions .solution-detail__title > p:not(.section-label),
  .motion-ready .page-solutions .solution-detail__body > p:first-child,
  .motion-ready .page-solutions .solution-detail .feature-list li {
    transform: translate3d(0, 10px, 0);
  }

  .motion-ready .page-solutions .solution-detail.is-visible .feature-list li {
    transition-delay: calc(170ms + var(--route-item, 0) * 22ms);
  }

  .motion-ready .page-solutions .roadmap-cta--flow .flow-shape--silver,
  .motion-ready .page-solutions .roadmap-cta--flow .flow-shape--indigo-back,
  .motion-ready .page-culture .culture-partnership .culture-flow-shape--wine,
  .motion-ready .page-culture .culture-partnership .culture-flow-shape--crimson-back {
    transform: translate3d(-8px, 0, 0);
  }

  .motion-ready .page-solutions .roadmap-cta--flow .flow-shape--indigo,
  .motion-ready .page-solutions .roadmap-cta--flow .flow-shape--steel,
  .motion-ready .page-culture .culture-partnership .culture-flow-shape--crimson,
  .motion-ready .page-culture .culture-partnership .culture-flow-shape--coral {
    transform: translate3d(8px, 0, 0);
  }

  .motion-ready .page-culture .culture-about > .split-heading h2,
  .motion-ready .page-culture .founder-quote__content > *,
  .motion-ready .page-culture .founder-quote blockquote > *,
  .motion-ready .page-culture .founder-quote figcaption,
  .motion-ready .page-culture .principle__meta,
  .motion-ready .page-culture .principle h3,
  .motion-ready .page-culture .principle p {
    transform: translate3d(0, 10px, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .motion-ready .page-solutions .solution-detail__title .section-label,
  .motion-ready .page-solutions .solution-detail__title h2,
  .motion-ready .page-solutions .solution-detail__title > p:not(.section-label),
  .motion-ready .page-solutions .solution-detail__body > p:first-child,
  .motion-ready .page-solutions .solution-detail .feature-list li,
  .motion-ready .page-solutions .platform-category__icon,
  .motion-ready .page-solutions .platform-category__head,
  .motion-ready .page-solutions .platform-category li,
  .motion-ready .page-solutions .deployment-grid article > *,
  .motion-ready .page-solutions .journey-step__num,
  .motion-ready .page-solutions .journey-step h3,
  .motion-ready .page-solutions .journey-step p,
  .motion-ready .page-solutions .journey-step ul,
  .motion-ready .page-culture .culture-about > .split-heading h2,
  .motion-ready .page-culture .culture-about > .split-heading .split-heading__body > p,
  .motion-ready .page-culture .mission-panel,
  .motion-ready .page-culture .mission-panel__content > *,
  .motion-ready .page-culture .founder-quote__monogram,
  .motion-ready .page-culture .founder-quote__content > *,
  .motion-ready .page-culture .founder-quote blockquote > *,
  .motion-ready .page-culture .founder-quote figcaption,
  .motion-ready .page-culture .principle__meta,
  .motion-ready .page-culture .principle h3,
  .motion-ready .page-culture .principle p,
  .motion-ready .page-culture .partnership-grid h2 span,
  .motion-ready .page-culture .partnership-statement span,
  .motion-ready .page-culture .looking-ahead__quote,
  .motion-ready .page-culture .looking-ahead__sub {
    opacity: 1 !important;
    clip-path: none !important;
    transform: none !important;
    transition: none !important;
  }

  .motion-ready .page-solutions .solution-detail__body::before,
  .motion-ready .page-solutions .deployment-grid article::before,
  .motion-ready .page-culture .mission-panel--mission::before,
  .motion-ready .page-culture .founder-quote::before,
  .motion-ready .page-culture .founder-quote::after,
  .motion-ready .page-culture .principle::after {
    transform: none !important;
    transition: none !important;
  }

  .motion-ready .page-solutions .roadmap-cta--flow .flow-shape,
  .motion-ready .page-solutions .roadmap-cta--flow .flow-highlight,
  .motion-ready .page-culture .culture-partnership .culture-flow-shape,
  .motion-ready .page-culture .culture-partnership .culture-flow-highlight {
    stroke-dashoffset: 0 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Culture partnership / mobile contrast and pacing
   The ribbon remains the full-section backdrop, but it reaches its darker
   values earlier so white editorial copy and sector labels remain readable. */

@media (max-width: 760px) {
  .page-culture .culture-partnership {
    min-height: 0;
    background: linear-gradient(
      180deg,
      var(--culture-paper) 0%,
      #c96a7d 7%,
      #6c1d2d 18%,
      #321018 48%,
      #08090b 100%
    );
  }

  .page-culture .culture-partnership .partnership-grid {
    width: calc(100vw - 2 * var(--tk-pad-x));
    padding-block: clamp(96px, 18vw, 124px) clamp(82px, 15vw, 104px);
  }

  .page-culture .culture-partnership .partnership-grid > div:first-child h2 {
    max-width: 11.5ch;
    margin-inline: auto;
    color: var(--color-dark-text-primary);
    font-size: clamp(34px, 8.7vw, 46px);
    line-height: 1;
    text-shadow: 0 2px 22px rgba(50, 16, 24, .34);
  }

  .page-culture .culture-partnership h2 span {
    white-space: normal;
  }

  .page-culture .culture-partnership .partnership-grid__body {
    max-width: 34ch;
    margin-top: 34px;
  }

  .page-culture .culture-partnership .partnership-grid__body > p:not(.region-line) {
    max-width: 32ch;
    color: rgba(255, 255, 255, .9);
    font-size: 17px;
    font-weight: 460;
    line-height: 1.65;
    text-shadow: 0 1px 16px rgba(50, 16, 24, .28);
  }

  .page-culture .culture-industry-pills {
    width: min(460px, 100%);
    margin-top: 48px;
    gap: 12px;
  }

  .page-culture .culture-industry-pills .sector-pill {
    width: 100%;
    min-height: 54px;
    justify-content: flex-start;
    padding: 13px 18px;
    border-color: rgba(255, 255, 255, .3);
    background: rgba(8, 9, 11, .26);
    color: rgba(255, 255, 255, .94);
    font-size: 15px;
    line-height: 1.35;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    backdrop-filter: blur(10px);
  }

  .page-culture .culture-industry-pills .sector-pill__icon {
    width: 19px;
    height: 19px;
    color: var(--brand-focus);
    stroke-width: 1.9;
  }
}

/* Culture / Looking Ahead
   Keep the dark scene present while its copy reveals independently. This
   avoids the section background being faded twice by the shared reveal class. */

.page-culture .looking-ahead {
  background:
    radial-gradient(circle at 50% 0%, rgba(108, 29, 45, .2), transparent 46%),
    linear-gradient(180deg, #08090b 0%, #110b0e 58%, #210b11 100%);
  border-color: rgba(201, 106, 125, .34);
  color: var(--color-dark-text-primary);
}

.page-culture .looking-ahead__quote {
  max-width: 25ch;
  margin-inline: auto;
  color: var(--color-dark-text-primary);
  text-wrap: balance;
}

.page-culture .looking-ahead__sub {
  max-width: 54ch;
  color: var(--color-dark-text-secondary);
  line-height: 1.65;
  text-wrap: pretty;
}

@media (max-width: 680px) {
  .page-culture .looking-ahead {
    padding-block: clamp(88px, 20vw, 116px);
  }

  .page-culture .looking-ahead__quote {
    max-width: 15ch;
    margin-bottom: 48px;
    font-size: clamp(32px, 8.4vw, 40px);
    line-height: 1.08;
  }

  .page-culture .looking-ahead__quote br {
    display: none;
  }

  .page-culture .looking-ahead__sub {
    max-width: 32ch;
    font-size: 17px;
    line-height: 1.65;
  }
}

/* Culture / Founder message mobile measure
   Preserve the open editorial treatment while preventing the serif quotation
   from overrunning narrow viewports. */

@media (max-width: 560px) {
  .page-culture .culture-belief {
    padding-block: 48px;
  }

  .page-culture .founder-quote {
    gap: 24px;
    padding: 34px 0 40px;
  }

  .page-culture .founder-quote__monogram {
    width: 86px;
    border-radius: 14px;
  }

  .page-culture .founder-quote__content,
  .page-culture .founder-quote blockquote,
  .page-culture .founder-quote blockquote p {
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }

  .page-culture .founder-quote__eyebrow {
    margin-bottom: 20px;
    font-size: 11px;
    letter-spacing: .12em;
  }

  .page-culture .founder-quote blockquote p {
    font-size: clamp(27px, 8vw, 32px);
    letter-spacing: -.035em;
    line-height: 1.08;
    overflow-wrap: break-word;
    text-wrap: pretty;
  }

  .page-culture .founder-quote blockquote .founder-quote__statement {
    margin-top: 24px;
    font-size: 18px;
    letter-spacing: -.022em;
    line-height: 1.42;
  }

  .page-culture .founder-quote figcaption {
    margin-top: 28px;
  }
}

/* Solutions / hero signature alignment
   Treat “With INFINITAS.” as one closing phrase so its three parts cannot
   separate or drift across lines on narrow screens. */

.page-solutions .hero-title__signature {
  grid-area: 2 / 1 / 3 / 4;
  display: inline-flex;
  align-items: baseline;
  justify-self: center;
  gap: .2em;
  white-space: nowrap;
}

.page-solutions .hero-title__signature .hero-title__with,
.page-solutions .hero-title__signature .hero-title__brand,
.page-solutions .hero-title__signature .hero-title__period {
  grid-area: auto;
  justify-self: auto;
}

.page-solutions .hero-title__signature .hero-title__brand {
  width: 7.4em;
}

@media (max-width: 680px) {
  .page-solutions .page-hero h1 {
    text-align: center;
  }

  .page-solutions .hero-title__signature {
    width: 100%;
    margin-top: .48em;
    justify-content: center;
    gap: .18em;
  }

  .page-solutions .hero-title__signature .hero-title__with {
    display: inline;
    margin-top: 0;
  }

  .page-solutions .hero-title__signature .hero-title__brand {
    width: 7.15em;
    margin-left: 0;
  }
}

/* Home / engagement path */

.page-home .engagement-path {
  padding-block: clamp(88px, 8vw, 136px);
  background:
    radial-gradient(circle at 18% 12%, rgba(108, 29, 45, .14), transparent 34%),
    var(--color-dark-canvas);
}

.page-home .engagement-path__intro {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .55fr);
  gap: clamp(28px, 7vw, 112px);
  align-items: end;
  padding-bottom: clamp(44px, 5vw, 72px);
}

.page-home .engagement-path__intro .section-label {
  grid-column: 1 / -1;
  margin-bottom: 0;
  color: var(--brand-rose);
}

.page-home .engagement-path__intro h2 {
  max-width: 16ch;
  color: var(--color-dark-text-primary);
  font-size: clamp(42px, 4.4vw, 68px);
  line-height: .98;
  text-wrap: balance;
}

.page-home .engagement-path__intro > p:last-child {
  max-width: 35ch;
  color: var(--color-dark-text-secondary);
  font-size: clamp(17px, 1.25vw, 20px);
  line-height: 1.65;
}

.page-home .engagement-path__steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(247, 246, 243, .18);
  list-style: none;
}

.page-home .engagement-path__steps li {
  min-width: 0;
  padding: clamp(28px, 3vw, 44px) clamp(18px, 2.2vw, 34px) 0;
  border-left: 1px solid rgba(247, 246, 243, .12);
}

.page-home .engagement-path__steps li:last-child {
  border-right: 1px solid rgba(247, 246, 243, .12);
}

.page-home .engagement-path__steps li > span {
  display: block;
  margin-bottom: clamp(44px, 5vw, 72px);
  color: var(--brand-rose);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
}

.page-home .engagement-path__steps h3 {
  margin-bottom: 18px;
  color: var(--color-dark-text-primary);
  font-size: clamp(28px, 2.4vw, 38px);
}

.page-home .engagement-path__steps p {
  color: var(--color-dark-text-secondary);
  font-size: 16px;
  line-height: 1.6;
}

.page-home .engagement-path__steps small {
  display: block;
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid rgba(247, 246, 243, .1);
  color: var(--color-dark-text-muted);
  font-size: 13px;
  line-height: 1.5;
}

/* Solutions / omnichannel enquiry intelligence example */

.page-solutions .omnichannel-use-case {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-block: clamp(28px, 4vw, 52px) clamp(72px, 7vw, 104px);
  padding: clamp(36px, 4vw, 56px);
  border-top: 1px solid rgba(201, 106, 125, .55);
  border-bottom: 1px solid rgba(247, 246, 243, .16);
  background:
    radial-gradient(circle at 82% 14%, rgba(201, 106, 125, .09), transparent 35%),
    linear-gradient(145deg, rgba(21, 22, 25, .96), rgba(8, 9, 11, .98));
}

.page-solutions .omnichannel-use-case__head {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .65fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: end;
}

.page-solutions .omnichannel-use-case__head .section-label,
.page-solutions .omnichannel-lanes .section-label {
  color: var(--brand-rose);
}

.page-solutions .omnichannel-use-case__head h2 {
  max-width: 15ch;
  color: var(--color-dark-text-primary);
  font-size: clamp(38px, 3.9vw, 58px);
  line-height: .97;
  text-wrap: balance;
}

.page-solutions .omnichannel-use-case__head > p {
  max-width: 38ch;
  color: var(--color-dark-text-secondary);
  font-size: clamp(16px, 1.1vw, 18px);
  line-height: 1.58;
}

.page-solutions .omnichannel-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: clamp(38px, 4.5vw, 58px) 0 0;
  padding: 0;
  border-top: 1px solid rgba(247, 246, 243, .16);
  list-style: none;
}

.page-solutions .omnichannel-flow li {
  min-width: 0;
  padding: 24px clamp(14px, 1.6vw, 22px) 26px;
  border-left: 1px solid rgba(247, 246, 243, .1);
}

.page-solutions .omnichannel-flow li:last-child {
  border-right: 1px solid rgba(247, 246, 243, .1);
}

.page-solutions .omnichannel-flow i,
.page-solutions .omnichannel-lanes > article > i {
  width: 24px;
  height: 24px;
  color: var(--brand-rose);
  stroke-width: 1.65;
}

.page-solutions .omnichannel-flow span {
  display: block;
  margin: 24px 0 12px;
  color: var(--color-dark-text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.page-solutions .omnichannel-flow h3 {
  margin-bottom: 10px;
  color: var(--color-dark-text-primary);
  font-size: clamp(20px, 1.55vw, 25px);
}

.page-solutions .omnichannel-flow p,
.page-solutions .omnichannel-lanes p,
.page-solutions .omnichannel-lanes li {
  color: var(--color-dark-text-secondary);
  font-size: 15px;
  line-height: 1.6;
}

.page-solutions .omnichannel-lanes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(38px, 4vw, 58px);
  border-top: 1px solid rgba(247, 246, 243, .16);
}

.page-solutions .omnichannel-lanes article {
  min-width: 0;
  padding: clamp(26px, 3vw, 38px);
}

.page-solutions .omnichannel-lanes article + article {
  border-left: 1px solid rgba(247, 246, 243, .14);
}

.page-solutions .omnichannel-lanes--teams article + article {
  border-left: 0;
}

.page-solutions .omnichannel-lanes--teams article:nth-child(even) {
  border-left: 1px solid rgba(247, 246, 243, .14);
}

.page-solutions .omnichannel-lanes--teams article:nth-child(n + 3) {
  border-top: 1px solid rgba(247, 246, 243, .14);
}

.page-solutions .agriculture-use-case {
  background:
    radial-gradient(circle at 16% 12%, rgba(201, 106, 125, .08), transparent 34%),
    linear-gradient(155deg, rgba(21, 22, 25, .97), rgba(8, 9, 11, .99));
}

.page-solutions .agriculture-stakeholders {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.page-solutions .agriculture-stakeholders article + article {
  border-left: 1px solid rgba(247, 246, 243, .14);
}

.page-solutions .omnichannel-lanes.agriculture-stakeholders h3 {
  max-width: none;
  font-size: clamp(24px, 1.9vw, 30px);
  text-wrap: pretty;
}

.page-solutions .agriculture-guardrail {
  display: grid;
  grid-template-columns: minmax(190px, .42fr) minmax(0, 1fr);
  gap: clamp(18px, 3vw, 40px);
  margin: 0;
  padding: clamp(24px, 2.7vw, 34px) clamp(18px, 3vw, 38px) 0;
  border-top: 1px solid rgba(247, 246, 243, .14);
  color: var(--color-dark-text-secondary);
  font-size: 15px;
  line-height: 1.58;
}

.page-solutions .agriculture-guardrail strong {
  color: var(--brand-rose);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.45;
  text-transform: uppercase;
}

.page-solutions .omnichannel-lanes .section-label {
  margin: 24px 0 14px;
}

.page-solutions .omnichannel-lanes h3 {
  max-width: 22ch;
  margin-bottom: 14px;
  color: var(--color-dark-text-primary);
  font-size: clamp(24px, 2.1vw, 34px);
  line-height: 1.04;
  text-wrap: balance;
}

.page-solutions .omnichannel-lanes ul {
  display: grid;
  gap: 8px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.page-solutions .omnichannel-lanes li {
  position: relative;
  padding-left: 18px;
}

.page-solutions .omnichannel-lanes li::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand-signal);
}

@media (max-width: 900px) {
  .page-home .engagement-path__intro,
  .page-solutions .omnichannel-use-case__head {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .page-home .engagement-path__steps,
  .page-solutions .omnichannel-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-home .engagement-path__steps li:nth-child(3),
  .page-home .engagement-path__steps li:nth-child(4),
  .page-solutions .omnichannel-flow li:nth-child(3),
  .page-solutions .omnichannel-flow li:nth-child(4) {
    border-top: 1px solid rgba(247, 246, 243, .12);
  }
}

@media (max-width: 1100px) {
  .page-solutions .agriculture-stakeholders {
    grid-template-columns: 1fr;
  }

  .page-solutions .agriculture-stakeholders article + article {
    border-top: 1px solid rgba(247, 246, 243, .14);
    border-left: 0;
  }

  .page-solutions .agriculture-guardrail {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .page-home .engagement-path {
    padding-block: 78px 92px;
  }

  .page-home .engagement-path__intro {
    padding-bottom: 38px;
  }

  .page-home .engagement-path__intro h2,
  .page-solutions .omnichannel-use-case__head h2 {
    font-size: clamp(34px, 9vw, 42px);
  }

  .page-home .engagement-path__steps,
  .page-solutions .omnichannel-flow,
  .page-solutions .omnichannel-lanes {
    grid-template-columns: 1fr;
  }

  .page-home .engagement-path__steps li,
  .page-solutions .omnichannel-flow li {
    padding: 28px 18px 32px;
    border-right: 1px solid rgba(247, 246, 243, .1);
    border-bottom: 1px solid rgba(247, 246, 243, .1);
  }

  .page-home .engagement-path__steps li > span {
    margin-bottom: 28px;
  }

  .page-solutions .omnichannel-use-case {
    margin-block: 24px 72px;
    padding: 34px 18px;
  }

  .page-solutions .omnichannel-flow {
    margin-top: 36px;
  }

  .page-solutions .omnichannel-flow span {
    margin-top: 22px;
  }

  .page-solutions .omnichannel-lanes {
    margin-top: 38px;
  }

  .page-solutions .omnichannel-lanes article {
    padding: 28px 4px;
  }

  .page-solutions .omnichannel-lanes article + article {
    border-top: 1px solid rgba(247, 246, 243, .14);
    border-left: 0;
  }

  .page-solutions .omnichannel-lanes--teams article:nth-child(even) {
    border-left: 0;
  }

  .page-solutions .agriculture-guardrail {
    gap: 14px;
    padding-inline: 4px;
  }
}

/* Home / mobile chapter height repair
   A legacy cadence rule fixed the matrix content at 104px. The current
   editorial compositions are taller, so let their content determine the
   section height and keep decorative veils inside the viewport. */

@media (max-width: 680px) {
  html,
  body {
    max-width: 100%;
    overflow-x: clip;
  }

  .page-home .hero-bridge,
  .page-home .section-dash-divider,
  .page-home .site-footer {
    overflow-x: clip;
  }

  .page-home .hero-bridge {
    height: auto;
  }

  .page-home .hero-bridge__content {
    width: calc(100% - 2 * var(--tk-pad-x));
    height: auto;
    min-height: 0;
    align-items: start;
  }

  .page-home .hero-bridge__heading,
  .page-home .hero-bridge__aside {
    width: 100%;
    min-width: 0;
  }

  .page-home .hero-bridge__content::before {
    inset: -8% 0;
  }

  .page-home .hero-bridge__content h2 {
    max-width: 100%;
  }

  .page-home .hero-bridge__region {
    width: 100%;
    max-width: 18ch;
    line-height: 1.08;
    text-wrap: balance;
  }

  .page-home .section-dash-divider__content {
    width: calc(100% - 2 * var(--tk-pad-x));
    height: auto;
    min-height: clamp(320px, 94vw, 380px);
  }

  .page-home .section-dash-divider__content::before {
    width: 100%;
  }
}

/* ==========================================================================
   Case Studies / practical implementation blueprints

   The new route extends the Solutions language without turning the examples
   into a presentation deck. Sections remain open editorial ledgers organised
   by graphite rules, quiet rose signals and concise implementation steps.
   ========================================================================== */

.page-solutions .case-study-more {
  display: flex;
  justify-content: flex-end;
  margin-top: clamp(28px, 3vw, 42px);
  padding-top: clamp(24px, 2.5vw, 34px);
  border-top: 1px solid rgba(247, 246, 243, .14);
}

.page-solutions .case-study-more .text-link {
  color: var(--brand-rose);
}

.page-case-studies {
  background: var(--color-dark-canvas);
  color: var(--color-dark-text-primary);
}

.page-case-studies main {
  overflow: hidden;
  background: var(--color-dark-canvas);
}

.page-case-studies main .section-label {
  color: var(--brand-rose);
}

.page-case-studies main .section-label::before {
  background: var(--brand-signal);
  box-shadow: 0 0 0 4px rgba(201, 106, 125, .14);
}

.page-case-studies .case-studies-hero {
  position: relative;
  isolation: isolate;
  min-height: clamp(760px, 94vh, 940px);
  display: flex;
  align-items: flex-end;
  padding-block: clamp(150px, 17vh, 210px) clamp(72px, 8vh, 104px);
  border-bottom: 1px solid rgba(247, 246, 243, .14);
  background:
    linear-gradient(180deg, rgba(8, 9, 11, .26), rgba(8, 9, 11, .84) 68%, #08090b 100%),
    url("solutions-hero-mountains-only.webp") center 28% / cover no-repeat;
}

.page-case-studies .case-studies-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(circle at 20% 28%, rgba(201, 106, 125, .12), transparent 32%),
    linear-gradient(90deg, rgba(8, 9, 11, .28), transparent 54%);
  pointer-events: none;
}

.page-case-studies .case-studies-hero__inner {
  position: relative;
  z-index: 1;
}

.page-case-studies .case-studies-hero h1 {
  max-width: 12ch;
  margin: 0;
  color: var(--color-dark-text-primary);
  font-size: clamp(68px, 7.2vw, 116px);
  font-weight: 570;
  letter-spacing: -.065em;
  line-height: .88;
  text-wrap: balance;
}

.page-case-studies .case-studies-hero h1 em {
  color: var(--brand-rose);
  font-family: var(--font-newsreader);
  font-weight: 450;
}

.page-case-studies .case-studies-hero__summary {
  max-width: 54ch;
  margin-top: clamp(28px, 3vw, 44px);
  color: var(--color-dark-text-secondary);
  font-size: clamp(18px, 1.35vw, 22px);
  line-height: 1.6;
}

.page-case-studies .case-studies-hero__note {
  max-width: 67ch;
  margin-top: 14px;
  color: var(--color-dark-text-muted);
  font-size: clamp(14px, 1vw, 16px);
  line-height: 1.65;
}

.page-case-studies .case-studies-jump {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 1360px;
  margin-top: clamp(52px, 6vw, 86px);
  border-top: 1px solid rgba(247, 246, 243, .18);
  border-bottom: 1px solid rgba(247, 246, 243, .18);
}

.page-case-studies .case-studies-jump a {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 7px 16px;
  align-items: center;
  padding: clamp(24px, 2.8vw, 38px);
  color: var(--color-dark-text-primary);
  transition: background 220ms var(--ease);
}

.page-case-studies .case-studies-jump a + a {
  border-left: 1px solid rgba(247, 246, 243, .14);
}

.page-case-studies .case-studies-jump a:hover {
  background: rgba(201, 106, 125, .08);
}

.page-case-studies .case-studies-jump i,
.page-case-studies .case-studies-jump svg {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  margin-top: 2px;
  width: 24px;
  height: 24px;
  color: var(--brand-rose);
  stroke-width: 1.7;
}

.page-case-studies .case-studies-jump span {
  grid-column: 2;
  min-width: 0;
  font-size: clamp(17px, 1.25vw, 20px);
  font-weight: 650;
}

.page-case-studies .case-studies-jump small {
  grid-column: 2;
  min-width: 0;
  color: var(--color-dark-text-muted);
  font-size: 13px;
  line-height: 1.45;
}

.page-case-studies .case-study-chapter {
  scroll-margin-top: 96px;
  padding-block: clamp(106px, 10vw, 164px);
  background:
    radial-gradient(circle at 88% 8%, rgba(201, 106, 125, .07), transparent 27%),
    var(--color-dark-canvas);
}

.page-case-studies .case-study-chapter--agriculture {
  border-top: 1px solid rgba(247, 246, 243, .12);
  background:
    radial-gradient(circle at 10% 9%, rgba(201, 106, 125, .07), transparent 28%),
    #0a0b0d;
}

.page-case-studies .case-study-chapter--confinement {
  border-top: 1px solid rgba(247, 246, 243, .12);
  background:
    radial-gradient(circle at 86% 10%, rgba(201, 106, 125, .09), transparent 30%),
    linear-gradient(155deg, #0b0c0e, #08090b 72%);
}

.page-case-studies .case-study-chapter--oil-gas {
  border-top: 1px solid rgba(247, 246, 243, .12);
  background:
    radial-gradient(ellipse at 16% 12%, rgba(201, 106, 125, .08), transparent 31%),
    linear-gradient(145deg, #090a0c, #101114 48%, #08090b 82%);
}

.page-case-studies .case-study-detail {
  padding-block: clamp(46px, 4.5vw, 68px);
  border-top: 1px solid rgba(201, 106, 125, .58);
  border-bottom: 1px solid rgba(247, 246, 243, .16);
}

.page-case-studies .case-study-detail__head {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(300px, .64fr);
  gap: clamp(42px, 8vw, 126px);
  align-items: end;
}

.page-case-studies .case-study-detail__head h2 {
  max-width: 14ch;
  color: var(--color-dark-text-primary);
  font-size: clamp(50px, 5vw, 78px);
  font-weight: 560;
  letter-spacing: -.055em;
  line-height: .94;
  text-wrap: balance;
}

.page-case-studies .case-study-detail__head > p {
  max-width: 39ch;
  color: var(--color-dark-text-secondary);
  font-size: clamp(17px, 1.15vw, 20px);
  line-height: 1.65;
}

.page-case-studies .case-study-start {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(64px, 7vw, 106px);
  border-top: 1px solid rgba(247, 246, 243, .16);
  border-bottom: 1px solid rgba(247, 246, 243, .16);
}

.page-case-studies .case-study-start > article {
  min-width: 0;
  padding: clamp(34px, 4vw, 58px);
}

.page-case-studies .case-study-start > article + article {
  border-left: 1px solid rgba(247, 246, 243, .14);
}

.page-case-studies .case-study-start i {
  width: 26px;
  height: 26px;
  color: var(--brand-rose);
  stroke-width: 1.65;
}

.page-case-studies .case-study-start .section-label {
  margin: 34px 0 17px;
}

.page-case-studies .case-study-start h3,
.page-case-studies .case-study-subhead h3,
.page-case-studies .case-study-measures h3 {
  color: var(--color-dark-text-primary);
  font-size: clamp(28px, 2.55vw, 40px);
  font-weight: 560;
  letter-spacing: -.035em;
  line-height: 1.04;
  text-wrap: balance;
}

.page-case-studies .case-study-start h3 {
  max-width: 20ch;
}

.page-case-studies .case-study-start ul {
  display: grid;
  gap: 10px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.page-case-studies .case-study-start li {
  position: relative;
  padding-left: 18px;
  color: var(--color-dark-text-secondary);
  font-size: 15px;
  line-height: 1.55;
}

.page-case-studies .case-study-start li::before {
  content: "";
  position: absolute;
  top: .68em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand-signal);
}

.page-case-studies .case-study-subhead {
  display: grid;
  grid-template-columns: minmax(180px, .42fr) minmax(0, 1fr);
  gap: clamp(34px, 6vw, 90px);
  align-items: end;
  margin-top: clamp(82px, 8vw, 126px);
}

.page-case-studies .case-study-subhead .section-label {
  margin-bottom: 4px;
}

.page-case-studies .case-study-subhead h3 {
  max-width: 20ch;
}

.page-case-studies .case-study-detail > .omnichannel-flow,
.page-case-studies .case-study-detail > .omnichannel-lanes {
  margin-top: clamp(34px, 4vw, 54px);
}

.page-case-studies .case-study-rollout {
  margin-top: clamp(90px, 9vw, 142px);
  padding-top: clamp(48px, 5vw, 72px);
  border-top: 1px solid rgba(247, 246, 243, .16);
}

.page-case-studies .case-study-rollout .case-study-subhead {
  margin-top: 0;
}

.page-case-studies .case-study-timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: clamp(42px, 4.5vw, 64px) 0 0;
  padding: 0;
  border-top: 1px solid rgba(247, 246, 243, .16);
  list-style: none;
}

.page-case-studies .case-study-timeline li {
  min-width: 0;
  padding: clamp(28px, 3vw, 42px) clamp(18px, 2.2vw, 32px) 0;
  border-left: 1px solid rgba(247, 246, 243, .12);
}

.page-case-studies .case-study-timeline li:last-child {
  border-right: 1px solid rgba(247, 246, 243, .12);
}

.page-case-studies .case-study-timeline li > span {
  display: block;
  margin-bottom: clamp(32px, 4vw, 54px);
  color: var(--brand-rose);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
}

.page-case-studies .case-study-timeline strong {
  color: var(--color-dark-text-primary);
  font-size: clamp(22px, 1.8vw, 28px);
}

.page-case-studies .case-study-timeline p {
  margin-top: 14px;
  color: var(--color-dark-text-secondary);
  font-size: 15px;
  line-height: 1.6;
}

.page-case-studies .case-study-measures {
  display: grid;
  grid-template-columns: minmax(260px, .68fr) minmax(0, 1fr);
  gap: clamp(56px, 8vw, 120px);
  align-items: end;
  margin-top: clamp(92px, 9vw, 140px);
  padding-top: clamp(48px, 5vw, 72px);
  border-top: 1px solid rgba(247, 246, 243, .16);
}

.page-case-studies .case-study-measures h3 {
  max-width: 17ch;
}

.page-case-studies .case-study-measures ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(247, 246, 243, .14);
  list-style: none;
}

.page-case-studies .case-study-measures li {
  min-width: 0;
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 22px 18px;
  border-bottom: 1px solid rgba(247, 246, 243, .14);
  color: var(--color-dark-text-secondary);
  font-size: 15px;
  line-height: 1.4;
}

.page-case-studies .case-study-measures li:nth-child(even) {
  border-left: 1px solid rgba(247, 246, 243, .14);
}

.page-case-studies .case-study-measures i {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: var(--brand-rose);
  stroke-width: 1.75;
}

.page-case-studies .proposal-workspace {
  margin-top: clamp(90px, 9vw, 142px);
  padding-top: clamp(48px, 5vw, 72px);
  border-top: 1px solid rgba(247, 246, 243, .16);
}

.page-case-studies .proposal-workspace .case-study-subhead {
  margin-top: 0;
}

.page-case-studies .proposal-workspace__frame {
  margin-top: clamp(38px, 4.5vw, 64px);
  border: 1px solid rgba(247, 246, 243, .16);
  background:
    linear-gradient(135deg, rgba(201, 106, 125, .045), transparent 38%),
    rgba(21, 22, 25, .72);
}

.page-case-studies .proposal-workspace__bar {
  display: grid;
  grid-template-columns: minmax(260px, .62fr) minmax(0, 1fr);
  gap: clamp(30px, 5vw, 76px);
  align-items: end;
  padding: clamp(28px, 3.4vw, 48px);
  border-bottom: 1px solid rgba(247, 246, 243, .15);
}

.page-case-studies .proposal-workspace__bar > div > span {
  display: block;
  margin-bottom: 12px;
  color: var(--brand-rose);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.page-case-studies .proposal-workspace__bar strong {
  display: block;
  max-width: 25ch;
  color: var(--color-dark-text-primary);
  font-size: clamp(22px, 2vw, 30px);
  font-weight: 560;
  line-height: 1.12;
}

.page-case-studies .proposal-workspace__bar dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}

.page-case-studies .proposal-workspace__bar dl > div {
  min-width: 0;
  padding-left: clamp(14px, 2vw, 26px);
  border-left: 1px solid rgba(247, 246, 243, .13);
}

.page-case-studies .proposal-workspace__bar dt {
  color: var(--color-dark-text-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.page-case-studies .proposal-workspace__bar dd {
  margin: 9px 0 0;
  color: var(--color-dark-text-primary);
  font-size: 14px;
  line-height: 1.35;
}

.page-case-studies .proposal-workspace__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.page-case-studies .proposal-workspace__grid article {
  min-width: 0;
  padding: clamp(30px, 3.8vw, 52px);
  border-bottom: 1px solid rgba(247, 246, 243, .13);
}

.page-case-studies .proposal-workspace__grid article:nth-child(even) {
  border-left: 1px solid rgba(247, 246, 243, .13);
}

.page-case-studies .proposal-workspace__grid i {
  width: 24px;
  height: 24px;
  color: var(--brand-rose);
  stroke-width: 1.65;
}

.page-case-studies .proposal-workspace__grid .section-label {
  margin: 27px 0 12px;
}

.page-case-studies .proposal-workspace__grid h4 {
  color: var(--color-dark-text-primary);
  font-size: clamp(21px, 1.7vw, 27px);
  font-weight: 560;
  letter-spacing: -.025em;
  line-height: 1.12;
}

.page-case-studies .proposal-workspace__grid ul {
  display: grid;
  gap: 9px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.page-case-studies .proposal-workspace__grid li {
  position: relative;
  padding-left: 17px;
  color: var(--color-dark-text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

.page-case-studies .proposal-workspace__grid li::before {
  content: "";
  position: absolute;
  top: .68em;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--brand-signal);
}

.page-case-studies .proposal-workspace__foot {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0 clamp(20px, 3vw, 38px);
}

.page-case-studies .proposal-workspace__foot span {
  min-width: 0;
  display: flex;
  gap: 11px;
  align-items: center;
  padding: 22px 14px;
  color: var(--color-dark-text-muted);
  font-size: 12px;
  line-height: 1.4;
}

.page-case-studies .proposal-workspace__foot span + span {
  border-left: 1px solid rgba(247, 246, 243, .12);
}

.page-case-studies .proposal-workspace__foot i {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  color: var(--brand-rose);
  stroke-width: 1.75;
}

.page-case-studies .case-studies-closing {
  padding-block: clamp(96px, 9vw, 150px);
  border-top: 1px solid rgba(247, 246, 243, .14);
  background:
    radial-gradient(circle at 72% 42%, rgba(108, 29, 45, .24), transparent 34%),
    linear-gradient(145deg, #111215, #08090b 72%);
}

.page-case-studies .case-studies-closing__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .62fr);
  gap: clamp(64px, 9vw, 150px);
  align-items: end;
}

.page-case-studies .case-studies-closing__lead .section-label {
  margin-bottom: clamp(30px, 3.5vw, 50px);
}

.page-case-studies .case-studies-closing h2 {
  max-width: 18ch;
  color: var(--color-dark-text-primary);
  font-size: clamp(48px, 4.6vw, 76px);
  font-weight: 560;
  letter-spacing: -.055em;
  line-height: .94;
  text-wrap: balance;
}

.page-case-studies .case-studies-closing__action p {
  max-width: 39ch;
  color: var(--color-dark-text-secondary);
  font-size: 17px;
  line-height: 1.65;
}

.page-case-studies .case-studies-closing .button {
  width: fit-content;
  max-width: 100%;
  margin-top: 34px;
  padding-inline: 28px;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .page-case-studies .case-studies-jump {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-case-studies .case-studies-jump a:nth-child(3) {
    border-top: 1px solid rgba(247, 246, 243, .14);
    border-left: 0;
  }

  .page-case-studies .case-studies-jump a:nth-child(4) {
    border-top: 1px solid rgba(247, 246, 243, .14);
  }

  .page-case-studies .case-study-detail__head,
  .page-case-studies .case-study-measures {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .page-case-studies .case-study-detail__head > p {
    max-width: 58ch;
  }

  .page-case-studies .case-study-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-case-studies .case-study-timeline li:nth-child(3),
  .page-case-studies .case-study-timeline li:nth-child(4) {
    padding-top: 38px;
    border-top: 1px solid rgba(247, 246, 243, .12);
  }

  .page-case-studies .proposal-workspace__bar {
    grid-template-columns: 1fr;
  }

  .page-case-studies .case-studies-closing__grid {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .page-case-studies .case-studies-closing__action {
    max-width: 620px;
  }
}

@media (max-width: 760px) {
  .page-solutions .case-study-more {
    justify-content: flex-start;
  }

  .page-solutions .case-study-more .text-link {
    width: 100%;
    justify-content: space-between;
    line-height: 1.35;
  }

  .page-case-studies .case-studies-hero {
    min-height: 760px;
    padding-block: 132px 64px;
    background-position: 54% 24%;
  }

  .page-case-studies .case-studies-hero h1 {
    max-width: 8ch;
    font-size: clamp(54px, 15vw, 72px);
    line-height: .9;
  }

  .page-case-studies .case-studies-hero__summary {
    max-width: 34ch;
    font-size: 17px;
  }

  .page-case-studies .case-studies-hero__note {
    max-width: 37ch;
    margin-top: 12px;
    font-size: 14px;
  }

  .page-case-studies .case-studies-jump,
  .page-case-studies .case-study-start,
  .page-case-studies .case-study-subhead,
  .page-case-studies .case-study-timeline,
  .page-case-studies .case-studies-closing__grid {
    grid-template-columns: 1fr;
  }

  .page-case-studies .case-studies-jump a + a,
  .page-case-studies .case-study-start > article + article {
    border-top: 1px solid rgba(247, 246, 243, .14);
    border-left: 0;
  }

  .page-case-studies .proposal-workspace {
    margin-top: 76px;
  }

  .page-case-studies .proposal-workspace__bar,
  .page-case-studies .proposal-workspace__grid article {
    padding: 28px 20px;
  }

  .page-case-studies .proposal-workspace__bar dl,
  .page-case-studies .proposal-workspace__grid,
  .page-case-studies .proposal-workspace__foot {
    grid-template-columns: 1fr;
  }

  .page-case-studies .proposal-workspace__bar dl {
    gap: 0;
    border-top: 1px solid rgba(247, 246, 243, .13);
  }

  .page-case-studies .proposal-workspace__bar dl > div {
    padding: 16px 0;
    border-bottom: 1px solid rgba(247, 246, 243, .11);
    border-left: 0;
  }

  .page-case-studies .proposal-workspace__grid article:nth-child(even) {
    border-left: 0;
  }

  .page-case-studies .proposal-workspace__foot {
    padding-inline: 20px;
  }

  .page-case-studies .proposal-workspace__foot span {
    padding-inline: 0;
  }

  .page-case-studies .proposal-workspace__foot span + span {
    border-top: 1px solid rgba(247, 246, 243, .12);
    border-left: 0;
  }

  .page-case-studies .case-study-chapter {
    padding-block: 82px;
  }

  .page-case-studies .case-study-detail {
    padding-block: 38px;
  }

  .page-case-studies .case-study-detail__head h2 {
    font-size: clamp(42px, 11.5vw, 56px);
  }

  .page-case-studies .case-study-start {
    margin-top: 54px;
  }

  .page-case-studies .case-study-start > article {
    padding: 34px 4px;
  }

  .page-case-studies .case-study-subhead {
    gap: 20px;
    margin-top: 72px;
  }

  .page-case-studies .case-study-subhead h3,
  .page-case-studies .case-study-measures h3 {
    font-size: clamp(28px, 8vw, 36px);
  }

  .page-case-studies .case-study-timeline li,
  .page-case-studies .case-study-timeline li:nth-child(3),
  .page-case-studies .case-study-timeline li:nth-child(4) {
    padding: 28px 4px 30px;
    border-right: 0;
    border-bottom: 1px solid rgba(247, 246, 243, .12);
    border-left: 0;
  }

  .page-case-studies .case-study-timeline li > span {
    margin-bottom: 24px;
  }

  .page-case-studies .case-study-measures {
    margin-top: 76px;
  }

  .page-case-studies .case-study-measures ul {
    grid-template-columns: 1fr;
  }

  .page-case-studies .case-study-measures li:nth-child(even) {
    border-left: 0;
  }

  .page-case-studies .case-studies-closing {
    padding-block: 92px;
  }

  .page-case-studies .case-studies-closing__grid {
    gap: 28px;
  }

  .page-case-studies .case-studies-closing h2 {
    font-size: clamp(42px, 11vw, 54px);
  }

  .page-case-studies .case-studies-closing .button {
    width: 100%;
    white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-case-studies .case-studies-jump a {
    transition: none;
  }
}
