.landing-page { background: #fff; color: #193538; }

.landing-page main { min-height: 0; }

.landing-intro {
  position: relative;
  display: grid;
  min-height: calc(100svh - var(--header-height));
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  background: #102f32;
  color: #f5fbf9;
}
.landing-intro::before,
.landing-intro::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
}
.landing-intro::before {
  z-index: -2;
  background:
    radial-gradient(circle at 50% 46%, rgb(159 226 215 / 16%), transparent 31rem),
    radial-gradient(circle at 15% 90%, rgb(13 110 110 / 10%), transparent 25rem),
    linear-gradient(135deg, #12383a, #0b292d 72%);
}
.landing-intro::after {
  z-index: -1;
  opacity: .3;
  background-image:
    linear-gradient(rgb(159 226 215 / 7%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(159 226 215 / 7%) 1px, transparent 1px);
  background-size: 5rem 5rem;
  mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 78%, transparent);
}
.landing-intro__visual {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
}
.landing-intro__network {
  width: min(100%, 92rem);
  height: auto;
  overflow: visible;
  opacity: .95;
}
.landing-intro__rings ellipse {
  fill: none;
  stroke: rgb(159 226 215 / 18%);
  stroke-dasharray: 2 17;
  stroke-linecap: round;
  transform-box: fill-box;
  transform-origin: center;
  animation: intro-ring-drift 18s ease-in-out infinite alternate;
}
.landing-intro__rings ellipse:nth-child(2) { animation-delay: -4s; opacity: .8; }
.landing-intro__rings ellipse:nth-child(3) { animation-delay: -8s; opacity: .65; }
.landing-intro__paths path {
  fill: none;
  stroke: #9fe2d7;
  stroke-width: 1.5;
  stroke-dasharray: 1 19;
  stroke-linecap: round;
  opacity: .6;
  animation: intro-path-flow 11s linear infinite;
}
.landing-intro__paths path:nth-child(2) {
  stroke: #e9a596;
  animation-duration: 14s;
  animation-delay: -5s;
  opacity: .42;
}
.landing-intro__card {
  fill: rgb(245 251 249 / 3%);
  stroke: rgb(245 251 249 / 28%);
  stroke-width: 1;
  transform-box: fill-box;
  transform-origin: center;
  animation: intro-card-float 9s ease-in-out infinite alternate;
}
.landing-intro__card path {
  fill: none;
  stroke: rgb(245 251 249 / 42%);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 4 8;
  animation: intro-card-scan 5s linear infinite;
}
.landing-intro__card--two { animation-delay: -3s; animation-duration: 11s; }
.landing-intro__card--three { animation-delay: -6s; animation-duration: 10s; }
.landing-intro__nodes circle {
  fill: #9fe2d7;
  filter: drop-shadow(0 0 12px rgb(159 226 215 / 80%));
  animation: intro-node-pulse 2.8s ease-in-out infinite;
}
.landing-intro__nodes circle:nth-child(2) { animation-delay: -.5s; opacity: .75; }
.landing-intro__nodes circle:nth-child(3) { animation-delay: -1.3s; fill: #fff; }
.landing-intro__nodes circle:nth-child(4) { animation-delay: -1.9s; opacity: .75; }
.landing-intro__nodes circle:nth-child(5) { animation-delay: -2.3s; fill: #e9a596; }
.landing-intro__glow {
  mix-blend-mode: screen;
  animation: intro-glow-breathe 5s ease-in-out infinite alternate;
}
.landing-intro__content {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: .55rem;
  text-align: center;
  transform: translateY(-1rem);
  animation: intro-content-in 1.2s cubic-bezier(.2, .75, .2, 1) both;
}
.landing-intro__wordmark {
  margin: 0;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 10vw, 8rem);
  font-weight: 500;
  letter-spacing: -.06em;
  line-height: .9;
}
.landing-intro__caption {
  margin: 0;
  color: #9fe2d7;
  font-size: clamp(.8rem, 1.5vw, 1rem);
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.landing-intro__skip {
  position: absolute;
  z-index: 2;
  right: max(var(--gutter), 4vw);
  bottom: clamp(1.5rem, 5vh, 3.5rem);
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  min-height: 44px;
  color: rgb(245 251 249 / 78%);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-decoration: none;
  text-transform: uppercase;
  animation: intro-skip-pulse 2.2s ease-in-out infinite;
}
.landing-intro__skip span { color: #9fe2d7; font-size: 1.35rem; line-height: 1; }
.landing-intro__skip:hover { color: #fff; }
.landing-intro.is-skipped { display: none; }

@keyframes intro-ring-drift {
  from { transform: rotate(-4deg) scale(.98); }
  to { transform: rotate(5deg) scale(1.03); }
}
@keyframes intro-path-flow { to { stroke-dashoffset: -240; } }
@keyframes intro-card-float {
  from { transform: translate3d(0, 0, 0) rotate(-1deg); }
  to { transform: translate3d(0, -14px, 0) rotate(1deg); }
}
@keyframes intro-card-scan { to { stroke-dashoffset: -48; } }
@keyframes intro-node-pulse {
  0%, 100% { transform: scale(.75); opacity: .45; }
  50% { transform: scale(1.6); opacity: 1; }
}
@keyframes intro-glow-breathe {
  from { opacity: .45; transform: scale(.8); transform-origin: 50% 50%; }
  to { opacity: .95; transform: scale(1.15); transform-origin: 50% 50%; }
}
@keyframes intro-content-in {
  from { opacity: 0; transform: translateY(1rem); }
  to { opacity: 1; transform: translateY(-1rem); }
}
@keyframes intro-skip-pulse {
  0%, 100% { opacity: .65; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(.25rem); }
}

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

.landing-hero {
  position: relative;
  overflow: clip;
  padding-block: clamp(3rem, 6vw, 5.5rem) clamp(3rem, 6vw, 5.5rem);
  background: var(--color-surface);
}

.landing-hero::after {
  position: absolute;
  right: 8%;
  bottom: -7rem;
  width: 23rem;
  height: 23rem;
  border: 1px solid rgb(20 145 155 / 16%);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.landing-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  align-items: center;
  gap: clamp(2.5rem, 7vw, 7rem);
}

.landing-hero__content { min-width: 0; }
.landing-hero h1 { max-width: 12ch; }
.landing-hero__assurance {
  max-width: 59ch;
  margin: 1.5rem 0 0;
  color: var(--color-text);
  font-weight: 600;
}

.landing-page .button,
.landing-page .button--demo { background: var(--color-teal-dark); color: #fff; }
.landing-page .button:hover,
.landing-page .button--demo:hover { background: #16474b; color: #fff; }

.landing-hero__visual {
  width: min(100%, 31rem);
  margin-inline: auto;
}
.landing-hero__visual img { width: 100%; height: auto; }

.landing-hero--value {
  min-height: min(48rem, calc(100svh - var(--header-height)));
  padding-block: 0;
  background: #153b3b;
  color: #fff;
}
.landing-hero--value::after { content: none; }
.landing-hero__background {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(5%, 7%) scale(1.14);
  transform-origin: center;
}
.landing-hero--value::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgb(7 31 36 / 82%), rgb(7 31 36 / 53%) 48%, rgb(7 31 36 / 15%)),
    linear-gradient(0deg, rgb(7 31 36 / 52%), transparent 56%);
  content: "";
  pointer-events: none;
}
.landing-hero--value .landing-hero__grid {
  display: flex;
  min-height: inherit;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 3rem;
  padding-block: clamp(2.5rem, 6vh, 5rem);
}
.landing-hero--value .landing-hero__content { display: contents; }
.landing-hero--value h1 {
  position: relative;
  z-index: 2;
  max-width: 90%;
  margin: 0;
  color: #fff;
  font-size: clamp(3rem, 8vw, 6.5rem);
  line-height: 1.08;
  text-shadow: 0 2px 24px rgb(0 0 0 / 24%);
}
.landing-hero--value h1 span {
  display: block;
  color: #9fe2d7;
}
.landing-hero--value .lead {
  position: relative;
  z-index: 2;
  max-width: min(90%, 48rem);
  margin: 0;
  color: #fff;
  font-size: clamp(1.05rem, 1.7vw, 1.3rem);
  text-shadow: 0 2px 16px rgb(0 0 0 / 25%);
}
.landing-hero__benefits {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 30rem;
  gap: .9rem .75rem;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}
.landing-hero__benefits li {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  font-size: .74rem;
  line-height: 1.4;
}
.landing-hero__benefit-icon {
  display: grid;
  flex: 0 0 2rem;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: .6rem;
  background: #e8f3f2;
  font-size: 1.1rem;
}
.landing-hero__benefit-copy,
.landing-hero__benefit-copy strong {
  display: block;
}

.value-points {
  position: relative;
  padding-block: clamp(1.25rem, 2vw, 1.75rem);
  background: var(--color-surface);
}
.value-points__content {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
  align-items: start;
  gap: clamp(1.5rem, 4vw, 3rem);
  max-width: var(--container);
}
.value-points--scrolling .value-points__content {
  position: sticky;
  z-index: 2;
  top: calc(var(--header-height) + 1.5rem);
}
.value-points h2 {
  align-self: center;
  margin: 0;
  color: var(--color-teal);
  font-size: clamp(1.9rem, 3.1vw, 2.5rem);
  font-weight: 500;
}
.value-points__icons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .6rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.value-points__icons li {
  display: grid;
  place-items: center;
  min-width: 0;
}
.value-points__icons .landing-hero__benefit-icon {
  flex-basis: 3.5rem;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: .9rem;
  font-size: 1.8rem;
  opacity: 0;
  transform: translateY(.5rem) scale(.85);
  transition: opacity .35s ease, transform .35s ease;
}
.value-points__icons li.is-visible .landing-hero__benefit-icon {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.value-points .landing-hero__benefits {
  max-width: none;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  margin-top: 0;
}
.value-points .landing-hero__benefits li {
  display: block;
  align-items: center;
  min-width: 0;
  margin: 0;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  box-shadow: 0 .5rem 1.5rem rgb(26 43 60 / 5%);
}
.value-point-card {
  transition: box-shadow .22s ease;
}
.value-points--scrolling .landing-hero__benefits {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  padding-bottom: 0;
  isolation: isolate;
}
.value-points--scrolling .landing-hero__benefits li {
  grid-area: 1 / 1;
  position: relative;
}
.value-points--scrolling .value-point-card {
  opacity: 0;
  transform: translateY(1.25rem);
  pointer-events: none;
  transition: opacity .42s ease, transform .42s ease, box-shadow .22s ease;
}
.value-points--scrolling .value-point-card.is-active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.value-point-card__content { max-width: none; }
.value-point-card h3 {
  margin: 0;
  color: var(--color-teal);
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 2.8vw, 2.15rem);
  font-weight: 500;
  line-height: 1.2;
}
.value-point-card__content > p {
  margin: .75rem 0 0;
  color: var(--color-text-muted);
  font-size: clamp(1.1rem, 1.5vw, 1.25rem);
  line-height: 1.6;
}
@media (hover: hover) and (pointer: fine) {
  .value-point-card:hover,
  .value-point-card.reveal-pending.is-revealed:hover {
    transform: translateY(-3px);
    box-shadow: 0 .85rem 2rem rgb(26 43 60 / 12%);
  }
}
.landing-hero__benefit-copy strong {
  margin: .05rem 0 .2rem;
  color: var(--color-text);
  font-size: .78rem;
}

.review-workflow {
  position: relative;
  padding-block: clamp(4rem, 8vw, 7rem);
  background: var(--color-surface-raised);
}
.review-workflow::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: min(100% - (var(--gutter) * 2), var(--container));
  height: 1px;
  transform: translateX(-50%);
  background: rgb(13 110 110 / 18%);
  content: "";
}
.review-workflow__grid {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  align-items: stretch;
  gap: clamp(1.5rem, 4.5vw, 4.5rem);
}
.review-workflow__intro {
  position: sticky;
  top: calc(var(--header-height) + 1.25rem);
  align-self: start;
  overflow-x: clip;
  isolation: isolate;
  padding: clamp(1.5rem, 3.3vw, 3rem);
  border-radius: 1.4rem;
  background: radial-gradient(circle at 100% 0%, rgb(159 226 215 / 15%), transparent 38%), #123d3e;
  box-shadow: 0 1.2rem 3rem rgb(18 61 62 / 14%);
  color: #fff;
}
.review-workflow__intro::after {
  position: absolute;
  z-index: -1;
  right: -4.8rem;
  bottom: -5.8rem;
  width: 14rem;
  height: 14rem;
  border: 1px solid rgb(159 226 215 / 20%);
  border-radius: 50%;
  content: "";
}
.review-workflow__intro .eyebrow { color: #9fe2d7; }
.review-workflow__intro h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  font-weight: 500;
  line-height: 1.05;
}
.review-workflow__lead {
  max-width: 36rem;
  margin: 1.25rem 0 0;
  color: rgb(255 255 255 / 86%);
  font-size: clamp(1rem, 1.4vw, 1.12rem);
}
.review-workflow__route {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-top: clamp(2rem, 4vw, 3rem);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
}
.review-workflow__route span {
  display: inline-flex;
  min-height: 2.35rem;
  align-items: center;
  padding-inline: .7rem;
  border: 1px solid rgb(255 255 255 / 25%);
  border-radius: 999px;
  background: rgb(255 255 255 / 7%);
  white-space: nowrap;
}
.review-workflow__route i {
  width: clamp(.55rem, 1.5vw, 1.25rem);
  height: 1px;
  flex: 0 0 auto;
  background: #9fe2d7;
}
.review-workflow__assurance {
  margin: 1.6rem 0 0;
  padding-left: 1rem;
  border-left: 2px solid #9fe2d7;
  color: #fff;
  font-weight: 700;
}
.review-workflow__availability {
  margin: 1rem 0 0;
  color: rgb(255 255 255 / 67%);
  font-size: .78rem;
  line-height: 1.5;
}
.review-workflow__right { min-width: 0; }
.review-workflow__stages {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}
.workflow-stage {
  display: grid;
  min-height: clamp(15rem, 36svh, 23rem);
  align-items: center;
  scroll-margin-block: calc(var(--header-height) + 1rem);
}
.workflow-stage__card {
  width: 100%;
  padding: 1rem 1.1rem;
  border: 1px solid var(--color-border);
  border-radius: 1.15rem;
  background: var(--color-surface);
  box-shadow: 0 .5rem 1.6rem rgb(26 43 60 / 4%);
  transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease, padding .3s ease;
}
.workflow-stage.is-current .workflow-stage__card {
  padding: clamp(1.15rem, 2.4vw, 1.7rem);
  border-color: rgb(13 110 110 / 34%);
  box-shadow: 0 .9rem 2.5rem rgb(26 43 60 / 10%);
  transform: scale(1.015);
}
.workflow-stage__heading { margin: 0; }
.workflow-stage__trigger {
  display: grid;
  width: 100%;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .85rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.workflow-stage__number {
  color: var(--color-text-muted);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .08em;
}
.workflow-stage__icon {
  display: grid;
  width: 2.75rem;
  height: 2.75rem;
  place-items: center;
  border-radius: .85rem;
  background: #e8f3f2;
  color: var(--color-teal);
  transition: background .3s ease, color .3s ease, transform .3s ease;
}
.workflow-stage__icon svg {
  width: 1.4rem;
  height: 1.4rem;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.workflow-stage__title {
  min-width: 0;
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 2vw, 1.55rem);
  font-weight: 500;
  line-height: 1.2;
}
.workflow-stage__chevron {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  color: var(--color-teal);
  font-family: var(--font-body);
  font-size: 1.1rem;
  line-height: 1;
  transition: transform .3s ease;
}
.workflow-stage.is-current .workflow-stage__icon { background: var(--color-teal); color: #fff; }
.workflow-stage.is-current .workflow-stage__chevron { transform: rotate(180deg); }
.workflow-stage__details[hidden] { display: none; }
.workflow-stage__details {
  margin: 1.2rem 0 0 3.6rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--color-border);
  animation: workflow-fade-up .35s ease both;
}
.workflow-stage__details > p {
  max-width: 48ch;
  margin: 0;
  color: var(--color-text-muted);
  font-size: clamp(.96rem, 1.45vw, 1.08rem);
  line-height: 1.55;
}
.workflow-stage__controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-top: 1.3rem;
}
.workflow-stage__arrow {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: .45rem;
  padding: .4rem .55rem;
  border: 0;
  border-radius: .5rem;
  background: transparent;
  color: var(--color-teal-dark);
  cursor: pointer;
  font: 700 .82rem/1.3 var(--font-body);
}
.workflow-stage__arrow:hover:not(:disabled) { background: var(--color-surface-raised); }
.workflow-stage__arrow:disabled { color: #89949e; cursor: not-allowed; }
.workflow-stage__arrow span { font-size: 1rem; }
.workflow-stage__count {
  color: var(--color-teal-dark);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .05em;
  white-space: nowrap;
}
.workflow-stage__count span { color: var(--color-text-muted); font-weight: 500; }
.review-workflow__more {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .45rem 1rem;
  margin-top: 1.4rem;
  padding: clamp(1.1rem, 2.5vw, 1.6rem);
  border: 1px solid rgb(13 110 110 / 22%);
  border-radius: 1rem;
  background: rgb(255 255 255 / 70%);
}
.review-workflow__more-title {
  margin: 0;
  color: var(--color-text);
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 500;
}
.review-workflow__more p:not(.review-workflow__more-title) {
  margin: .3rem 0 0;
  color: var(--color-text-muted);
  font-size: .84rem;
  line-height: 1.45;
}
.review-workflow__more .button { grid-column: 2; grid-row: 1 / span 2; white-space: nowrap; }
.review-workflow__methodology {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  color: var(--color-teal);
  font-size: .82rem;
  font-weight: 700;
}
.review-workflow__methodology:hover { color: var(--color-teal-dark); }
.review-workflow [data-reveal].reveal-pending { opacity: 0; transform: translateY(12px); }
.review-workflow [data-reveal].reveal-pending.is-revealed { opacity: 1; transform: translateY(0); }

.review-workflow--horizontal .review-workflow__layout { display: block; }
.review-workflow--horizontal .review-workflow__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1rem, 3vw, 2.5rem);
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.review-workflow--horizontal .review-workflow__header h2 {
  max-width: none;
  flex: 0 1 70%;
  width: 70%;
  margin: 0;
  color: var(--color-teal-dark);
  font-size: clamp(1.15rem, 5.2vw, 3.5rem);
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: 1.08;
}
.review-workflow--horizontal .review-workflow__header > .button {
  flex: 0 0 auto;
}
.review-workflow__image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 1.25rem;
}
.review-workflow__map-hint { margin: -1rem 0 1rem; color: var(--color-text-muted); font-size: .9rem; }
.review-workflow--horizontal .review-workflow__right { margin-top: clamp(1.5rem, 3.5vw, 3rem); }
.review-workflow--horizontal .review-workflow__stages {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding: .35rem .35rem 1.2rem;
  scroll-padding-inline: .35rem;
  scroll-snap-type: x mandatory;
  scrollbar-color: var(--color-teal) transparent;
  -webkit-overflow-scrolling: touch;
}
.review-workflow__map { position: relative; isolation: isolate; }
.review-workflow__hotspots {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 3 / 1;
  display: none;
}
.workflow-hotspot {
  position: absolute;
  z-index: 1;
  display: grid;
  width: clamp(2.4rem, 4vw, 3.2rem);
  aspect-ratio: 1;
  place-items: center;
  padding: 0;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--color-teal-dark);
  box-shadow: 0 2px 10px rgb(8 43 55 / 32%);
  color: #fff;
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: background-color .2s ease, box-shadow .2s ease, scale .2s ease;
}
.workflow-hotspot:hover,
.workflow-hotspot:focus-visible,
.workflow-hotspot[aria-pressed="true"] {
  z-index: 2;
  background: var(--color-teal);
  box-shadow: 0 0 0 5px rgb(0 189 185 / 24%), 0 3px 12px rgb(8 43 55 / 32%);
  scale: 1.08;
}
.workflow-hotspot:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.workflow-hotspot svg {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}
.workflow-hotspot--design { left: 7%; top: 59%; }
.workflow-hotspot--search { left: 21%; top: 17%; }
.workflow-hotspot--screening { left: 41%; top: 13%; }
.workflow-hotspot--analysis { left: 54%; top: 39%; }
.workflow-hotspot--synthesis { left: 73%; top: 34%; }
.workflow-hotspot--writing { left: 93%; top: 24%; }
.review-workflow--horizontal.has-workflow-map .review-workflow__hotspots { display: block; }
.review-workflow--horizontal.has-workflow-map .review-workflow__right { margin-top: 1rem; }
.review-workflow--horizontal.has-workflow-map .review-workflow__stages {
  display: block;
  overflow: visible;
  padding: 0;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage { display: none; }
.review-workflow--horizontal.has-workflow-map .workflow-stage.is-current {
  display: block;
  min-height: 17rem;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage.is-current .workflow-stage__card {
  height: auto;
  min-height: 17rem;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage.is-current .workflow-stage__card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(6rem, .32fr) minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  column-gap: clamp(.8rem, 2.4vw, 2rem);
  align-items: stretch;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__heading { grid-column: 2; grid-row: 1; align-self: end; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__trigger {
  display: flex;
  width: auto;
  min-height: 0;
  gap: 0;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__number,
.review-workflow--horizontal.has-workflow-map .workflow-stage__chevron { display: none; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__icon {
  position: absolute;
  top: clamp(1.15rem, 2.4vw, 1.7rem);
  bottom: clamp(1.15rem, 2.4vw, 1.7rem);
  left: clamp(1.15rem, 2.4vw, 1.7rem);
  width: min(30%, clamp(6rem, 19vw, 13rem));
  height: auto;
  min-height: 0;
  border-radius: .9rem;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__icon svg {
  width: clamp(3.25rem, 7vw, 5.5rem);
  height: clamp(3.25rem, 7vw, 5.5rem);
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__title { font-size: clamp(1.3rem, 2.5vw, 2rem); }
.review-workflow--horizontal.has-workflow-map .workflow-stage__details {
  display: flex;
  grid-column: 2;
  grid-row: 2;
  flex-direction: column;
  align-self: stretch;
  margin: 1rem 0 0;
  padding-top: 1rem;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__details > p { max-width: 56ch; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__controls { margin-top: auto; padding-top: 1rem; }
.review-workflow--horizontal.has-workflow-map .review-workflow__overlay {
  position: absolute;
  z-index: 3;
  inset: 0;
  pointer-events: none;
}
.review-workflow--horizontal.has-workflow-map .review-workflow__stages { position: absolute; inset: 0; }
.review-workflow--horizontal.has-workflow-map .workflow-stage.is-current {
  position: absolute;
  inset: 0;
  min-height: 0;
  pointer-events: none;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage.is-current .workflow-stage__card {
  position: absolute;
  right: 2%;
  bottom: 3%;
  display: grid;
  width: min(25rem, 38%);
  min-height: 0;
  height: auto;
  grid-template-columns: 3rem minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 0 .9rem;
  padding: 1rem 1.1rem;
  border-color: rgb(13 110 110 / 20%);
  border-radius: 1rem;
  background: rgb(255 255 255 / 88%);
  box-shadow: 0 .75rem 2rem rgb(26 43 60 / 14%);
  backdrop-filter: blur(14px);
  isolation: isolate;
  pointer-events: auto;
  transform: none;
}
.review-workflow--horizontal.has-workflow-map:not(.is-workflow-card-visible) .workflow-stage.is-current .workflow-stage__card { display: none; }
.review-workflow--horizontal.has-workflow-map.is-workflow-card-visible .workflow-stage.is-current .workflow-stage__card { display: grid; }
.review-workflow--horizontal.has-workflow-map [data-stage-index="4"].is-current .workflow-stage__card,
.review-workflow--horizontal.has-workflow-map [data-stage-index="5"].is-current .workflow-stage__card {
  right: auto;
  left: 2%;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage.is-current .workflow-stage__card::before {
  position: absolute;
  z-index: -1;
  inset: -1rem;
  border-radius: inherit;
  background: rgb(255 255 255 / 68%);
  content: "";
  filter: blur(18px);
  pointer-events: none;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__heading { grid-column: 2; grid-row: 1; align-self: center; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__trigger { display: flex; width: auto; min-height: 0; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__icon {
  position: absolute;
  top: 1rem;
  bottom: auto;
  left: 1.1rem;
  width: 3rem;
  height: 3rem;
  min-height: 0;
  border-radius: .8rem;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__icon svg { width: 1.65rem; height: 1.65rem; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__title { font-size: clamp(1.1rem, 1.6vw, 1.35rem); }
.review-workflow--horizontal.has-workflow-map .workflow-stage__details {
  grid-column: 2;
  grid-row: 2;
  margin: .7rem 0 0;
  padding-top: .7rem;
}
.review-workflow--horizontal.has-workflow-map .workflow-stage__details > p { font-size: .9rem; line-height: 1.45; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__controls { margin-top: .6rem; padding-top: .5rem; }
.review-workflow--horizontal.has-workflow-map .workflow-stage__arrow { min-height: 36px; padding: .25rem .35rem; font-size: .72rem; }
.review-workflow--horizontal .workflow-stage {
  display: flex;
  flex: 0 0 min(24rem, calc(100% - .7rem));
  min-height: 17rem;
  align-items: stretch;
  scroll-margin: 0;
  scroll-snap-align: start;
}
.review-workflow--horizontal .workflow-stage__card,
.review-workflow--horizontal .workflow-stage.is-current .workflow-stage__card {
  height: 100%;
  padding: clamp(1rem, 2vw, 1.5rem);
  transform: none;
}
.review-workflow--horizontal .workflow-stage__trigger { gap: .6rem; }
.review-workflow--horizontal .workflow-stage__title { font-size: clamp(1.15rem, 1.5vw, 1.4rem); }
.review-workflow--horizontal .workflow-stage__chevron { display: none; }
.review-workflow--horizontal .workflow-stage__details { margin-left: 0; }
.review-workflow--horizontal .review-workflow__lead { max-width: 65ch; margin-top: 1.5rem; color: var(--color-text-muted); }
.review-workflow--horizontal .review-workflow__assurance { max-width: 65ch; color: var(--color-text); }

@keyframes workflow-fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.demo-invitation h2 { max-width: 12ch; margin: 0; font-size: clamp(2.25rem, 5vw, 4.5rem); font-weight: 500; }

.demo-invitation {
  padding-block: clamp(3rem, 6vw, 5rem);
  background: var(--color-surface);
}
.demo-invitation__content { max-width: 72rem; text-align: center; }
.demo-invitation__content h2 { max-width: none; }
.demo-invitation__content .landing-hero__actions { justify-content: center; }
.demo-invitation__content p:not(.eyebrow) {
  max-width: 42rem;
  margin: 1.5rem auto 0;
  color: var(--color-text-muted);
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
}
.demo-invitation__content .button { margin-top: 2rem; }

.landing-page .site-footer .brand::after { content: none; }
.landing-page .site-footer a:hover { color: var(--color-mint); }
.landing-page .primary-nav__links { box-shadow: none; }

@media (max-width: 56rem) {
  .review-workflow--horizontal .review-workflow__header {
    align-items: flex-start;
    flex-direction: column;
  }
  .review-workflow--horizontal .review-workflow__header h2 { width: 100%; flex-basis: auto; }
  .landing-hero__grid,
  .review-workflow__grid { grid-template-columns: minmax(0, 1fr); }
  .value-points__content { grid-template-columns: minmax(0, 1fr); }
  .value-points h2 { position: relative; top: auto; margin-bottom: 0; }
  .landing-hero { padding-top: clamp(3.5rem, 10vw, 5rem); }
  .landing-hero--value { min-height: min(44rem, calc(100svh - var(--header-height))); }
  .landing-page .footer-nav { grid-template-columns: minmax(0, 1fr); }
  .review-workflow__intro { position: relative; top: auto; }
  .workflow-stage { min-height: 0; }
  .workflow-stage__card,
  .workflow-stage.is-current .workflow-stage__card { padding: 1rem; transform: none; }
  .workflow-stage__details { margin-left: 0; }
  .review-workflow__stages { gap: .7rem; }
  .review-workflow--horizontal.has-workflow-map .review-workflow__overlay {
    position: static;
    margin-top: -.75rem;
    pointer-events: auto;
  }
  .review-workflow--horizontal.has-workflow-map .review-workflow__stages { position: static; }
  .review-workflow--horizontal.has-workflow-map .workflow-stage.is-current {
    position: relative;
    inset: auto;
    min-height: 0;
    pointer-events: auto;
  }
  .review-workflow--horizontal.has-workflow-map .workflow-stage.is-current .workflow-stage__card {
    position: relative;
    inset: auto;
    width: min(100%, 38rem);
    margin-inline: auto;
  }
}

@media (max-width: 34rem) {
  .landing-hero h1 { font-size: clamp(2.55rem, 13vw, 3.35rem); }
  .landing-hero--value { min-height: max(42rem, calc(100svh - var(--header-height))); }
  .review-workflow__route { gap: .35rem; font-size: .66rem; }
  .review-workflow__route span { min-height: 2rem; padding-inline: .55rem; }
  .review-workflow__route i { width: .55rem; }
  .review-workflow__more { grid-template-columns: minmax(0, 1fr); }
  .review-workflow__more .button { grid-column: auto; grid-row: auto; justify-self: start; }
  .value-points .landing-hero__benefits li {
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
    gap: 1rem;
  }
}

@media (max-height: 44rem) and (min-width: 56.01rem) {
  .review-workflow__intro { position: relative; top: auto; }
}

/* Scroll narrative for the review journey. */
.workflow-story {
  --workflow-ink: #f1fbf9;
  --workflow-muted: rgb(241 251 249 / 70%);
  --workflow-line: rgb(159 226 215 / 30%);
  position: relative;
  overflow: hidden;
  padding-block: clamp(3.5rem, 7vw, 6rem) clamp(5rem, 11vw, 10rem);
  background:
    radial-gradient(circle at 14% 4%, rgb(20 145 155 / 22%), transparent 28rem),
    radial-gradient(circle at 92% 54%, rgb(13 110 110 / 11%), transparent 28rem),
    linear-gradient(145deg, #082f35 0%, #0b3d42 48%, #092d35 100%);
  color: var(--workflow-ink);
}
.workflow-story::before { display: none; }
.workflow-story__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 0;
}
.workflow-story__intro {
  grid-column: 1;
  grid-row: 1;
  padding-block: 0 clamp(2.5rem, 5vw, 4.5rem);
  text-align: center;
}
.workflow-story__integration-heading .eyebrow { color: #9fe2d7; }
.workflow-story__intro h1,
.workflow-story__intro h2 {
  max-width: 18ch;
  margin: 0 auto;
  color: var(--workflow-ink);
  font-size: clamp(2.45rem, 5vw, 4.7rem);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: .98;
}
.workflow-story__intro h1 {
  width: 100%;
  max-width: none;
}
.workflow-story__timeline {
  position: relative;
  grid-column: 1;
  grid-row: 2;
  width: 100%;
  max-width: 58rem;
  margin-inline: auto;
}
.workflow-story__rail {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.workflow-story__rail path {
  fill: none;
  stroke: var(--workflow-line);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.25;
  vector-effect: non-scaling-stroke;
}
.workflow-story__stages {
  position: relative;
  z-index: 1;
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}
.workflow-story__stage {
  position: relative;
  display: grid;
  min-height: clamp(19rem, 43svh, 28rem);
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: clamp(.65rem, 1.4vw, 1rem);
  align-content: center;
  scroll-margin-block: calc(var(--header-height) + 2rem);
}
.workflow-story__stage-number {
  display: none;
}
.workflow-story__trigger {
  display: grid;
  grid-column: 1 / -1;
  grid-row: 1;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(.65rem, 1.4vw, 1rem);
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--workflow-ink);
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.workflow-story__icon {
  display: grid;
  width: clamp(3rem, 5vw, 4rem);
  height: clamp(3rem, 5vw, 4rem);
  place-items: center;
  border: 1px solid rgb(159 226 215 / 38%);
  border-radius: 1rem;
  background: #12464b;
  color: #9fe2d7;
  position: relative;
  z-index: 2;
  transition: background-color .45s ease, border-color .45s ease, color .45s ease, transform .45s ease;
}
.workflow-story__trigger > .workflow-story__icon {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
}
.workflow-story__icon svg {
  width: 1.5rem;
  height: 1.5rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.5;
}
.workflow-story__stage.is-active .workflow-story__icon {
  border-color: #9fe2d7;
  background: #9fe2d7;
  color: #0b3d42;
}
.workflow-story__heading {
  display: grid;
  grid-column: 2;
  grid-row: 1;
  gap: .25rem;
  min-width: 0;
}
.workflow-story__title {
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 3vw, 2.55rem);
  font-weight: 500;
  line-height: 1.05;
}
.workflow-story__subtitle {
  color: var(--workflow-muted);
  font-size: clamp(.85rem, 1.25vw, 1rem);
  line-height: 1.4;
}
.workflow-story__detail {
  grid-column: 2;
  grid-row: 2;
  margin-top: 1.25rem;
  padding: 1rem 0 0;
}
.workflow-story__stage:nth-child(even) .workflow-story__trigger > .workflow-story__icon {
  grid-column: 2;
  justify-self: end;
}
.workflow-story__stage:nth-child(even) {
  grid-template-columns: minmax(0, 1fr) auto;
}
.workflow-story__stage:nth-child(even) .workflow-story__trigger {
  grid-template-columns: minmax(0, 1fr) auto;
}
.workflow-story__stage:nth-child(even) .workflow-story__heading,
.workflow-story__stage:nth-child(even) .workflow-story__detail {
  grid-column: 1;
}
.workflow-story__detail > p {
  max-width: 43rem;
  margin: 0;
  color: var(--workflow-ink);
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.55;
}
.workflow-story.is-enhanced .workflow-story__detail { display: none; }
.workflow-story.is-enhanced .workflow-story__stage { opacity: 1; filter: none; transform: none; transition: none; }
.workflow-dialog {
  width: min(44rem, calc(100vw - 2rem));
  max-width: none;
  max-height: min(80svh, 46rem);
  margin: auto;
  padding: 0;
  border: 1px solid rgb(159 226 215 / 35%);
  border-radius: 1.25rem;
  background: #0b3d42;
  color: #f4fbfa;
  box-shadow: 0 2rem 6rem rgb(0 0 0 / 35%);
}
.workflow-dialog::backdrop {
  background: rgb(5 29 32 / 75%);
  backdrop-filter: blur(5px);
}
.workflow-dialog__inner {
  max-height: min(80svh, 46rem);
  overflow: auto;
  padding: clamp(1.5rem, 4vw, 3rem);
}
.workflow-dialog__close {
  display: inline-flex;
  margin-bottom: 2rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #9fe2d7;
  cursor: pointer;
  font: inherit;
}
.workflow-dialog h2 {
  margin: .4rem 0 1.25rem;
  color: var(--workflow-ink);
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 500;
  line-height: 1;
}
.workflow-dialog__detail { margin: 0; }
.workflow-dialog__detail > p {
  max-width: 43rem;
  margin: 0;
  color: var(--workflow-ink);
  font-size: 1.05rem;
  line-height: 1.6;
}
.workflow-dialog__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 2rem;
}
@media (max-width: 40rem) {
  .workflow-dialog__inner { padding: 1.25rem; }
  .workflow-dialog__actions { align-items: stretch; flex-direction: column; }
  .workflow-dialog__actions .button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .workflow-dialog::backdrop { backdrop-filter: none; }
}
.workflow-story__stage:nth-child(odd) {
  --workflow-heading-shift: clamp(1.5rem, 3.4vw, 2rem);
  --workflow-detail-inset: calc(var(--workflow-heading-shift) + 3rem);
}
.workflow-story__stage:nth-child(odd) .workflow-story__heading {
  transform: translateX(var(--workflow-heading-shift));
}
.workflow-story__stage:nth-child(odd) .workflow-story__detail {
  padding-left: var(--workflow-detail-inset);
}
.workflow-story__roles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem 1.25rem;
  margin-top: 1.25rem;
}
.workflow-story__roles p {
  margin: 0;
  color: var(--workflow-muted);
  font-size: .82rem;
  line-height: 1.5;
}
.workflow-story__roles strong {
  display: block;
  margin-bottom: .2rem;
  color: #9fe2d7;
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.workflow-story.is-enhanced .workflow-story__stage {
  opacity: .08;
  filter: blur(12px);
  transform: translateY(2.4rem) scale(.96);
  transition: opacity .8s ease, filter .8s ease, transform .8s cubic-bezier(.2, .75, .25, 1);
}
.workflow-story.is-enhanced .workflow-story__stage.is-visible {
  opacity: 1;
  filter: none;
  transform: none;
}
.workflow-story__integration {
  grid-column: 1 / -1;
  margin-top: clamp(4rem, 10vw, 8rem);
}
.workflow-story__integration-heading { max-width: 48rem; }
.workflow-story__integration-heading h2 {
  max-width: 17ch;
  margin: 0;
  color: var(--workflow-ink);
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 4vw, 3.5rem);
  font-weight: 500;
  line-height: 1.02;
}
.workflow-story__integration-heading > p:last-child {
  max-width: 42rem;
  margin: 1rem 0 0;
  color: var(--workflow-muted);
  line-height: 1.55;
}
.workflow-story.is-enhanced .workflow-story__integration {
  opacity: .18;
  filter: blur(8px);
  transform: translateY(3rem) scale(.96);
  transition: opacity 1s ease, filter 1s ease, transform 1.1s cubic-bezier(.2, .75, .25, 1);
}
.workflow-story.is-enhanced.is-integration-visible .workflow-story__integration {
  opacity: 1;
  filter: none;
  transform: none;
}
.workflow-story__integration-scene {
  position: relative;
  overflow: hidden;
  margin-top: clamp(2rem, 4vw, 3.5rem);
  padding: clamp(1rem, 2.5vw, 2rem);
  border: 1px solid rgb(159 226 215 / 25%);
  border-radius: 1.6rem;
  background: radial-gradient(circle at 50% -15%, rgb(159 226 215 / 17%), transparent 34rem), rgb(4 29 35 / 54%);
  box-shadow: 0 1.5rem 4rem rgb(0 0 0 / 18%);
}
.workflow-story__integration-scene::before {
  position: absolute;
  top: 5rem;
  right: 12%;
  left: 12%;
  height: 18rem;
  border: 1px solid rgb(159 226 215 / 10%);
  border-radius: 50%;
  content: "";
  pointer-events: none;
  transform: rotate(-4deg);
}
.workflow-story__canopy {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  padding: clamp(1rem, 2vw, 1.6rem);
  border: 1px solid rgb(159 226 215 / 40%);
  border-radius: 2rem 2rem 1.2rem 1.2rem;
  background: linear-gradient(180deg, rgb(159 226 215 / 12%), rgb(159 226 215 / 4%)), rgb(7 46 53 / 93%);
  box-shadow: 0 .9rem 2rem rgb(0 0 0 / 20%);
  transition: opacity 1s ease, transform 1s cubic-bezier(.2, .75, .25, 1);
}
.workflow-story__canopy::before {
  position: absolute;
  inset: .55rem;
  border: 1px solid rgb(159 226 215 / 14%);
  border-radius: 1.55rem 1.55rem .85rem .85rem;
  content: "";
  pointer-events: none;
}
.workflow-story__canopy-layer {
  position: relative;
  display: flex;
  min-height: 5.25rem;
  align-items: center;
  gap: .7rem;
  padding: .8rem .85rem;
  border-left: 3px solid var(--color-mint);
  border-radius: .75rem;
  background: rgb(255 255 255 / 5%);
}
.workflow-story__canopy-layer--prisma { border-left-color: #82c8d0; }
.workflow-story__canopy-layer--reporting { border-left-color: #0d6e6e; }
.workflow-story__canopy-mark {
  display: grid;
  width: 1.8rem;
  height: 1.8rem;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgb(159 226 215 / 50%);
  border-radius: 50%;
  color: #9fe2d7;
  font-size: .62rem;
  font-weight: 800;
}
.workflow-story__canopy-layer div { display: grid; gap: .2rem; }
.workflow-story__canopy-layer strong {
  color: var(--workflow-ink);
  font-family: var(--font-display);
  font-size: clamp(1rem, 1.8vw, 1.45rem);
  font-weight: 500;
}
.workflow-story__canopy-layer small {
  color: var(--workflow-muted);
  font-size: .7rem;
  line-height: 1.25;
}
.workflow-story__process-deck {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .55rem;
  margin: -.6rem .75rem 0;
  padding: 1.25rem .7rem .75rem;
  border: 1px solid rgb(159 226 215 / 22%);
  border-top: 0;
  border-radius: 0 0 1.2rem 1.2rem;
  background: rgb(159 226 215 / 5%);
  transition: opacity 1s ease, filter 1s ease, transform 1.1s cubic-bezier(.2, .75, .25, 1);
}
.workflow-story__process-deck::before {
  position: absolute;
  top: .95rem;
  right: 5%;
  left: 5%;
  border-top: 1px dashed rgb(159 226 215 / 28%);
  content: "";
}
.workflow-story.is-enhanced .workflow-story__canopy,
.workflow-story.is-enhanced .workflow-story__process-deck {
  opacity: .18;
  filter: blur(8px);
  transform: translateY(1.5rem) scale(.88);
}
.workflow-story.is-enhanced.is-integration-visible .workflow-story__canopy,
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-deck {
  opacity: 1;
  filter: none;
  transform: none;
}
.workflow-story__process-card {
  position: relative;
  display: grid;
  min-height: 5.6rem;
  align-content: center;
  justify-items: center;
  gap: .5rem;
  padding: .6rem .35rem;
  border: 1px solid rgb(159 226 215 / 26%);
  border-radius: .8rem;
  background: rgb(7 46 53 / 88%);
  color: var(--workflow-ink);
  text-align: center;
  transition: transform .9s cubic-bezier(.2, .75, .25, 1), border-color .7s ease, background-color .7s ease;
}
.workflow-story__process-card:nth-child(1) { transform: translateY(1rem) rotate(-3deg); }
.workflow-story__process-card:nth-child(2) { transform: translateY(.4rem) rotate(-2deg); }
.workflow-story__process-card:nth-child(3) { transform: translateY(.1rem) rotate(-1deg); }
.workflow-story__process-card:nth-child(4) { transform: translateY(-.1rem); }
.workflow-story__process-card:nth-child(5) { transform: translateY(.1rem) rotate(1deg); }
.workflow-story__process-card:nth-child(6) { transform: translateY(.4rem) rotate(2deg); }
.workflow-story__process-card:nth-child(7) { transform: translateY(1rem) rotate(3deg); }
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(1),
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(7) { transform: translateY(.4rem) rotate(0); }
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(2),
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(6) { transform: translateY(-.1rem) rotate(0); }
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(3),
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(5) { transform: translateY(-.45rem) rotate(0); }
.workflow-story.is-enhanced.is-integration-visible .workflow-story__process-card:nth-child(4) { transform: translateY(-.65rem) rotate(0); }
.workflow-story__process-card .workflow-story__icon { width: 2.2rem; height: 2.2rem; border-radius: .65rem; }
.workflow-story__process-card .workflow-story__icon svg { width: 1rem; height: 1rem; }
.workflow-story__process-card > span:last-child {
  color: var(--workflow-muted);
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .035em;
  line-height: 1.15;
  text-transform: uppercase;
}
.workflow-story__integration-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  margin-top: 1.5rem;
}
.workflow-story__integration-footer p {
  margin: 0;
  color: var(--workflow-muted);
  line-height: 1.5;
}
.workflow-story__integration-footer strong { color: var(--workflow-ink); }
.workflow-story .button--light {
  flex: 0 0 auto;
  border-color: #9fe2d7;
  background: #9fe2d7;
  color: #0b3d42;
}
.workflow-story .button--light:hover { border-color: #fff; background: #fff; color: #0b3d42; }
.workflow-story__closing .button--light { border-color: #fff; background: #fff; color: #0b3d42; }
.workflow-story__closing .button--light:hover { border-color: #e8f0ef; background: #e8f0ef; }
/* The methodology header and footer now use the shared site.css theme. */
/* Keep the how-it-works heading and its lead centred in both languages. */
.methodology-page .workflow-story__intro {
  width: 100%;
  justify-self: stretch;
  text-align: center;
}
.methodology-page .workflow-story__intro h1,
.methodology-page .workflow-story__intro .workflow-story__lead {
  margin-inline: auto;
  text-align: center;
}

/* Seven-phase methodology page. The base layout stays fully readable without JS. */
.workflow-story__layout { gap: 0; }
.workflow-story__intro { padding-bottom: clamp(2rem, 4vw, 3rem); }
.workflow-story__intro h1 { max-width: 20ch; font-size: clamp(2.4rem, 5vw, 4.4rem); line-height: 1.03; }
.workflow-story__lead { max-width: 44rem; margin: 1.2rem auto 0; color: var(--workflow-muted); font-size: clamp(1rem, 1.6vw, 1.2rem); line-height: 1.6; }
.workflow-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0 auto clamp(3rem, 7vw, 5.5rem); max-width: 68rem; }
.workflow-principles article { padding: 1.25rem; border: 1px solid rgb(159 226 215 / 25%); border-radius: 1rem; background: rgb(4 29 35 / 35%); }
.workflow-principles h2 { margin: 0 0 .6rem; color: #9fe2d7; font-family: var(--font-display); font-size: 1.25rem; font-weight: 500; text-align: center; }
.workflow-principle__icon { display: block; width: 1.75rem; height: 1.75rem; margin-bottom: .7rem; color: #9fe2d7; }
.workflow-principles article:nth-child(2) .workflow-principle__icon { margin-inline: auto; }
.workflow-principle__wordmark { margin: -.25rem 0 .65rem !important; color: #9fe2d7 !important; font-size: .76rem !important; font-weight: 700; line-height: 1.35; }
.workflow-principles p { margin: 0; color: var(--workflow-muted); font-size: .9rem; line-height: 1.55; }
.workflow-raise-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin: .8rem 0 0; padding: 0; list-style: none; }
.workflow-raise-values li { display: flex; min-height: 2.25rem; align-items: center; gap: .45rem; padding: .45rem .55rem; border: 1px solid rgb(13 110 110 / 18%); border-radius: .55rem; background: #fff; color: var(--workflow-ink); font-size: .76rem; font-weight: 700; line-height: 1.2; }
.workflow-raise-values li::before { width: .45rem; height: .45rem; flex: 0 0 auto; border-radius: 50%; background: var(--color-teal); content: ""; }
.workflow-principles .workflow-principles__note { grid-column: 1 / -1; margin: 0; padding-left: .25rem; font-size: .8rem; }
.workflow-map-heading { margin: 0 auto 1.5rem; text-align: center; }
.workflow-map-heading h2 { margin: 0; color: var(--workflow-ink); font-family: var(--font-display); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 500; }
.workflow-map-heading p { margin: .6rem 0 0; color: var(--workflow-muted); }
.workflow-map-nav { max-width: 68rem; margin: 0 auto 2.5rem; }
.workflow-map-nav ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; margin: 0; padding: 0; list-style: none; }
.workflow-map-nav a { display: flex; min-height: 4.2rem; align-items: center; gap: .7rem; padding: .8rem; border: 1px solid rgb(159 226 215 / 25%); border-radius: .9rem; color: var(--workflow-ink); text-decoration: none; transition: background-color .2s ease, border-color .2s ease, transform .2s ease; }
.workflow-map-nav a:hover { border-color: #9fe2d7; background: rgb(159 226 215 / 10%); animation: workflow-nudge .28s ease-in-out; }
.workflow-map-nav a:focus-visible, .workflow-story a:focus-visible, .workflow-story button:focus-visible { outline: 3px solid #ff8978; outline-offset: 4px; }
.workflow-map-nav__icon { display: grid; width: 1.5rem; height: 1.5rem; flex: 0 0 auto; place-items: center; border: 1px solid #9fe2d7; border-radius: .5rem; background: rgb(159 226 215 / 12%); }
.workflow-map-nav__icon::after { width: .42rem; height: .42rem; border-radius: 50%; background: #9fe2d7; content: ""; }
.workflow-story__stages { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0 auto; max-width: 68rem; }
.workflow-story__stage, .workflow-story__stage:nth-child(even) { display: block; min-height: 0; padding: 0; scroll-margin-top: 2rem; }
.workflow-phase { height: 100%; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid rgb(159 226 215 / 23%); border-radius: 1.1rem; background: rgb(4 29 35 / 42%); }
.workflow-story__trigger, .workflow-story__stage:nth-child(even) .workflow-story__trigger { grid-template-columns: auto minmax(0, 1fr); gap: .8rem; text-align: left; }
.workflow-story__trigger > .workflow-story__icon, .workflow-story__stage:nth-child(even) .workflow-story__trigger > .workflow-story__icon { grid-column: 1; justify-self: start; }
.workflow-story__icon { width: 2.7rem; height: 2.7rem; border-radius: .8rem; }
.workflow-story__icon > span { display: none; }
.workflow-story__icon::after { width: .65rem; height: .65rem; border: 2px solid currentColor; border-radius: 50%; content: ""; }
.workflow-story__heading, .workflow-story__stage:nth-child(even) .workflow-story__heading { grid-column: 2; transform: none; }
.workflow-story__heading { margin: 0; }
.workflow-story__title { font-size: clamp(1.25rem, 2vw, 1.7rem); }
.workflow-story__subtitle { font-size: .86rem; }
.workflow-story__detail, .workflow-story__stage:nth-child(even) .workflow-story__detail { display: block; margin: 1rem 0 0; padding: 0; }
.workflow-story.is-enhanced .workflow-story__detail { display: none; }
.workflow-story__detail > .workflow-phase__purpose { color: var(--workflow-ink); font-size: .95rem; line-height: 1.6; }
.workflow-story__roles { grid-template-columns: 1fr; gap: .7rem; margin-top: 1rem; }
.workflow-story__roles p { font-size: .83rem; }
.workflow-phase__visual { margin: 1rem 0 0; }
.workflow-visual { display: block; width: 100%; max-height: 15rem; aspect-ratio: 16 / 9; object-fit: cover; border: 1px solid rgb(159 226 215 / 25%); border-radius: .75rem; background: #103f45; }
.workflow-visual--diagram { display: grid; place-items: center; overflow: hidden; }
.workflow-visual--diagram svg { display: block; width: 100%; height: auto; }
.workflow-phase__visual figcaption { margin-top: .45rem; color: var(--workflow-muted); font-size: .75rem; line-height: 1.4; }
.workflow-phase__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: 1rem; }
.workflow-phase__actions .button { min-height: 2.75rem; }
.workflow-phase__back { color: #9fe2d7; font-size: .85rem; }
.workflow-story__closing { display: flex; max-width: 68rem; align-items: center; justify-content: center; gap: 1rem; margin: 2rem auto 0; padding: 1.25rem 0 0; border-top: 1px solid rgb(159 226 215 / 20%); }
.workflow-story__closing p { margin: 0; color: var(--workflow-muted); }
.workflow-dialog__phase-nav { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; }
.workflow-dialog__phase-nav a { color: #9fe2d7; }
.workflow-dialog h2:focus { outline: none; }
.workflow-dialog__inner { overscroll-behavior: contain; }
@keyframes workflow-nudge { 25% { transform: rotate(-1deg); } 75% { transform: rotate(1deg); } }
@media (prefers-reduced-motion: reduce) {
  .workflow-map-nav a { transition: none; }
  .workflow-map-nav a:hover { animation: none; }
}
@media (max-width: 56rem) {
  .workflow-principles { grid-template-columns: 1fr; }
  .workflow-map-nav ol { grid-template-columns: 1fr; }
  .workflow-story__stages { grid-template-columns: 1fr; }
}
@media (max-width: 34rem) {
  .workflow-map-nav ol { grid-template-columns: 1fr; }
  .workflow-story__closing { align-items: center; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .workflow-story.is-enhanced .workflow-story__stage,
  .workflow-story.is-enhanced .workflow-story__integration,
  .workflow-story.is-enhanced .workflow-story__canopy,
  .workflow-story.is-enhanced .workflow-story__process-deck,
  .workflow-story.is-enhanced .workflow-story__process-card { opacity: 1; filter: none; transform: none; }
}

@media (max-width: 56rem) {
  .workflow-story { padding-block: 4.5rem 5rem; }
  .workflow-story__layout { display: block; }
  .workflow-story__intro { padding-block: 0 2rem; }
  .workflow-story__intro h2 { max-width: 12ch; }
  .workflow-story__timeline { max-width: none; }
  .workflow-story__stage { min-height: clamp(19rem, 58svh, 27rem); }
  .workflow-story__roles { grid-template-columns: minmax(0, 1fr); }
  .workflow-story__integration { margin-top: 4rem; }
  .workflow-story__canopy { grid-template-columns: minmax(0, 1fr); }
  .workflow-story__process-deck { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .workflow-story__integration-footer { align-items: flex-start; flex-direction: column; }
  .workflow-story__integration-footer .button { width: 100%; }
}

@media (max-width: 34rem) {
  .workflow-story__stage,
  .workflow-story__trigger { column-gap: .55rem; }
  .workflow-story__icon { width: 2.75rem; height: 2.75rem; border-radius: .8rem; }
  .workflow-story__icon svg { width: 1.25rem; height: 1.25rem; }
  .workflow-story__title { font-size: 1.45rem; }
  .workflow-story__subtitle { font-size: .8rem; }
  .workflow-story__detail { margin-top: 1rem; padding-top: .9rem; }
  .workflow-story__detail > p { font-size: .94rem; }
  .workflow-story__integration-scene::before { display: none; }
  .workflow-story__process-deck { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-inline: .2rem; }
  .workflow-story__process-card:nth-child(n) { transform: none; }
}

.workflow-story--teaser {
  position: relative;
  padding-block: clamp(4rem, 8vw, 7rem);
  background: var(--color-surface-raised);
}
.workflow-story--teaser::before { display: none; }

/* Seven phase narrative */
.workflow-story__intro h1 { max-width: none; margin-inline: auto; }
@media (min-width: 56.01rem) {
  .workflow-story__intro h1 { white-space: nowrap; }
}
.workflow-principles { align-items: stretch; margin-bottom: 1.25rem; }
.workflow-principle { display: flex; flex-direction: column; }
.workflow-principle--2 { align-items: stretch; justify-content: flex-start; text-align: left; }
.workflow-principle--2 h2 { margin-bottom: 0; }
.workflow-principle--2 .workflow-principle__icon { width: min(100%, 7rem); height: 7rem; flex: 0 0 7rem; align-self: center; margin: 1.5rem auto 0; color: var(--mint, #9fe2d7); }
.workflow-principle__wordmark { font-size: 1.35rem; font-weight: 800; letter-spacing: .16em; }
.workflow-reference-names { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .65rem 1rem; margin-top: auto; padding-top: 1.25rem; color: var(--mint, #9fe2d7); font-size: .78rem; font-weight: 800; letter-spacing: .08em; }
.workflow-journey { margin-top: 0; }
.workflow-journey .workflow-chapter:first-child { padding-top: clamp(2rem, 4vw, 3.5rem); }
.workflow-map-heading { margin: 4rem auto 1.5rem; text-align: center; }
.workflow-map-nav ol { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; padding: 0; list-style: none; }
.workflow-map-nav { margin: 3rem auto 2.5rem; }
.workflow-map-nav li { min-width: 0; }
.workflow-map-nav a { display: grid; height: 100%; grid-template-columns: 5.5rem minmax(0,1fr); align-items: center; gap: 1rem; padding: .85rem; border: 1px solid rgba(159,226,215,.3); border-radius: 1.1rem; color: inherit; text-decoration: none; transition: border-color .2s ease, background-color .2s ease, transform .2s ease; }
.workflow-map-nav a:hover,.workflow-map-nav a:focus-visible,.workflow-map-nav li.is-active a { border-color: var(--mint,#9fe2d7); background: rgba(159,226,215,.09); }
.workflow-map-nav a:hover img,.workflow-map-nav a:focus-visible img { animation: phase-wiggle .32s ease-in-out; }
.workflow-map-nav img { width: 5.5rem; height: 4.2rem; border-radius: .65rem; object-fit: cover; }
.workflow-map-nav strong,.workflow-map-nav small { display: block; }
.workflow-map-nav small { margin-top: .4rem; opacity: .78; line-height: 1.35; }
@keyframes phase-wiggle { 25% { transform: rotate(-2deg) translateY(-2px); } 75% { transform: rotate(2deg) translateY(1px); } }
.workflow-journey { position: relative; margin-top: 3rem; }
.workflow-chapter { display: grid; min-height: 34rem; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); align-items: center; gap: clamp(2rem,7vw,7rem); padding: clamp(3.5rem,8vw,7rem) 0; border-top: 1px solid rgba(159,226,215,.25); scroll-margin-top: 6rem; }
.workflow-chapter:nth-child(even) .workflow-chapter__visual { order: -1; }
.workflow-chapter__copy h2 { margin: .35rem 0 1.5rem; font-family: var(--font-display, Georgia,serif); font-size: clamp(2.1rem,4vw,3.8rem); line-height: 1.05; }
.workflow-action { max-width: 34rem; margin: .7rem 0; font-size: clamp(1.15rem,1.8vw,1.55rem); line-height: 1.35; }
.workflow-action--vetra { color: var(--mint,#9fe2d7); }
.workflow-action--researcher { color: var(--text-primary,#f5f7f7); }
.workflow-chapter__dynamic { max-width: 37rem; margin: 1.6rem 0 1.8rem; line-height: 1.7; opacity: .86; }
.workflow-chapter__actions { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem 1rem; }
.workflow-chapter__back { margin-left: 0; }
.workflow-chapter__visual { margin: 0; }
.workflow-video-progress { display: flex; gap: .35rem; margin: 0 0 .7rem; }
.workflow-video-progress span { display: block; height: 4px; flex: 1; overflow: hidden; border-radius: 999px; background: rgb(159 226 215 / 24%); }
.workflow-video-progress span::before { display: block; width: 100%; height: 100%; border-radius: inherit; background: var(--mint, #9fe2d7); content: ""; transform: scaleX(var(--video-progress, 0)); transform-origin: left; }
.workflow-video-stack { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 1rem; background: rgb(4 29 35 / 35%); }
.workflow-video-stack .workflow-video-clip { display: none; width: 100%; height: 100%; max-height: none; object-fit: contain; border-radius: inherit; }
.workflow-video-stack .workflow-video-clip.is-current { display: block; }
.workflow-detail-trigger { display: flex; width: 100%; min-height: 3.5rem; align-items: center; justify-content: space-between; gap: 1.2rem; margin-top: 1.2rem; padding: .8rem .2rem; border: 0; border-top: 1px solid rgb(159 226 215 / 35%); border-bottom: 1px solid rgb(159 226 215 / 35%); border-radius: 0; background: transparent; color: var(--workflow-ink); font: inherit; font-size: .92rem; font-weight: 700; text-align: left; cursor: pointer; transition: color .2s ease, border-color .2s ease; }
.workflow-stage-points { display: grid; gap: .25rem; margin: 0; padding-left: 1.2rem; color: var(--workflow-muted); font-size: .9rem; line-height: 1.45; }
.workflow-detail-trigger:hover { border-color: var(--mint, #9fe2d7); color: var(--mint, #9fe2d7); }
.workflow-detail-trigger svg { width: 1.3rem; height: 1.3rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; transition: transform .2s ease; }
.workflow-detail-trigger:hover svg { transform: translateY(2px); }
.workflow-detail-trigger:focus-visible, .workflow-dialog__close:focus-visible { outline: 3px solid #ff8978; outline-offset: 4px; }
.workflow-dialog.design-detail-dialog { width: min(68rem, calc(100vw - 2rem)); }
.workflow-dialog.design-detail-dialog[open] { position: fixed; inset: var(--design-dialog-top, 5.75rem) 1rem auto; max-height: calc(100dvh - var(--design-dialog-top, 5.75rem) - 1rem); overflow: hidden; margin: 0 auto; animation: design-dialog-fade-up .32s cubic-bezier(.2,.75,.25,1) both; }
.workflow-dialog.design-detail-dialog[open] .workflow-dialog__inner { position: relative; max-height: calc(100dvh - var(--design-dialog-top, 5.75rem) - 1rem); overflow: auto; padding-top: clamp(1.25rem, 2.5vw, 2rem); scrollbar-width: none; -ms-overflow-style: none; }
.workflow-dialog[open], .workflow-dialog[open] .workflow-dialog__inner { scrollbar-width: none; -ms-overflow-style: none; }
.workflow-dialog[open]::-webkit-scrollbar, .workflow-dialog[open] .workflow-dialog__inner::-webkit-scrollbar { display: none; }
.design-detail-dialog .workflow-dialog__close { position: absolute; top: .7rem; right: clamp(1.25rem, 4vw, 3rem); z-index: 1; display: grid; width: 2.5rem; height: 2.5rem; place-items: center; margin: 0; padding: 0; border: 0; color: #fff; font-size: 2rem; line-height: 1; text-decoration: none; }
.workflow-dialog.design-detail-dialog[open]::backdrop { animation: design-dialog-backdrop-in .24s ease-out both; }
@keyframes design-dialog-fade-up { from { opacity: 0; transform: translateY(1.25rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes design-dialog-backdrop-in { from { background: rgb(5 29 32 / 0%); backdrop-filter: blur(0); } to { background: rgb(5 29 32 / 75%); backdrop-filter: blur(5px); } }
.design-dialog__stage { display: grid; min-height: 0; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); align-items: center; gap: clamp(1.5rem,4vw,4rem); padding-bottom: 1rem; border-bottom: 1px solid rgb(159 226 215 / 25%); margin-bottom: 1rem; }
.design-dialog__stage .workflow-chapter__copy h2 { margin: .25rem 0 1rem; font-family: var(--font-display, Georgia,serif); font-size: clamp(2.1rem,4vw,3.8rem); line-height: 1.05; }
.design-dialog__stage .workflow-action { margin: .7rem 0; }
.design-dialog__stage .workflow-stage-points { margin-top: 1rem; }
.design-dialog__stage .workflow-chapter__visual { min-width: 0; }
.design-dialog__stage .workflow-chapter__visual video { display: block; width: 100%; max-height: 27rem; object-fit: contain; border-radius: 1rem; background: transparent; }
.design-detail-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding-bottom: 1.5rem; }
.design-detail-card { min-width: 0; padding: clamp(1rem, 2.5vw, 1.5rem); border: 1px solid rgb(159 226 215 / 24%); border-radius: 1rem; background: rgb(4 29 35 / 35%); }
.design-detail-card__number { display: block; margin-bottom: .7rem; color: var(--mint, #9fe2d7); font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.design-detail-card h3 { margin: 0 0 .65rem; color: var(--workflow-ink); font-family: var(--font-display, Georgia, serif); font-size: clamp(1.2rem, 2vw, 1.6rem); line-height: 1.15; }
.design-detail-card p { margin: 0; color: var(--workflow-muted); font-size: .92rem; line-height: 1.55; }
.workflow-chapter__visual img { display: block; width: 100%; max-height: 27rem; object-fit: contain; border-radius: 1rem; }
.workflow-chapter__visual video { display: block; width: 100%; max-height: 27rem; object-fit: contain; border-radius: 1rem; background: transparent; }
.workflow-chapter__visual figcaption { margin-top: .75rem; font-size: .85rem; opacity: .72; }
.workflow-chapter__back { display: inline-block; margin-left: 1rem; color: inherit; text-underline-offset: .2em; }
.workflow-dialog { width: min(58rem,calc(100vw - 2rem)); max-height: min(88vh,52rem); overflow: auto; padding: 0; border: 1px solid rgba(159,226,215,.4); border-radius: 1.25rem; background: #0b3d42; color: #f5f7f7; }
.workflow-dialog::backdrop { background: rgba(3,24,27,.78); }
.workflow-dialog__inner { padding: clamp(1.25rem,4vw,3rem); }
.workflow-dialog__close { display: block; margin: 0 0 2rem auto; border: 0; background: transparent; color: inherit; text-decoration: underline; cursor: pointer; }
.workflow-dialog__inner h2 { margin: .3rem 0 1.5rem; font-family: var(--font-display,Georgia,serif); font-size: clamp(2rem,5vw,3rem); }
.workflow-dialog__detail { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 2rem; }
.workflow-dialog__detail .workflow-chapter__copy { display: contents; }
.workflow-dialog__detail .workflow-chapter__copy .eyebrow,.workflow-dialog__detail .workflow-chapter__copy h2 { display: none; }
.workflow-dialog__detail .workflow-chapter__visual { grid-column: 2; grid-row: 1 / span 4; }
.workflow-dialog__detail .workflow-chapter__dynamic { grid-column: 1; }
.workflow-dialog__detail .button { grid-column: 1; }
@media (max-width: 760px) {
  .workflow-map-nav ol { grid-template-columns: 1fr; }
  .workflow-map-nav a { grid-template-columns: 5rem minmax(0,1fr); }
  .workflow-map-nav img { width: 5rem; height: 3.8rem; }
  .workflow-chapter { min-height: 0; grid-template-columns: 1fr; gap: 1.6rem; padding-block: 3.5rem; }
  .workflow-chapter:nth-child(even) .workflow-chapter__visual { order: initial; }
  .workflow-chapter__visual img { max-height: 20rem; }
  .workflow-chapter__visual video { max-height: 20rem; }
  .design-dialog__stage { grid-template-columns: 1fr; }
  .design-detail-cards { grid-template-columns: 1fr; }
  .design-dialog__stage { min-height: 0; gap: 1.6rem; }
  .workflow-dialog.design-detail-dialog[open] { inset: 5.25rem .5rem auto; width: calc(100vw - 1rem); max-height: calc(100dvh - 5.75rem); }
  .workflow-dialog.design-detail-dialog[open] .workflow-dialog__inner { max-height: calc(100dvh - 5.75rem); }
  .design-dialog__stage .workflow-chapter__visual video { max-height: 20rem; }
  .workflow-dialog__detail { grid-template-columns: 1fr; }
  .workflow-dialog__detail .workflow-chapter__visual { grid-column: auto; grid-row: auto; }
  .workflow-dialog__detail .workflow-chapter__copy { display: block; }
  .workflow-dialog__detail .workflow-chapter__copy .workflow-chapter__dynamic { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .workflow-map-nav a { transition: none; }
  .workflow-map-nav a:hover img,.workflow-map-nav a:focus-visible img { animation: none; }
  .workflow-dialog.design-detail-dialog[open], .workflow-dialog.design-detail-dialog[open]::backdrop { animation: none; }
}
.workflow-teaser__layout {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  align-items: center;
  gap: clamp(2rem, 6vw, 6rem);
}
.workflow-teaser__copy .eyebrow { color: var(--color-teal); }
.workflow-teaser__copy h2 {
  max-width: 13ch;
  margin: 0;
  color: var(--color-teal-dark);
  font-size: clamp(2.15rem, 4.5vw, 4rem);
  font-weight: 500;
  line-height: 1.02;
}
.workflow-teaser__copy p:not(.eyebrow) {
  max-width: 35rem;
  margin: 1.25rem 0 0;
  color: var(--color-text-muted);
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.55;
}
.workflow-teaser__copy .button { margin-top: 1.75rem; }
.workflow-teaser__map {
  overflow: hidden;
  border-radius: 1.25rem;
  background: #dceae8;
  box-shadow: 0 1rem 2.5rem rgb(26 43 60 / 12%);
}
.workflow-teaser__map img { width: 100%; height: auto; }
.workflow-teaser__labels {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .45rem;
  padding: 1rem;
  background: #123d3e;
}
.workflow-teaser__labels span {
  padding: .45rem .65rem;
  border: 1px solid rgb(159 226 215 / 35%);
  border-radius: 999px;
  color: #dff7f2;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .03em;
}
@media (max-width: 56rem) {
  .workflow-teaser__layout { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .workflow-teaser__copy h2 { max-width: 15ch; }
}

@media (max-width: 44rem) {
  .landing-intro__network { width: 155%; max-width: none; }
  .landing-intro__skip { right: 50%; transform: translateX(50%); }
}

@media (prefers-reduced-motion: reduce) {
  .landing-intro__rings ellipse,
  .landing-intro__paths path,
  .landing-intro__card,
  .landing-intro__card path,
  .landing-intro__nodes circle,
  .landing-intro__glow,
  .landing-intro__content,
  .landing-intro__skip { animation: none; }
}

/* Editorial research journey and the three team use cases. */
.landing-intro { min-height: min(48rem, calc(100svh - var(--header-height))); }
.landing-intro__content { width: 100%; max-width: none; margin-top: -1rem; }
.landing-intro__caption {
  max-width: 54rem;
  margin: 0;
  color: #f5fbf9;
  font-family: var(--font-display);
  font-size: clamp(2rem, 5vw, 4.5rem);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: 1.02;
  text-transform: none;
  white-space: nowrap;
}
.landing-intro__subtitle {
  max-width: 54rem;
  margin: .45rem 0 0;
  color: #f5fbf9;
  font-size: clamp(1rem, 1.6vw, 1.35rem);
  font-weight: 500;
  letter-spacing: .01em;
  line-height: 1.3;
}
.intro-composition {
  position: absolute;
  inset: 8% max(var(--gutter), 5vw) 12%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(7rem, 1fr));
  align-items: center;
  gap: clamp(.5rem, 2vw, 1.4rem);
  pointer-events: none;
}
.landing-intro__skip { z-index: 4; }
.landing-hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr); }
.landing-hero::after { content: none; }
.landing-hero__grid { grid-template-columns: minmax(0, 1fr); }
.landing-hero h1 { max-width: 15ch; color: var(--color-teal-dark); font-size: clamp(2.7rem, 5.5vw, 5.1rem); }
.landing-hero__content > .eyebrow { color: var(--color-teal); }
.landing-hero__content .lead { max-width: 57ch; margin-top: 1.4rem; color: var(--color-text-muted); font-size: clamp(1.05rem, 1.5vw, 1.2rem); line-height: 1.65; }
.landing-hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.landing-hero__actions .button { min-height: 3.1rem; }
.landing-hero__actions .button--outline { border: 1px solid var(--color-teal-dark); background: var(--color-teal-dark); color: #fff; }
.landing-hero__actions .button--outline:hover { border-color: #16474b; background: #16474b; color: #fff; }
.landing-hero__art { position: relative; display: grid; min-height: 22rem; place-items: center; }
.landing-hero__art img { display: block; width: 100%; height: auto; max-height: 25rem; object-fit: contain; }
.evidence-node { position: absolute; display: grid; width: 8.5rem; min-height: 6rem; align-content: center; gap: .3rem; padding: 1rem; border: 1px solid rgb(11 61 66 / 15%); border-radius: 1rem; background: #fff; box-shadow: 0 1rem 2rem rgb(11 61 66 / 12%); }
.evidence-node span { color: var(--color-text-muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.evidence-node strong { color: var(--color-teal-dark); font-family: var(--font-display); font-size: 1.25rem; font-weight: 500; }
.evidence-node--source { top: 10%; left: 2%; }
.evidence-node--decision { z-index: 1; top: 39%; left: 34%; border-color: rgb(20 145 155 / 35%); background: #eaf6f3; }
.evidence-node--finding { right: 0; bottom: 8%; border-color: rgb(13 110 110 / 35%); }
.evidence-link { position: absolute; z-index: -1; width: 45%; border-top: 2px dashed rgb(20 145 155 / 45%); transform-origin: left; }
.evidence-link--one { top: 36%; left: 27%; transform: rotate(18deg); }
.evidence-link--two { top: 56%; left: 56%; border-color: rgb(13 110 110 / 50%); transform: rotate(31deg); }
.use-cases { scroll-margin-top: calc(-1 * var(--space-2)); padding-block: clamp(2.75rem, 5.5vw, 4.5rem); background: #fff; }
.use-cases__intro { max-width: none; margin-bottom: clamp(2.5rem, 5vw, 4.25rem); }
.use-cases__intro h2 { max-width: none; margin: 0; color: var(--color-teal-dark); font-family: var(--font-display); font-size: clamp(2.25rem, 4.7vw, 4.2rem); font-weight: 500; letter-spacing: -.035em; line-height: 1.02; }
.use-cases__intro > p:last-child { max-width: none; margin: 1rem 0 0; color: var(--color-text-muted); font-size: 1.08rem; line-height: 1.6; }
.research-challenges { margin-bottom: clamp(4rem, 8vw, 7rem); }
.research-challenges .use-cases__intro { margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.research-challenges__intro { max-width: 56rem; }
.research-challenges__eyebrow { margin: 0 0 .85rem !important; color: var(--color-teal) !important; font-family: var(--font-body, sans-serif); font-size: .76rem !important; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.research-challenges__intro > p:not(.research-challenges__eyebrow) { max-width: 53rem; margin: 1rem 0 0; color: var(--color-text-muted); font-size: clamp(.98rem, 1.3vw, 1.08rem); line-height: 1.65; }
.research-challenges__intro > p strong { color: var(--color-teal-dark); font-weight: 700; }
.research-challenges__closing { max-width: 55rem; margin: 1.5rem auto 0; text-align: center; color: var(--color-teal-dark); font-weight: 600; line-height: 1.6; }
.research-challenges__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.research-challenges__grid li { display: grid; grid-template-columns: 20% minmax(0, 1fr); min-width: 0; overflow: hidden; border: 1px solid rgb(11 61 66 / 10%); border-radius: .9rem; background: #f7faf9; }
.research-challenges__image { position: relative; display: flex; align-items: center; min-width: 0; background: var(--color-green-soft); }
.research-challenges__image img { display: block; width: 100%; height: auto; }
.research-challenges__image::after { content: ""; position: absolute; inset: 0 0 0 60%; background: linear-gradient(to right, transparent, #f7faf9); pointer-events: none; }
.research-challenges__content { align-self: center; min-width: 0; padding: 1.35rem 1.35rem 1.35rem 1rem; text-align: left; }
.research-challenges__grid h3 { margin: 0; color: var(--color-teal-dark); font-family: var(--font-display); font-size: 1.2rem; font-weight: 600; line-height: 1.25; }
.research-challenges__grid p { margin: .55rem 0 0; color: var(--color-text-muted); font-size: .95rem; line-height: 1.5; }
.research-challenges__references { display: grid; gap: .35rem; margin: 1rem 0 0; padding-left: 1.25rem; color: var(--color-text-muted); font-size: .82rem; line-height: 1.5; }
.research-challenges__references a { color: var(--color-teal-dark); text-underline-offset: .15em; }
.use-cases__solutions-intro { margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.use-cases__layout { display: grid; grid-template-columns: minmax(15rem, .75fr) minmax(0, 1.25fr); gap: clamp(2rem, 7vw, 7rem); align-items: start; }
.use-cases__tabs { display: grid; gap: .75rem; }
.use-cases__tabs button { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); gap: .35rem .7rem; padding: 1.15rem 1rem; border: 1px solid transparent; border-radius: .8rem; background: transparent; color: var(--color-text); cursor: pointer; font: inherit; text-align: left; }
.use-cases__tabs button > span { grid-row: 1 / span 2; color: var(--color-teal); font-size: .75rem; font-weight: 800; }
.use-cases__tabs button strong { font-family: var(--font-display); font-size: 1.12rem; font-weight: 500; line-height: 1.25; }
.use-cases__tabs button small { grid-column: 2; color: var(--color-text-muted); font-size: .86rem; line-height: 1.4; }
.use-cases__tabs button[aria-selected="true"] { border-color: rgb(20 145 155 / 24%); background: #fff; box-shadow: 0 .5rem 1.5rem rgb(26 43 60 / 6%); }
.use-cases__tabs button:focus-visible { outline: 3px solid var(--color-teal); outline-offset: 3px; }
.use-cases__panels { min-width: 0; }
.use-case-panel { min-height: 18rem; padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid rgb(11 61 66 / 10%); border-radius: 1.2rem; background: #fff; box-shadow: 0 1rem 3rem rgb(26 43 60 / 6%); }
.use-case-panel + .use-case-panel { margin-top: 1rem; }
.use-case-panel h3 { max-width: 22ch; margin: 0; color: var(--color-teal-dark); font-family: var(--font-display); font-size: clamp(1.8rem, 3.3vw, 2.8rem); font-weight: 500; line-height: 1.07; }
.use-case-panel > p:not(.eyebrow) { max-width: 62ch; color: var(--color-text-muted); line-height: 1.6; }
.use-case-panel .eyebrow { margin: 0 0 .65rem; color: var(--color-teal); font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.use-case-panel__outcome { padding: 1rem 1.1rem; border-left: 3px solid var(--color-mint); background: var(--color-green-soft); }
.use-case-panel__outcome strong { display: block; margin-bottom: .25rem; color: var(--color-teal-dark); }
.use-case-panel > a { display: inline-flex; gap: .55rem; margin-top: .5rem; color: var(--color-teal-dark); font-weight: 800; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.use-cases.has-tabs .use-case-panel[hidden] { display: none; }
.demo-invitation__content > p:not(.eyebrow) { max-width: 45rem; margin: 1rem auto 0; color: rgb(255 255 255 / 82%); line-height: 1.6; }

/* Eight video cards are dealt into a loose pile, shuffled, then fanned into a row. */
.intro-composition {
  inset: 0;
  display: block;
  overflow: hidden;
  perspective: 1200px;
}
.intro-card {
  position: absolute;
  z-index: calc(var(--card-index) + 1);
  top: calc(48% + var(--pile-y));
  left: calc(50% + var(--pile-x));
  width: min(36vw, 32rem);
  aspect-ratio: 16 / 9;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgb(226 246 241 / 55%);
  border-radius: .9rem;
  background: #102f32;
  box-shadow: 0 1.5rem 3rem rgb(0 0 0 / 35%);
  opacity: 0;
  transform: translate(-50%, -50%) rotate(var(--card-angle));
  transform-origin: center;
  transition: top .95s cubic-bezier(.2,.76,.2,1), left .95s cubic-bezier(.2,.76,.2,1), transform .68s cubic-bezier(.2,.76,.2,1), opacity .45s ease, box-shadow .5s ease;
  will-change: transform, opacity;
}
.intro-card video { display: block; width: 100%; height: 100%; object-fit: cover; }
.intro-card__still { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.intro-card__still[hidden] { display: none; }
.landing-intro.is-running .intro-card {
  top: 130%;
  left: calc(50% + var(--deal-x));
  opacity: 0;
  transform: translate(-50%, -50%) rotate(calc(var(--card-angle) * 2)) scale(.72);
}
.landing-intro.is-running .intro-card.is-dealt {
  top: calc(48% + var(--pile-y));
  left: calc(50% + var(--pile-x));
  opacity: 1;
  transform: translate(-50%, -50%) rotate(var(--card-angle));
}
.landing-intro.is-dropping .intro-card.is-dealt { top: calc(53% + var(--pile-y)); }
.landing-intro.is-shuffling .intro-card {
  opacity: 1;
  z-index: calc(10 + (7 - var(--card-index)));
  top: calc(48% + var(--shuffle-y));
  left: calc(50% + var(--shuffle-x));
  transform: translate(-50%, -50%) rotate(var(--shuffle-angle)) scale(1.06);
  box-shadow: 0 2rem 4rem rgb(0 0 0 / 42%);
  transition-duration: 1.15s;
  transition-timing-function: cubic-bezier(.22,.68,.2,1);
}
.intro-card:nth-child(1) { --shuffle-x: -29vw; --shuffle-y: -16vh; --shuffle-angle: -18deg; }
.intro-card:nth-child(2) { --shuffle-x: 22vw; --shuffle-y: 24vh; --shuffle-angle: 16deg; }
.intro-card:nth-child(3) { --shuffle-x: -17vw; --shuffle-y: 30vh; --shuffle-angle: 21deg; }
.intro-card:nth-child(4) { --shuffle-x: 31vw; --shuffle-y: -13vh; --shuffle-angle: -20deg; }
.intro-card:nth-child(5) { --shuffle-x: -25vw; --shuffle-y: -12vh; --shuffle-angle: 17deg; }
.intro-card:nth-child(6) { --shuffle-x: 18vw; --shuffle-y: 31vh; --shuffle-angle: -16deg; }
.intro-card:nth-child(7) { --shuffle-x: 27vw; --shuffle-y: -18vh; --shuffle-angle: 20deg; }
.intro-card:nth-child(8) { --shuffle-x: -31vw; --shuffle-y: 23vh; --shuffle-angle: -19deg; }
.landing-intro.is-row .intro-card {
  top: calc(68% + var(--row-y, 0vh));
  left: calc(50% + var(--row-x));
  opacity: 1;
  transform: translate(-50%, -50%) rotate(0deg) scale(.5);
  box-shadow: 0 .75rem 1.5rem rgb(0 0 0 / 32%);
  transition-duration: 1.3s;
  transition-timing-function: cubic-bezier(.22,.68,.2,1);
}
.landing-intro.is-row .intro-card:nth-child(1) { transition-delay: 0ms; }
.landing-intro.is-row .intro-card:nth-child(2) { transition-delay: 90ms; }
.landing-intro.is-row .intro-card:nth-child(3) { transition-delay: 180ms; }
.landing-intro.is-row .intro-card:nth-child(4) { transition-delay: 270ms; }
.landing-intro.is-row .intro-card:nth-child(5) { transition-delay: 360ms; }
.landing-intro.is-row .intro-card:nth-child(6) { transition-delay: 450ms; }
.landing-intro.is-row .intro-card:nth-child(7) { transition-delay: 540ms; }
.landing-intro.is-row .intro-card:nth-child(8) { transition-delay: 630ms; }
.landing-intro.is-row .landing-intro__content { align-self: start; margin-top: clamp(8rem, 18vh, 12rem); }
.landing-intro.is-running .landing-intro__content { opacity: 0; transform: translateY(1.4rem); animation: none; }
.landing-intro.is-finished .landing-intro__content { animation: intro-title-rise .8s cubic-bezier(.2,.75,.2,1) both; }
@keyframes intro-title-rise { from { opacity: 0; transform: translateY(1.5rem); } to { opacity: 1; transform: translateY(-1rem); } }
.landing-intro.is-static .intro-card { opacity: 1; transition: none; }

@media (max-width: 56rem) {
  .research-challenges__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .intro-composition { inset: 5% var(--gutter) 15%; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, minmax(5rem, 1fr)); gap: .55rem; opacity: .68; }
  .landing-intro__content { align-self: end; margin: 0 1rem 4.5rem; }
  .landing-intro__caption { font-size: clamp(2rem, 7vw, 3.5rem); }
  .landing-intro__caption { white-space: normal; }
  .landing-intro__subtitle { font-size: clamp(1.1rem, 4vw, 1.5rem); }
  .landing-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .landing-hero__art { min-height: 18rem; }
  .use-cases__layout { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .use-cases__tabs { display: none; }
  .use-case-panel { min-height: 0; }
  .use-cases.has-tabs .use-case-panel[hidden] { display: block; }
}
@media (max-width: 36rem) {
  .research-challenges__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 56rem) {
  .intro-card { width: 72vw; border-radius: .65rem; }
  .landing-intro.is-row .intro-card { top: calc(70% + var(--row-y, 0vh)); transform: translate(-50%, -50%) rotate(0deg) scale(.3); }
  .landing-intro.is-row .intro-card:nth-child(n) { transition-delay: 0ms; }
  .landing-intro.is-row .landing-intro__content { margin-top: clamp(6.5rem, 14vh, 8rem); }
}
@media (prefers-reduced-motion: reduce) {
  .landing-intro.is-running .intro-card { top: calc(70% + var(--row-y, 0vh)); opacity: 1; transform: translate(-50%, -50%) rotate(0deg) scale(.5); }
  .landing-intro.is-running .landing-intro__content { opacity: 1; transform: translateY(-1rem); }
  .landing-intro.is-finished .landing-intro__content { animation: none; }
  .landing-intro__skip { animation: none; }
}
@media (max-width: 56rem) and (prefers-reduced-motion: reduce) {
  .landing-intro.is-running .intro-card { transform: translate(-50%, -50%) rotate(0deg) scale(.3); }
}


/* Dialog close controls use a standalone accessible white X in every stage. */
.workflow-dialog__close { position: absolute; top: clamp(1.25rem, 4vw, 3rem); right: clamp(1.25rem, 4vw, 3rem); z-index: 2; display: grid; width: 2.5rem; height: 2.5rem; place-items: center; margin: 0; padding: 0; border: 0; background: transparent; color: #fff; font-size: 2rem; line-height: 1; text-decoration: none; cursor: pointer; }
.workflow-dialog__inner { position: relative; }

/* Light treatment for the methodology narrative. */
.methodology-page .workflow-story {
  --workflow-ink: #193538;
  --workflow-muted: #53696b;
  --workflow-line: rgb(13 110 110 / 24%);
  --mint: #0d6e6e;
  background: #fff;
  color: var(--workflow-ink);
}
.methodology-page .workflow-story__integration-heading .eyebrow,
.methodology-page .workflow-story .eyebrow { color: var(--color-teal); }
.methodology-page .workflow-principles article,
.methodology-page .workflow-phase,
.methodology-page .workflow-story__canopy-layer,
.methodology-page .workflow-story__integration-panel {
  border-color: rgb(11 41 45 / 14%);
  background: #f5f9f8;
  color: var(--workflow-ink);
}
.methodology-page .workflow-principles article { padding: 1.1rem; }
.methodology-page .workflow-reference-names { width: 100%; overflow: hidden; justify-content: flex-start; margin-top: 1rem; padding-top: 0; }
.methodology-page .workflow-reference-track { display: flex; width: max-content; flex: 0 0 auto; align-items: center; gap: 1rem; animation: reference-guidelines-marquee 18s linear infinite; }
.methodology-page .workflow-reference-track span { flex: 0 0 auto; }
.methodology-page .workflow-reference-track a { flex: 0 0 auto; color: inherit; text-decoration: none; }
.methodology-page .workflow-reference-track a:hover { text-decoration: underline; text-underline-offset: .2em; }
.methodology-page .workflow-reference-track a:focus-visible { border-radius: .15rem; outline: 2px solid var(--color-teal); outline-offset: 3px; }
@keyframes reference-guidelines-marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .methodology-page .workflow-reference-track { animation: none; }
  .methodology-page .workflow-reference-track span:nth-child(n + 4) { display: none; }
}
.methodology-page .workflow-principle--2 .workflow-principle__icon {
  width: min(100%, 5.5rem);
  height: 5.5rem;
  flex-basis: 5.5rem;
  margin-top: 1rem;
}
.methodology-page .workflow-story__intro h1,
.methodology-page .workflow-principles h2,
.methodology-page .workflow-map-heading h2,
.methodology-page .workflow-chapter__copy h2,
.methodology-page .workflow-story__canopy-layer h3,
.methodology-page .workflow-story__integration-footer strong { color: var(--color-teal-dark); }
.methodology-page .workflow-principle--3 h2 a { color: inherit; text-decoration: none; }
.methodology-page .workflow-principle--3 h2 a:hover { text-decoration: underline; text-underline-offset: .15em; }
.methodology-page .workflow-principle--3 h2 a:focus-visible { border-radius: .1em; outline: 2px solid var(--color-teal); outline-offset: 3px; }
.methodology-page .workflow-principle--3 { justify-content: flex-start; gap: .4rem; }
.methodology-page .workflow-principle--3 h2 { margin: 0 0 .6rem; font-family: var(--font-display); font-size: 1.25rem; font-weight: 500; letter-spacing: 0; }
.methodology-page .workflow-raise-expansion { max-width: 18ch; margin: 0 auto; color: var(--color-text-muted); font-size: .88rem; line-height: 1.4; text-align: center; }
.methodology-page .workflow-raise-expansion strong { color: var(--color-teal); font-weight: 800; }
.methodology-page .workflow-principle__icon,
.methodology-page .workflow-reference-names,
.methodology-page .workflow-principle__wordmark { color: var(--color-teal); }
.methodology-page .workflow-principle__wordmark { color: var(--color-teal) !important; }
.methodology-page .workflow-story__roles strong,
.methodology-page .workflow-story__canopy-mark,
.methodology-page .workflow-story__icon { color: var(--color-teal-dark); }
.methodology-page .workflow-story__icon,
.methodology-page .workflow-story__stage.is-active .workflow-story__icon { border-color: rgb(13 110 110 / 28%); background: #eaf6f3; }
.methodology-page .workflow-story__integration-scene,
.methodology-page .workflow-story__canopy { border-color: rgb(11 41 45 / 14%); background: #f5f9f8; box-shadow: 0 1rem 3rem rgb(26 43 60 / 7%); }
.methodology-page .workflow-story__canopy-layer { background: #fff; }
.methodology-page .workflow-story__process-deck { border-color: rgb(11 41 45 / 14%); background: #eaf6f3; }
.methodology-page .workflow-map-nav a { border-color: rgb(11 41 45 / 16%); }
.methodology-page .workflow-map-nav a:hover,
.methodology-page .workflow-map-nav a:focus-visible,
.methodology-page .workflow-map-nav li.is-active a { background: #eaf6f3; }
.methodology-page .workflow-story__closing { border-top-color: rgb(11 41 45 / 16%); }
.methodology-page .workflow-story__closing .button--light { border-color: var(--color-teal-dark); background: var(--color-teal-dark); color: #fff; }
.methodology-page .workflow-story__closing .button--light:hover { border-color: #16474b; background: #16474b; }
.methodology-page .workflow-dialog {
  border-color: rgb(11 41 45 / 16%);
  background: #fff;
  color: var(--color-text);
  box-shadow: 0 1.5rem 4rem rgb(11 41 45 / 20%);
}
.methodology-page .workflow-dialog__close { color: var(--color-teal-dark); }
.methodology-page .design-dialog__stage { border-bottom-color: rgb(11 41 45 / 16%); }
.methodology-page .design-dialog__stage .workflow-chapter__copy h2,
.methodology-page .workflow-dialog h2,
.methodology-page .design-detail-card h3 { color: var(--color-teal-dark); }
.methodology-page .design-dialog__stage .workflow-action--vetra { color: var(--color-teal); }
.methodology-page .design-dialog__stage .workflow-action--researcher,
.methodology-page .workflow-dialog .workflow-stage-points,
.methodology-page .design-detail-card p { color: var(--color-text-muted); }
.methodology-page .design-detail-card { border-color: rgb(11 41 45 / 14%); background: #f5f9f8; }
.methodology-page .workflow-video-progress span { background: rgb(13 110 110 / 18%); }
.methodology-page .workflow-video-progress span::before { background: var(--color-teal); }
.methodology-page .workflow-video-stack { border: 1px solid rgb(11 41 45 / 12%); background: #f1f7f6; }
.methodology-page .workflow-dialog__phase-nav a { color: var(--color-teal); }




/* Static Lucide illustrations replace the previous video/progress stacks. */
.workflow-stage-art__surface {
  display: grid;
  min-height: 15rem;
  aspect-ratio: 16 / 9;
  place-items: center;
  border: 1px solid rgb(159 226 215 / 24%);
  border-radius: 1rem;
  background: radial-gradient(circle at 50% 48%, rgb(159 226 215 / 13%), transparent 55%), rgb(4 29 35 / 18%);
}
.workflow-stage-art__icon {
  width: clamp(5rem, 15vw, 9rem);
  height: clamp(5rem, 15vw, 9rem);
  color: #9fe2d7;
  filter: drop-shadow(0 8px 28px rgb(9 47 53 / 20%));
}
.methodology-page .workflow-stage-art__surface {
  border-color: rgb(11 41 45 / 12%);
  background: radial-gradient(circle at 50% 48%, rgb(14 111 106 / 10%), transparent 55%), #f1f7f6;
}
.methodology-page .workflow-stage-art__icon { color: var(--color-teal); }
@media (max-width: 56rem) {
  .workflow-stage-art__surface { min-height: 11rem; }
}

/* Editorial, stacked methodology details — shared by ES and EN dialogs. */
.methodology-page .design-detail-cards {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 0 1rem;
}
.methodology-page .design-detail-card {
  min-width: 0;
  padding: clamp(1rem, 2vw, 1.4rem) .25rem;
  border: 0;
  border-bottom: 1px solid rgb(11 41 45 / 14%);
  border-radius: 0;
  background: transparent;
}
.methodology-page .design-detail-card:first-child { padding-top: .35rem; }
.methodology-page .design-detail-card:last-child { border-bottom: 0; }
.methodology-page .design-detail-card h3 {
  margin: 0 0 .35rem;
  color: var(--color-teal-dark);
  font-size: clamp(1.12rem, 1.7vw, 1.4rem);
}
.methodology-page .design-detail-card p {
  max-width: 85ch;
  font-size: .94rem;
  line-height: 1.65;
}


/* Shared workflow: 80% explanatory copy, 20% matching Vetra App icon. */
.methodology-page .workflow-journey .workflow-chapter,
.methodology-page .design-dialog__stage {
  grid-template-columns: minmax(0, 4fr) minmax(0, 1fr);
  column-gap: clamp(1rem, 3vw, 3rem);
}
.methodology-page .workflow-journey .workflow-chapter:nth-child(even) .workflow-chapter__visual {
  order: initial;
}
.methodology-page .workflow-stage-art__surface {
  aspect-ratio: 1;
  min-height: 0;
  width: 100%;
  max-width: 11rem;
  margin-inline: auto;
  border: 0;
  background: transparent;
}
.methodology-page .workflow-stage-art__icon {
  display: block;
  width: 66%;
  height: 66%;
  max-width: 6.5rem;
  max-height: 6.5rem;
  color: var(--color-teal);
  filter: none;
}
.methodology-page .workflow-dialog.design-detail-dialog[open] .workflow-dialog__inner {
  padding-top: clamp(3.25rem, 5vw, 4.5rem);
  padding-bottom: clamp(3.25rem, 5vw, 4.5rem);
}
.methodology-page .design-detail-dialog .workflow-dialog__close {
  top: clamp(1.25rem, 2vw, 2rem);
}
@media (max-width: 56rem) {
  .methodology-page .workflow-journey .workflow-chapter,
  .methodology-page .design-dialog__stage {
    grid-template-columns: minmax(0, 1fr);
  }
  .methodology-page .workflow-stage-art__surface {
    max-width: 8rem;
  }
}


/* Alternate icons across workflow chapters while keeping the 80/20 split. */
@media (min-width: 56.001rem) {
  .methodology-page .workflow-journey .workflow-chapter:nth-child(even) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 4fr);
  }
  .methodology-page .workflow-journey .workflow-chapter:nth-child(even) .workflow-chapter__visual {
    order: -1;
  }
  /* Match the expanded dialog to left-icon chapters: 20% icon, 80% copy. */
  .methodology-page .workflow-journey .workflow-chapter:nth-child(even) .design-dialog__stage {
    grid-template-columns: minmax(0, 1fr) minmax(0, 4fr);
  }
  .methodology-page .workflow-journey .workflow-chapter:nth-child(even) .design-dialog__stage .workflow-chapter__visual {
    order: -1;
  }
}


/* Compact vertical rhythm between the seven methodology stages. */
.methodology-page .workflow-journey .workflow-chapter {
  min-height: 0;
  padding-block: clamp(2rem, 4vw, 3.5rem);
}
.methodology-page .workflow-journey .workflow-chapter:first-child {
  padding-top: clamp(2rem, 4vw, 3.5rem);
}
@media (max-width: 56rem) {
  .methodology-page .workflow-journey .workflow-chapter {
    padding-block: clamp(1.75rem, 5vw, 2.5rem);
  }
}


/* Final intro scene: a responsive, content-sized grid instead of viewport offsets. */
.landing-intro.is-row {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(1.5rem, 3vw, 3rem);
  min-height: 0;
  padding: clamp(3rem, 7vh, 5rem) var(--gutter);
}
.landing-intro.is-settling { overflow: visible; }
.landing-intro.is-row .landing-intro__content {
  order: -1;
  align-self: center;
  width: min(100%, 72rem);
  margin: 0;
  text-align: center;
  opacity: 1;
  transform: none;
  animation: none;
}
.landing-intro.is-row .landing-intro__caption,
.landing-intro.is-row .landing-intro__subtitle { margin-inline: auto; }
.landing-intro.is-row .intro-composition {
  position: relative;
  inset: auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: auto;
  align-items: center;
  width: min(100%, 74rem);
  margin-inline: auto;
  gap: clamp(.5rem, 1.5vw, 1rem);
  overflow: visible;
}
.landing-intro.is-row .intro-card,
.landing-intro.is-row.is-running .intro-card,
.landing-intro.is-row.is-shuffling .intro-card,
.landing-intro.is-row.is-static .intro-card {
  position: relative;
  inset: auto;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 0;
  opacity: 1;
  transform: none;
  transition: none;
  box-shadow: 0 .75rem 1.5rem rgb(0 0 0 / 24%);
}
@media (max-width: 56rem), (max-height: 40rem) and (max-width: 75rem) {
  .landing-intro.is-row .intro-composition { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .landing-intro.is-row { padding-block: clamp(2rem, 5vh, 3.5rem); }
  .landing-intro.is-row .landing-intro__caption { white-space: normal; }
}
@media (max-width: 32rem) {
  .landing-intro.is-row .intro-composition { gap: .5rem; }
}


/* Center the three cards in row two under four evenly spaced cards. */
@media (min-width: 56.001rem) and (min-height: 40.001rem), (min-width: 75.001rem) {
  .landing-intro.is-row .intro-composition {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .landing-intro.is-row .intro-card { grid-column: span 2; }
  .landing-intro.is-row .intro-card:nth-child(5) { grid-column: 2 / span 2; }
  .landing-intro.is-row .intro-card:nth-child(6) { grid-column: 4 / span 2; }
  .landing-intro.is-row .intro-card:nth-child(7) { grid-column: 6 / span 2; }
}
@media (max-width: 56rem), (max-height: 40rem) and (max-width: 75rem) {
  .landing-intro.is-row .intro-card { grid-column: auto; }
  .landing-intro.is-row .intro-card:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    width: calc(50% - .5rem);
    justify-self: center;
  }
}

/* Methodology: dark editorial overview, white seven-stage narrative. */
.methodology-page .workflow-story { background: var(--color-white); }
.methodology-page .workflow-story__layout > .workflow-overview {
  position: relative;
  grid-column: 1;
  isolation: isolate;
  padding: clamp(3rem, 6vw, 5rem) 0 clamp(3rem, 5vw, 4rem);
}
.methodology-page .workflow-overview::before {
  position: absolute;
  z-index: -1;
  content: "";
  inset: 0 calc(50% - 50vw);
  background: var(--color-teal-dark);
}
.methodology-page .workflow-overview .workflow-story__intro {
  grid-row: auto;
  padding-bottom: clamp(2rem, 4vw, 3rem);
}
.methodology-page .workflow-overview .workflow-story__intro h1 {
  color: var(--color-white);
}
.methodology-page .workflow-overview .workflow-story__lead {
  color: var(--color-text-on-dark-muted);
}
.methodology-page .workflow-overview .workflow-principles { margin-bottom: 0; }
.methodology-page .workflow-overview .workflow-principles article {
  background: var(--color-dark-surface);
  border-color: var(--color-footer-divider);
  color: var(--color-text-on-dark-muted);
}
.methodology-page .workflow-overview .workflow-principles h2,
.methodology-page .workflow-overview .workflow-principle--3 h2 a {
  color: var(--color-white);
}
.methodology-page .workflow-overview .workflow-raise-expansion { color: var(--color-text-on-dark-muted); }
.methodology-page .workflow-overview .workflow-raise-expansion strong,
.methodology-page .workflow-overview .workflow-principle__wordmark,
.methodology-page .workflow-overview .workflow-reference-names,
.methodology-page .workflow-overview .workflow-principle__icon { color: var(--color-mint) !important; }
.methodology-page .workflow-overview .workflow-principle__icon {
  background: transparent;
  border-color: var(--color-footer-divider);
}
.methodology-page .workflow-overview .workflow-reference-track a { color: var(--color-text-on-dark); }
.methodology-page .workflow-journey { grid-column: 1; }


/* Semantic hierarchy in the methodology overview (ES/EN). */
.methodology-page .workflow-overview {
  --text-heading: var(--color-white);
  --text-body: var(--color-text-on-dark-muted);
  --text-muted: var(--color-text-on-dark-muted);
  --text-accent: var(--color-mint);
  --text-link: var(--color-mint);
}
.methodology-page .workflow-overview .workflow-principles article,
.methodology-page .workflow-overview .workflow-principles article p,
.methodology-page .workflow-overview .workflow-raise-expansion {
  color: var(--text-body);
}
.methodology-page .workflow-overview .workflow-principles h2 {
  color: var(--text-heading);
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.2;
}
.methodology-page .workflow-overview .workflow-story__lead { color: var(--text-body); font-size: var(--type-lead); }
.methodology-page .workflow-overview .workflow-principle__icon,
.methodology-page .workflow-overview .workflow-reference-names { color: var(--text-accent); }
.methodology-page .workflow-journey {
  --text-heading: var(--color-teal-dark);
  --text-body: var(--color-text);
  --text-muted: var(--color-text-muted);
  --text-accent: var(--color-teal);
}
.methodology-page .workflow-journey .workflow-chapter__copy h2 { color: var(--text-heading); }
.methodology-page .workflow-journey .workflow-chapter__copy .eyebrow { color: var(--text-accent); }
.methodology-page .workflow-journey .workflow-stage-points { color: var(--text-muted); }

/* Typography and contrast system — shared across ES/EN page sections. */
.methodology-page .workflow-overview {
  --text-heading: var(--color-white);
  --text-body: var(--color-text-on-dark-muted);
  --text-muted: var(--color-text-on-dark-muted);
  --text-accent: var(--color-mint);
}
.methodology-page .workflow-overview .workflow-principles article > p,
.methodology-page .workflow-overview .workflow-principle--1 > p,
.methodology-page .workflow-overview .workflow-raise-expansion {
  color: var(--text-body);
  font-family: var(--font-body);
  font-size: var(--type-body);
  line-height: 1.6;
}
.methodology-page .workflow-overview .workflow-principles h2 { color: var(--text-heading); }
.methodology-page .workflow-overview .workflow-principles .workflow-principle__wordmark,
.methodology-page .workflow-overview .workflow-principles .workflow-principle__icon { color: var(--text-accent); }
.methodology-page .workflow-overview .workflow-story__lead { color: var(--text-body); font-size: var(--type-lead); }
.methodology-page .workflow-journey .workflow-chapter__copy h2 { font-size: var(--type-h2); }
.methodology-page .workflow-journey .workflow-chapter__copy .eyebrow { font-size: var(--type-eyebrow); color: var(--text-accent); }
.methodology-page .design-detail-card h3 { color: var(--text-heading); font-family: var(--font-display); font-size: var(--type-h3); }
.methodology-page .design-detail-card p { color: var(--text-muted); font-size: var(--type-body); }
.landing-page .research-challenges__intro h2,
.landing-page .use-cases__solutions-intro h2 { font-size: var(--type-h2); }
.landing-page .research-challenges__eyebrow,
.landing-page .use-case-panel .eyebrow { font-size: var(--type-eyebrow) !important; color: var(--text-accent) !important; }
.landing-page .research-challenges__grid h3 { color: var(--text-heading); }
.landing-page .research-challenges__grid p { color: var(--text-muted); }
.landing-page .use-case-panel h3 { color: var(--text-heading); font-size: var(--type-h3); }
.landing-page .use-case-panel > p:not(.eyebrow) { color: var(--text-muted); font-size: var(--type-body); }

/* Keep challenge card headings visually aligned and ensure long translated labels wrap. */
.landing-page .research-challenges__grid h3 {
  text-align: left;
  text-wrap: balance;
}
.landing-page .use-cases__tabs button {
  min-width: 0;
}
.landing-page .use-cases__tabs button strong,
.landing-page .use-case-panel h3 {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  hyphens: auto;
  text-wrap: pretty;
}

/* Explicit two-line closing headline in both languages. */
.landing-page .demo-invitation #landing-title .landing-title__line { display: block; }