:root {
  --color-purple: #6e1fce;
  --color-green: #67d2a4;
  --color-charcoal: #2e2e2e;
  --color-white: #ffffff;
  --font-sans: "Inter", sans-serif;
  --font-editorial: "Merriweather", serif;
  --content-width: 1200px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
  --section-gap: 120px;
  --section-content-gap: 30px;
  --section-title-gap: var(--space-sm);
  --section-copy-gap: var(--space-xs);
  --section-control-gap: 11px;
  --section-boundary-gap: 12px;
}

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

html,
body {
  width: 100%;
  margin: 0;
  overflow-x: hidden;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--color-white);
  color: var(--color-charcoal);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

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

.full-width {
  width: 100%;
}

.site-shell {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.site-shell > section + section {
  margin-top: var(--section-gap);
}

.content-container {
  width: min(calc(100% - 40px), var(--content-width));
  margin-inline: auto;
}

.site-header {
  width: 100%;
  height: 63px;
  background: var(--color-charcoal);
  border: 1px solid rgb(0 0 0 / 15%);
}

.site-header__inner {
  width: min(calc(100% - 40px), 1253px);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.brand {
  display: block;
  width: 194px;
  height: 29px;
  flex: 0 0 auto;
}

.brand img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 19px;
  color: var(--color-white);
  font-size: 14.12px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.155px;
  text-transform: uppercase;
  white-space: nowrap;
}

.main-nav a {
  transition: opacity 160ms ease;
}

.main-nav a:hover,
.main-nav a:focus-visible {
  opacity: 0.72;
}

.mobile-menu-toggle {
  display: none;
}

.hero {
  position: relative;
  width: 100%;
  height: 750px;
  overflow: hidden;
  background-image: url("assets/images/hero-umbrella.png");
  background-position: 27.2% 51%;
  background-size: 200% auto;
  color: var(--color-white);
}

.hero__inner {
  position: relative;
  z-index: 1;
  width: min(calc(100% - 40px), 1010px);
  height: 100%;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(89.13deg, rgb(110 31 206 / 50%) 0.48%, rgb(255 255 255 / 50%) 130.16%);
  mix-blend-mode: multiply;
  pointer-events: none;
}

.hero__content {
  position: relative;
  width: 515px;
  padding-top: 159px;
}

.hero__eyebrow {
  margin: 0 0 12px;
  font-size: 22.56px;
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: -0.248px;
  text-transform: uppercase;
}

.hero h1 {
  margin: 0;
  font-size: 39.92px;
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -0.439px;
}

.hero__description {
  margin: 41px 0 0;
  font-size: 16.29px;
  font-weight: 400;
  line-height: 1.26;
  letter-spacing: -0.179px;
}

.hero__cta {
  width: 413px;
  height: 42px;
  margin-top: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  background: var(--color-green);
  color: var(--color-white);
  font-size: 15.16px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.167px;
  text-transform: none;
  transition: filter 160ms ease;
}

.hero__cta:hover,
.hero__cta:focus-visible {
  filter: brightness(0.95);
}

.testimonials {
  position: relative;
  height: 416px;
  overflow: hidden;
  background: var(--color-white);
}

.testimonials__heading {
  text-align: center;
}

.testimonials h2,
.candidates h2 {
  margin: 0;
  color: var(--color-purple);
  font-size: 44.62px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.491px;
}

.testimonials__lead,
.testimonials__audience,
.candidates__heading p {
  font-family: var(--font-editorial);
  color: var(--color-charcoal);
  text-align: center;
}

.testimonials__lead {
  margin: var(--section-title-gap) 0 0;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.33px;
}

.testimonials__audience {
  margin: var(--section-copy-gap) 0 0;
  font-size: 24px;
  font-weight: 300;
  line-height: 1.18;
  letter-spacing: -0.33px;
}

.testimonials__viewport {
  position: relative;
  margin-top: var(--section-content-gap);
  left: 50%;
  width: 1423px;
  height: 235px;
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  cursor: grab;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  transform: translateX(-50%);
}

.testimonials__track {
  width: max-content;
  display: flex;
  gap: 8px;
}

.testimonials__viewport::-webkit-scrollbar {
  display: none;
}

.testimonials__viewport.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  scroll-snap-type: none;
  user-select: none;
}

.testimonial-card {
  width: 469px;
  height: 235px;
  flex: 0 0 469px;
  flex-shrink: 0;
  margin: 0;
  padding: 21px 31px 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  border-radius: 14.33px;
  background: var(--color-green);
  color: var(--color-purple);
  box-shadow: 0 0 2.17px rgb(0 0 0 / 3%);
  text-align: center;
  scroll-snap-align: start;
}

.testimonial-card p {
  min-height: 104px;
  margin: 0;
  font-size: 16.2px;
  font-weight: 400;
  line-height: 1.46;
  letter-spacing: -0.165px;
}

.testimonial-card p strong {
  font-weight: 700;
}

.testimonial-card footer {
  width: 100%;
  display: flex;
  flex-direction: column;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.33;
  letter-spacing: -0.143px;
}

.testimonial-card footer strong {
  font-size: 14.2px;
  font-weight: 700;
}

.testimonials__dots {
  position: absolute;
  top: calc(100% - 12px);
  left: 50%;
  display: flex;
  align-items: center;
  gap: 5px;
  transform: translateX(-50%);
}

.testimonials__dot {
  width: 12px;
  height: 12px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: background-color 220ms ease, transform 220ms ease;
}

.testimonials__dot img {
  display: block;
  width: 100%;
  height: 100%;
  transition: opacity 220ms ease;
}

.testimonials__dot.is-active {
  background: var(--color-purple);
  transform: scale(1.08);
}

.testimonials__dot.is-active img {
  opacity: 0;
}

.testimonials__dot:focus-visible {
  outline: 2px solid var(--color-purple);
  outline-offset: 3px;
}

@media (max-width: 1450px) {
  .testimonials__viewport {
    width: calc(100% - 30px);
  }
}

@media (max-width: 900px) {
  body.mobile-menu-open {
    overflow: hidden;
  }

  .site-header {
    position: relative;
    z-index: 20;
    height: 62px;
  }

  .site-header__inner {
    width: calc(100% - 40px);
  }

  .brand {
    width: 154px;
    height: auto;
  }

  .mobile-menu-toggle {
    width: 44px;
    height: 44px;
    padding: 11px 9px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 5px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--color-white);
    cursor: pointer;
  }

  .mobile-menu-toggle span {
    width: 100%;
    height: 2px;
    display: block;
    border-radius: 999px;
    background: currentcolor;
    transition: transform 250ms ease, opacity 250ms ease;
  }

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

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

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

  .mobile-menu-toggle:focus-visible {
    outline: 2px solid var(--color-green);
    outline-offset: 2px;
  }

  .main-nav {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: 0;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    overflow: hidden;
    visibility: hidden;
    background: var(--color-charcoal);
    font-size: 14px;
    opacity: 0;
    transition: max-height 300ms ease, padding 300ms ease, opacity 200ms ease, visibility 0s linear 300ms;
  }

  .main-nav.is-open {
    max-height: calc(100svh - 62px);
    padding-block: 10px 18px;
    overflow-y: auto;
    visibility: visible;
    opacity: 1;
    transition: max-height 300ms ease, padding 300ms ease, opacity 200ms ease;
  }

  .main-nav a {
    min-height: 46px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgb(255 255 255 / 14%);
  }

  .main-nav a:last-child {
    border-bottom: 0;
  }

  .hero {
    height: auto;
    min-height: 650px;
    background-position: center center;
    background-size: cover;
  }

  .hero__inner {
    width: calc(100% - 40px);
    min-height: 650px;
    display: flex;
    align-items: center;
  }

  .hero__overlay {
    background: linear-gradient(90deg, rgb(110 31 206 / 78%) 0%, rgb(110 31 206 / 46%) 100%);
    mix-blend-mode: multiply;
  }

  .hero__content {
    width: 100%;
    padding: 58px 0 64px;
  }

  .hero__eyebrow {
    margin-bottom: 12px;
    font-size: 17px;
  }

  .hero h1 {
    max-width: 520px;
    font-size: clamp(28px, 8.35vw, 36px);
    line-height: 1.16;
    letter-spacing: -0.35px;
  }

  .hero h1 br,
  .hero__description br {
    display: none;
  }

  .hero__description {
    max-width: 520px;
    margin-top: 30px;
    font-size: clamp(14px, 4vw, 16px);
    line-height: 1.42;
    letter-spacing: -0.1px;
  }

  .hero__cta {
    width: min(100%, 413px);
    min-height: 46px;
    height: auto;
    margin-top: 34px;
    padding: 12px 18px;
    border-radius: 23px;
    font-size: clamp(13px, 3.8vw, 15px);
    text-align: center;
  }
}

@media (max-width: 767px) {
  .testimonials {
    height: 590px;
  }

  .testimonials__viewport {
    left: auto;
    width: calc(100% - 40px);
    height: 390px;
    margin-inline: auto;
    transform: none;
  }

  .testimonials__track {
    width: 100%;
    height: 100%;
    align-items: stretch;
  }

  .testimonial-card {
    width: 100%;
    height: auto;
    flex-basis: 100%;
    justify-content: center;
    gap: 44px;
    padding: 32px 32px 30px;
  }

  .testimonial-card p {
    min-height: 0;
    font-size: 20.25px;
  }

  .testimonial-card footer {
    font-size: 15.6px;
  }

  .testimonial-card footer strong {
    font-size: 17px;
  }

  .testimonial-card p br {
    display: none;
  }
}

@media (max-width: 359px) {
  .site-header__inner,
  .hero__inner {
    width: calc(100% - 32px);
  }

  .brand {
    width: 142px;
  }

  .hero,
  .hero__inner {
    min-height: 620px;
  }
}

.candidates {
  background: var(--color-white);
}

.candidates__heading {
  padding: 0 0 var(--section-content-gap);
  text-align: center;
}

.candidates__heading p {
  margin: var(--section-title-gap) auto 0;
  font-size: 30px;
  font-weight: 300;
  line-height: 1.18;
  letter-spacing: -0.33px;
}

.candidates__image {
  --candidate-parallax-y: 0px;
  position: relative;
  width: 100%;
  height: 611px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 56px;
  overflow: hidden;
}

.candidates__image::before {
  content: "";
  position: absolute;
  inset: -30px 0;
  background-image: url("assets/images/candidates-team.png");
  background-position: center center;
  background-size: cover;
  transform: translate3d(0, var(--candidate-parallax-y), 0);
  will-change: transform;
}

.candidates__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(89.13deg, rgb(110 31 206 / 74%) 0.48%, rgb(255 255 255 / 74%) 130.16%);
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 1;
}

.candidates__cta {
  width: 413px;
  height: 43px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  border: 0;
  background: var(--color-green);
  color: var(--color-white);
  font-size: 16.42px;
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: -0.181px;
  font-family: var(--font-sans);
  cursor: pointer;
  transition: filter 160ms ease;
}

.candidates__cta:hover,
.candidates__cta:focus-visible {
  filter: brightness(0.95);
}

.candidate-upload {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
}

.candidate-upload__input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.candidate-upload__details {
  display: flex;
  align-items: center;
  gap: 12px;
}

.candidate-upload__details[hidden] {
  display: none;
}

.candidate-upload__filename,
.candidate-upload__status {
  margin: 0;
  color: var(--color-white);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  text-shadow: 0 1px 2px rgb(0 0 0 / 35%);
}

.candidate-upload__filename {
  max-width: 290px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.candidate-upload__submit {
  min-width: 154px;
  height: 36px;
  padding: 0 18px;
  border: 0;
  border-radius: 18px;
  background: var(--color-purple);
  color: var(--color-white);
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.candidate-upload__submit:disabled,
.candidates__cta:disabled {
  cursor: wait;
  opacity: 0.72;
}

.candidate-upload__status {
  min-height: 17px;
  max-width: 520px;
}

.candidate-upload__status:empty {
  display: none;
}

.metrics {
  background: var(--color-white);
}

.metrics__panel {
  width: min(calc(100% - 40px), 1198px);
  height: 344px;
  padding: 38px 25px 25px;
  border-radius: 28px;
  background: var(--color-purple);
  color: var(--color-white);
}

.metrics h2 {
  margin: 0;
  font-size: 44.62px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.491px;
  text-align: center;
}

.metrics__grid {
  margin-top: 27px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10.6px;
}

.metric-item {
  min-width: 0;
  text-align: center;
}

.metric-item__value {
  min-height: 92px;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: var(--font-editorial);
  line-height: 1.18;
  letter-spacing: -0.362px;
}

.metric-item__main {
  display: flex;
  align-items: baseline;
  justify-content: center;
  font-size: 42.28px;
  font-weight: 700;
  white-space: nowrap;
}

.metric-item__number {
  min-width: 1ch;
  font-size: 42.28px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.metric-item:nth-child(2) .metric-item__number {
  min-width: 3ch;
}

.metric-item:nth-child(3) .metric-item__number,
.metric-item:nth-child(4) .metric-item__number,
.metric-item:nth-child(5) .metric-item__number {
  min-width: 2ch;
}

.metric-item__unit {
  display: block;
  font-size: 28.19px;
  font-weight: 300;
  text-transform: lowercase;
}

.metric-item__description {
  margin: 7px 0 0;
  font-size: 13.01px;
  font-weight: 400;
  line-height: 1.51;
  letter-spacing: -0.143px;
}

@media (max-width: 900px) {
  .candidates__heading {
    width: min(calc(100% - 40px), var(--content-width));
  }

  .candidates h2 {
    font-size: clamp(35px, 7vw, 42px);
  }

  .candidates__heading p {
    max-width: 640px;
    font-size: clamp(20px, 4.2vw, 27px);
    line-height: 1.3;
  }

  .candidates__heading p br {
    display: none;
  }

  .candidates__image {
    height: clamp(390px, 62vw, 500px);
    padding: 0 20px 38px;
  }

  .candidates__image::before {
    inset: 0;
    background-position: center center;
    transform: none;
    will-change: auto;
  }

  .candidate-upload {
    width: min(100%, 520px);
  }

  .candidates__cta {
    width: min(100%, 413px);
    min-height: 46px;
    height: auto;
    padding: 12px 18px;
    border-radius: 23px;
  }

  .candidate-upload__details {
    max-width: 100%;
    flex-wrap: wrap;
    justify-content: center;
  }

  .candidate-upload__filename,
  .candidate-upload__status {
    max-width: min(100%, 520px);
  }

  .metrics__panel {
    width: calc(100% - 40px);
    height: auto;
    padding: 38px 24px 40px;
  }

  .metrics h2 {
    font-size: clamp(35px, 7vw, 42px);
  }

  .metrics__grid {
    margin-top: var(--section-content-gap);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 34px;
  }

  .metric-item {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .metric-item:last-child {
    grid-column: 1 / -1;
    width: min(100%, 260px);
    justify-self: center;
  }

  .metric-item__value {
    min-height: 84px;
  }

  .metric-item__main,
  .metric-item__number {
    font-size: clamp(36px, 8vw, 42.28px);
  }

  .metric-item__unit {
    font-size: clamp(23px, 5.2vw, 28.19px);
  }

  .metric-item:nth-child(3) .metric-item__unit {
    font-size: clamp(21px, 4.8vw, 26px);
  }

  .metric-item__description {
    max-width: 240px;
    font-size: clamp(13px, 2.5vw, 14px);
  }

}

@media (max-width: 359px) {
  .metrics__panel {
    padding-inline: 20px;
  }

  .metrics__grid {
    grid-template-columns: 1fr;
    row-gap: 32px;
  }

  .metric-item:last-child {
    grid-column: auto;
  }
}

.segments {
  background: var(--color-white);
}

.segments__heading {
  text-align: center;
}

.segments h2 {
  margin: 0;
  color: var(--color-purple);
  font-size: 44.62px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.491px;
}

.segments h2 span {
  font-weight: 400;
}

.segments__subtitle {
  margin: var(--section-title-gap) 0 0;
  font-family: var(--font-editorial);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.33px;
}

.segments__intro {
  margin: var(--section-title-gap) 0 0;
  font-family: var(--font-editorial);
  font-size: 24.47px;
  font-weight: 300;
  line-height: 1.34;
  letter-spacing: -0.33px;
}

.segments__grid {
  width: min(calc(100% - 40px), 1069px);
  margin-top: var(--section-content-gap);
  display: grid;
  grid-template-columns: repeat(3, 347px);
  column-gap: 14px;
  row-gap: 0;
  align-items: start;
  align-content: start;
  justify-content: center;
}

.segment-card {
  height: 444px;
  margin: 0;
  padding: 18.5px 23px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 6.95px;
  background: var(--color-white);
  box-shadow: 0 0 2.32px rgb(0 0 0 / 3%);
  text-align: center;
}

.segment-card--tall {
  height: 477px;
  padding-bottom: 23px;
}

.segment-card:nth-child(n + 4) {
  transform: translateY(-10px);
}

.segment-card img {
  width: 249px;
  height: 140px;
  flex: 0 0 auto;
  border-radius: 11px;
  object-fit: cover;
}

.segment-card__copy {
  width: 301px;
  margin-top: 30px;
}

.segment-card h3 {
  margin: 0;
  color: var(--color-purple);
  font-family: var(--font-editorial);
  font-size: 21.27px;
  font-weight: 400;
  line-height: 1.51;
  letter-spacing: -0.152px;
}

.segment-card p {
  margin: 14px 0 0;
  color: rgb(0 0 0 / 80%);
  font-size: 13.85px;
  font-weight: 400;
  line-height: 1.51;
  letter-spacing: -0.152px;
}

.segments__dots {
  display: none;
}

@media (max-width: 900px) {
  .segments__heading {
    width: min(calc(100% - 40px), var(--content-width));
  }

  .segments h2 {
    font-size: clamp(35px, 7vw, 42px);
  }

  .segments__subtitle {
    font-size: clamp(25px, 5vw, 30px);
  }

  .segments__intro {
    font-size: clamp(19px, 3.8vw, 24px);
  }

  .segments__intro br {
    display: none;
  }

  .segments__grid {
    width: calc(100% - 40px);
    display: flex;
    grid-template-columns: none;
    gap: 0;
    align-items: stretch;
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    touch-action: pan-x pan-y;
    cursor: grab;
  }

  .segments__grid::-webkit-scrollbar {
    display: none;
  }

  .segments__grid.is-dragging {
    cursor: grabbing;
    scroll-behavior: auto;
    scroll-snap-type: none;
    user-select: none;
  }

  .segment-card,
  .segment-card--tall {
    width: 100%;
    height: auto;
    min-height: 500px;
    flex: 0 0 100%;
    padding: 18.5px 32px 24px;
    scroll-snap-align: start;
  }

  .segment-card:nth-child(n + 4) {
    transform: none;
  }

  .segment-card img {
    width: min(100%, 249px);
    height: auto;
    aspect-ratio: 249 / 140;
  }

  .segment-card__copy {
    width: 100%;
    max-width: 310px;
    margin-inline: auto;
  }

  .segment-card p {
    font-size: 15.18px;
    line-height: 1.51;
  }

}

.services {
  background: var(--color-white);
}

.services__panel {
  width: min(calc(100% - 40px), 1201px);
  padding-block: 55px;
  border-radius: 28px;
  background: rgb(103 210 164 / 42%);
}

.services__heading {
  text-align: center;
}

.services h2 {
  margin: 0;
  color: var(--color-purple);
  font-size: 44.62px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.491px;
}

.services h2 span {
  font-weight: 400;
}

.services__subtitle {
  margin: var(--section-title-gap) auto 0;
  color: var(--color-charcoal);
  font-family: var(--font-editorial);
  font-size: 30px;
  font-weight: 300;
  line-height: 1.18;
  letter-spacing: -0.33px;
}

.services__intro {
  margin: 12px auto 0;
  color: var(--color-charcoal);
  font-size: 20px;
  font-weight: 300;
  line-height: 1.43;
  letter-spacing: -0.22px;
}

.services__list {
  width: 1049px;
  margin: 92px auto 0;
  display: flex;
  flex-direction: column;
  gap: 50px;
}

.service-row {
  width: 1049px;
  height: 543px;
  display: grid;
  grid-template-columns: 469px 580px;
  align-items: center;
}

.service-row--image-first {
  grid-template-columns: 580px 469px;
}

.service-row__content,
.service-row__media {
  display: flex;
  align-items: center;
  justify-content: center;
}

.service-row__content {
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: flex-start;
  padding: 58px 42px;
  color: var(--color-charcoal);
}

.service-row__content h3 {
  margin: 0;
  color: var(--color-purple);
  font-family: var(--font-editorial);
  font-size: 28.66px;
  font-weight: 400;
  line-height: 1.51;
  letter-spacing: -0.205px;
}

.service-row__content h3 span {
  text-transform: none;
}

.service-row__content .service-row__title--market {
  line-height: 1;
}

.service-row__content p {
  width: 384px;
  margin: 0;
  font-size: 18.66px;
  font-weight: 500;
  line-height: 1.51;
  letter-spacing: -0.205px;
}

.service-row__content h3 + p {
  margin-top: 4px;
}

.service-row__content p + p {
  margin-top: 25px;
}

.service-row__cta {
  width: 260px;
  height: 46px;
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  background: var(--color-purple);
  color: var(--color-white);
  font-size: 18.62px;
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: -0.205px;
  text-transform: lowercase;
  transition: filter 160ms ease;
}

.service-row__cta:hover,
.service-row__cta:focus-visible,
.service-row__mobile-cta:hover,
.service-row__mobile-cta:focus-visible {
  filter: brightness(0.92);
}

.service-row__mobile-cta,
.services__dots {
  display: none;
}

.service-row__media {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 20px 28px;
}

.service-row__media img {
  display: block;
  width: 525px;
  height: 491px;
  border-radius: 11px;
  object-fit: cover;
}

.service-row--rpo {
  width: 1096px;
  height: 276px;
  margin-left: -24px;
  grid-template-columns: 594px 502px;
}

.service-row--rpo .service-row__content {
  padding: 30px 64px;
}

.service-row--rpo .service-row__content h3 {
  font-size: 22.16px;
  line-height: 1.18;
  letter-spacing: -0.159px;
}

.service-row--rpo .service-row__content p {
  width: 466px;
  font-size: 14.43px;
  font-weight: 400;
  line-height: 1.51;
  letter-spacing: -0.159px;
}

.service-row--rpo .service-row__content p + p {
  margin-top: 18px;
}

.service-row--rpo .service-row__media {
  padding: 0 47px;
}

.service-row--rpo .service-row__media img {
  width: 409px;
  height: 273px;
}

.services__closing {
  margin: 30px auto 0;
  color: #130f26;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.43;
  letter-spacing: -0.22px;
  text-align: center;
}

@media (max-width: 900px) {
  .services__panel {
    width: calc(100% - 40px);
    padding: 44px 20px;
  }

  .services h2 {
    font-size: clamp(35px, 7vw, 42px);
  }

  .services__subtitle {
    font-size: clamp(23px, 4.8vw, 29px);
    line-height: 1.3;
  }

  .services__subtitle br,
  .services__intro br,
  .services__closing br {
    display: none;
  }

  .services__intro {
    font-size: clamp(16px, 3.2vw, 19px);
  }

  .services__list {
    width: 100%;
    margin-top: 48px;
    padding-bottom: 12px;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    touch-action: pan-x pan-y;
    cursor: grab;
  }

  .services__list::-webkit-scrollbar {
    display: none;
  }

  .services__list.is-dragging {
    cursor: grabbing;
    scroll-behavior: auto;
    scroll-snap-type: none;
    user-select: none;
  }

  .service-row,
  .service-row--image-first,
  .service-row--rpo {
    width: 100%;
    height: auto;
    min-height: 0;
    flex: 0 0 100%;
    margin: 0;
    padding: 0 4px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    scroll-snap-align: start;
  }

  .service-row__media,
  .service-row--rpo .service-row__media {
    order: 1;
    width: 100%;
    height: auto;
    padding: 0;
  }

  .service-row__media img,
  .service-row--rpo .service-row__media img {
    width: 100%;
    height: auto;
    aspect-ratio: 525 / 360;
    object-fit: cover;
  }

  .service-row__content,
  .service-row--rpo .service-row__content {
    order: 2;
    width: 100%;
    height: auto;
    flex: 1;
    align-items: center;
    justify-content: center;
    padding: 28px 12px 8px;
    text-align: center;
  }

  .service-row__content h3,
  .service-row--rpo .service-row__content h3 {
    font-size: clamp(23px, 5vw, 28px);
    line-height: 1.35;
  }

  .service-row__content .service-row__title--market {
    line-height: 1.18;
  }

  .service-row__content p,
  .service-row--rpo .service-row__content p {
    width: 100%;
    max-width: 540px;
    font-size: clamp(15px, 3.1vw, 18px);
    line-height: 1.5;
  }

  .service-row__content h3 + p {
    margin-top: 12px;
  }

  .service-row__content p + p,
  .service-row--rpo .service-row__content p + p {
    margin-top: 18px;
  }

  .service-row__cta,
  .service-row__mobile-cta {
    width: min(100%, 260px);
    min-height: 46px;
    height: auto;
    margin-top: 28px;
    padding: 12px 18px;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 23px;
    background: var(--color-purple);
    color: var(--color-white);
    font-size: 18px;
    font-weight: 900;
    line-height: 1.18;
    text-transform: lowercase;
    transition: filter 160ms ease;
  }

  .services__closing {
    margin-top: 28px;
    font-size: clamp(17px, 3.4vw, 20px);
    line-height: 1.43;
  }
}

.clients,
.about {
  background: var(--color-white);
}

.clients__heading,
.about > h2 {
  text-align: center;
}

.clients h2,
.about > h2 {
  margin: 0;
  color: var(--color-purple);
  font-size: 44.62px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.491px;
}

.about > h2 span {
  font-weight: 400;
}

.clients__heading p {
  margin: var(--section-title-gap) 0 0;
  color: var(--color-charcoal);
  font-family: var(--font-editorial);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.33px;
}

.client-logos {
  width: min(calc(100% - 40px), 1203px);
  margin-top: var(--section-content-gap);
}

.client-logos__primary {
  display: grid;
  grid-template-columns: repeat(6, 195px);
  column-gap: 6.6px;
  justify-content: center;
}

.client-logo-column {
  width: 195px;
  height: 154px;
  display: grid;
  grid-template-rows: repeat(2, 1fr);
}

.client-logo,
.client-logo-box {
  display: flex;
  align-items: center;
  justify-content: center;
}

.client-logo img,
.client-logo-box img {
  display: block;
  max-width: 140px;
  max-height: 48px;
  object-fit: contain;
}

.client-logo img,
.client-logo-box {
  transform-origin: center;
  transition: transform 250ms ease;
}

.client-logo:hover img,
.client-logo:focus-within img,
.client-logo-box:hover,
.client-logo-box:focus-within {
  transform: scale(1.1);
}

.client-logo--rodbank { width: 121px; height: 33px; }
.client-logo--beepay { width: 129px; height: 35px; }
.client-logo--madeinweb { width: 139px; height: 23px; }
.client-logo--star7 { width: 75px; height: 25px; }
.client-logo--data-rudder { width: 119px; height: 33px; }
.client-logo--vedacit { width: 133px; height: 25px; }
.client-logo--fits { width: 76px; height: 30px; }
.client-logo--assai { width: 101px; height: 36px; }
.client-logo--e-cross { width: 102px; height: 20px; }
.client-logo--cga { width: 91px; height: 30px; }
.client-logo--apto { width: 105px; height: 35px; }
.client-logo--loomy { width: 83px; height: 27px; }

.client-logos__secondary {
  margin-top: var(--section-content-gap);
  display: grid;
  grid-template-columns: repeat(3, 195px);
  column-gap: 20px;
  justify-content: center;
  transform: translateY(-20px);
}

.client-logo-box {
  width: 195px;
  height: 96px;
}

.client-logo--soin { width: 59px; height: 42px; }
.client-logo--miamake { width: 109px; height: 47px; }
.client-logo--geribello { width: 102px; height: 37px; }

.about__title--mobile {
  display: none;
}

.about__layout {
  margin-top: var(--section-content-gap);
  display: grid;
  align-items: center;
}

.about__layout--umbrella {
  width: min(calc(100% - 40px), 1084px);
  min-height: 801px;
  grid-template-columns: 478px 606px;
}

.about__layout--juliana {
  width: min(calc(100% - 40px), 1061px);
  min-height: 801px;
  grid-template-columns: 583px 478px;
}

.about__photo {
  width: 478px;
  height: 801px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about__photo-frame {
  position: relative;
  width: 411px;
  height: 735px;
  overflow: hidden;
  border-radius: 11px;
}

.about--umbrella .about__photo img {
  position: absolute;
  top: -11px;
  left: -53px;
  display: block;
  width: 481px;
  height: 746px;
  max-width: none;
  object-fit: cover;
}

.about--juliana .about__photo img {
  position: absolute;
  top: -107px;
  left: -289px;
  display: block;
  width: 1039px;
  height: 1512px;
  max-width: none;
  object-fit: cover;
}

.about__copy-wrap {
  width: 606px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 39px;
}

.about__copy {
  width: 465px;
  color: var(--color-charcoal);
  font-size: 20px;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: -0.22px;
}

.about__copy p,
.about__copy blockquote {
  margin: 0;
}

.about__copy p + p,
.about__copy p + blockquote {
  margin-top: 28px;
}

.about__copy strong,
.about__copy blockquote {
  color: #000000;
  font-weight: 500;
}

.about--umbrella .about__copy > p:first-child strong {
  font-weight: 600;
}

.about__mark {
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
}

.about__copy--juliana {
  width: 495px;
  justify-self: center;
  color: var(--color-charcoal);
  text-align: right;
}

.about__copy--juliana blockquote {
  padding: 0;
  text-align: right;
}

@media (max-width: 900px) {
  .clients__heading {
    width: min(calc(100% - 40px), var(--content-width));
  }

  .clients h2,
  .about > h2,
  .about__title--mobile {
    font-size: clamp(35px, 7vw, 42px);
  }

  .clients__heading p {
    font-size: clamp(23px, 4.8vw, 29px);
    line-height: 1.3;
  }

  .clients__subtitle-mobile-line {
    display: block;
  }

  .client-logos {
    width: min(calc(100% - 40px), 560px);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 24px;
    align-items: center;
    justify-items: center;
  }

  .client-logos__primary,
  .client-logo-column,
  .client-logos__secondary {
    display: contents;
  }

  .client-logo,
  .client-logo-box {
    width: 100%;
    height: 72px;
    transform: none;
  }

  .client-logo-box:last-child {
    grid-column: 1 / -1;
    width: min(100%, 195px);
    justify-self: center;
  }

  .about__title--desktop {
    display: none;
  }

  .about__title--mobile {
    order: 1;
    display: block;
    margin: 0;
    color: var(--color-purple);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -0.491px;
    text-align: center;
  }

  .about__title--mobile span {
    font-weight: 400;
  }

  .about__layout,
  .about__layout--umbrella,
  .about__layout--juliana {
    width: min(calc(100% - 40px), 620px);
    min-height: 0;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 36px;
  }

  .about__photo {
    order: 2;
    width: 100%;
    height: auto;
  }

  .about__photo-frame {
    width: 100%;
    height: auto;
    border-radius: 11px;
  }

  .about--umbrella .about__photo img,
  .about--juliana .about__photo img {
    position: static;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
  }

  .about__copy-wrap,
  .about__copy,
  .about__copy--juliana {
    width: 100%;
  }

  .about__copy-wrap,
  .about__copy--juliana {
    order: 3;
  }

  .about__copy-wrap {
    margin-top: 0;
    flex-direction: column;
    gap: 22px;
  }

  .about__copy,
  .about__copy--juliana,
  .about__copy--juliana blockquote {
    font-size: clamp(16px, 3.4vw, 19px);
    line-height: 1.5;
    text-align: center;
  }

  .about__copy p + p,
  .about__copy p + blockquote {
    margin-top: 22px;
  }
}

@media (hover: none), (pointer: coarse) {
  .client-logo:hover img,
  .client-logo:focus-within img,
  .client-logo-box:hover,
  .client-logo-box:focus-within {
    transform: none;
  }

}

.contact {
  background: var(--color-white);
}

.contact > h2 {
  margin: 0;
  color: var(--color-purple);
  font-size: 44.62px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.491px;
  text-align: center;
}

.contact__panel {
  width: min(calc(100% - 40px), 1201px);
  min-height: 500px;
  margin-top: var(--section-content-gap);
  padding: 38px 46px;
  display: grid;
  grid-template-columns: 414px 1fr;
  column-gap: 52px;
  align-items: stretch;
  border-radius: 12px;
  background: var(--color-green);
}

.contact__details {
  padding: 35px 36px;
  display: flex;
  align-items: center;
  border-radius: 12px;
  background: #130f26;
  color: var(--color-white);
}

.contact__list {
  width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 26px;
  font-style: normal;
}

.contact__list a {
  display: flex;
  align-items: center;
  gap: 13px;
  font-size: 14.375px;
  font-weight: 700;
  line-height: 1.35;
}

.contact__icon {
  width: 46.2875px;
  height: 46.2875px;
  flex: 0 0 46.2875px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--color-purple);
  transition: background-color 250ms ease;
}

.contact__list a:hover .contact__icon,
.contact__list a:focus-visible .contact__icon {
  background: var(--color-green);
}

.contact__icon img {
  width: 49.5%;
  height: 49.5%;
  display: block;
  object-fit: contain;
}

.contact__icon img[src$="RS_LINKEDIN.png"] {
  width: 47.0547%;
  height: 47.0547%;
}

.contact-form {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.contact-form label,
.contact-form label > span {
  display: block;
}

.contact-form label > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  border: 0;
  border-radius: 18px;
  outline: 0;
  background: var(--color-white);
  color: var(--color-purple);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
}

.contact-form input {
  height: 48px;
  padding: 0 20px;
}

.contact-form textarea {
  height: 100%;
  min-height: 160px;
  padding: 16px 20px;
  resize: vertical;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: var(--color-purple);
  opacity: 1;
}

.contact-form input:focus-visible,
.contact-form textarea:focus-visible {
  outline: 2px solid var(--color-purple);
  outline-offset: 2px;
}

.contact-form__message {
  flex: 1;
  min-height: 0;
}

.contact-form button {
  width: 177px;
  height: 42px;
  border: 0;
  border-radius: 20px;
  background: var(--color-purple);
  color: var(--color-white);
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: filter 160ms ease;
}

.contact-form button:hover,
.contact-form button:focus-visible {
  filter: brightness(0.92);
}

.contact-form__status {
  position: absolute;
  right: 0;
  bottom: 12px;
  left: 195px;
  min-height: 0;
  margin: 0;
  color: #130f26;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}

.site-footer {
  width: 100%;
  min-height: 272px;
  margin-top: var(--section-gap);
  padding: 0;
  display: flex;
  align-items: center;
  background: var(--color-purple);
  color: var(--color-white);
}

.site-footer__inner {
  width: min(calc(100% - 40px), 1020px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.site-footer__statement {
  margin: 0;
  padding-bottom: 22px;
  border-bottom: 1px solid rgb(255 255 255 / 45%);
  font-family: var(--font-editorial);
  font-size: 15.6345px;
  font-weight: 700;
  line-height: 1.29;
  letter-spacing: -0.164px;
  text-align: center;
}

.site-footer__main {
  min-height: 78px;
  display: grid;
  grid-template-columns: 174px 1fr 180px;
  column-gap: 38px;
  align-items: center;
  border-bottom: 1px solid rgb(255 255 255 / 45%);
}

.site-footer__brand {
  width: 174px;
  height: 26px;
}

.site-footer__brand img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.site-footer__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 19px;
  font-size: 11.296px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.155px;
  text-transform: uppercase;
  white-space: nowrap;
}

.site-footer__email {
  justify-self: end;
  font-size: 10.88px;
  font-weight: 700;
  line-height: 1.4;
}

.site-footer__legal {
  padding-top: 19px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 8.1375px;
  font-weight: 300;
  line-height: 1.3;
  letter-spacing: -0.085px;
}

.site-footer__legal p {
  margin: 0;
}

.site-footer__legal a {
  font-size: 7.35px;
}

.site-footer__legal strong {
  font-weight: 600;
}

@media (max-width: 900px) {
  .contact > h2 {
    font-size: clamp(35px, 7vw, 42px);
  }

  .contact__panel {
    width: min(calc(100% - 40px), 620px);
    min-height: 0;
    padding: 24px 20px;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 28px;
  }

  .contact__details {
    width: 100%;
    height: auto;
    padding: 28px 24px;
  }

  .contact__list {
    gap: 20px;
  }

  .contact__list a {
    min-width: 0;
    gap: 12px;
    font-size: 13px;
  }

  .contact__list a > span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .contact__icon {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  .contact-form {
    width: 100%;
    height: auto;
  }

  .contact-form__message {
    flex: none;
  }

  .contact-form textarea {
    height: 180px;
    min-height: 180px;
  }

  .contact-form button {
    min-height: 44px;
  }

  .contact-form__status {
    position: static;
    min-height: 0;
  }

  .site-footer {
    min-height: 0;
    padding-top: 44px;
    padding-bottom: 44px;
    align-items: stretch;
  }

  .site-footer__inner {
    width: min(calc(100% - 40px), 620px);
    min-height: 0;
  }

  .site-footer__statement {
    padding: 0 0 28px;
    font-size: clamp(13.6px, 3.68vw, 16.8px);
    line-height: 1.45;
  }

  .site-footer__main {
    min-height: 0;
    padding: 28px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  .site-footer__brand {
    width: min(165px, 57.2vw);
    height: auto;
  }

  .site-footer__brand img {
    height: auto;
  }

  .site-footer__nav {
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }

  .site-footer__nav a {
    font-size: 11.55px;
    line-height: 1.35;
  }

  :is(.segments__dots, .services__dots) {
    margin-top: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
  }

  :is(.segments__dot, .services__dot) {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #d7d7d7;
    cursor: pointer;
    transition: background-color 220ms ease, transform 220ms ease;
  }

  :is(.segments__dot, .services__dot).is-active {
    background: var(--color-purple);
    transform: scale(1.08);
  }

  :is(.segments__dot, .services__dot):focus-visible {
    outline: 2px solid var(--color-purple);
    outline-offset: 3px;
  }

  .site-footer__email {
    justify-self: auto;
    font-size: 13px;
    text-align: center;
  }

  .site-footer__legal {
    padding-top: 28px;
    flex-direction: column;
    justify-content: flex-start;
    gap: 14px;
    font-size: 11px;
    line-height: 1.45;
    text-align: center;
  }

  .site-footer__legal a {
    font-size: 11px;
    line-height: 1.45;
  }

  .site-footer__legal a strong {
    display: block;
  }
}

@media (hover: none), (pointer: coarse) {
  .contact__list a:hover .contact__icon {
    background: var(--color-purple);
  }
}

.reveal,
.hero-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 600ms ease-out,
    transform 600ms ease-out;
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

.reveal.is-visible,
.hero-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .candidates__image::before {
    transform: none;
    will-change: auto;
  }

  .client-logo img,
  .client-logo-box,
  .contact__icon {
    transition: none;
  }

  .client-logo:hover img,
  .client-logo:focus-within img,
  .client-logo-box:hover,
  .client-logo-box:focus-within {
    transform: none;
  }

  .mobile-menu-toggle span,
  .main-nav {
    transition: none;
  }

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