/* Ported from the reference build by tools/port/css.mjs. Do not edit; edit the generator or override in assets/css/theme/. */
.solution__head[data-c-a-home-solution] {
  gap: var(--s-6);
  align-items: end;
  margin-bottom: clamp(1.75rem, 1rem + 1.6vw, 2.5rem);
  display: grid;
}
.solution__lede[data-c-a-home-solution] {
  max-width: 46ch;
}
@media (width>=960px) {
  .solution__head[data-c-a-home-solution] {
    grid-template-columns: 1.2fr 0.8fr;
  }
}
.relay[data-c-a-home-solution] {
  --pad: clamp(1rem, 0.5rem + 2vw, 2rem);
  border-radius: var(--r-xl);
  isolation: isolate;
  color: var(--ink);
  background:
    radial-gradient(55% 50% at 90% 0, #a796ff59, #0000 60%),
    radial-gradient(45% 50% at 0 100%, #d4f25a59, #0000 60%),
    linear-gradient(#11131a09 1px, #0000 1px) 0 0/100% 48px,
    #f6f5ff;
  position: relative;
  overflow: hidden;
  box-shadow:
    0 0 0 1px #3044f51a,
    0 40px 80px -50px #141c6b59;
}
.relay__heads[data-c-a-home-solution] {
  z-index: 2;
  padding: var(--pad) 0 var(--s-4);
  grid-template-columns: repeat(3, 1fr);
  display: grid;
  position: relative;
}
.head[data-c-a-home-solution] {
  padding-inline: var(--s-4);
  text-align: center;
  justify-items: center;
  gap: 6px;
  display: grid;
}
.head__avatar[data-c-a-home-solution] {
  background: linear-gradient(135deg, #ffd9c2, #ffb3a1);
  border-radius: 50%;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 4px;
  display: grid;
  box-shadow: 0 0 0 4px #fff;
}
.head__avatar[data-c-a-home-solution] span[data-c-a-home-solution] {
  background: #fff;
  border-radius: 50% 50% 45% 45%;
  width: 20px;
  height: 20px;
  translate: 0 -3px;
  box-shadow: 0 12px 0 -2px #fff;
}
.head__badge[data-c-a-home-solution] {
  height: 52px;
  color: var(--ink);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  box-shadow:
    0 0 0 1px var(--line),
    0 8px 18px -10px #11131a4d;
  background: #fff;
  border-radius: 14px;
  place-items: center;
  margin-bottom: 4px;
  padding: 0 16px;
  display: grid;
}
.head__logo[data-c-a-home-solution] {
  height: 52px;
  box-shadow:
    0 0 0 1px var(--line),
    0 0 0 5px #d4f25a80;
  background: #fff;
  border-radius: 14px;
  place-items: center;
  margin-bottom: 4px;
  padding: 0 16px;
  display: grid;
}
.head__label[data-c-a-home-solution] {
  font-family: var(--font-display);
  font-size: var(--fs-md);
  font-weight: var(--fw-semibold);
}
.head__note[data-c-a-home-solution] {
  color: var(--muted);
  max-width: 24ch;
  font-size: 0.8rem;
}
.relay__stage[data-c-a-home-solution] {
  padding: var(--s-6) 0 var(--pad);
  position: relative;
}
.lane[data-c-a-home-solution] {
  border-left: 1.5px dashed #11131a29;
  width: 0;
  position: absolute;
  top: 0;
  bottom: 0;
}
.lane--client[data-c-a-home-solution] {
  left: 16.6667%;
}
.lane--agency[data-c-a-home-solution] {
  left: 50%;
}
.lane--team[data-c-a-home-solution] {
  border-left-color: #3044f54d;
  left: 83.3333%;
}
.wall[data-c-a-home-solution] {
  z-index: 0;
  background:
    linear-gradient(90deg, #3044f512, #3044f505 40%), repeating-linear-gradient(-45deg, #3044f50a 0 2px, #0000 2px 12px);
  border-left: 1px solid #3044f52e;
  position: absolute;
  inset: 0 0 0 66.6667%;
}
.wall[data-c-a-home-solution] span[data-c-a-home-solution] {
  border-radius: var(--r-pill);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--cobalt);
  background: #3044f514;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 0.62rem;
  display: inline-flex;
  position: absolute;
  top: 14px;
  right: 14px;
}
.steps[data-c-a-home-solution] {
  z-index: 1;
  gap: var(--s-2);
  display: grid;
  position: relative;
}
.step[data-c-a-home-solution] {
  height: 84px;
  position: relative;
}
.step__route[data-c-a-home-solution] {
  display: none;
}
.arrow[data-c-a-home-solution] {
  top: 58px;
  left: var(--l);
  width: var(--w);
  height: 2px;
  position: absolute;
}
.arrow__line[data-c-a-home-solution] {
  background: var(--ink);
  transform-origin: 0;
  transition: transform 0.7s var(--ease-out) var(--d);
  border-radius: 2px;
  position: absolute;
  inset: 0;
  transform: scaleX(0);
}
.arrow__head[data-c-a-home-solution] {
  border-top: 2px solid var(--ink);
  border-right: 2px solid var(--ink);
  opacity: 0;
  width: 10px;
  height: 10px;
  transition: opacity 0.2s var(--ease-out) calc(var(--d) + 0.6s);
  position: absolute;
  top: 50%;
  right: -2px;
  translate: 0 -50%;
  rotate: 45deg;
}
.step--back[data-c-a-home-solution] .arrow__line[data-c-a-home-solution] {
  transform-origin: 100%;
}
.step--back[data-c-a-home-solution] .arrow__head[data-c-a-home-solution] {
  left: -2px;
  right: auto;
  rotate: -135deg;
}
.step--internal[data-c-a-home-solution] .arrow__line[data-c-a-home-solution] {
  background: var(--cobalt);
}
.step--internal[data-c-a-home-solution] .arrow__head[data-c-a-home-solution] {
  border-color: var(--cobalt);
}
.bubble[data-c-a-home-solution] {
  top: 0;
  left: calc(var(--l) + var(--w) / 2);
  --bx: -50%;
  box-shadow:
    0 0 0 1px var(--line),
    0 10px 24px -14px #11131a59;
  text-align: center;
  white-space: nowrap;
  opacity: 0;
  transform: translate(var(--bx), 8px);
  transition:
    opacity 0.5s var(--ease-out) calc(var(--d) + 0.25s),
    transform 0.5s var(--ease-out) calc(var(--d) + 0.25s);
  background: #fff;
  border-radius: 14px;
  justify-items: center;
  gap: 2px;
  padding: 0.5rem 0.9rem;
  display: grid;
  position: absolute;
}
.bubble__msg[data-c-a-home-solution] {
  font-weight: var(--fw-semibold);
  font-size: var(--fs-sm);
}
.bubble__note[data-c-a-home-solution] {
  color: var(--muted);
  font-size: 0.74rem;
}
.step--internal[data-c-a-home-solution] .bubble[data-c-a-home-solution] {
  background: var(--cobalt-mist);
  box-shadow: 0 0 0 1px #3044f540;
}
.step--work[data-c-a-home-solution] .bubble[data-c-a-home-solution] {
  left: var(--x);
  background: var(--lime);
  color: var(--cobalt-ink);
  top: 8px;
  box-shadow: 0 12px 30px -12px #d4f25a99;
}
.step--work[data-c-a-home-solution] .bubble__note[data-c-a-home-solution] {
  color: #141c6bb3;
}
html.js .step[data-c-a-home-solution][data-reveal] {
  opacity: 1;
  transform: none;
}
html.js .step[data-c-a-home-solution][data-reveal].is-in .arrow__line[data-c-a-home-solution] {
  transform: scaleX(1);
}
html.js .step[data-c-a-home-solution][data-reveal].is-in .arrow__head[data-c-a-home-solution],
html.js .step[data-c-a-home-solution][data-reveal].is-in .bubble[data-c-a-home-solution] {
  opacity: 1;
  transform: translate(var(--bx), 0);
}
html:not(.js) .arrow__line[data-c-a-home-solution] {
  transform: none;
}
html:not(.js) .arrow__head[data-c-a-home-solution],
html:not(.js) .bubble[data-c-a-home-solution] {
  opacity: 1;
  transform: translate(var(--bx), 0);
}
@media (width<=899px) {
  .relay__heads[data-c-a-home-solution],
  .lane[data-c-a-home-solution],
  .wall[data-c-a-home-solution],
  .arrow[data-c-a-home-solution] {
    display: none;
  }
  .relay__stage[data-c-a-home-solution] {
    padding: var(--pad);
  }
  .steps[data-c-a-home-solution] {
    gap: var(--s-3);
    border-left: 1.5px dashed #11131a2e;
    padding-left: 22px;
  }
  .step[data-c-a-home-solution] {
    gap: 8px;
    height: auto;
    display: grid;
  }
  .step[data-c-a-home-solution]:before {
    content: "";
    width: 12px;
    height: 12px;
    box-shadow: inset 0 0 0 2px var(--ink);
    background: #fff;
    border-radius: 50%;
    position: absolute;
    top: 4px;
    left: -29px;
  }
  .step--internal[data-c-a-home-solution]:before,
  .step--work[data-c-a-home-solution]:before {
    box-shadow: inset 0 0 0 2px var(--cobalt);
  }
  .step__route[data-c-a-home-solution] {
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
    align-items: center;
    gap: 8px;
    font-size: 0.68rem;
    display: flex;
  }
  .step__n[data-c-a-home-solution] {
    color: var(--cobalt);
  }
  .bubble[data-c-a-home-solution],
  .step--work[data-c-a-home-solution] .bubble[data-c-a-home-solution] {
    --bx: 0%;
    text-align: left;
    white-space: normal;
    justify-items: start;
    position: static;
  }
  .bubble[data-c-a-home-solution] {
    transition-delay: 0.12s;
  }
}
