:root {
  --motion-instant: 120ms;
  --motion-fast: 220ms;
  --motion-base: 420ms;
  --motion-panel: 520ms;
  --motion-reveal: 720ms;
  --motion-feature: 960ms;
  --motion-signature: 1150ms;
  --motion-ease-out: cubic-bezier(.22, 1, .36, 1);
  --motion-ease-emphasis: cubic-bezier(.16, 1, .3, 1);
  --motion-ease-in-out: cubic-bezier(.65, 0, .35, 1);
}

html.menu-open,
body.menu-open {
  overflow: hidden;
}

body.menu-open {
  position: fixed;
  right: 0;
  left: 0;
  width: 100%;
}

/* Progressive enhancement: content is visible until the engine is ready. */
.reveal,
.hero-title .line > span {
  opacity: 1;
  transform: none;
}

/* Universal viewport reveal engine. Pages opt in through data-reveal only. */
[data-reveal] {
  --reveal-y: 22px;
  --reveal-blur: 4px;
}

[data-reveal-part] {
  --reveal-y: 16px;
  --reveal-blur: 2px;
}

[data-reveal="eyebrow"],
[data-reveal-part="eyebrow"] {
  --reveal-y: 14px;
  --reveal-blur: 2px;
}

[data-reveal="title"],
[data-reveal-part="title"] {
  --reveal-y: 26px;
  --reveal-blur: 6px;
}

[data-reveal="text"],
[data-reveal-part="text"] {
  --reveal-y: 16px;
  --reveal-blur: 2px;
}

[data-reveal="card"],
[data-reveal="metric"] {
  --reveal-y: 24px;
  --reveal-blur: 4px;
}

[data-reveal="block"] {
  --reveal-y: 26px;
  --reveal-blur: 4px;
}

.motion-ready [data-reveal]:not([data-reveal-complete]) {
  opacity: 0;
  filter: blur(var(--reveal-blur));
  transform: translate3d(0, var(--reveal-y), 0);
  will-change: opacity, transform, filter;
}

/* Directional modifier for horizontal editorial rows. */
.motion-ready [data-reveal="row-x"]:not([data-reveal-complete]) {
  opacity: 1;
  filter: none;
  transform: none;
  will-change: auto;
}

.motion-ready [data-reveal="row-x"]:not([data-reveal-complete]) > * {
  opacity: 0;
  filter: blur(12px);
  transform: translate3d(38px, 0, 0);
  will-change: opacity, transform, filter;
}

.motion-ready [data-reveal-sequence]:not([data-reveal-complete]) > :is(article, li) {
  opacity: 0;
  filter: blur(12px);
  transform: translate3d(38px, 0, 0);
  will-change: opacity, transform, filter;
}

@media (max-width: 900px) {
  .motion-ready [data-reveal="row-x"]:not([data-reveal-complete]) > *,
  .motion-ready [data-reveal-sequence]:not([data-reveal-complete]) > :is(article, li) {
    transform: translate3d(20px, 0, 0);
  }

  .motion-ready .performance-page .process-register [data-reveal="row-x"]:not([data-reveal-complete]) > * {
    transform: translate3d(0, 20px, 0);
  }
}

.motion-ready [data-reveal-group]:not([data-reveal-complete]) [data-reveal-part] {
  opacity: 0;
  filter: blur(var(--reveal-blur));
  transform: translate3d(0, var(--reveal-y), 0);
  will-change: opacity, transform, filter;
}

.motion-ready [data-motion="hero-stitch"]:not([data-motion-complete]) .hero-title .line > span {
  transform: translate3d(var(--stitch-x, 0), 108%, 0);
  will-change: transform;
}

.motion-ready [data-motion="hero-stitch"]:not([data-motion-complete]) .hero-title .line:first-child > span {
  --stitch-x: -.75ch;
}

.motion-ready [data-motion="hero-stitch"]:not([data-motion-complete]) .hero-title .line:nth-child(2) > span {
  --stitch-x: .75ch;
}

.motion-ready [data-motion="hero-stitch"]:not([data-motion-complete]) .eyebrow,
.motion-ready [data-motion="hero-stitch"]:not([data-motion-complete]) .hero-bottom {
  opacity: 0;
  transform: translate3d(0, 20px, 0);
  will-change: transform, opacity;
}

.pain,
.service {
  position: relative;
}

.motion-rule {
  position: absolute !important;
  z-index: 2 !important;
  top: -1px;
  right: 0;
  left: 0;
  display: block;
  height: 1px;
  background: #c8c6bd;
  pointer-events: none;
  transform-origin: left center;
}

.service .motion-rule {
  background: #cac8c0;
}

.motion-ready [data-motion="rows"]:not([data-motion-complete]) > .pain,
.motion-ready [data-motion="rows"]:not([data-motion-complete]) > .service {
  border-top-color: transparent;
}

.motion-ready [data-motion="rows"]:not([data-motion-complete]) .motion-rule {
  transform: scaleX(0);
  will-change: transform;
}

.motion-ready [data-motion="rows"]:not([data-motion-complete]) > .pain > :not(.motion-rule),
.motion-ready [data-motion="rows"]:not([data-motion-complete]) > .service > :not(.motion-rule) {
  opacity: 0;
  transform: translate3d(0, 12px, 0);
  will-change: transform, opacity;
}

[data-motion="rows"][data-motion-complete] .motion-rule {
  opacity: 0;
}

.motion-ready [data-motion="metrics"] .result-card:not([data-motion-complete]) {
  opacity: 0;
  transform: translate3d(0, 16px, 0);
  will-change: transform, opacity;
}

/* M02: semantic line groups reveal inside stable masks; the H2 remains intact. */
.motion-heading-line {
  display: block;
  overflow: clip;
  padding-bottom: .08em;
  margin-bottom: -.08em;
  color: inherit !important;
}

.motion-heading-line.is-muted,
.motion-heading-line.is-muted .motion-heading-text {
  color: #9b9990 !important;
}

.section-heading.light .motion-heading-line.is-muted,
.section-heading.light .motion-heading-line.is-muted .motion-heading-text {
  color: #77766f !important;
}

.motion-heading-text {
  display: block;
  color: inherit !important;
}

.motion-ready [data-motion="heading"]:not([data-motion-complete]) .kicker {
  opacity: 0;
  transform: translate3d(0, 12px, 0);
  will-change: transform, opacity;
}

.motion-ready [data-motion="heading"]:not([data-motion-complete]) .motion-heading-text {
  transform: translate3d(0, 108%, 0);
  will-change: transform;
}

/* M05: the existing growth diagram resolves from its geometry to one system. */
.approach-diagram {
  --system-ring-scale: 1;
  --system-ring-opacity: 1;
}

.approach-diagram::before,
.approach-diagram::after {
  opacity: var(--system-ring-opacity);
  transform: scale(var(--system-ring-scale));
  transform-origin: center;
}

.diagram-core {
  --system-core-scale: 1;
  transform: translate(-50%, -50%) scale(var(--system-core-scale));
}

.diagram-item {
  transform: translate3d(var(--system-label-x, 0), var(--system-label-y, 0), 0);
}

.motion-ready [data-motion="system"]:not([data-motion-complete]) {
  --system-ring-scale: .88;
  --system-ring-opacity: .12;
}

.motion-ready [data-motion="system"]:not([data-motion-complete]) .diagram-core {
  --system-core-scale: .82;
  opacity: .28;
  will-change: transform, opacity;
}

.motion-ready [data-motion="system"]:not([data-motion-complete]) .diagram-item {
  opacity: .42;
  will-change: transform, opacity;
}

.motion-ready [data-motion="system"]:not([data-motion-complete]) .item-1 { --system-label-y: 20px; }
.motion-ready [data-motion="system"]:not([data-motion-complete]) .item-2 { --system-label-x: -20px; }
.motion-ready [data-motion="system"]:not([data-motion-complete]) .item-3 { --system-label-x: -15px; --system-label-y: -15px; }
.motion-ready [data-motion="system"]:not([data-motion-complete]) .item-4 { --system-label-x: 15px; --system-label-y: -15px; }
.motion-ready [data-motion="system"]:not([data-motion-complete]) .item-5 { --system-label-x: 20px; }

/* M07: one compact scroll-mapped statement, never a layout animation. */
@media (min-width: 901px) {
  .motion-ready [data-motion="statement"]:not([data-motion-complete]) {
    opacity: .78;
    transform: translate3d(-3vw, 0, 0) scale(.988);
    transform-origin: right center;
    will-change: transform, opacity;
  }
}

/* M08: the seam opens the existing yellow action plane without a viewport wipe. */
.contact {
  --handoff-plane-scale: 0;
  --handoff-line-scale: 0;
  --handoff-line-opacity: 0;
  position: relative;
  overflow: clip;
}

.contact::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background: var(--yellow);
  pointer-events: none;
  transform: scaleY(var(--handoff-plane-scale));
  transform-origin: center top;
}

.contact::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  height: 2px;
  background: #111;
  opacity: var(--handoff-line-opacity);
  pointer-events: none;
  transform: scaleX(var(--handoff-line-scale));
  transform-origin: left center;
}

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

.motion-ready [data-motion="handoff"]:not([data-motion-complete]) {
  background-color: transparent;
  --handoff-line-opacity: 1;
}

.motion-ready [data-motion="handoff"]:not([data-motion-complete]) .contact-layout {
  opacity: 0;
  will-change: opacity;
}

.site-header {
  transition-duration: var(--motion-base);
  transition-timing-function: var(--motion-ease-out);
}

.desktop-nav a,
.header-phone,
.footer-up,
.text-link,
.button,
.pain i,
.service i {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--motion-ease-out);
}

.button {
  transition-property: color, background-color, border-color, transform;
}

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

.button:active {
  transform: translateY(1px);
  transition-duration: var(--motion-instant);
}

.text-link span,
.button span {
  display: inline-block;
  transition: transform var(--motion-fast) var(--motion-ease-out);
}

.text-link:hover span,
.text-link:focus-visible span,
.button:hover span,
.button:focus-visible span {
  transform: translate3d(3px, -3px, 0);
}

.service::before {
  display: none;
}

.service:hover p {
  color: #686760;
}

.service:hover i {
  transform: none;
}

.scroll-cue span {
  width: 56px;
  transform: scaleX(.607);
  transform-origin: left center;
  animation: motion-cue 1700ms var(--motion-ease-in-out) infinite;
}

@keyframes motion-cue {
  50% {
    transform: scaleX(1);
  }
}

:where(a, button, input, [tabindex]):focus-visible {
  outline: 2px solid var(--yellow);
  outline-offset: 4px;
}

.contact-copy a:focus-visible {
  outline-color: #111;
}

.button-primary:focus-visible,
.contact-form :where(input, button):focus-visible {
  outline-color: #fff;
}

.contact-form label:focus-within {
  border-bottom-color: var(--yellow);
}

@media (max-width: 900px) {
  .motion-ready [data-motion="hero-stitch"]:not([data-motion-complete]) .hero-title .line > span {
    --stitch-x: 0;
  }

  .motion-ready [data-motion="heading"]:not([data-motion-complete]) .motion-heading-text {
    transform: translate3d(0, 104%, 0);
  }

  .motion-ready [data-motion="system"]:not([data-motion-complete]) .diagram-item {
    --system-label-x: 0;
    --system-label-y: 12px;
    opacity: .38;
  }

  .motion-ready [data-motion="statement"]:not([data-motion-complete]) {
    opacity: .86;
    transform: translate3d(-10px, 0, 0) scale(.992);
    transform-origin: left center;
    will-change: transform, opacity;
  }

  .menu-toggle span {
    transform-origin: center;
    transition: transform var(--motion-base) var(--motion-ease-in-out);
  }

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

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

  .mobile-menu {
    visibility: hidden;
    height: calc(100dvh - 72px);
    bottom: auto;
    transition: transform var(--motion-panel) var(--motion-ease-in-out), visibility 0s linear var(--motion-panel);
  }

  body.menu-open .site-header {
    background: #0a0a0a;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .mobile-menu.open {
    visibility: visible;
    transition-delay: 0s;
  }

  .mobile-menu nav a,
  .mobile-menu > a {
    opacity: 0;
    transform: translate3d(12px, 0, 0);
    transition: opacity var(--motion-base) var(--motion-ease-out), transform var(--motion-base) var(--motion-ease-out);
  }

  .mobile-menu.open nav a,
  .mobile-menu.open > a {
    opacity: 1;
    transform: none;
  }

  .mobile-menu.open nav a:nth-child(1) { transition-delay: 250ms; }
  .mobile-menu.open nav a:nth-child(2) { transition-delay: 290ms; }
  .mobile-menu.open nav a:nth-child(3) { transition-delay: 330ms; }
  .mobile-menu.open nav a:nth-child(4) { transition-delay: 370ms; }
  .mobile-menu.open > a { transition-delay: 410ms; }
}

@media (hover: none) {
  .button-primary:hover,
  .result-card:hover,
  .industry-cloud span:hover {
    transform: none;
  }
}

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

  .motion-ready [data-reveal],
  .motion-ready [data-reveal-group] [data-reveal-part] {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }

  .orb-one,
  .scroll-cue span {
    animation: none !important;
    transform: none;
  }

  .mobile-menu,
  .mobile-menu nav a,
  .mobile-menu > a,
  .menu-toggle span {
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }

  .text-link:hover span,
  .text-link:focus-visible span,
  .button:hover span,
  .button:focus-visible span,
  .button-primary:hover,
  .button:active,
  .service:hover i {
    transform: none;
  }
}