@font-face {
  font-family: "Poppins";
  src: url("assets/fonts/poppins-300.ttf") format("truetype");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("assets/fonts/poppins-400.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("assets/fonts/poppins-500.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Poppins";
  src: url("assets/fonts/poppins-600.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Stack Sans";
  src: url("assets/fonts/stack-sans-headline-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 700;
  font-display: swap;
}

:root {
  --ink: #11110f;
  --ink-soft: #1a1a18;
  --paper: #f3f2ee;
  --white: #ffffff;
  --muted: #686761;
  --line: #cac8c1;
  --line-dark: #363633;
  --orange: #ff5a24;
  --orange-dark: #d9410d;
  --accent: #ff5a24;
  --section-space: clamp(6.5rem, 10vw, 10rem);
  --container: 1480px;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --type-display: clamp(4rem, 6.45vw, 7.45rem);
  --type-hero: clamp(3.2rem, 4.8vw, 5.1rem);
  --type-h2: clamp(2.45rem, 3.8vw, 4.15rem);
  --type-h3: clamp(1.4rem, 1.55vw, 1.85rem);
  --type-h4: clamp(1.125rem, 1.15vw, 1.35rem);
  --type-body: clamp(1rem, .25vw + .96rem, 1.125rem);
  --font-display: "Stack Sans", "Arial Narrow", Arial, sans-serif;
  --font-body: "Poppins", "Segoe UI", Arial, sans-serif;
}

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

html {
  scroll-behavior: smooth;
  scroll-padding-top: 86px;
}

body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.menu-open {
  overflow: hidden;
}

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

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

button, input, select, textarea {
  color: inherit;
  font: inherit;
}

button, select {
  cursor: pointer;
}

button {
  border: 0;
}

p {
  margin: 0;
  font-size: var(--type-body);
  font-weight: 400;
}

main p,
main li,
main dt,
main dd {
  text-align: left;
}

h1, h2, h3, h4 {
  margin: 0;
  color: inherit;
  font-weight: 400;
  letter-spacing: -.045em;
  text-align: left;
  text-wrap: balance;
  overflow-wrap: break-word;
  hyphens: auto;
  font-family: var(--font-display);
}

h1 {
  font-size: var(--type-display);
  font-weight: 400;
  line-height: .87;
}

h2 {
  font-size: var(--type-h2);
  font-weight: 400;
  line-height: 1.02;
}

h3 {
  font-size: var(--type-h3);
  font-weight: 400;
  line-height: 1.12;
}

h4 {
  font-size: var(--type-h4);
  font-weight: 500;
  line-height: 1.18;
}

h3,
h4 {
  letter-spacing: -.025em;
}

::selection {
  color: var(--white);
  background: var(--orange);
}

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

.icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.line-icon {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

.container {
  width: min(calc(100% - clamp(2.5rem, 7vw, 8rem)), var(--container));
  margin-inline: auto;
}

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

.dark-section {
  position: relative;
  overflow: hidden;
  color: var(--white);
  background: var(--ink);
}

.dark-section > * {
  position: relative;
  z-index: 1;
}

.skip-link {
  position: fixed;
  top: 0;
  left: 1rem;
  z-index: 1000;
  padding: .8rem 1rem;
  color: var(--white);
  background: var(--ink);
  transform: translateY(-120%);
  transition: transform .2s ease;
}

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

.button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  padding: .9rem 1.35rem;
  border: 1px solid transparent;
  font-size: 1rem;
  font-weight: 520;
  letter-spacing: .035em;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s var(--ease);
}

.button:hover {
  transform: translateY(-3px);
}

.header-cta > span,
.button > span,
.menu-more > span,
.menu-feature a > span,
.compact-menu-footer > span,
.portfolio-cta > span {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 9px;
  flex: 0 0 20px;
  color: currentColor;
  font-size: 0;
}

.header-cta > span::before,
.button > span::before,
.menu-more > span::before,
.menu-feature a > span::before,
.compact-menu-footer > span::before,
.portfolio-cta > span::before {
  content: "";
  position: absolute;
  top: 4px;
  right: 0;
  width: 20px;
  height: 1px;
  background: currentColor;
}

.header-cta > span::after,
.button > span::after,
.menu-more > span::after,
.menu-feature a > span::after,
.compact-menu-footer > span::after,
.portfolio-cta > span::after {
  content: "";
  position: absolute;
  top: 1px;
  right: 0;
  width: 7px;
  height: 7px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}

.button-primary {
  color: var(--white);
  background: var(--orange);
}

.button-primary:hover {
  background: var(--orange-dark);
}

.button-secondary {
  color: var(--ink);
  border-color: var(--ink);
  background: rgba(255, 255, 255, .72);
}

.button-secondary:hover {
  color: var(--white);
  background: var(--ink);
}

.image-marker {
  display: block;
  position: absolute;
  top: -6px;
  right: -10px;
  z-index: 4;
  width: 145px;
  height: 102px;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
  pointer-events: none;
}

.image-marker::before,
.image-marker::after {
  content: "";
  position: absolute;
  top: 32px;
  right: -10px;
  width: 160px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 90, 36, .94) 28% 78%, transparent);
  transform-origin: center;
}

.image-marker::before {
  transform: rotate(57deg);
}

.image-marker::after {
  opacity: .72;
  transform: rotate(122deg);
}

.axis-mark {
  position: absolute;
  z-index: 0;
  display: block;
  width: min(34vw, 440px);
  height: 110px;
  opacity: .42;
  pointer-events: none;
}

.axis-mark::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--orange) 0 16%, rgba(239, 91, 45, .72) 54%, transparent 100%);
}

.axis-mark::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 2px;
  height: 100%;
  background: linear-gradient(180deg, transparent, rgba(239, 91, 45, .76) 36%, var(--orange));
}

.axis-mark i {
  position: absolute;
  bottom: -8px;
  left: -8px;
  width: 18px;
  height: 18px;
  background: var(--orange);
}

.axis-mark-line {
  height: 0;
}

.axis-mark-line::after {
  display: none;
}

.portfolio,
.sectors,
.numbers,
.core-fields,
.insights,
.next-step {
  position: relative;
  overflow: hidden;
}

.portfolio > .container,
.numbers > .container,
.core-fields > .container,
.insights > .container,
.next-step > .container,
.contact-form-section > .container {
  position: relative;
  z-index: 1;
}

.sectors-layout {
  position: relative;
  z-index: 1;
}

.axis-mark-portfolio {
  top: 7rem;
  right: -2rem;
  width: min(29vw, 390px);
  height: 92px;
  opacity: .24;
  transform: scaleX(-1);
}

.axis-mark-sectors {
  bottom: 4.25rem;
  left: -1.5rem;
  width: min(25vw, 340px);
  height: 126px;
  opacity: .17;
}

.axis-mark-numbers {
  top: 8rem;
  right: 2.5%;
  width: min(31vw, 420px);
  height: 104px;
  opacity: .36;
  transform: scaleX(-1);
}

.axis-mark-case {
  right: -1rem;
  bottom: 2.3rem;
  z-index: 3;
  width: min(38vw, 500px);
  opacity: .48;
}

.axis-mark-insights {
  right: -2rem;
  bottom: 4rem;
  width: min(31vw, 430px);
  opacity: .17;
  transform: scaleX(-1);
}

.axis-mark-next {
  bottom: 3.5rem;
  left: -1rem;
  width: min(27vw, 350px);
  height: 118px;
  opacity: .3;
}

.axis-mark-contact {
  top: 3.5rem;
  right: 3.5%;
  width: min(24vw, 310px);
  height: 152px;
  opacity: .3;
  transform: scaleX(-1);
}

.section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  align-items: end;
  margin-bottom: clamp(3.5rem, 6vw, 6rem);
}

.section-head > div:last-child {
  display: flex;
  width: 100%;
  min-width: 0;
  grid-column: 1;
  grid-row: 1;
  flex-direction: column;
  align-items: flex-start;
}

.section-head > .heading-line {
  display: none;
}

.section-head::after {
  content: "";
  display: block;
  width: min(340px, 58vw);
  height: 8px;
  grid-column: 1;
  margin-top: 2rem;
  background:
    linear-gradient(var(--orange), var(--orange)) left center / 34px 8px no-repeat,
    linear-gradient(#c8c6bf, #c8c6bf) 44px center / calc(100% - 44px) 1px no-repeat;
}

.section-head-light::after {
  background:
    linear-gradient(var(--orange), var(--orange)) left center / 34px 8px no-repeat,
    linear-gradient(#373734, #373734) 44px center / calc(100% - 44px) 1px no-repeat;
}

.section-head h2 {
  max-width: 1030px;
}

.section-kicker {
  margin-bottom: 1.1rem;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .14em;
  text-align: left;
  text-transform: uppercase;
}

.section-head-light .section-kicker,
.next-step .section-kicker,
.case-feature .section-kicker {
  color: #aaa9a3;
}

.heading-line,
.case-line {
  display: none;
}

.heading-line i,
.heading-line span,
.case-line i,
.case-line span {
  position: absolute;
  top: 28px;
  right: -12px;
  width: 180px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 90, 36, .92) 42% 70%, transparent);
  transform-origin: center;
}

.heading-line i,
.case-line i {
  transform: rotate(57deg);
}

.heading-line span,
.case-line span {
  opacity: .7;
  transform: rotate(123deg);
}

html.js .reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}

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

/* Header */
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  color: var(--ink);
  background: rgba(250, 249, 246, .95);
  border-bottom: 1px solid rgba(17, 17, 15, .14);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  transition: background-color .25s ease, box-shadow .25s ease;
}

.site-header.is-scrolled {
  background: rgba(250, 249, 246, .97);
  box-shadow: 0 9px 30px rgba(17, 17, 15, .07);
}

.header-inner {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr) auto;
  width: min(calc(100% - clamp(2.5rem, 7vw, 8rem)), var(--container));
  height: 82px;
  margin-inline: auto;
  align-items: center;
  gap: clamp(1.5rem, 2.7vw, 3.5rem);
}

.brand {
  display: block;
  width: 152px;
  line-height: 0;
}

.brand img {
  width: 100%;
  height: auto;
  filter: brightness(0);
}

.primary-navigation {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: stretch;
  gap: clamp(1rem, 1.3vw, 1.65rem);
  font-size: 1rem;
  font-weight: 400;
  white-space: nowrap;
  overflow: visible;
}

.nav-item {
  position: relative;
  display: flex;
  height: 100%;
  align-items: stretch;
}

.nav-item > .nav-menu-button,
.nav-item > .nav-direct-link {
  position: relative;
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: .35rem;
  padding: 0;
  color: var(--ink);
  background: transparent;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: -.01em;
}

.nav-item > .nav-menu-button::after,
.nav-item > .nav-direct-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: var(--ink);
  transition: width .25s var(--ease);
}

.nav-item > .nav-menu-button:hover::after,
.nav-item > .nav-menu-button[aria-expanded="true"]::after,
.nav-item > .nav-menu-button:focus-visible::after,
.nav-item > .nav-direct-link:hover::after,
.nav-item > .nav-direct-link:focus-visible::after,
.nav-item > .nav-direct-link.is-active::after {
  width: 100%;
}

.nav-item > .nav-menu-button:focus-visible,
.nav-item > .nav-direct-link:focus-visible,
.submenu-back:focus-visible,
.mobile-category-toggle:focus-visible,
.compact-menu-list a:focus-visible,
.menu-column a:focus-visible,
.menu-toggle:focus-visible {
  outline: 0;
}

.submenu-back:focus-visible,
.mobile-category-toggle:focus-visible,
.compact-menu-list a:focus-visible,
.menu-column a:focus-visible {
  background: rgba(239, 91, 45, .08);
}

.menu-toggle:focus-visible {
  box-shadow: inset 0 0 0 1px rgba(17, 17, 15, .35);
}

.nav-chevron {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: .15rem;
  color: var(--ink);
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  font-size: 0;
  transform: rotate(45deg);
  transition: transform .2s ease;
}

.nav-menu-button[aria-expanded="true"] .nav-chevron {
  top: 2px;
  transform: rotate(225deg);
}

.nav-mobile-icon {
  display: none;
}

.header-cta {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  gap: .8rem;
  padding: .75rem 1.15rem;
  color: var(--white);
  background: var(--ink);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0;
  transition: background-color .25s ease;
}

.header-cta:hover {
  background: #292925;
}

.header-cta b {
  font-weight: inherit;
}

.menu-toggle {
  display: none;
}

.nav-dropdown[hidden] {
  display: none;
}

.nav-dropdown {
  white-space: normal;
}

.services-menu {
  position: fixed;
  top: 82px;
  right: 0;
  left: 0;
  max-height: calc(100svh - 82px);
  overflow-y: auto;
  padding-top: .85rem;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.services-menu-inner {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(250px, 1.15fr);
  gap: 0;
  width: min(calc(100% - clamp(2.5rem, 7vw, 8rem)), var(--container));
  margin-inline: auto;
  padding: clamp(1.15rem, 1.6vw, 1.55rem);
  color: var(--white);
  background: rgba(13, 13, 12, .99);
  box-shadow: 0 26px 70px rgba(0, 0, 0, .18);
}

/* The overview remains available in the mobile drill-down. Hiding it on
   desktop keeps the mega menu's intended four columns + feature card grid. */
.menu-overview-link {
  display: none;
}

.submenu-back,
.mobile-category-toggle {
  display: none;
}

.menu-column {
  min-width: 0;
  padding-inline: clamp(.85rem, 1.15vw, 1.35rem);
  border-right: 1px solid #383835;
}

.menu-column h2 {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: .65rem;
  padding-bottom: .72rem;
  border-bottom: 0;
  color: var(--white);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.25;
  overflow-wrap: normal;
  hyphens: manual;
}

.menu-column h2 .line-icon {
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  color: var(--orange);
  stroke-width: 1.05;
}

.menu-column ul {
  display: grid;
  gap: .48rem;
  margin: .7rem 0 0;
  padding: 0;
  list-style: none;
}

.menu-column a {
  display: flex;
  flex-direction: column;
  gap: .08rem;
  font-size: 1rem;
  color: #eeece6;
  font-weight: 400;
  line-height: 1.3;
  transition: color .2s ease, transform .2s var(--ease);
}

.menu-column a:hover {
  color: var(--orange);
  transform: translateX(4px);
}

.menu-column small {
  color: #97968f;
  font-size: .75rem;
  font-weight: 400;
  letter-spacing: .06em;
  line-height: 1.3;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.menu-column .menu-more {
  display: inline-flex;
  width: fit-content;
  flex-direction: row;
  align-items: center;
  gap: .55rem;
  margin-top: 1.05rem;
  color: var(--orange);
  font-size: 1rem;
  font-weight: 450;
}

.menu-feature {
  display: flex;
  min-height: 278px;
  flex-direction: column;
  position: relative;
  margin-left: clamp(1rem, 1.8vw, 2rem);
  padding: clamp(1.45rem, 2vw, 2.15rem);
  overflow: hidden;
  color: var(--white);
  background:
    linear-gradient(90deg, rgba(9, 9, 8, .96), rgba(9, 9, 8, .58)),
    url("assets/images/sunset-facade.jpg") center / cover no-repeat;
}

.menu-feature > span:not(.image-marker) {
  color: #8f8e88;
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.menu-feature h2 {
  margin-top: auto;
  font-size: clamp(1.55rem, 1.8vw, 2rem);
  font-weight: 460;
  line-height: .98;
}

.menu-feature p {
  margin-top: .8rem;
  color: #b8b6af;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.45;
}

.menu-feature a {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  margin-top: 1.5rem;
  font-size: 1rem;
  font-weight: 480;
}

.menu-feature a span {
  color: var(--orange);
}

.nav-dropdown-compact {
  position: absolute;
  top: calc(100% - 1px);
  left: 50%;
  width: min(350px, calc(100vw - 2rem));
  padding-top: .65rem;
  transform: translateX(-50%);
  white-space: normal;
}

.nav-item-last .nav-dropdown-compact {
  right: 0;
  left: auto;
  transform: none;
}

.compact-menu-shell {
  max-height: calc(100svh - 105px);
  overflow-y: auto;
  padding: 1rem 1.15rem 1.1rem;
  color: var(--white);
  background: rgba(13, 13, 12, .99);
  border: 1px solid rgba(255, 255, 255, .09);
  box-shadow: 0 24px 58px rgba(0, 0, 0, .28);
}

.compact-menu-list {
  display: grid;
  gap: .05rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.compact-menu-list a {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: .8rem;
  align-items: start;
  padding: .67rem .45rem;
  color: #f3f1ec;
  transition: color .2s ease, background-color .2s ease, transform .2s var(--ease);
}

.compact-menu-list a:hover {
  color: var(--orange);
  background: rgba(255, 255, 255, .035);
  transform: translateX(3px);
}

.compact-menu-list svg {
  width: 22px;
  height: 22px;
  margin-top: .04rem;
  fill: none;
  color: var(--orange);
  stroke: currentColor;
  stroke-width: 1.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.compact-menu-list a > span {
  display: grid;
  gap: .13rem;
}

.compact-menu-list strong {
  font-size: 1rem;
  font-weight: 450;
  line-height: 1.22;
}

.compact-menu-list small {
  color: #9e9d97;
  font-size: .75rem;
  font-weight: 400;
  line-height: 1.32;
}

.compact-menu-footer {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: .75rem .45rem 0;
  padding-top: .85rem;
  color: var(--orange);
  border-top: 1px solid #363633;
  font-size: 1rem;
  font-weight: 450;
}

/* Hero */
.hero {
  position: relative;
  min-height: max(720px, 100svh);
  overflow: hidden;
  background: var(--paper);
}

.hero-background,
.hero-gradient {
  position: absolute;
  inset: 0;
}

.hero-background {
  background: url("assets/images/hero-orange-reflection.jpg") center / cover no-repeat;
  filter: contrast(1.02) brightness(.98) saturate(1.02);
  opacity: .84;
  transform: scale(1.02);
  animation: hero-settle 1.6s var(--ease) both;
}

.hero-gradient {
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(243, 242, 238, 1) 0%, rgba(243, 242, 238, .995) 30%, rgba(243, 242, 238, .94) 53%, rgba(243, 242, 238, .42) 76%, rgba(243, 242, 238, .06) 100%),
    linear-gradient(180deg, rgba(243, 242, 238, .44) 0%, transparent 34%, rgba(243, 242, 238, .1) 100%);
}

.hero-inner {
  position: relative;
  z-index: 3;
  display: flex;
  min-height: max(720px, 100svh);
  align-items: center;
  padding-top: 7rem;
  padding-bottom: 9.25rem;
}

.hero-copy {
  display: flex;
  width: min(66%, 950px);
  flex-direction: column;
  align-items: flex-start;
}

.hero h1 {
  font-size: var(--type-hero);
  font-weight: 400;
  line-height: 1.015;
  letter-spacing: -.032em;
  text-wrap: nowrap;
  hyphens: none;
}

.hero-title-accent {
  display: block;
  color: var(--ink);
  white-space: nowrap;
}

.hero-rule {
  display: block;
  width: min(340px, 58vw);
  height: 8px;
  margin-top: 2rem;
  background:
    linear-gradient(var(--orange), var(--orange)) left center / 34px 8px no-repeat,
    linear-gradient(#c8c6bf, #c8c6bf) 44px center / calc(100% - 44px) 1px no-repeat;
}

.hero-subline {
  margin-bottom: 1.35rem;
  color: #5e5d58;
  font-size: clamp(1.25rem, .9vw + .95rem, 1.7rem);
  font-weight: 400;
  letter-spacing: 0;
}

.hero-description {
  max-width: 670px;
  margin-top: 1.65rem;
  color: #1b1b1b;
  font-size: clamp(1.05rem, .4vw + .98rem, 1.3rem);
  line-height: 1.55;
}

.hero-actions {
  display: flex;
  justify-content: flex-start;
  gap: .75rem;
  margin-top: 2.35rem;
}

.hero-graphic {
  position: absolute;
  top: 6.3rem;
  right: 2.2%;
  left: auto;
  z-index: 3;
  width: 350px;
  height: 245px;
  overflow: visible;
  transform: none;
}

.hero-graphic i {
  position: absolute;
  top: 78px;
  right: 0;
  width: 350px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 90, 36, .92) 34% 76%, transparent);
  transform: rotate(58deg);
}

.hero-graphic span {
  position: absolute;
  top: 78px;
  right: 0;
  display: block;
  width: 350px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 90, 36, .64) 34% 76%, transparent);
  transform: rotate(122deg);
}

.hero-marker {
  display: none;
}

@keyframes hero-settle {
  from { opacity: .28; transform: scale(1.08); }
  to { opacity: .84; transform: scale(1.02); }
}

.hero-bracket {
  position: absolute;
  right: 5%;
  bottom: 7%;
  z-index: 3;
  width: 310px;
  height: 190px;
  pointer-events: none;
  transform: scaleX(-1);
  transform-origin: center;
}

.hero-bracket::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--orange), rgba(255, 90, 36, .52) 58%, transparent);
}

.hero-bracket::after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: -8px;
  width: 18px;
  height: 18px;
  background: var(--orange);
}

.hero-bracket i {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 2px;
  height: 100%;
  background: linear-gradient(180deg, transparent, rgba(255, 90, 36, .46) 32%, var(--orange));
}

.hero-bracket span {
  display: none;
}

/* Customer logos */
.logo-strip {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: clamp(180px, 19vw, 320px) 1fr;
  min-height: 116px;
  align-items: stretch;
  overflow: hidden;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #e9e8e3;
  margin-top: -116px;
}

.logo-strip-label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 1rem 2.25rem;
  border-right: 1px solid var(--line);
  color: var(--muted);
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .1em;
  white-space: nowrap;
  text-transform: uppercase;
}

@media (max-width: 1530px) {
  .logo-strip {
    grid-template-columns: minmax(300px, auto) minmax(0, 1fr);
  }

  .logo-strip-label {
    white-space: normal;
  }
}

.logo-window {
  display: flex;
  align-items: center;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.logo-track {
  display: flex;
  width: max-content;
  animation: logo-flow 34s linear infinite;
}

.logo-window:hover .logo-track {
  animation-play-state: paused;
}

.logo-group {
  display: flex;
  align-items: center;
}

.client-logo {
  position: relative;
  display: inline-flex;
  align-items: baseline;
  gap: .4rem;
  margin-inline: clamp(2rem, 4vw, 4.5rem);
  color: #777771;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1rem, 1.3vw, 1.45rem);
  letter-spacing: .08em;
  white-space: nowrap;
}

.client-logo b {
  color: #aaa9a3;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 400;
}

.logo-strip img {
  filter: grayscale(1);
  opacity: .66;
}

@keyframes logo-flow {
  to { transform: translateX(-50%); }
}

/* Portfolio */
.portfolio {
  overflow: hidden;
}

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

.portfolio-card {
  position: relative;
  display: flex;
  min-height: 560px;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(1.45rem, 2vw, 2.2rem);
  overflow: hidden;
  border-left: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
  text-align: left;
  background: linear-gradient(145deg, rgba(255, 255, 255, .018), transparent 52%);
  transition: background-color .35s ease, transform .35s var(--ease);
}

.portfolio-card::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--orange), transparent);
  transition: width .4s var(--ease);
}

.portfolio-card:hover {
  background-color: rgba(255, 255, 255, .035);
}

.portfolio-card:hover::before {
  width: 100%;
}

.portfolio-top {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 1rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid rgba(255, 255, 255, .11);
}

.portfolio-top .line-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  color: var(--orange);
  stroke-width: 1.25;
}

.portfolio-top h3 {
  max-width: none;
  color: var(--white);
  font-size: clamp(1.35rem, 1.35vw, 1.7rem);
  font-weight: 500;
  line-height: 1.08;
}

.portfolio-card .portfolio-summary {
  min-height: 6.4rem;
  margin-top: 1.2rem;
  color: #aaa9a3;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.55;
  transition: color .35s ease;
}

.portfolio-services {
  display: grid;
  width: 100%;
  margin: .4rem 0 0;
  padding: 0;
  list-style: none;
}

.portfolio-services li {
  border-bottom: 1px solid rgba(255, 255, 255, .11);
}

.portfolio-services a {
  position: relative;
  display: block;
  padding: .92rem .35rem .92rem 1.4rem;
  color: #f1efea;
  font-size: clamp(1rem, .25vw + .96rem, 1.125rem);
  font-weight: 400;
  line-height: 1.35;
  transition: color .2s ease, padding-left .25s var(--ease);
}

.portfolio-services a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: .1rem;
  width: 7px;
  height: 7px;
  border-top: 1.5px solid var(--orange);
  border-right: 1.5px solid var(--orange);
  transform: translateY(-50%) rotate(45deg);
}

.portfolio-services a:hover {
  color: var(--orange);
  padding-left: 1.7rem;
}

.portfolio-card .portfolio-cta {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  margin-top: auto;
  padding-top: 1.75rem;
  color: var(--orange);
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.portfolio-card .portfolio-cta:hover {
  color: #ff835b;
}

/* Why */
.why {
  position: relative;
  overflow: hidden;
  background: var(--white);
}

.why > .container,
.team > .container,
.certifications > .container,
.ecosystem > .container {
  position: relative;
  z-index: 1;
}

.axis-mark-why {
  right: -2rem;
  bottom: 4.5rem;
  width: min(36vw, 520px);
  opacity: .2;
}

.why::before {
  content: none;
}

.reason-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.reason-list li {
  position: relative;
  display: grid;
  grid-template-columns: 64px minmax(210px, .72fr) minmax(0, 1.28fr);
  gap: clamp(1.4rem, 3vw, 3.8rem);
  align-items: start;
  padding: clamp(2.4rem, 3.8vw, 4.2rem) clamp(0rem, 1vw, 1rem);
  border-bottom: 1px solid var(--line);
  transition: background-color .25s ease, padding-inline .3s var(--ease);
}

.reason-list li::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: clamp(180px, 25vw, 380px);
  height: 8px;
  background:
    linear-gradient(var(--orange), var(--orange)) left center / 34px 8px no-repeat,
    linear-gradient(var(--line), var(--line)) 44px center / calc(100% - 44px) 1px no-repeat;
  opacity: .86;
}

.reason-list li:nth-child(even)::after {
  width: clamp(130px, 18vw, 280px);
}

.reason-list li:hover {
  padding-inline: clamp(1rem, 2vw, 2.1rem);
  background: var(--paper);
}

.reason-list > li > span {
  color: var(--muted);
  font-size: 1rem;
  letter-spacing: .15em;
  text-align: left;
}

.reason-list h3 {
  max-width: 420px;
  margin: 0;
  font-size: clamp(1.2rem, 1.35vw, 1.55rem);
  font-weight: 400;
  line-height: 1.25;
}

.reason-list p {
  max-width: 780px;
  color: #1b1b1b;
  font-size: clamp(1.45rem, 1.8vw, 1.8rem);
  font-weight: 300;
  line-height: 1.2;
}

/* Sectors */
.sectors {
  overflow: hidden;
  color: var(--ink);
  background: #efeee9;
}

.sectors-layout {
  --sector-inset: max(clamp(1.25rem, 3.5vw, 4rem), calc((100% - var(--container)) / 2));
  display: grid;
  grid-template-columns: minmax(430px, .82fr) minmax(0, 1.58fr);
  gap: clamp(2.5rem, 4vw, 5rem);
  width: calc(100% - var(--sector-inset));
  margin-left: var(--sector-inset);
}

.sectors-intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.compact-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.compact-head h2 {
  font-size: var(--type-h2);
}

.sectors-intro > p {
  max-width: 500px;
  color: var(--muted);
}

.slider-controls {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  margin-top: auto;
  padding-top: 3.5rem;
}

.slider-controls button {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  color: var(--ink);
  border: 1px solid var(--line);
  background: transparent;
  transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}

.slider-controls button:hover {
  color: var(--ink);
  border-color: var(--orange);
  background: var(--orange);
}

.slider-controls span {
  color: var(--muted);
  font-size: 1rem;
  letter-spacing: .12em;
}

.slider-controls b {
  color: var(--ink);
}

.sector-slider {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding-bottom: 1.25rem;
  scrollbar-width: none;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
}

.sector-slider::-webkit-scrollbar {
  display: none;
}

.sector-card {
  flex: 0 0 min(510px, 76%);
  min-height: 610px;
  scroll-snap-align: start;
  color: var(--white);
  border: 1px solid var(--line-dark);
  background: var(--ink-soft);
}

.sector-card figure {
  position: relative;
  height: 265px;
  margin: 0;
  overflow: hidden;
}

.sector-card figure::after,
.insight-card figure::after {
  content: none;
}

.sector-card figure .image-marker,
.insight-card figure .image-marker {
  z-index: 2;
}

.sector-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.02) brightness(.94);
  transition: transform .8s var(--ease), filter .5s ease;
}

.sector-card img.sector-healthcare-ward {
  object-position: center 58%;
}

.sector-card:hover img {
  filter: contrast(1.04) brightness(.98);
  transform: scale(1.045);
}

.sector-card > div {
  display: flex;
  min-height: 340px;
  flex-direction: column;
  align-items: flex-start;
  padding: 2.1rem;
}

.sector-card > div > span {
  color: #77766f;
  font-size: 1rem;
  letter-spacing: .15em;
}

.sector-card h3 {
  margin-top: 1.8rem;
}

.sector-card p {
  margin-top: 1.25rem;
  color: #a8a7a1;
  font-size: 1rem;
}

/* Numbers */
.numbers {
  isolation: isolate;
  padding-block: clamp(4.8rem, 7vw, 7rem);
  background:
    radial-gradient(circle at 15% 18%, rgba(255, 90, 36, .1), transparent 24%),
    #090908;
}

.numbers::after {
  content: none;
}

.numbers .section-head {
  margin-bottom: clamp(2.5rem, 4vw, 4rem);
}

.number-stage {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.15fr .8fr .8fr;
  grid-template-rows: repeat(2, minmax(185px, 1fr));
  gap: .75rem;
  min-height: 470px;
  margin: 0;
}

.number-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  min-width: 0;
  padding: clamp(1.5rem, 2.25vw, 2.4rem);
  overflow: hidden;
  color: var(--white);
  border: 1px solid var(--line-dark);
  background: rgba(24, 24, 22, .94);
}

.number-item-lead {
  grid-column: 1;
  grid-row: 1 / 3;
  background:
    linear-gradient(110deg, rgba(255, 90, 36, .23), transparent 58%),
    rgba(22, 22, 20, .98);
}

.number-item-wide {
  grid-column: 2 / 4;
  grid-row: 1;
}

.number-item-accent {
  color: var(--ink);
  border-color: var(--orange);
  background: var(--orange);
}

.number-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.number-item strong {
  font-family: var(--font-display);
  font-size: clamp(4.1rem, 5.8vw, 6.5rem);
  font-weight: 400;
  letter-spacing: -.085em;
  line-height: .78;
}

.number-item-lead strong {
  color: var(--orange);
  font-size: clamp(6rem, 8.6vw, 9rem);
}

.number-item-wide strong {
  font-size: clamp(4.6rem, 6.1vw, 6.8rem);
}

.number-item-accent strong {
  font-size: clamp(4rem, 5.3vw, 5.8rem);
}

.number-content span {
  max-width: 210px;
  margin-top: .9rem;
  color: #c3c3c3;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .02em;
  line-height: 1.45;
}

.number-item-accent .number-content span {
  color: rgba(17, 17, 15, .78);
}

.number-target {
  content: "";
  position: absolute;
  right: clamp(1.5rem, 4vw, 4rem);
  bottom: clamp(1.5rem, 3vw, 3rem);
  width: 104px;
  aspect-ratio: 1;
  border: 1px solid rgba(255, 90, 36, .62);
}

.number-target::before,
.number-target::after {
  content: "";
  position: absolute;
  background: var(--orange);
}

.number-target::before {
  top: 50%;
  left: -26px;
  width: calc(100% + 52px);
  height: 1px;
}

.number-target::after {
  top: -26px;
  left: 50%;
  width: 1px;
  height: calc(100% + 52px);
}

.number-note {
  position: relative;
  z-index: 1;
  margin-top: 1.2rem;
  color: #7f7e78;
  font-size: 1rem;
  font-weight: 400;
}

/* Team */
.team {
  position: relative;
  overflow: hidden;
  background: var(--white);
}

.team-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  border-top: 1px solid var(--line);
  border-right: 1px solid var(--line);
  background: var(--line);
}

.team-secondary {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  background: var(--line);
}

.person-card {
  position: relative;
  display: grid;
  border-left: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.person-card-lead {
  grid-template-columns: minmax(0, 1.16fr) minmax(390px, .84fr);
  min-height: 630px;
}

.team-secondary .person-card {
  grid-template-columns: minmax(220px, .9fr) minmax(0, 1.1fr);
  min-height: 430px;
}

.portrait-placeholder,
.person-photo {
  position: relative;
  display: grid;
  min-height: 350px;
  place-items: center;
  overflow: hidden;
  color: #7d7b74;
  background:
    repeating-linear-gradient(90deg, rgba(17,17,15,.035) 0 1px, transparent 1px 34px),
    #deddd7;
}

.person-card-lead .portrait-placeholder,
.person-photo-lead {
  min-height: 630px;
}

.person-photo {
  margin: 0;
  background: #d9d7d0;
}

.person-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}

.person-photo-lead img {
  object-position: center 34%;
}

.team-secondary .person-photo {
  min-height: 430px;
}

.team-secondary .person-card:first-child .person-photo img {
  object-position: center 31%;
}

.team-secondary .person-card:last-child .person-photo img {
  object-position: center 28%;
}

.person-photo > .image-marker {
  top: -8px;
  right: -18px;
  z-index: 2;
}

.portrait-placeholder::before {
  content: "";
  position: absolute;
  width: 70%;
  aspect-ratio: 1;
  border: 1px solid rgba(17, 17, 15, .14);
  transform: rotate(45deg);
}

.portrait-placeholder .line-icon {
  width: 74px;
  height: 74px;
  stroke-width: .7;
}

.portrait-placeholder span {
  position: absolute;
  left: 1.4rem;
  bottom: 1.3rem;
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.portrait-placeholder .image-marker {
  top: -8px;
  right: -18px;
}

.person-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(1.5rem, 3vw, 3rem);
  text-align: left;
}

.person-meta {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
}

.person-meta > span {
  color: var(--muted);
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.person-copy h3 {
  margin-top: .9rem;
}

.person-copy p {
  margin-top: 1rem;
  color: var(--muted);
  font-size: 1rem;
}

.person-copy .person-credentials {
  padding-top: 1rem;
  border-top: 1px solid #292927;
  color: #d1cfc8;
  line-height: 1.55;
}

.person-copy .person-cta {
  margin-top: 2rem;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.person-copy .person-cta span {
  color: var(--orange);
}

.linkedin-link {
  display: grid;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  place-items: center;
  margin: 0;
  color: var(--orange);
  border: 1px solid rgba(239, 91, 45, .42);
  background: transparent;
  transition: color .2s ease, background-color .2s ease, transform .25s var(--ease);
}

.linkedin-link .line-icon {
  width: 22px;
  height: 22px;
  fill: currentColor;
  stroke: none;
}

.linkedin-link:hover {
  color: var(--white);
  background: var(--orange);
  transform: translateY(-2px);
}

.person-copy > .linkedin-link {
  margin: auto 0 0 auto;
}

.person-card-lead .person-copy {
  color: var(--white);
  background: #0b0b0a;
}

.person-card-lead .person-meta > span,
.person-card-lead .person-copy p {
  color: #b8b6af;
}

.team-more {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2rem;
  align-items: center;
  min-height: 150px;
  padding: clamp(1.6rem, 2.8vw, 2.8rem) clamp(1.6rem, 3vw, 3.2rem);
  border-left: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.team-more-copy {
  max-width: 760px;
}

.team-more-title {
  margin-bottom: .35rem;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 1.7vw, 1.85rem);
  font-weight: 400;
  line-height: 1.12;
}

.team-more-copy p:last-child {
  color: #1b1b1b;
  font-size: 1rem;
}

.team-avatar-group {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: .55rem;
}

.team-avatar-group img,
.team-avatar-group span {
  width: 72px;
  height: 72px;
  flex: 0 0 72px;
  margin-right: -12px;
  border: 3px solid var(--paper);
  border-radius: 50%;
  object-fit: cover;
  object-position: center 25%;
  background: #dad8d1;
}

.team-avatar-group span {
  display: grid;
  place-items: center;
  margin-right: 0;
  color: var(--ink);
  border-color: var(--white);
  background: var(--white);
  font-size: .86rem;
  font-weight: 500;
}

.axis-mark-team {
  top: 12rem;
  right: -1.5rem;
  width: min(25vw, 360px);
  height: 115px;
  opacity: .2;
  transform: scaleX(-1);
}

/* Featured case */
.case-feature {
  position: relative;
  display: flex;
  min-height: 760px;
  align-items: center;
  overflow: hidden;
  color: var(--white);
  background: var(--ink);
}

.case-feature > img,
.case-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.case-feature > img {
  object-fit: cover;
  object-position: center 48%;
  filter: contrast(1.05) brightness(.72) saturate(.88);
}

.case-overlay {
  z-index: 1;
  background: linear-gradient(90deg, rgba(17,17,15,.94), rgba(17,17,15,.64) 50%, rgba(17,17,15,.18) 100%);
}

.case-feature > .image-marker {
  top: -24px;
  right: 1%;
  z-index: 3;
  width: 260px;
  height: 185px;
}

.case-feature > .image-marker::before,
.case-feature > .image-marker::after {
  top: 58px;
  right: -18px;
  width: 290px;
}

.case-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.case-content .case-line {
  width: 168px;
  align-self: flex-end;
  margin-bottom: 1rem;
}

.case-feature .case-line {
  display: none;
}

.case-content h2,
.case-content > p:not(.section-kicker) {
  max-width: 820px;
}

.case-content > p:not(.section-kicker) {
  margin-top: 1.6rem;
  color: #d0cec7;
}

.case-content .button {
  margin-top: 2.2rem;
}

/* Certifications */
.certifications {
  position: relative;
  overflow: hidden;
  background: var(--white);
}

.axis-mark-certifications {
  bottom: 3.5rem;
  left: -1rem;
  width: min(24vw, 310px);
  height: 80px;
  opacity: .19;
}

.certificate-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.certificate {
  display: grid;
  min-height: 300px;
  grid-template-columns: minmax(180px, .72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: clamp(1.4rem, 2.5vw, 3rem);
  padding: clamp(2rem, 3vw, 3.4rem) clamp(0rem, 2vw, 2.4rem);
  border-bottom: 1px solid var(--line);
  background: transparent;
}

.certificate:nth-child(even) {
  padding-left: clamp(2rem, 3.2vw, 4rem);
  border-left: 1px solid var(--line);
}

.certificate:nth-child(odd) {
  padding-right: clamp(2rem, 3.2vw, 4rem);
}

.certificate-mark {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 210px;
  padding: .75rem;
  color: var(--ink);
  background: transparent;
}

.certificate-mark img {
  width: 100%;
  max-width: 230px;
  max-height: 190px;
  object-fit: contain;
  filter: none;
}

.certificate-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0;
  text-align: left;
}

.certificate p,
.certificate-copy > span {
  color: #1b1b1b;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .04em;
}

.certificate h3 {
  margin-block: .9rem;
  font-size: var(--type-h3);
  font-weight: 400;
  line-height: 1.08;
}

/* Core fields */
.core-layout {
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: clamp(2rem, 5vw, 6rem);
  align-items: stretch;
}

.core-visual {
  position: relative;
  min-height: 700px;
  overflow: hidden;
  border: 1px solid var(--line-dark);
  background: #161614;
}

.core-visual > img,
.core-image-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.core-visual > img {
  object-fit: cover;
  object-position: 54% center;
  filter: brightness(.66) saturate(.9) contrast(1.04);
}

.core-image-overlay {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(14, 14, 13, .12), rgba(14, 14, 13, .62)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 62px);
}

.core-image-overlay::after {
  content: none;
}

.core-visual::before {
  content: none;
}

.core-visual::after {
  content: none;
}

.core-visual > .image-marker {
  top: -8px;
  right: -10px;
  z-index: 4;
}

.axis-mark-core {
  top: 6.5rem;
  right: -1.5rem;
  left: auto;
  width: min(30vw, 410px);
  height: 108px;
  opacity: .3;
  transform: scaleX(-1);
}

.trace-grid {
  position: absolute;
  inset: auto 2.2rem 2.2rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .6rem;
  z-index: 3;
  color: #d0cec7;
  font-size: 1rem;
  letter-spacing: .14em;
  text-align: left;
}

.trace-grid span {
  padding-top: .8rem;
  border-top: 1px solid var(--line-dark);
}

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

.core-item {
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 2rem;
  padding: 2.6rem 0 2.8rem;
  border-bottom: 1px solid var(--line-dark);
}

.core-item > span {
  padding-top: .3rem;
  color: #77766f;
  font-size: 1rem;
  letter-spacing: .15em;
  text-align: left;
}

.core-item > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.core-item p {
  max-width: 690px;
  margin-top: 1.15rem;
  color: #aaa9a3;
}

.core-item a {
  margin-top: 1.3rem;
  color: #d4d2cc;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.core-item a b {
  color: var(--orange);
}

/* Insights */
.insights {
  background: var(--white);
}

.insight-grid {
  display: grid;
  grid-template-columns: 1.45fr repeat(2, 1fr);
  border-top: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

.insight-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  border-left: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.insight-card figure {
  position: relative;
  height: 285px;
  margin: 0;
  overflow: hidden;
}

.insight-card-large figure {
  height: 390px;
}

.insight-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.03) brightness(.94);
  transition: transform .8s var(--ease), filter .45s ease;
}

.insight-card img.insight-image-access {
  object-position: center 62%;
}

.insight-card:hover img {
  filter: contrast(1.04) brightness(.98);
  transform: scale(1.045);
}

.insight-card > div {
  display: flex;
  min-height: 280px;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(1.6rem, 3vw, 3rem);
  text-align: left;
}

.insight-card > div > span {
  color: var(--muted);
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.insight-card h3 {
  margin-top: 1.2rem;
}

.insight-card b {
  margin-top: auto;
  padding-top: 2rem;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.insight-card > div > p {
  margin-top: 1rem;
  color: #1b1b1b;
  font-size: 1rem;
}

.insights-footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 2rem;
}

.insights-all-link {
  display: inline-flex;
  align-items: center;
  gap: .85rem;
  padding: .35rem 0 .65rem;
  border-bottom: 1px solid var(--ink);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: .075em;
  text-transform: uppercase;
  transition: color .2s ease, border-color .2s ease, gap .25s var(--ease);
}

.insights-all-link span {
  color: var(--orange);
  font-size: 1.15rem;
  line-height: 1;
}

.insights-all-link:hover {
  gap: 1.2rem;
  color: var(--orange-dark);
  border-color: var(--orange);
}

.whitepaper-visual {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: .7rem;
  padding: clamp(2rem, 4vw, 4.25rem);
  color: var(--white);
  background:
    linear-gradient(135deg, rgba(255, 90, 36, .22), transparent 38%),
    linear-gradient(135deg, #0e0e0d 0 54%, #181816 54% 100%);
}

.whitepaper-visual::before {
  content: "";
  position: absolute;
  top: -15%;
  right: 10%;
  width: 1px;
  height: 130%;
  background: linear-gradient(transparent, var(--orange) 36% 64%, transparent);
  transform: rotate(37deg);
}

.whitepaper-visual::after {
  content: "";
  position: absolute;
  top: 2rem;
  left: clamp(2rem, 4vw, 4.25rem);
  width: min(220px, 48%);
  height: 8px;
  background:
    linear-gradient(var(--orange), var(--orange)) left center / 34px 8px no-repeat,
    linear-gradient(#4c4b47, #4c4b47) 44px center / calc(100% - 44px) 1px no-repeat;
}

.whitepaper-visual .whitepaper-label {
  position: relative;
  z-index: 1;
  color: #c3c3c3;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.whitepaper-visual strong {
  position: relative;
  z-index: 1;
  font-family: var(--font-display);
  font-size: clamp(4.7rem, 8vw, 8.4rem);
  font-weight: 300;
  letter-spacing: -.045em;
  line-height: .82;
}

.whitepaper-visual i {
  position: relative;
  z-index: 1;
  max-width: 390px;
  color: #d7d5ce;
  font-size: 1rem;
  font-style: normal;
}

.insight-card:hover b {
  color: var(--orange);
}

/* Ecosystem */
.ecosystem {
  position: relative;
  overflow: hidden;
  background: var(--paper);
}

.axis-mark-ecosystem {
  top: 8rem;
  right: -1rem;
  width: min(27vw, 390px);
  opacity: .22;
  transform: scaleX(-1);
}

.ecosystem-map {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  padding: 1px;
  background: var(--line);
}

.ecosystem-item {
  position: relative;
  display: flex;
  min-height: 390px;
  flex-direction: column;
  padding: clamp(1.6rem, 2.7vw, 3rem);
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(255, 90, 36, .045), transparent 42%),
    var(--white);
  transition: box-shadow .3s ease, transform .3s var(--ease);
}

.ecosystem-item,
.ecosystem-item > div:last-child {
  min-width: 0;
}

.ecosystem-item::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--orange), transparent 74%);
  transform: scaleX(.22);
  transform-origin: left;
  transition: transform .35s var(--ease);
}

.ecosystem-item::after {
  content: "";
  position: absolute;
  right: -42px;
  bottom: 18px;
  width: 160px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 90, 36, .72));
  transform: rotate(-48deg);
  transition: width .35s var(--ease), opacity .35s ease;
}

.ecosystem-item:hover {
  z-index: 2;
  box-shadow: 0 24px 54px rgba(17, 17, 15, .11);
  transform: translateY(-4px);
}

.ecosystem-item:hover::before {
  transform: scaleX(1);
}

.ecosystem-item:hover::after {
  width: 240px;
}

.ecosystem-item .line-icon {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  color: var(--orange);
}

.solution-meta {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;
  color: #575650;
}

.solution-meta > span {
  min-width: 0;
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .14em;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.solution-meta > b {
  padding: .35rem .65rem;
  color: var(--orange-dark);
  border: 1px solid rgba(255, 90, 36, .45);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.ecosystem-item > div:last-child {
  display: flex;
  min-height: 0;
  flex-direction: column;
  align-self: stretch;
  flex: 1;
}

.ecosystem-item h3 {
  margin-top: clamp(2rem, 3vw, 3.2rem);
  margin-bottom: 1rem;
  font-size: clamp(2rem, 2.7vw, 3rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.035em;
}

.ecosystem-item p {
  max-width: 650px;
  color: #1b1b1b;
  font-size: 1rem;
}

.ecosystem-item .solution-summary {
  max-width: 720px;
  margin-bottom: 1rem;
  font-size: clamp(1.05rem, .45vw + 1rem, 1.2rem);
  font-weight: 400;
  line-height: 1.45;
}

.ecosystem-link {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  margin-top: auto;
  padding-top: 2.25rem;
  color: var(--orange);
  font-size: 1rem;
  font-weight: 500;
}

.ecosystem-link b {
  font-weight: 400;
  transition: transform .25s var(--ease);
}

.ecosystem-item:hover .ecosystem-link b {
  transform: translate(3px, -2px);
}

.ecosystem .section-intro {
  max-width: 850px;
  margin-top: 1.35rem;
  color: #1b1b1b;
  font-size: 1rem;
}

/* Next step */
.next-step {
  padding-block: clamp(5rem, 8vw, 8.5rem);
  overflow: hidden;
}

.next-step-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(3rem, 7vw, 8rem);
  align-items: center;
}

.assistant-card {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 320px auto;
  min-height: 600px;
  border: 1px solid var(--line-dark);
}

.portrait-placeholder-light,
.person-photo-assistant {
  min-height: 320px;
  color: #aaa9a3;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 32px),
    #1a1a18;
}

.person-photo-assistant {
  background: #171715;
}

.person-photo-assistant img {
  object-position: center;
  filter: brightness(.9) saturate(.9);
}

.portrait-placeholder-light::before {
  border-color: rgba(255,255,255,.16);
}

.assistant-card > div:last-child {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 2rem;
  text-align: left;
}

.assistant-card > div:last-child > span {
  color: #8f8e88;
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.assistant-card h3 {
  margin-top: 1rem;
}

.assistant-card p {
  margin-top: .5rem;
  color: #aaa9a3;
  font-size: 1rem;
}

.assistant-card .assistant-description {
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line-dark);
  color: #cbc9c2;
  line-height: 1.55;
}

.assistant-linkedin {
  margin: 1.5rem 0 0 auto;
  color: var(--orange);
}

.next-step-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.next-step-copy .case-line {
  width: 168px;
  align-self: flex-end;
  margin-bottom: 1rem;
}

.next-step-copy > p:not(.section-kicker) {
  max-width: 690px;
  margin-top: 1.6rem;
  color: #aaa9a3;
}

.next-step-copy .button {
  margin-top: 2.2rem;
}

/* Form */
.contact-form-section {
  position: relative;
  overflow: hidden;
  background: #e9e8e3;
}

.contact-form-section::after {
  content: none;
}

.anchor-alias {
  position: absolute;
  top: -82px;
}

.contact-combined-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(380px, .82fr) minmax(0, 1.18fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: stretch;
}

.contact-person-panel {
  display: grid;
  min-height: 720px;
  grid-template-rows: minmax(390px, 1.15fr) minmax(280px, .85fr);
  color: var(--white);
  background: #10100f;
}

.person-photo-contact {
  min-height: 390px;
  background: #171715;
}

.person-photo-contact img {
  object-position: center 24%;
  filter: brightness(1.06) saturate(.92) contrast(.98);
}

.contact-person-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(1.8rem, 3vw, 3.25rem);
}

.contact-person-copy > span {
  color: #c3c3c3;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.contact-person-copy h3 {
  margin-top: .85rem;
}

.contact-person-copy p {
  margin-top: .75rem;
  color: #c3c3c3;
  font-size: 1rem;
}

.contact-person-copy .direct-contact {
  margin-top: 1.5rem;
}

.contact-person-copy .linkedin-link {
  margin: auto 0 0 auto;
}

.form-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: stretch;
  background: transparent;
}

.form-intro {
  position: relative;
  display: flex;
  min-height: 720px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: clamp(2rem, 4.5vw, 5rem);
  overflow: hidden;
  color: var(--white);
  background: var(--ink);
}

.form-intro::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    linear-gradient(180deg, rgba(11, 11, 10, .34), rgba(11, 11, 10, .94) 82%),
    linear-gradient(125deg, rgba(239, 91, 45, .32), transparent 58%),
    url("assets/images/orange-black-glass.jpg") center / cover no-repeat;
  opacity: .72;
}

.form-intro > * {
  position: relative;
  z-index: 2;
}

.form-index {
  position: absolute;
  top: clamp(2rem, 4vw, 4rem);
  left: clamp(2rem, 4.5vw, 5rem);
  color: #8f8e88;
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.form-intro .heading-line {
  display: block;
  width: 100%;
  height: 8px;
  margin-bottom: 1.7rem;
  background:
    linear-gradient(var(--orange), var(--orange)) left center / 34px 8px no-repeat,
    linear-gradient(#373734, #373734) 44px center / calc(100% - 44px) 1px no-repeat;
}

.form-intro .heading-line i,
.form-intro .heading-line span {
  display: none;
}

.form-intro h2 {
  max-width: 650px;
  font-size: var(--type-h2);
}

.form-intro > p:not(.section-kicker) {
  max-width: 590px;
  margin-top: 1.5rem;
  color: #b8b6af;
}

.direct-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .45rem;
  margin-top: 2.4rem;
  padding-left: 1.1rem;
  border-left: 2px solid var(--orange);
  color: var(--white);
  font-size: 1rem;
  font-weight: 400;
}

.direct-contact a:hover {
  color: var(--orange-dark);
}

.contact-form {
  position: relative;
  display: grid;
  align-content: center;
  gap: .4rem;
  min-height: 720px;
  padding: clamp(2rem, 4.2vw, 4.8rem);
  border: 0;
  background: rgba(255, 255, 255, .62);
}

.form-lead {
  max-width: 680px;
  margin: 0 0 1rem;
  color: #1b1b1b;
  font-size: 1rem;
}

.contact-form::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 24%;
  height: 2px;
  background: var(--orange);
}

.form-topline {
  display: grid;
  grid-template-columns: auto 1fr 14px;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.form-topline i {
  height: 1px;
  background: var(--line);
}

.form-topline b {
  width: 14px;
  height: 14px;
  background: var(--orange);
}

.form-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

.contact-form label {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  padding: 1.25rem 0 1rem;
  color: #3f3f3b;
  border: 0;
  border-bottom: 1px solid #c2c0b9;
  background: transparent;
  font-size: 1rem;
  font-weight: 450;
  letter-spacing: .1em;
  text-align: left;
  text-transform: uppercase;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  border: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: normal;
  text-align: left;
  text-transform: none;
  transition: border-color .2s ease, background-color .2s ease;
}

.contact-form input,
.contact-form select {
  min-height: 46px;
  padding: .45rem 0;
}

.contact-form textarea {
  min-height: 150px;
  padding: .8rem 0;
  resize: vertical;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  border-color: var(--orange);
}

.contact-form label:focus-within {
  border-bottom-color: var(--orange);
  box-shadow: none;
}

.contact-form .consent-field {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: .85rem;
  align-items: start;
  padding: 1.15rem 0 0;
  color: #1b1b1b;
  border-bottom: 0;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.5;
  text-transform: none;
}

.contact-form .consent-field input {
  width: 20px;
  height: 20px;
  min-height: 0;
  margin: .15rem 0 0;
  padding: 0;
  accent-color: var(--orange);
}

.contact-form .consent-field a {
  text-decoration: underline;
  text-decoration-color: rgba(255, 90, 36, .55);
  text-underline-offset: .18em;
}

.contact-form ::placeholder {
  color: #8b8982;
  opacity: 1;
}

.form-footer {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2rem;
  margin-top: 1.2rem;
}

.form-footer p {
  color: var(--muted);
  font-size: 1rem;
  text-align: left;
}

/* Footer */
.site-footer {
  padding-top: clamp(4.5rem, 7vw, 7rem);
  color: #aaa9a3;
  background: #0b0b0a;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.45fr repeat(3, 1fr);
  gap: clamp(2.5rem, 5vw, 6rem);
  padding-bottom: 4.5rem;
}

.footer-company img {
  width: 185px;
  height: auto;
  filter: none;
}

.footer-company p {
  margin-top: 1.8rem;
  font-size: 1rem;
}

.footer-company {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.footer-company > a {
  padding-block: .22rem;
  font-size: 1rem;
}

.footer-grid > div:not(.footer-company) {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}

.footer-grid h2 {
  margin-bottom: 1.25rem;
  color: var(--white);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.footer-grid a {
  padding-block: .3rem;
  font-size: 1rem;
}

.footer-grid a:hover,
.footer-bottom a:hover {
  color: var(--white);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  padding-block: 1.5rem 2rem;
  border-top: 1px solid #292927;
  font-size: 1rem;
}

.footer-bottom div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem;
}

.footer-bottom .footer-circuit-link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  color: #d3d1cb;
}

.footer-bottom .footer-circuit-link::before {
  content: "";
  width: 20px;
  height: 2px;
  background: var(--orange);
}

.footer-bottom .footer-circuit-link span {
  color: var(--orange);
}

/* Unified copy contrast */
.hero-description,
.sectors-intro > p,
.why .reason-list p,
.team-secondary .person-copy p,
.certifications .certificate p,
.certifications .certificate-copy > span,
.ecosystem-item:not(:hover) p,
.contact-form p {
  color: #1b1b1b;
}

.portfolio-card .portfolio-summary,
.sector-card p,
.person-card-lead .person-copy p,
.case-content > p:not(.section-kicker),
.core-item p,
.contact-person-copy p,
.contact-person-copy > span {
  color: #c3c3c3;
}

.menu-column small,
.menu-feature p,
.compact-menu-list small {
  color: #c3c3c3;
}

.site-footer {
  color: #c3c3c3;
}

/* Tablet */
@media (max-width: 1180px) {
  .header-inner {
    grid-template-columns: 150px minmax(0, 1fr) auto;
    gap: 1.25rem;
  }

  .primary-navigation {
    gap: 1rem;
    font-size: 1rem;
  }

  .services-menu-inner {
    padding: .9rem;
  }

  .menu-column {
    padding-inline: .62rem;
  }

  .menu-column h2 {
    font-size: 1rem;
  }

  .menu-column a {
    font-size: 1rem;
  }

  .menu-feature {
    margin-left: .7rem;
    padding: 1.25rem;
  }

  .portfolio-grid,
  .ecosystem-map {
    grid-template-columns: repeat(2, 1fr);
  }

  .portfolio-card {
    min-height: 500px;
  }

  .ecosystem-item {
    min-height: 340px;
  }

  .sectors-layout {
    grid-template-columns: minmax(310px, .8fr) minmax(0, 1.4fr);
  }

  .sector-card {
    flex-basis: 80%;
  }

  .team-layout,
  .next-step-grid {
    grid-template-columns: 1fr;
  }

  .team-secondary {
    grid-template-columns: repeat(2, 1fr);
  }

  .assistant-card {
    max-width: 760px;
  }

  .insight-grid {
    grid-template-columns: 1.2fr 1fr;
  }

  .insight-card:last-child {
    grid-column: 1 / -1;
  }

  .insight-card:last-child {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .insight-card:last-child figure {
    height: 100%;
    min-height: 300px;
  }
}

/* Mobile navigation and layout */
@media (max-width: 1180px) {
  :root {
    --section-space: clamp(5rem, 12vw, 7rem);
  }

  .team-secondary {
    grid-template-columns: 1fr;
  }

  .team-secondary .person-card {
    grid-template-columns: minmax(250px, .8fr) minmax(0, 1.2fr);
  }

  .axis-mark-team,
  .axis-mark-ecosystem {
    opacity: .12;
  }

  .header-inner {
    grid-template-columns: minmax(100px, 1fr) auto auto;
    height: 74px;
    gap: .8rem;
  }

  .site-header {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .brand {
    width: 128px;
  }

  .header-cta {
    min-height: 38px;
    padding: .62rem .8rem;
    font-size: 1rem;
  }

  .menu-toggle {
    display: grid;
    grid-template-columns: 24px auto;
    grid-template-rows: repeat(3, 4px);
    column-gap: .7rem;
    align-items: center;
    padding: .65rem 0 .65rem .35rem;
    background: transparent;
  }

  .menu-toggle span {
    grid-column: 1;
    width: 24px;
    height: 1px;
    background: var(--ink);
    transition: transform .25s ease, opacity .2s ease;
  }

  .menu-toggle b {
    grid-column: 2;
    grid-row: 1 / 4;
    font-size: 1rem;
    font-weight: 450;
    letter-spacing: .04em;
  }

  .menu-toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(5px) rotate(45deg);
  }

  .menu-toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }

  .menu-toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-5px) rotate(-45deg);
  }

  .primary-navigation {
    position: fixed;
    top: 74px;
    right: 0;
    bottom: 0;
    left: auto;
    display: none;
    width: min(90vw, 380px);
    height: auto;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    overflow-y: auto;
    padding: 1rem 1.15rem 3rem;
    color: var(--white);
    background: rgba(14, 14, 13, .995);
    box-shadow: -24px 30px 50px rgba(0, 0, 0, .22);
  }

  .primary-navigation.is-open {
    display: flex;
  }

  .primary-navigation .nav-item {
    display: block;
    height: auto;
  }

  .nav-item > .nav-menu-button,
  .nav-item > .nav-direct-link {
    display: grid;
    grid-template-columns: 23px minmax(0, 1fr) auto;
    gap: .75rem;
    width: 100%;
    min-height: 52px;
    padding: .85rem .15rem;
    color: var(--white);
    border-bottom: 1px solid var(--line-dark);
    font-size: 1rem;
    font-weight: 420;
    text-align: left;
  }

  .nav-item > .nav-direct-link {
    grid-template-columns: 23px minmax(0, 1fr);
  }

  .nav-item > .nav-menu-button::after,
  .nav-item > .nav-direct-link::after {
    display: none;
  }

  .nav-mobile-icon {
    display: block;
    width: 21px;
    height: 21px;
    fill: none;
    stroke: var(--orange);
    stroke-width: 1.25;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .nav-chevron {
    top: 0;
    color: #97958f;
    font-size: 0;
    transform: rotate(-45deg);
  }

  .nav-menu-button[aria-expanded="true"] .nav-chevron {
    top: 0;
    transform: rotate(-45deg);
  }

  .services-menu {
    position: fixed;
    inset: 74px 0 0 auto;
    z-index: 4;
    width: min(94vw, 430px);
    overflow-y: auto;
    padding: 0;
    color: var(--ink);
    background: var(--paper);
    border-left: 1px solid rgba(17, 17, 15, .16);
    box-shadow: -24px 30px 50px rgba(0, 0, 0, .2);
  }

  .services-menu-inner {
    display: block;
    width: 100%;
    min-height: 100%;
    padding: 0 1.25rem 3rem;
    color: var(--ink);
    background: var(--paper);
    box-shadow: none;
  }

  .submenu-back {
    display: flex;
    width: 100%;
    min-height: 58px;
    align-items: center;
    gap: .65rem;
    color: var(--ink);
    border-bottom: 1px solid rgba(17, 17, 15, .17);
    background: transparent;
    font-size: 1rem;
    font-weight: 500;
    text-align: left;
  }

  .submenu-back span {
    font-size: 1.15rem;
  }

  .menu-overview-link {
    display: flex;
    width: 100%;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 0;
    color: var(--orange-dark);
    border-bottom: 1px solid rgba(17, 17, 15, .17);
    font-size: 1rem;
    font-weight: 450;
    line-height: 1.3;
  }

  .menu-overview-link span {
    flex: 0 0 auto;
    font-size: 1.1rem;
  }

  .menu-column {
    padding: 0;
    padding-inline: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(17, 17, 15, .17);
  }

  .mobile-category-toggle {
    display: flex;
    width: 100%;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 0;
    color: var(--ink);
    background: transparent;
    font-size: 1rem;
    font-weight: 440;
    text-align: left;
  }

  .mobile-category-toggle span {
    font-size: 1.2rem;
    font-weight: 300;
    transition: transform .2s ease;
  }

  .menu-column.is-expanded .mobile-category-toggle span {
    transform: rotate(45deg);
  }

  .menu-column-body {
    display: none;
    padding: .15rem 0 1.2rem 1rem;
  }

  .menu-column.is-expanded .menu-column-body {
    display: block;
  }

  .menu-column h2 {
    display: none;
  }

  .menu-column a {
    color: var(--ink);
    font-size: 1rem;
  }

  .menu-column small {
    color: #77756f;
    font-size: .75rem;
  }

  .menu-feature {
    display: none;
  }

  .nav-dropdown-compact {
    position: fixed;
    inset: 74px 0 0 auto;
    z-index: 4;
    width: min(94vw, 430px);
    padding: 0;
    transform: none;
    white-space: normal;
  }

  .compact-menu-shell {
    height: 100%;
    max-height: none;
    padding: 0 1.25rem 3rem;
    color: var(--ink);
    background: var(--paper);
    border: 0;
    border-left: 1px solid rgba(17, 17, 15, .16);
    box-shadow: -24px 30px 50px rgba(0, 0, 0, .2);
  }

  .compact-menu-list {
    gap: 0;
  }

  .compact-menu-list a {
    grid-template-columns: 24px minmax(0, 1fr);
    gap: .8rem;
    min-height: 55px;
    padding: .8rem 0;
    color: var(--ink);
    border-bottom: 1px solid rgba(17, 17, 15, .13);
  }

  .compact-menu-list a:hover {
    color: var(--orange-dark);
    background: transparent;
  }

  .compact-menu-list svg {
    width: 21px;
    height: 21px;
  }

  .compact-menu-list strong {
    font-size: 1rem;
    font-weight: 440;
  }

  .compact-menu-list small {
    color: #6d6c67;
    font-size: .75rem;
  }

  .compact-menu-footer {
    margin: 1rem 0 0;
    color: var(--orange-dark);
    border-top: 0;
    font-size: 1rem;
  }

  .section-head {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .hero,
  .hero-inner {
    min-height: max(720px, 100svh);
  }

  .hero-copy {
    width: 78%;
  }

  .hero-gradient {
    background:
      linear-gradient(90deg, rgba(243, 242, 238, 1) 0%, rgba(243, 242, 238, .98) 52%, rgba(243, 242, 238, .76) 78%, rgba(243, 242, 238, .52) 100%),
      linear-gradient(180deg, rgba(243, 242, 238, .82), transparent 32%, rgba(243,242,238,.18));
  }

  .logo-strip {
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .logo-strip-label {
    min-height: 48px;
    justify-content: flex-start;
    padding: .7rem 1rem;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    white-space: normal;
  }

  .logo-window {
    min-height: 78px;
  }

  .portfolio-grid,
  .ecosystem-map {
    grid-template-columns: repeat(2, 1fr);
  }

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

  .sectors-layout {
    grid-template-columns: 1fr;
    width: min(calc(100% - 2.5rem), var(--container));
    margin-inline: auto;
  }

  .sectors-intro > p {
    max-width: 690px;
  }

  .slider-controls {
    margin-right: auto;
  }

  .sector-card {
    flex-basis: min(500px, 82vw);
  }

  .reason-list li {
    grid-template-columns: 52px minmax(180px, .65fr) minmax(0, 1.35fr);
    gap: 1.4rem;
  }

  .core-layout,
  .form-layout,
  .contact-combined-grid {
    grid-template-columns: 1fr;
  }

  .team-more {
    grid-template-columns: 1fr;
  }

  .team-avatar-group {
    justify-content: flex-start;
  }

  .contact-person-panel {
    grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr);
    grid-template-rows: 1fr;
    min-height: 560px;
  }

  .person-photo-contact {
    min-height: 560px;
  }

  .number-stage {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: minmax(320px, 1.15fr) repeat(2, minmax(185px, 1fr));
  }

  .number-item-lead {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .number-item-wide {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .core-visual {
    min-height: 480px;
  }

  .case-feature {
    min-height: 680px;
  }

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

  .footer-company {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .container,
  .header-inner {
    width: calc(100% - 2.5rem);
  }

  .header-inner {
    grid-template-columns: 104px minmax(0, 1fr) 28px;
    gap: .45rem;
  }

  .brand {
    width: 104px;
  }

  .header-cta {
    min-height: 32px;
    justify-self: end;
    padding: .42rem .55rem;
    font-size: .875rem;
    line-height: 1;
    white-space: nowrap;
  }

  .header-cta b {
    display: none;
  }

  .header-cta > span {
    display: none;
  }

  .menu-toggle {
    grid-template-columns: 24px;
    padding-left: .2rem;
  }

  .menu-toggle b {
    display: none;
  }

  h1 {
    font-size: clamp(2.7rem, 12.4vw, 4.3rem);
    line-height: .91;
  }

  .hero h1 {
    font-size: clamp(1.85rem, 8.7vw, 3.25rem);
    line-height: 1.035;
    letter-spacing: -.035em;
  }

  h2 {
    font-size: var(--type-h2);
  }

  .section-head {
    grid-template-columns: 1fr;
    gap: 0;
    margin-bottom: 3.2rem;
  }

  .heading-line,
  .case-line {
    width: 108px;
    height: 68px;
  }

  .heading-line i,
  .heading-line span,
  .case-line i,
  .case-line span {
    top: 20px;
    right: -14px;
    width: 130px;
  }

  .heading-line span {
    width: 125px;
    height: 1px;
  }

  .button {
    width: 100%;
    padding-inline: .8rem;
  }

  .hero,
  .hero-inner {
    min-height: max(740px, 100svh);
  }

  .hero-background {
    background-position: 63% center;
  }

  .hero-gradient {
    background:
      linear-gradient(90deg, rgba(243,242,238,1) 0%, rgba(243,242,238,.98) 58%, rgba(243,242,238,.62) 100%),
      linear-gradient(180deg, rgba(243,242,238,.82), transparent 36%, rgba(243,242,238,.16));
  }

  .hero-inner {
    align-items: flex-end;
    padding-top: 8rem;
    padding-bottom: 3rem;
  }

  .hero-copy {
    width: 100%;
  }

  .hero-subline {
    margin-bottom: 1.1rem;
    font-size: 1.22rem;
  }

  .hero-description {
    margin-top: 1.7rem;
  }

  .hero-actions {
    width: 100%;
    flex-direction: column;
  }

  .hero-graphic {
    top: 4.6rem;
    right: -.75rem;
    left: auto;
    width: 175px;
    height: 130px;
  }

  .hero-graphic i,
  .hero-graphic span {
    top: 40px;
    right: 0;
    width: 175px;
  }

  .hero-bracket {
    right: 1.25rem;
    bottom: 1.4rem;
    width: 125px;
    height: 82px;
    opacity: .72;
  }

  .hero-bracket i {
    width: 2px;
    height: 100%;
  }

  .hero-bracket span {
    right: 14px;
    bottom: 14px;
    transform: scale(.78);
    transform-origin: right bottom;
  }

  .hero-marker {
    right: 1.25rem;
    bottom: 2rem;
  }

  .logo-strip {
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .logo-strip-label {
    min-height: 48px;
    justify-content: flex-start;
    padding: .7rem 1rem;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    text-align: left;
  }

  .logo-window {
    min-height: 78px;
  }

  .portfolio-grid,
  .ecosystem-map,
  .certificate-grid,
  .team-secondary,
  .insight-grid,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .portfolio-card {
    min-height: 0;
  }

  .portfolio-card .portfolio-summary {
    min-height: 0;
  }

  .portfolio-card .portfolio-cta {
    margin-top: 2rem;
  }

  .ecosystem-item {
    min-height: 340px;
  }

  .solution-meta {
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: start;
  }

  .solution-meta > b {
    grid-column: 2;
    justify-self: start;
  }

  .trace-grid {
    inset: auto 1.25rem 1.25rem;
    grid-template-columns: 1fr;
    gap: .35rem;
    letter-spacing: .08em;
  }

  .ecosystem-item h3 {
    font-size: clamp(2rem, 9vw, 2.65rem);
  }

  .reason-list li {
    grid-template-columns: 44px 1fr;
    min-height: 0;
    padding-block: 2rem;
  }

  .reason-list h3 {
    grid-column: 2;
  }

  .reason-list p {
    grid-column: 1 / -1;
    margin-top: .5rem;
    font-size: clamp(1.25rem, 5vw, 1.5rem);
  }

  .compact-head {
    grid-template-columns: minmax(0, 1fr);
  }

  .compact-head h2 {
    font-size: var(--type-h2);
  }

  .sector-card {
    flex-basis: 86vw;
    min-height: 570px;
  }

  .sector-card figure {
    height: 230px;
  }

  .sector-card > div {
    min-height: 330px;
    padding: 1.5rem;
  }

  .number-stage {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: .8rem;
  }

  .number-item,
  .number-item-lead,
  .number-item-wide,
  .number-item-accent {
    grid-column: 1;
    grid-row: auto;
    min-height: 210px;
  }

  .number-item-lead {
    min-height: 320px;
  }

  .number-item strong,
  .number-item-wide strong {
    font-size: clamp(4.6rem, 24vw, 6.5rem);
  }

  .number-item-lead strong {
    font-size: clamp(7.2rem, 37vw, 10rem);
  }

  .person-card-lead,
  .assistant-card {
    grid-template-columns: 1fr;
  }

  .team-secondary .person-card {
    grid-template-columns: 1fr;
  }

  .person-card-lead .portrait-placeholder,
  .person-card-lead .person-photo,
  .portrait-placeholder-light {
    min-height: 420px;
  }

  .person-card .portrait-placeholder:not(.portrait-placeholder-light),
  .team-secondary .person-photo {
    min-height: 340px;
  }

  .person-copy {
    padding: 1.6rem;
  }

  .team-more {
    padding: 1.6rem;
  }

  .team-avatar-group img,
  .team-avatar-group span {
    width: 58px;
    height: 58px;
    flex-basis: 58px;
  }

  .case-feature > .image-marker {
    top: -16px;
    right: -8%;
    width: 190px;
    height: 132px;
  }

  .case-feature > .image-marker::before,
  .case-feature > .image-marker::after {
    top: 42px;
    width: 205px;
  }

  .axis-mark:not(.axis-mark-case) {
    opacity: .12;
  }

  .axis-mark-core {
    top: 4.5rem;
    right: -1rem;
    left: auto;
    width: 58%;
    height: 64px;
  }

  .case-feature {
    min-height: 650px;
    align-items: flex-end;
    padding-bottom: 4rem;
  }

  .case-overlay {
    background: linear-gradient(180deg, rgba(17,17,15,.25), rgba(17,17,15,.93) 70%, rgba(17,17,15,.98));
  }

  .case-content .case-line {
    width: 100%;
  }

  .certificate,
  .certificate:nth-child(even),
  .certificate:nth-child(odd) {
    grid-template-columns: 1fr;
    min-height: 0;
    gap: .75rem;
    padding: 1.75rem 0 2rem;
    border-left: 0;
  }

  .certificate-mark {
    min-height: 160px;
    justify-content: flex-start;
    padding: 0;
  }

  .certificate-mark img {
    max-width: 220px;
    max-height: 150px;
  }

  .certificate-copy {
    padding: .5rem 0 0;
  }

  .core-visual {
    min-height: 360px;
  }

  .core-item {
    grid-template-columns: 42px 1fr;
    gap: 1rem;
  }

  .insight-card:last-child {
    display: flex;
  }

  .insight-card figure,
  .insight-card-large figure,
  .insight-card:last-child figure {
    height: 260px;
    min-height: 0;
  }

  .form-row {
    grid-template-columns: 1fr;
  }

  .contact-person-panel {
    grid-template-columns: 1fr;
    grid-template-rows: 390px auto;
    min-height: 0;
  }

  .person-photo-contact {
    min-height: 390px;
  }

  .contact-form {
    min-height: 0;
    padding: 2rem 1.25rem;
  }

  .form-footer {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .form-footer p {
    text-align: left;
  }

  .footer-company {
    grid-column: auto;
  }

  .footer-grid > div:not(.footer-company) {
    align-items: flex-start;
    padding-top: 1.5rem;
    border-top: 1px solid #292927;
    text-align: left;
  }

  .footer-grid h2 {
    text-align: left;
  }

  .footer-bottom {
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

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

  .logo-track {
    animation: none;
  }
}

body h1,
body h2,
body h3 {
  font-weight: 400 !important;
}

/* Blog article pages */
.article-page {
  color: #1b1b1b;
  background: var(--paper);
}

.article-main {
  padding-top: 82px;
}

.article-page .primary-navigation {
  gap: clamp(.9rem, 1.15vw, 1.45rem);
}

.article-hero {
  position: relative;
  overflow: hidden;
  padding-block: clamp(4.75rem, 8vw, 8rem);
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(112deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0) 48%),
    var(--paper);
}

.article-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(410px, .92fr);
  align-items: center;
  gap: clamp(3rem, 6vw, 7.5rem);
}

.article-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 860px;
}

.article-back {
  display: inline-flex;
  margin-bottom: clamp(2.5rem, 4vw, 4.5rem);
  align-items: center;
  color: #585752;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .035em;
  transition: color .2s ease, transform .2s ease;
}

.article-back:hover {
  color: var(--ink);
  transform: translateX(-4px);
}

.article-category,
.article-section-label {
  color: #63615c;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.article-category {
  margin-bottom: 1.35rem;
}

.article-hero h1 {
  max-width: 890px;
  font-size: clamp(3.5rem, 5.7vw, 6.4rem);
  line-height: .94;
  letter-spacing: -.055em;
}

.article-deck {
  max-width: 760px;
  margin-top: clamp(1.75rem, 3vw, 2.75rem);
  color: #353431;
  font-size: clamp(1.2rem, 1.35vw, 1.55rem);
  font-weight: 300;
  line-height: 1.5;
}

.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem 1.6rem;
  margin-top: clamp(2rem, 3.5vw, 3.25rem);
  padding-top: 1.35rem;
  border-top: 1px solid var(--line);
  color: #565550;
  font-size: 1rem;
}

.article-meta span {
  position: relative;
}

.article-meta span + span::before {
  content: "";
  position: absolute;
  top: .72em;
  left: -.9rem;
  width: 4px;
  height: 4px;
  background: var(--orange);
}

.article-hero-media {
  position: relative;
  height: clamp(430px, 43vw, 660px);
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(17, 17, 15, .17);
  background: var(--ink);
}

.article-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.04) brightness(.91);
}

.article-hero-media-access img {
  object-position: center 62%;
}

.article-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(17, 17, 15, .08), transparent 48%, rgba(239, 91, 45, .1));
  pointer-events: none;
}

.article-hero-media .image-marker {
  top: -2px;
  right: 0;
  width: 190px;
  height: 135px;
}

.article-hero-media .image-marker::before,
.article-hero-media .image-marker::after {
  width: 205px;
}

.article-axis {
  position: absolute;
  right: -1rem;
  bottom: 2.2rem;
  width: min(31vw, 470px);
  height: 100px;
  opacity: .45;
  pointer-events: none;
}

.article-axis::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(239, 91, 45, .66) 36%, var(--orange));
}

.article-axis::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 100%;
  background: linear-gradient(180deg, transparent, var(--orange));
}

.article-axis i {
  position: absolute;
  right: -7px;
  bottom: -7px;
  width: 15px;
  height: 15px;
  background: var(--orange);
}

.article-layout {
  display: grid;
  grid-template-columns: minmax(220px, 290px) minmax(0, 860px);
  justify-content: center;
  gap: clamp(4rem, 8vw, 9rem);
  padding-block: clamp(6rem, 10vw, 10rem);
}

.article-toc {
  position: sticky;
  top: 118px;
  align-self: start;
  padding-top: .45rem;
}

.article-toc > p {
  margin-bottom: 1.4rem;
  color: #55544f;
  font-size: 1rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.article-toc ol {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
  counter-reset: article-toc;
}

.article-toc li {
  counter-increment: article-toc;
  border-bottom: 1px solid var(--line);
}

.article-toc a {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: .75rem;
  padding: 1rem 0;
  color: #3f3e3a;
  font-size: 1rem;
  line-height: 1.45;
  transition: color .2s ease, padding-left .2s ease;
}

.article-toc a::before {
  content: counter(article-toc, decimal-leading-zero);
  color: var(--orange);
  font-family: var(--font-display);
  font-size: .92rem;
}

.article-toc a:hover {
  padding-left: .35rem;
  color: var(--ink);
}

.article-content {
  min-width: 0;
}

.article-content section {
  scroll-margin-top: 118px;
}

.article-content section + section {
  margin-top: clamp(5.5rem, 9vw, 8.5rem);
  padding-top: clamp(3.5rem, 5vw, 5rem);
  border-top: 1px solid var(--line);
}

.article-content p,
.article-content li {
  font-size: clamp(1rem, .18vw + .97rem, 1.125rem);
  font-weight: 400;
  line-height: 1.8;
}

.article-content p + p {
  margin-top: 1.4rem;
}

.article-content .article-lead {
  margin-bottom: 2rem;
  font-size: clamp(1.3rem, 1.15vw, 1.55rem);
  font-weight: 300;
  line-height: 1.62;
  letter-spacing: -.015em;
}

.article-content h2 {
  max-width: 820px;
  margin: .8rem 0 2rem;
  font-size: clamp(2.35rem, 3.6vw, 4rem);
  line-height: 1.02;
}

.article-content h3 {
  margin: 3rem 0 1rem;
  font-size: clamp(1.5rem, 1.85vw, 2rem);
  line-height: 1.18;
}

.article-callout {
  position: relative;
  margin-block: clamp(3rem, 5vw, 4.5rem);
  padding: clamp(2.2rem, 4vw, 3.6rem);
  overflow: hidden;
  color: var(--white);
  background: var(--ink);
}

.article-callout::before,
.article-callout::after {
  content: "";
  position: absolute;
  top: 10px;
  right: -35px;
  width: 190px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--orange), transparent);
  transform-origin: center;
}

.article-callout::before {
  transform: rotate(57deg);
}

.article-callout::after {
  opacity: .65;
  transform: rotate(123deg);
}

.article-callout > span {
  display: block;
  margin-bottom: 1.2rem;
  color: #c3c3c3;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.article-callout p {
  position: relative;
  z-index: 1;
  max-width: 700px;
  color: var(--white);
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 2.6vw, 2.8rem);
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}

.article-domain-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-block: 2.6rem;
  border-top: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

.article-domain-grid span {
  display: flex;
  min-height: 82px;
  align-items: center;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: rgba(255, 255, 255, .46);
  font-size: 1rem;
  line-height: 1.35;
}

.article-role-grid,
.article-standard-grid,
.article-principles,
.article-implementation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-block: 2.7rem;
  border-top: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

.article-role-grid > div,
.article-standard-grid > div,
.article-principles > div,
.article-implementation > div {
  padding: clamp(1.6rem, 3vw, 2.5rem);
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: rgba(255, 255, 255, .45);
}

.article-role-grid span,
.article-standard-grid span,
.article-principles span,
.article-implementation span {
  display: block;
  margin-bottom: 1.4rem;
  color: var(--orange);
  font-family: var(--font-display);
  font-size: 1rem;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.article-role-grid h3,
.article-standard-grid h3,
.article-principles h3,
.article-implementation h3 {
  margin: 0 0 .9rem;
  font-size: clamp(1.35rem, 1.65vw, 1.75rem);
}

.article-role-grid p,
.article-standard-grid p,
.article-principles p,
.article-implementation p {
  margin: 0;
  color: #44433f;
  font-size: 1rem;
  line-height: 1.65;
}

.article-maturity {
  margin-top: 3rem;
  padding: clamp(2rem, 4vw, 3.2rem);
  color: var(--white);
  background: #171715;
}

.article-maturity > p {
  margin-bottom: 1.4rem;
  color: #c3c3c3;
  font-size: 1rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.article-maturity ol {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: maturity;
}

.article-maturity li {
  display: grid;
  grid-template-columns: minmax(120px, .45fr) 1fr;
  gap: 1.5rem;
  padding: 1rem 0;
  border-top: 1px solid #353532;
}

.article-maturity strong,
.article-maturity span {
  font-size: 1rem;
  font-weight: 400;
}

.article-maturity strong {
  color: var(--white);
}

.article-maturity span {
  color: #c3c3c3;
}

.article-steps,
.article-fields {
  margin: 2.6rem 0 0;
  padding: 0;
  list-style: none;
  counter-reset: article-step;
}

.article-steps li,
.article-fields li {
  position: relative;
  counter-increment: article-step;
}

.article-steps li {
  display: grid;
  grid-template-columns: 75px 1fr;
  min-height: 128px;
  padding: 1.6rem 0;
  border-top: 1px solid var(--line);
}

.article-steps li:last-child {
  border-bottom: 1px solid var(--line);
}

.article-steps li::before,
.article-fields li::before {
  content: counter(article-step, decimal-leading-zero);
  color: var(--orange);
  font-family: var(--font-display);
  font-size: 1.1rem;
}

.article-steps h3 {
  margin: 0 0 .65rem;
  font-size: clamp(1.45rem, 1.8vw, 1.85rem);
}

.article-steps p {
  margin: 0;
}

.article-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 3rem;
  border-top: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

.article-fields li {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 1rem;
  min-height: 220px;
  padding: clamp(1.5rem, 2.8vw, 2.25rem);
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: rgba(255, 255, 255, .4);
}

.article-fields h3 {
  margin: 0 0 .8rem;
  font-size: clamp(1.3rem, 1.55vw, 1.65rem);
}

.article-fields p {
  margin: 0;
  color: #44433f;
  font-size: 1rem;
  line-height: 1.65;
}

.article-author {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 2rem;
  margin-top: clamp(5rem, 8vw, 7rem);
  padding: 2rem 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.article-author > span {
  color: #65645f;
  font-size: 1rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.article-author strong {
  display: block;
  margin-bottom: .45rem;
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 400;
}

.article-author p {
  max-width: 620px;
  color: #55544f;
  font-size: 1rem;
  line-height: 1.65;
}

.article-related {
  padding-block: clamp(5.5rem, 9vw, 8.5rem);
  border-top: 1px solid var(--line);
  background: var(--white);
}

.article-related-grid {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(440px, 1.15fr);
  align-items: stretch;
  gap: clamp(3rem, 7vw, 8rem);
}

.article-related-grid > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.article-related h2 {
  max-width: 700px;
  margin-bottom: 2.4rem;
  font-size: clamp(2.4rem, 3.8vw, 4.2rem);
}

.article-related-card {
  position: relative;
  display: block;
  min-height: 420px;
  overflow: hidden;
  color: var(--white);
  background: var(--ink);
}

.article-related-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 34%, rgba(9, 9, 8, .88));
}

.article-related-card img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  filter: brightness(.78) contrast(1.06);
  transition: transform .8s var(--ease), filter .4s ease;
}

.article-related-card:hover img {
  filter: brightness(.85) contrast(1.06);
  transform: scale(1.035);
}

.article-related-card span {
  position: absolute;
  right: 2rem;
  bottom: 1.8rem;
  left: 2rem;
  z-index: 1;
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 2.4vw, 2.6rem);
  font-weight: 300;
  line-height: 1.12;
}

.article-cta {
  padding-block: clamp(5rem, 8vw, 8rem);
}

.article-cta-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(350px, .65fr);
  align-items: end;
  gap: clamp(3rem, 8vw, 9rem);
}

.article-cta h2 {
  max-width: 900px;
}

.article-cta-inner > div:last-child {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
}

.article-cta-inner > div:last-child p {
  color: #c3c3c3;
  line-height: 1.7;
}

.article-axis-light {
  bottom: 1.75rem;
  opacity: .26;
}

@media (max-width: 1180px) {
  .article-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(340px, .8fr);
    gap: 3rem;
  }

  .article-layout {
    grid-template-columns: 220px minmax(0, 760px);
    gap: 4rem;
  }

  .article-related-grid {
    grid-template-columns: minmax(0, .8fr) minmax(380px, 1fr);
    gap: 3rem;
  }
}

@media (max-width: 1180px) {
  .article-main {
    padding-top: 74px;
  }

  .article-hero-grid,
  .article-related-grid,
  .article-cta-inner {
    grid-template-columns: 1fr;
  }

  .article-hero-copy {
    max-width: 760px;
  }

  .article-hero-media {
    height: min(70vw, 560px);
  }

  .article-layout {
    grid-template-columns: 1fr;
    gap: 4rem;
  }

  .article-toc {
    position: static;
    width: min(100%, 620px);
  }

  .article-related-card {
    min-height: 380px;
  }

  .article-cta-inner > div:last-child {
    max-width: 680px;
  }
}

@media (max-width: 900px) {

  .article-hero-grid,
  .article-related-grid,
  .article-cta-inner {
    grid-template-columns: 1fr;
  }

  .article-hero-copy {
    max-width: 760px;
  }

  .article-hero-media {
    height: min(70vw, 560px);
  }

  .article-layout {
    grid-template-columns: 1fr;
    gap: 4rem;
  }

  .article-toc {
    position: static;
    width: min(100%, 620px);
  }

  .article-related-card {
    min-height: 380px;
  }

  .article-cta-inner > div:last-child {
    max-width: 680px;
  }
}

@media (max-width: 640px) {
  .article-hero {
    padding-block: 3.5rem 4.5rem;
  }

  .article-back {
    margin-bottom: 2.5rem;
  }

  .article-hero h1 {
    font-size: clamp(2.7rem, 13vw, 4.1rem);
    line-height: .98;
  }

  .article-deck {
    font-size: 1.15rem;
  }

  .article-meta {
    flex-direction: column;
    gap: .4rem;
  }

  .article-meta span + span::before {
    display: none;
  }

  .article-hero-media {
    height: 92vw;
    max-height: 510px;
  }

  .article-axis {
    width: 58vw;
    opacity: .28;
  }

  .article-layout {
    padding-block: 5rem;
  }

  .article-content section + section {
    margin-top: 4.75rem;
    padding-top: 3rem;
  }

  .article-content h2 {
    font-size: clamp(2.05rem, 10vw, 3rem);
  }

  .article-domain-grid,
  .article-role-grid,
  .article-standard-grid,
  .article-principles,
  .article-implementation,
  .article-fields {
    grid-template-columns: 1fr;
  }

  .article-domain-grid span {
    min-height: 68px;
  }

  .article-maturity li {
    grid-template-columns: 1fr;
    gap: .25rem;
  }

  .article-steps li {
    grid-template-columns: 52px 1fr;
  }

  .article-fields li {
    min-height: 0;
  }

  .article-author {
    grid-template-columns: 1fr;
    gap: .75rem;
  }

  .article-related-card,
  .article-related-card img {
    min-height: 330px;
  }

  .article-related-card span {
    right: 1.25rem;
    bottom: 1.25rem;
    left: 1.25rem;
  }
}
