.hero {
  display: grid;
  grid-template: 1fr / 1fr;
  min-height: clamp(32.5rem, 74svh, 47.5rem);
  overflow: hidden;
  background: #fff;
  animation: heroFade 640ms ease both;
}

.hero__media,
.hero__content {
  grid-area: 1 / 1;
}

.hero__media picture {
  display: block;
  inline-size: 100%;
  block-size: 100%;
}

.hero__media img {
  width: 100%;
  height: 100%;
  min-height: clamp(32.5rem, 74svh, 47.5rem);
  max-width: none;
  object-fit: cover;
  object-position: 62% center;
}

.hero__content {
  z-index: 1;
  width: min(51.5625rem, calc(100% - var(--page-padding) * 2));

  margin-left: clamp(1.5rem, 6.6vw, 7.625rem);
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.125rem;
  padding-block: 2.625rem;
}

.hero h1 {
  width: 65vw;
  margin-bottom: 0;
  color: #020202;
}

.hero__lead {
  margin: 0;
  font-size: clamp(1rem, 1.3vw, 1.5625rem);
  font-weight: 500;
  color: var(--color-slight-dark);
}

.hero__points {
  display: flex;
  flex-wrap: wrap;
  gap: 1.0625rem clamp(1.5rem, 3.6vw, 4.375rem);
  padding: 0;
  margin: 0.375rem 0 0.5rem;
  font-weight: 900;
  list-style: none;
}

.hero__points li {
  position: relative;
  padding-left: 1.125rem;
  font-size: 1.5625rem;
}

.hero__points li::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 0.3125rem;
  height: 0.3125rem;
  content: "";
  border-radius: 50%;
  background: currentColor;
  transform: translateY(-50%);
}

.hero__logos {
  display: flex;
  align-items: center;
  gap: clamp(1.375rem, 4vw, 3.25rem);
  margin-top: 1.125rem;
  width: 35.625rem;
  height: 9.375rem;
  flex-direction: row;
  justify-content: space-evenly;
}

.hero__logos img {
  width: 9.4375rem;
  height: 6.9375rem;
  object-fit: contain;
}

.hero__logos img:first-child {
  height: 6.9375rem;
  width: 9.4375rem;
}

.mission {
  position: relative;
  min-height: 540px;
  display: grid;
  align-items: center;
  isolation: isolate;
  overflow: hidden;
}

.mission__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: url("../images/mission-bg-1536.webp") center / cover no-repeat;
  background-image: image-set(
    url("../images/mission-bg-1536.webp") 1x,
    url("../images/mission-bg-3200.webp") 2x
  );
}

.mission::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: rgba(255, 255, 255, 0.5);
}

.mission__content {
  text-align: center;
}

.mission h2 {
  font-size: clamp(1.250rem, calc(0.700rem + 2.75vw), 4.000rem);
}

.mission h2 span {
  color: var(--color-red);
}

.mission p:not(.eyebrow) {
  margin-bottom: 0;
  color: #403F3F;
  font-size: clamp(0.750rem, calc(0.500rem + 1.25vw), 2.000rem);
  font-weight: 500;
}

.why-now {
  position: relative;
  overflow: hidden;
  background: #e7e7e7;
  isolation: isolate;
}

.why-now__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: url("../images/why-now-collage-1536.webp") center / cover no-repeat;
  background-image: image-set(
    url("../images/why-now-collage-1536.webp") 1x,
    url("../images/why-now-collage-1920.webp") 2x
  );
  opacity: 0.26;
}

.why-now::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: rgba(239, 239, 239, 0.6);
}

.why-now__content {
  position: relative;
}

.why-now h2 {
  max-width: 680px;
  font-size: clamp(1.875rem, calc(1.438rem + 2.188vw), 4.063rem);
}

.why-now__lead {
  max-width: 960px;
  margin-bottom: 54px;
  font-size: clamp(1.000rem, calc(0.813rem + 0.938vw), 1.938rem);
  font-weight: 500;
  line-height: 1.9;
}

.why-now__cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px 56px;
}

.why-card {
  --why-card-content-gap: 26px;
  --why-card-text-gap: 8px;
  display: flex;
  align-items: flex-start;
  gap: var(--why-card-content-gap);
  min-height: 160px;
  padding: 32px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset;
}

.why-card .why-card__icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
}

.why-card__content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
  margin-top: 2%;
  gap: var(--why-card-text-gap);
}

.why-card__title {
  margin: 0;
  color: var(--color-red);
  font-size: clamp(24px, 2.5vw, 38px);
  font-weight: 700;
  line-height: 1;
}

.why-card__description {
  margin: 0;
  color: #777;
  font-size: clamp(15px, 1.3vw, 18px);
  font-weight: 500;
}

@media (min-width: 48rem) {
  .why-now {
    --why-reference-width: 120rem;
    --why-container-width: 90rem;
    --why-scale: clamp(0.4, calc(100vw / var(--why-reference-width)), 1);
    --why-container-gutter: calc(27rem * var(--why-scale));
    --why-content-top: calc(15rem * var(--why-scale));
    --why-group-width: calc(90.25rem * var(--why-scale));
    --why-label-size: calc(2rem * var(--why-scale));
    --why-label-gap: calc(2.75rem * var(--why-scale));
    --why-title-size: calc(4.0625rem * var(--why-scale));
    --why-title-gap: calc(2.125rem * var(--why-scale));
    --why-lead-size: calc(2rem * var(--why-scale));
    --why-lead-gap: calc(6rem * var(--why-scale));
    --why-card-width: calc(42.3125rem * var(--why-scale));
    --why-card-height: calc(15.75rem * var(--why-scale));
    --why-card-column-gap: calc(4.625rem * var(--why-scale));
    --why-card-row-gap: calc(2.125rem * var(--why-scale));
    --why-card-padding-y: calc(2.25rem * var(--why-scale));
    --why-card-padding-x: calc(2.5rem * var(--why-scale));
    --why-icon-size: calc(5.4rem * var(--why-scale));
    --why-icon-svg-size: calc(3rem * var(--why-scale));
    --why-card-title-size: calc(2.8rem * var(--why-scale));
    --why-card-text-size: calc(1.75rem * var(--why-scale));
    display: grid;
    width: 100%;
    aspect-ratio: 1920 / 1552;
    padding-block: 0;
    overflow: clip;
    background: #e4e4e4;
  }

  .why-now__media {
    position: relative;
    inset: auto;
    z-index: 0;
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    min-height: 0;
    margin-left: 0;
    opacity: 0.38;
  }

  .why-now::after {
    position: relative;
    inset: auto;
    z-index: 1;
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    background: rgba(232, 232, 232, 0.54);
    pointer-events: none;
  }

  .why-now__content {
    z-index: 2;
    grid-area: 1 / 1;
    align-self: start;
    display: flex;
    flex-direction: column;
    width: min(var(--why-container-width), calc(100% - var(--why-container-gutter)));
    padding-top: var(--why-content-top);
  }

  .why-now__content.container {
    width: min(var(--why-container-width), calc(100% - var(--why-container-gutter)));
  }

  .why-now .eyebrow {
    width: min(100%, var(--why-group-width));
    margin: 0 auto var(--why-label-gap);
    font-size: var(--why-label-size);
    line-height: 1.2;
  }

  .why-now h2 {
    width: min(100%, var(--why-group-width));
    max-width: var(--why-group-width);
    margin: 0 auto var(--why-title-gap);
    color: #111;
    font-size: var(--why-title-size);
    line-height: 1.32;
  }

  .why-now__lead {
    width: min(100%, var(--why-group-width));
    max-width: var(--why-group-width);
    margin: 0 auto var(--why-lead-gap);
    color: #111;
    font-size: var(--why-lead-size);
    font-weight: 500;
    line-height: 1.75;
  }

  .why-now__cards {
    width: min(100%, var(--why-group-width));
    grid-template-columns: repeat(2, var(--why-card-width));
    justify-content: center;
    gap: var(--why-card-row-gap) var(--why-card-column-gap);
    margin-inline: auto;
  }

  .why-card {
    --why-card-content-gap: calc(1.35rem * var(--why-scale));
    --why-card-text-gap: calc(2.25rem * var(--why-scale));
    border-radius: 9px;
    width: var(--why-card-width);
    min-height: var(--why-card-height);
    padding: var(--why-card-padding-y) var(--why-card-padding-x);
    background: rgb(255 255 255 / 70%);
  }

  .why-card .icon-bubble {
    align-self: center;
    width: var(--why-icon-size);
    height: var(--why-icon-size);
    margin-top: -6%;
  }

  .why-card .icon-bubble svg {
    width: var(--why-icon-svg-size);
    height: var(--why-icon-svg-size);
  }

  .why-card__title {
    font-size: var(--why-card-title-size);
    line-height: 1.05;
  }

  .why-card__description {
    color: #666;
    font-size: var(--why-card-text-size);
    line-height: 1.65;
  }
}

.icon-bubble,
.feature-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255, 45, 34, 0.13);
  color: var(--color-red);
}

.icon-bubble svg,
.feature-icon svg {
  width: 26px;
  height: 26px;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}

:is(.specialized, .reward, .work-way, .day-life) {
  --section-container-width: 90rem;
  --section-container-ratio: 75%;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 100%;
  padding-block: 0;
  overflow: hidden;
}

:is(.specialized, .reward, .work-way, .day-life)>.container {
  inline-size: min(var(--section-container-ratio), var(--section-container-width));
  margin-inline: auto;
  padding-inline: 0;
}

.work-way {
  --work-reference-width: 120rem;
  --work-scale: clamp(0.4, calc(100vw / var(--work-reference-width)), 1);
  --work-heading-width: calc(64rem * var(--work-scale));
  --work-heading-gap: calc(9.25rem * var(--work-scale));
  --work-eyebrow-size: calc(1.625rem * var(--work-scale));
  --work-eyebrow-gap: calc(2.75rem * var(--work-scale));
  --work-title-size: calc(4.15rem * var(--work-scale));
  --work-title-line-height: calc(5.375rem * var(--work-scale));
  --work-title-gap: calc(4.75rem * var(--work-scale));
  --work-copy-size: calc(2.22rem * var(--work-scale));
  --work-copy-line-height: calc(2.625rem * var(--work-scale));
  --work-image-width: calc(41.5rem * var(--work-scale));
  --work-image-height: calc(27.75rem * var(--work-scale));
  --work-feature-column-width: calc(33.5rem * var(--work-scale));
  --work-column-gap: calc(11.5rem * var(--work-scale));
  --work-row-gap: calc(5rem * var(--work-scale));
  --work-feature-gap: calc(2.875rem * var(--work-scale));
  --work-feature-width: calc(33.5rem * var(--work-scale));
  --work-feature-height: calc(9.875rem * var(--work-scale));
  --work-feature-padding-y: calc(1.5rem * var(--work-scale));
  --work-feature-padding-x: calc(1.875rem * var(--work-scale));
  --work-feature-content-gap: calc(1.75rem * var(--work-scale));
  --work-feature-icon-container-size: calc(5.625rem * var(--work-scale));
  --work-feature-icon-size: calc(2.625rem * var(--work-scale));
  --work-feature-title-size: calc(2.9rem * var(--work-scale));
  --work-feature-title-gap: calc(0.925rem * var(--work-scale));
  --work-feature-text-size: calc(1.575rem * var(--work-scale));
  --work-left-offset: calc(4rem * var(--work-scale));
  --work-bottom-image-offset: calc(-4rem * var(--work-scale));
  background: #fff;
  aspect-ratio: 1920 / 2041;
}

.work-way .section-heading {
  max-inline-size: var(--work-heading-width);
  margin: 0 auto var(--work-heading-gap);
  text-align: center;
}

.work-way .section-heading .eyebrow {
  margin: 0 0 var(--work-eyebrow-gap);
  font-size: var(--work-eyebrow-size);
  line-height: 1.2;
}

.work-way .section-heading h2 {
  margin: 0 0 var(--work-title-gap);
  font-size: var(--work-title-size);
  line-height: var(--work-title-line-height);
}

.work-way .section-heading p:not(.eyebrow) {
  margin: 0;
  color: #535252;
  font-size: var(--work-copy-size);
  font-weight: 600;
  line-height: var(--work-copy-line-height);
}

.work-way__grid {
  display: grid;
  grid-template-columns: var(--work-image-width) var(--work-feature-column-width);
  grid-template-areas:
    "photoTop featuresRight"
    "featuresLeft photoBottom";
  align-items: center;
  justify-content: start;
  gap: var(--work-row-gap) var(--work-column-gap);
}

.work-way__image {
  inline-size: var(--work-image-width);
  block-size: var(--work-image-height);
  max-inline-size: none;
  object-fit: cover;
}

.work-way__image--top {
  grid-area: photoTop;
}

.work-way__image--bottom {
  grid-area: photoBottom;
  margin-left: var(--work-bottom-image-offset);
}

.work-way__features {
  display: grid;
  gap: var(--work-feature-gap);
  justify-items: start;
}

.work-way__features--right {
  grid-area: featuresRight;
}

.work-way__features--left {
  grid-area: featuresLeft;
  padding-left: var(--work-left-offset);
}

.work-feature {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: var(--work-feature-content-gap);
  inline-size: var(--work-feature-width);
  min-block-size: var(--work-feature-height);
  padding: var(--work-feature-padding-y) var(--work-feature-padding-x);
  background: #f0f0f0;
}

.work-feature h3 {
  margin: 0 0 var(--work-feature-title-gap);
  font-size: var(--work-feature-title-size);
  font-weight: 600;
  line-height: 1.18;
}

.work-feature p {
  margin: 0;
  color: #666;
  font-size: var(--work-feature-text-size);
  font-weight: 500;
  line-height: 1.35;
}

.work-way .feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 var(--work-feature-icon-container-size);
  inline-size: var(--work-feature-icon-container-size);
  block-size: var(--work-feature-icon-container-size);
  border: 0;
  border-radius: 50%;
  background: #e2e2e1;
  color: #737471;
}

.work-way .feature-icon svg {
  display: block;
  inline-size: var(--work-feature-icon-size);
  block-size: var(--work-feature-icon-size);
  overflow: visible;
}

.day-life {
    --day-reference-width: 120rem;
    --day-scale: clamp(0.4, calc(100vw / var(--day-reference-width)), 1);
    --day-grid-offset: calc(1.875rem * var(--day-scale));
    --day-eyebrow-size: calc(1.75rem * var(--day-scale));
    --day-eyebrow-gap: calc(3.25rem * var(--day-scale));
    --day-title-size: calc(4.5rem * var(--day-scale));
    --day-title-line-height: calc(6rem * var(--day-scale));
    --day-title-gap: calc(4rem * var(--day-scale));
    --day-column-width: calc(41.75rem * var(--day-scale));
    --day-column-gap: calc(3rem * var(--day-scale));
    --day-route-title-width: calc(21.5rem * var(--day-scale));
    --day-route-title-min-height: calc(5.5rem * var(--day-scale));
    --day-route-title-padding-block: calc(1.75rem * var(--day-scale));
    --day-route-title-padding-inline: calc(3rem * var(--day-scale));
    --day-route-title-left-notch: calc(2.125rem * var(--day-scale));
    --day-route-title-right-notch: calc(2.75rem * var(--day-scale));
    --day-route-title-gap: calc(3.125rem * var(--day-scale));
    --day-route-title-font-size: calc(2rem * var(--day-scale));
    --day-route-title-main-offset-inline: calc(0.25rem * var(--day-scale));
    --day-route-title-side-offset-inline: calc(0.6875rem * var(--day-scale));
    --day-route-title-side-gap: calc(0.3125rem * var(--day-scale));
    --day-list-gap: calc(4.625rem * var(--day-scale));
    --day-list-line-left: calc(1.375rem * var(--day-scale));
    --day-dot-size: calc(2.75rem * var(--day-scale));
    --day-dot-border: calc(0.188rem * var(--day-scale));
    --day-item-padding-left: calc(5rem * var(--day-scale));
    --day-time-size: calc(1.56rem * var(--day-scale));
    --day-time-gap: calc(1.25rem * var(--day-scale));
    --day-strong-size: calc(1.54rem * var(--day-scale));
    --day-text-width: calc(35rem * var(--day-scale));
    --day-text-size: calc(1.34rem * var(--day-scale));
    --day-text-line-height: calc(2.625rem * var(--day-scale));
    --day-text-gap: calc(1rem * var(--day-scale));
    --day-photo-opacity: 0.13;
    --day-photo-radius: calc(0.25rem * var(--day-scale));
    --day-left-up-width: calc(39rem * var(--day-scale));
    --day-left-up-height: calc(29rem * var(--day-scale));
    --day-left-up-x: calc(-1.5rem * var(--day-scale));
    --day-left-up-y: calc(18rem * var(--day-scale));
    --day-left-up-rotation: -10deg;
    --day-left-down-width: calc(35rem * var(--day-scale));
    --day-left-down-height: calc(27rem * var(--day-scale));
    --day-left-down-x: calc(5.75rem * var(--day-scale));
    --day-left-down-y: calc(58rem * var(--day-scale));
    --day-left-down-rotation: 12deg;
    --day-right-photo-width: calc(39rem * var(--day-scale));
    --day-right-photo-height: calc(27rem * var(--day-scale));
    --day-right-photo-x: calc(3.25rem * var(--day-scale));
    --day-right-photo-y: calc(41rem * var(--day-scale));
    --day-right-photo-rotation: 7deg;
    background: #fff;
    aspect-ratio: 1920 / 2085;
}

.day-life .eyebrow {
  margin: 0 0 var(--day-eyebrow-gap);
  font-size: var(--day-eyebrow-size);
  line-height: 1.2;
}

.day-life h2 {
  margin: 0 0 var(--day-title-gap);
  font-size: var(--day-title-size);
  line-height: var(--day-title-line-height);
  font-weight: 700;
}

.timeline-grid {
  display: grid;
  grid-template-columns: var(--day-column-width) var(--day-column-width);
  gap: var(--day-column-gap);
  justify-content: start;
  margin-left: var(--day-grid-offset);
}

.timeline-column {
  position: relative;
  min-inline-size: 0;
  isolation: isolate;
}

.timeline-column::before,
.timeline-column::after {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  inline-size: var(--day-left-up-width);
  block-size: var(--day-left-up-height);
  content: "";
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: var(--day-photo-radius);
  opacity: var(--day-photo-opacity);
}

.timeline-column::before {
  inset-block-start: var(--day-left-up-y);
  inset-inline-start: var(--day-left-up-x);
  background-image: url("../images/timeline-left-up-800.webp");
  background-image: image-set(
    url("../images/timeline-left-up-800.webp") 1x,
    url("../images/timeline-left-up-1600.webp") 2x
  );
  transform: rotate(var(--day-left-up-rotation));
}

.timeline-column::after {
  inset-block-start: var(--day-left-down-y);
  inset-inline-start: var(--day-left-down-x);
  inline-size: var(--day-left-down-width);
  block-size: var(--day-left-down-height);
  background-image: url("../images/work-remote-512.webp");
  background-image: image-set(
    url("../images/work-remote-320.webp") 1x,
    url("../images/work-remote-512.webp") 2x
  );
  transform: rotate(var(--day-left-down-rotation));
}

.timeline-column:nth-child(2)::before {
  inset-block-start: var(--day-right-photo-y);
  inset-inline-start: var(--day-right-photo-x);
  inline-size: var(--day-right-photo-width);
  block-size: var(--day-right-photo-height);
  background-image: url("../images/work-man-480.webp");
  background-image: image-set(
    url("../images/work-man-480.webp") 1x,
    url("../images/work-man-960.webp") 2x
  );
  background-position: center;
  transform: rotate(var(--day-right-photo-rotation));
}

.timeline-column:nth-child(2)::after {
  content: none;
}

.timeline-column>* {
  position: relative;
  z-index: 1;
}

.day-life__route-title {
     --day-life-route-title-background: transparent;
    --day-life-route-shadow-inline: calc(0.3125rem * var(--day-scale));
    --day-life-route-shadow-block: calc(0.4375rem * var(--day-scale));
    --day-life-route-shadow-blur: calc(0.25rem * var(--day-scale));
    --day-life-route-shadow-color: rgba(0, 0, 0, 0.24);
    position: relative;
    z-index: 0;
    isolation: isolate;
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
    align-items: center;
    inline-size: var(--day-route-title-width);
    max-inline-size: 100%;
    min-block-size: var(--day-route-title-min-height);
    padding-block: var(--day-route-title-padding-block);
    padding-inline: var(--day-route-title-padding-inline);
    margin: 0 0 var(--day-route-title-gap);
    overflow: visible;
    color: #050505;
    font-family: var(--font-sans);
    font-size: var(--day-route-title-font-size);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-align: start;
    white-space: nowrap;
    background: transparent;
    box-shadow: none;
    filter: drop-shadow(
    var(--day-life-route-shadow-inline)
    var(--day-life-route-shadow-block)
    var(--day-life-route-shadow-blur)
    var(--day-life-route-shadow-color)
  );
}

.day-life__route-title::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  background: var(--day-life-route-title-background);
  clip-path: polygon(var(--day-route-title-left-notch) 0, 100% 0, calc(100% - var(--day-route-title-right-notch)) 50%, 100% 100%, var(--day-route-title-left-notch) 100%, 0 50%);
  pointer-events: none;
}

.day-life__route-title::after {
  content: none;
}

.day-life__route-title--main {
  --day-life-route-title-background: #f2ef53;
  margin-inline-start: var(--day-route-title-main-offset-inline);
}

.day-life__route-title--side {
  --day-life-route-title-background: #d4de49;
  margin-inline-start: var(--day-route-title-side-offset-inline);
  margin-block-end: var(--day-route-title-side-gap);
}

.timeline-list {
  position: relative;
  display: grid;
  gap: var(--day-list-gap);
  padding: 0;
  margin: 0;
  list-style: none;
}

.reveal--right>.timeline-list {
  margin-top: 16%;
}

.timeline-list::before {
  height: 89%;
  position: absolute;
  top: calc(var(--day-dot-size) / 2);
  bottom: calc(var(--day-dot-size) / 2);
  left: var(--day-list-line-left);
  content: "";
  border-left: calc(0.187rem * var(--day-scale)) solid var(--color-red);
}

.timeline-list li {
  position: relative;
  padding-left: var(--day-item-padding-left);
}

.timeline-list li::before {
  position: absolute;
  top: 0;
  left: 0;
  inline-size: var(--day-dot-size);
  block-size: var(--day-dot-size);
  content: "";
  border: var(--day-dot-border) solid var(--color-red);
  border-radius: 50%;
  background: var(--color-red);
  box-shadow: inset 0 0 0 calc(0.4375rem * var(--day-scale)) #fff, inset 0 0 0 calc(1rem * var(--day-scale)) var(--color-red);
}

.timeline-list time {
  display: inline-block;
  margin-right: var(--day-time-gap);
  color: var(--color-red);
  font-size: var(--day-time-size);
  font-weight: 700;
  line-height: 1.4;
}

.timeline-list strong {
  font-size: var(--day-strong-size);
  font-weight: 700;
  line-height: 1.4;
}

.timeline-list p {
    max-inline-size: var(--day-text-width);
    margin: var(--day-text-gap) 0 0;
    color: #585555;
    font-size: var(--day-text-size);
    font-weight: 500;
    line-height: var(--day-text-line-height);
}

.reward {
  --reward-reference-width: 120rem;
  --reward-scale: clamp(0.4, calc(100vw / var(--reward-reference-width)), 1);
  --reward-eyebrow-size: calc(1.875rem * var(--reward-scale));
  --reward-eyebrow-gap: calc(2.5rem * var(--reward-scale));
  --reward-title-size: calc(4.875rem * var(--reward-scale));
  --reward-title-line-height: calc(6.25rem * var(--reward-scale));
  --reward-title-gap: calc(6.75rem * var(--reward-scale));
  --reward-image-width: calc(88.125rem * var(--reward-scale));
  --reward-image-offset: calc(1.375rem * var(--reward-scale));
  --reward-note-width: calc(46rem * var(--reward-scale));
  --reward-note-gap: calc(7.625rem * var(--reward-scale));
  --reward-note-padding: calc(2rem * var(--reward-scale));
  --reward-note-bar: calc(0.5rem * var(--reward-scale));
  --reward-note-size: calc(1.75rem * var(--reward-scale));
  color: #fff;
  background: var(--color-dark);
  aspect-ratio: 1920 / 1247;
}

.reward .eyebrow {
  margin: 0 0 var(--reward-eyebrow-gap);
  font-size: var(--reward-eyebrow-size);
  line-height: 1.2;
}

.reward h2 {
  margin: 0 0 var(--reward-title-gap);
  color: #fff;
  font-size: var(--reward-title-size);
  line-height: var(--reward-title-line-height);
}

.reward h2 span {
  color: var(--color-red);
}

.reward__image {
  inline-size: var(--reward-image-width);
  max-inline-size: none;
  margin-inline: var(--reward-image-offset) auto;
}

.reward__mobile {
  display: none;
}

.reward__note {
  position: relative;
  max-inline-size: var(--reward-note-width);
  margin: var(--reward-note-gap) 0 0;
  padding-left: var(--reward-note-padding);
  font-size: var(--reward-note-size);
  font-weight: 500;
  line-height: 1.45;
}

.reward__note::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  inline-size: var(--reward-note-bar);
  content: "";
  background: var(--color-red);
}

.focus {
    --focus-reference-width: 124.5rem;
    --focus-reference-ratio: 1992 / 1386;
    --focus-scale: clamp(0.385542, calc(100vw / var(--focus-reference-width)), 1);
    --focus-container-width: 90rem;
    --focus-container-ratio: 76%;
    --focus-left-width: calc(42rem * var(--focus-scale));
    --focus-right-width: calc(40.625rem * var(--focus-scale));
    --focus-agent-width: calc(37.75rem * var(--focus-scale));
    --focus-column-gap: calc(10rem * var(--focus-scale));
    --focus-row-gap: calc(7.25rem * var(--focus-scale));
    --focus-intro-offset: calc(2.875rem * var(--focus-scale));
    --focus-support-offset: calc(1rem * var(--focus-scale));
    --focus-agent-offset: calc(-3.25rem * var(--focus-scale));
    --focus-eyebrow-size: calc(1.945rem * var(--focus-scale));
    --focus-eyebrow-line-height: calc(2.25rem * var(--focus-scale));
    --focus-eyebrow-margin: calc(3rem * var(--focus-scale));
    --focus-title-size: calc(2.9rem * var(--focus-scale));
    --focus-title-line-height: calc(4rem * var(--focus-scale));
    --focus-title-margin: calc(4.25rem * var(--focus-scale));
    --focus-copy-size: calc(1.6rem * var(--focus-scale));
    --focus-copy-line-height: calc(2.375rem * var(--focus-scale));
    --focus-image-height: calc(27.125rem * var(--focus-scale));
    --focus-support-min-height: calc(21.5rem * var(--focus-scale));
    --focus-support-padding-block: calc(3.0rem * var(--focus-scale));
    --focus-support-padding-inline: calc(2rem * var(--focus-scale));
    --focus-support-radius: calc(1.5rem * var(--focus-scale));
    --focus-support-title-size: calc(1.75rem * var(--focus-scale));
    --focus-support-title-margin: calc(3.25rem * var(--focus-scale));
    --focus-support-list-size: calc(1.17rem * var(--focus-scale));
    --focus-support-list-row-gap: calc(1.375rem * var(--focus-scale));
    --focus-support-list-column-gap: calc(2.5rem * var(--focus-scale));
    --focus-agent-title-size: calc(2.5rem * var(--focus-scale));
    --focus-agent-title-line-height: calc(3rem * var(--focus-scale));
    --focus-agent-title-margin: calc(2.375rem * var(--focus-scale));
    --focus-agent-row-height: calc(4.75rem * var(--focus-scale));
    --focus-agent-row-gap: calc(5rem * var(--focus-scale));
    --focus-agent-row-padding: calc(3rem * var(--focus-scale));
    --focus-agent-text-size: calc(1.7rem * var(--focus-scale));
    --focus-agent-text-line-height: calc(1.75rem * var(--focus-scale));
    --focus-check-width: calc(1.8rem * var(--focus-scale));
    --focus-check-height: calc(1rem * var(--focus-scale));
    --focus-check-border: calc(0.3125rem * var(--focus-scale));
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding-block: 0;
    background: #fff;
    aspect-ratio: var(--focus-reference-ratio);
    overflow: hidden;
}

.focus>.container {
  width: min(var(--focus-container-ratio), var(--focus-container-width));
  margin-inline: auto;
  padding-inline: 0;
}

.focus__grid {
  display: grid;
  grid-template-columns: var(--focus-left-width) var(--focus-right-width);
  grid-template-areas:
    "intro image"
    "support work";
  column-gap: var(--focus-column-gap);
  row-gap: var(--focus-row-gap);
  align-items: start;
  justify-content: center;
}

.focus__intro {
  grid-area: intro;
  margin-top: var(--focus-intro-offset);
  width: calc(44rem * var(--focus-scale));
}

.focus__intro .eyebrow {
  margin: 0 0 var(--focus-eyebrow-margin);
  font-size: var(--focus-eyebrow-size);
  line-height: var(--focus-eyebrow-line-height);
}

.focus__intro h2 {
  margin: 0 0 var(--focus-title-margin);
  font-weight: 700;
  color: #202124;
  font-size: var(--focus-title-size);
  line-height: var(--focus-title-line-height);
}

.focus__intro p:not(.eyebrow) {
  margin: 0;
  color: #202124;
  font-size: var(--focus-copy-size);
  font-weight: 500;
  line-height: var(--focus-copy-line-height);
}

.focus__image {
  grid-area: image;
  width: var(--focus-right-width);
  height: var(--focus-image-height);
  max-width: none;
  object-fit: cover;
}

.support-box {
  grid-area: support;
  align-self: start;
  width: var(--focus-left-width);
  min-height: var(--focus-support-min-height);
  margin-top: var(--focus-support-offset);
  margin-bottom: calc(3rem * var(--focus-scale));
  padding: var(--focus-support-padding-block) var(--focus-support-padding-inline);
  color: #fff;
  background: #43506a;
  border-radius: var(--focus-support-radius);
}

.support-box h3 {
  margin: 0 0 var(--focus-support-title-margin);
  font-size: var(--focus-support-title-size);
  line-height: 1.45;
}

.support-box ul {
  display: grid;
  grid-template-columns: repeat(2, max-content);
  gap: var(--focus-support-list-row-gap) var(--focus-support-list-column-gap);
  padding: 0;
  margin: 0;
  font-size: var(--focus-support-list-size);
  font-weight: 700;
  line-height: 1.45;
  list-style: none;
}

.support-box li {
  white-space: nowrap;
}

.support-box li::before {
  content: "\30FB";
}

.agent-work {
  grid-area: work;
  justify-self: center;
  width: var(--focus-agent-width);
  max-width: var(--focus-agent-width);
  margin-top: var(--focus-agent-offset);
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  outline: 0;
}

.agent-work h3 {
  margin: 0 0 var(--focus-agent-title-margin);
  color: #050505;
  font-size: var(--focus-agent-title-size);
  font-weight: 800;
  line-height: var(--focus-agent-title-line-height);
  text-align: center;
}

.agent-work ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.agent-work li {
  display: flex;
  align-items: center;
  gap: var(--focus-agent-row-gap);
  min-height: var(--focus-agent-row-height);
  padding-inline-start: var(--focus-agent-row-padding);
  color: #6b6b6b;
  font-size: var(--focus-agent-text-size);
  font-weight: 500;
  line-height: var(--focus-agent-text-line-height);
  border-top: 0.0625rem dotted #aaa;
}

.agent-work li:first-child {
  border-top: 0;
}

.agent-work .check-icon {
  flex: 0 0 auto;
  width: var(--focus-check-width);
  height: var(--focus-check-height);
  border-left-width: var(--focus-check-border);
  border-bottom-width: var(--focus-check-border);
}

.check-icon,
.check-list li::before {
  display: block;
  width: 20px;
  height: 11px;
  border-left: 5px solid var(--color-red);
  border-bottom: 5px solid var(--color-red);
  transform: rotate(-45deg);
}

.specialized {
  --specialized-reference-width: 120rem;
  --specialized-scale: clamp(0.4, calc(100vw / var(--specialized-reference-width)), 1);
  --specialized-eyebrow-size: calc(1.875rem * var(--specialized-scale));
  --specialized-eyebrow-gap: calc(4rem * var(--specialized-scale));
  --specialized-title-size: calc(4.0625rem * var(--specialized-scale));
  --specialized-title-line-height: calc(5.625rem * var(--specialized-scale));
  --specialized-title-width: calc(75rem * var(--specialized-scale));
  --specialized-title-gap: calc(5.75rem * var(--specialized-scale));
  --specialized-accent-offset: calc(3.25rem * var(--specialized-scale));
  --specialized-accent-width: calc(0.875rem * var(--specialized-scale));
  --specialized-card-width: calc(43.375rem * var(--specialized-scale));
  --specialized-card-height: calc(34.875rem * var(--specialized-scale));
  --specialized-card-gap: calc(3.25rem * var(--specialized-scale));
  --specialized-card-radius: calc(1.75rem * var(--specialized-scale));
  --specialized-card-padding-y: calc(4.625rem * var(--specialized-scale));
  --specialized-card-padding-x: calc(4rem * var(--specialized-scale));
  --specialized-card-title-size: calc(2.7rem * var(--specialized-scale));
  --specialized-card-title-gap: calc(2.875rem * var(--specialized-scale));
  --specialized-list-size: calc(1.8rem * var(--specialized-scale));
  --specialized-list-gap: calc(1.5rem * var(--specialized-scale));
  --specialized-list-icon-col: calc(2.375rem * var(--specialized-scale));
  --specialized-list-icon-size: calc(1.5rem * var(--specialized-scale));
  --specialized-list-check-width: calc(1.875rem * var(--specialized-scale));
  --specialized-list-check-height: calc(1.125rem * var(--specialized-scale));
  --specialized-list-check-border: calc(0.375rem * var(--specialized-scale));
  background: var(--color-soft);
  aspect-ratio: 1920 / 1301;
}

.specialized .eyebrow {
  margin: 0 0 var(--specialized-eyebrow-gap);
  font-size: var(--specialized-eyebrow-size);
  line-height: 1.2;
}

.specialized .accent-heading {
  max-inline-size: var(--specialized-title-width);
  margin: 0 0 var(--specialized-title-gap);
  padding-left: var(--specialized-accent-offset);
  font-size: var(--specialized-title-size);
  line-height: var(--specialized-title-line-height);
  font-weight: 700;
}

.specialized .accent-heading::before {
  inline-size: var(--specialized-accent-width);
}

.comparison-grid {
  display: grid;
  grid-template-columns: repeat(2, var(--specialized-card-width));
  gap: var(--specialized-card-gap);
  justify-content: start;
}

.comparison-card {
  inline-size: var(--specialized-card-width);
  min-block-size: var(--specialized-card-height);
  padding: var(--specialized-card-padding-y) var(--specialized-card-padding-x);
  border-radius: var(--specialized-card-radius);
  background: #fff;
  box-shadow: var(--shadow-card);
}

.comparison-card h3 {
  margin: 0 0 var(--specialized-card-title-gap);
  font-size: var(--specialized-card-title-size);
  font-weight: 600;
  line-height: 1.35;
}

.comparison-card--positive {
  border: 0.0625rem solid rgba(16, 23, 45, 0.08);
}

.comparison-card--positive h3 {
  color: var(--color-red);
}

.cross-list,
.check-list {
  display: grid;
  gap: var(--specialized-list-gap);
  padding: 0;
  margin: 0;
  color: #666;
  font-size: var(--specialized-list-size);
  font-weight: 500;
  line-height: 1.45;
  list-style: none;
}

ul.check-list {
  font-weight: 600;
}

.cross-list li,
.check-list li {
  display: grid;
  grid-template-columns: var(--specialized-list-icon-col) 1fr;
  align-items: center;
  gap: calc(1.125rem * var(--specialized-scale));
}

.cross-list li::before {
  inline-size: var(--specialized-list-icon-size);
  block-size: var(--specialized-list-icon-size);
  content: "";
  background: linear-gradient(45deg, transparent 44%, #8a8a8a 44%, #8a8a8a 56%, transparent 56%),
    linear-gradient(-45deg, transparent 44%, #8a8a8a 44%, #8a8a8a 56%, transparent 56%);
}

.check-list li::before {
  inline-size: var(--specialized-list-check-width);
  block-size: var(--specialized-list-check-height);
  margin-top: calc(0.375rem * var(--specialized-scale));
  border-left-width: var(--specialized-list-check-border);
  border-bottom-width: var(--specialized-list-check-border);
  content: "";
}

.reasons {
  padding-block: clamp(82px, 11vw, 142px);
}

.reason-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px;
}

.reason-card {
  min-height: 290px;
  padding: 38px 32px;
  background: #fff;
  border-radius: var(--radius);
  box-shadow: 0 2px 0 rgba(16, 23, 45, 0.04);
}

.reason-card span {
  display: grid;
  place-items: center;
  width: 66px;
  height: 66px;
  margin-bottom: 24px;
  color: #fff;
  border-radius: 50%;
  background: var(--color-red-soft);
  font-size: 24px;
  font-weight: 900;
}

.reason-card h3 {
  height: 23%;
  margin: 0 0 18px;
  color: #050505;
  font-size: clamp(20px, 2vw, 26px);
  font-weight: 700;
}

.reason-card p {
  margin: 0;
  color: #666;
  font-weight: 500;
  line-height: 1.45;
}

@media (min-width: 48rem) {
  .reasons {
    --reasons-reference-width: 124.5rem;
    --reasons-container-width: 90rem;
    --reasons-scale: clamp(0.385542, calc(100vw / var(--reasons-reference-width)), 1);
    --reasons-side-space: calc(11.25rem * var(--reasons-scale));
    --reasons-label-size: calc(1.95rem * var(--reasons-scale));
    --reasons-label-gap: calc(2.875rem * var(--reasons-scale));
    --reasons-title-size: calc(3.8rem * var(--reasons-scale));
    --reasons-heading-gap: calc(5.25rem * var(--reasons-scale));
    --reasons-card-width: calc(29.2rem * var(--reasons-scale));
    --reasons-card-height: calc(30.2rem * var(--reasons-scale));
    --reasons-card-gap: calc(3rem * var(--reasons-scale));
    --reasons-card-padding-x: calc(2.5rem * var(--reasons-scale));
    --reasons-card-padding-y: calc(2.75rem * var(--reasons-scale));
    --reasons-card-radius: calc(0.5rem * var(--reasons-scale));
    --reasons-number-size: calc(6.16rem * var(--reasons-scale));
    --reasons-number-gap: calc(2rem * var(--reasons-scale));
    --reasons-number-font-size: calc(2.25rem * var(--reasons-scale));
    --reasons-card-title-size: calc(2.25rem * var(--reasons-scale));
    --reasons-card-title-gap: calc(1.75rem * var(--reasons-scale));
    --reasons-card-text-size: calc(1.5rem * var(--reasons-scale));
    display: grid;
    width: 100%;
    aspect-ratio: 1992 / 1152;
    padding-block: 0;
    overflow: clip;
  }

  .reasons>.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: min(var(--reasons-container-width), calc(100% - var(--reasons-side-space) * 2));
    justify-content: center;
  }

  .reasons .section-heading {
    width: 100%;
    max-width: none;
    margin-bottom: var(--reasons-heading-gap);
  }

  .reasons .eyebrow {
    margin: 0 0 var(--reasons-label-gap);
    font-size: var(--reasons-label-size);
    line-height: 1.2;
  }

  .reasons h2 {
    margin: 0;
    font-size: var(--reasons-title-size);
    line-height: 1.2;
  }

  .reason-grid {
    grid-template-columns: repeat(3, minmax(0, var(--reasons-card-width)));
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    gap: var(--reasons-card-gap);
  }

  .reason-card {
    width: var(--reasons-card-width);
    min-height: var(--reasons-card-height);
    padding: var(--reasons-card-padding-y) var(--reasons-card-padding-x);
    border-radius: var(--reasons-card-radius);
  }

  .reason-card span {
    width: var(--reasons-number-size);
    height: var(--reasons-number-size);
    margin-bottom: var(--reasons-number-gap);
    font-size: var(--reasons-number-font-size);
  }

  .reason-card h3 {
    margin-bottom: var(--reasons-card-title-gap);
    font-size: var(--reasons-card-title-size);
    line-height: 1.35;
  }

  .reason-card p {
    font-size: var(--reasons-card-text-size);
    line-height: 1.3;
  }
}

.stories {
      --stories-reference-width: 120rem;
    --stories-scale: clamp(0.4, calc(100vw / var(--stories-reference-width)), 1);
    --stories-container-width: 90rem;
    --stories-container-ratio: 75%;
    --stories-eyebrow-size: calc(1.75rem * var(--stories-scale));
    --stories-eyebrow-gap: calc(2.75rem * var(--stories-scale));
    --stories-title-size: calc(4.2rem * var(--stories-scale));
    --stories-title-line-height: calc(5.25rem * var(--stories-scale));
    --stories-title-gap: calc(5.5rem * var(--stories-scale));
    --stories-row-left-offset: calc(5rem * var(--stories-scale));
    --stories-row-gap: calc(3.125rem * var(--stories-scale));
    --stories-row-second-gap: calc(4.125rem * var(--stories-scale));
    --stories-row-second-margin: calc(5.375rem * var(--stories-scale));
    --stories-image-width: calc(29.5rem * var(--stories-scale));
    --stories-image-height: calc(44.25rem * var(--stories-scale));
    --stories-first-body-width: calc(43rem * var(--stories-scale));
    --stories-second-body-width: calc(47rem * var(--stories-scale));
    --stories-caption-gap: calc(1.5rem * var(--stories-scale));
    --stories-caption-size: calc(2.2rem * var(--stories-scale));
    --stories-role-min-width: calc(14.95rem * var(--stories-scale));
    --stories-role-height: calc(4.45rem * var(--stories-scale));
    --stories-role-padding-x: calc(1.5rem * var(--stories-scale));
    --stories-role-margin: calc(2rem * var(--stories-scale));
    --stories-role-size: calc(1.45rem * var(--stories-scale));
    --stories-heading-size: calc(2.45rem * var(--stories-scale));
    --stories-heading-line-height: calc(3.925rem * var(--stories-scale));
    --stories-heading-margin: calc(2.375rem * var(--stories-scale));
    --stories-tag-width: calc(26rem * var(--stories-scale));
    --stories-tag-height: calc(5.5rem * var(--stories-scale));
    --stories-tag-margin: calc(3.25rem * var(--stories-scale));
    --stories-tag-size: calc(2.2rem * var(--stories-scale));
    --stories-copy-size: calc(1.225rem * var(--stories-scale));
    --stories-copy-line-height: calc(2.625rem * var(--stories-scale));
    --stories-cta-margin: calc(6rem * var(--stories-scale));
    --stories-button-width: calc(45.625rem * var(--stories-scale));
    --stories-button-height: calc(7.15rem * var(--stories-scale));
    --stories-button-size: calc(2.4rem * var(--stories-scale));
    display: flex;
    align-items: center;
    justify-content: center;
    inline-size: 100%;
    padding-block: 0;
    background: #fff;
    aspect-ratio: 1920 / 2479;
}

.stories .container {
  inline-size: min(var(--stories-container-ratio), var(--stories-container-width));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.stories .eyebrow {
  margin: 0 0 var(--stories-eyebrow-gap);
  font-size: var(--stories-eyebrow-size);
  line-height: 1.2;
}

.stories h2 {
  margin: 0 0 var(--stories-title-gap);
  font-size: var(--stories-title-size);
  line-height: var(--stories-title-line-height);
  font-weight: 700;
}

.story {
  display: grid;
  grid-template-columns: var(--stories-image-width) var(--stories-first-body-width);
  gap: var(--stories-row-gap);
  align-items: center;
  justify-content: start;
  margin-top: 0;
  margin-left: var(--stories-row-left-offset);
}

.story--second {
  grid-template-columns: var(--stories-second-body-width) var(--stories-image-width);
  gap: var(--stories-row-second-gap);
  margin-top: var(--stories-row-second-margin);
}

.story figure {
  margin: 0;
  text-align: center;
}

.story img {
  inline-size: var(--stories-image-width);
  block-size: var(--stories-image-height);
  object-fit: cover;
  object-position: center;
}

.story--first img {
  object-position: center top;
}

.story--second img {
  object-position: center top;
}

.story figcaption {
  margin-top: var(--stories-caption-gap);
  color: #080808;
  font-size: var(--stories-caption-size);
  font-weight: 600;
  line-height: 1.2;
}

.story__role {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: var(--stories-role-min-width);
  min-block-size: var(--stories-role-height);
  margin: 0 0 var(--stories-role-margin);
  padding-inline: var(--stories-role-padding-x);
  color: #fff;
  background: #101827;
  font-size: var(--stories-role-size);
  font-weight: 600;
  line-height: 1;
}

.story h3 {
  margin: 0 0 var(--stories-heading-margin);
  font-size: var(--stories-heading-size);
  font-weight: 600;
  line-height: var(--stories-heading-line-height);
}

.story__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--stories-tag-width);
  min-block-size: var(--stories-tag-height);
  margin: 0 0 var(--stories-tag-margin);
  padding-inline: calc(1.5rem * var(--stories-scale));
  color: #fff;
  background: #e46868;
  font-size: var(--stories-tag-size);
  font-weight: 600;
  line-height: 1;
  text-align: center;
}

.story__body p:last-child {
  margin-bottom: 0;
  color: #4e4e4e;
  font-size: var(--stories-copy-size);
  font-weight: 500;
  line-height: var(--stories-copy-line-height);
}

.stories__cta {
  display: flex;
  justify-content: center;
  margin-top: var(--stories-cta-margin);
}

.stories__cta .button {
  inline-size: var(--stories-button-width);
  min-inline-size: 0;
  block-size: var(--stories-button-height);
  min-block-size: var(--stories-button-height);
  border-radius: 0;
  font-size: var(--stories-button-size);
}

.stories__cta .button svg {
    inline-size: calc(4rem * var(--stories-scale));
    block-size: calc(4rem * var(--stories-scale));
}

.join {
     --join-reference-width: 120rem;
    --join-scale: clamp(0.4, calc(100vw / var(--join-reference-width)), 1);
    --join-container-width: 90rem;
    --join-container-ratio: 75%;
    --join-content-offset: calc(1.25rem * var(--join-scale));
    --join-group-gap: calc(3rem * var(--join-scale));
    --join-steps-to-message-gap: calc(9.1875rem * var(--join-scale));
    --join-step-heading-gap: calc(2.375rem * var(--join-scale));
    --join-step-heading-size: max(calc(2.8rem * var(--join-scale)), 1.125rem);
    --join-card-width: calc(13.725rem * var(--join-scale));
    --join-card-height: calc(24.6375rem * var(--join-scale));
    --join-card-gap: calc(0.6875rem * var(--join-scale));
    --join-card-padding-block: calc(2.75rem * var(--join-scale));
    --join-card-padding-inline: calc(1.125rem * var(--join-scale));
    --join-card-number-gap: calc(2.75rem * var(--join-scale));
    --join-card-title-gap: calc(2.7rem * var(--join-scale));
    --join-card-number-size: max(calc(2.7rem * var(--join-scale)), 1.125rem);
    --join-card-title-size: max(calc(1.4rem * var(--join-scale)), 0.75rem);
    --join-card-copy-size: max(calc(1rem * var(--join-scale)), 0.625rem);
    --join-card-copy-line-height: 2.1;
    --join-message-image-width: calc(33.8125rem * var(--join-scale));
    --join-message-image-height: calc(50.75rem * var(--join-scale));
    --join-message-gap: calc(3.125rem * var(--join-scale));
    --join-message-width: calc(48.3125rem * var(--join-scale));
    --join-message-body-offset: 0rem;
    --join-message-eyebrow-size: max(calc(1.825rem * var(--join-scale)), 1rem);
    --join-message-eyebrow-gap: calc(1.75rem * var(--join-scale));
    --join-message-title-size: max(calc(3.35rem * var(--join-scale)), 2rem);
    --join-message-title-line-height: 2;
    --join-message-title-gap: calc(1.25rem * var(--join-scale));
    --join-message-copy-size: max(calc(1.2rem * var(--join-scale)), 0.75rem);
    --join-message-copy-line-height: 2.2;
    --join-message-indent: calc(1rem * var(--join-scale));
    --join-message-name-gap: calc(1.25rem * var(--join-scale));
    --join-signature-width: calc(20.4375rem * var(--join-scale));
    --join-signature-gap: calc(0.5625rem * var(--join-scale));
    display: flex;
    align-items: center;
    justify-content: center;
    inline-size: 100%;
    padding-block: 0;
    background: #f5f5f5;
    aspect-ratio: 1920 / 1919;
}

.join>.container {
  inline-size: min(var(--join-container-ratio), var(--join-container-width));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.join__steps {
  display: grid;
  grid-template-columns: repeat(2, auto);
  grid-auto-rows: 1fr;
  align-items: stretch;
  justify-content: center;
  gap: var(--join-group-gap);
  margin: 0 0 var(--join-steps-to-message-gap);
}

.join__steps > article {
  display: grid;
  grid-template-rows: auto 1fr;
}

.join__steps h3 {
  margin: 0 0 var(--join-step-heading-gap);
  color: #000;
  font-size: var(--join-step-heading-size);
  font-weight: 700;
  line-height: 1.45;
}

.step-row {
  display: grid;
  grid-template-columns: repeat(3, var(--join-card-width));
  grid-auto-rows: 1fr;
  align-items: stretch;
  gap: var(--join-card-gap);
}

.step-card {
  flex: 0 0 auto;
  inline-size: var(--join-card-width);
  max-inline-size: var(--join-card-width);
  block-size: var(--join-card-height);
  min-block-size: var(--join-card-height);
  padding: var(--join-card-padding-block) var(--join-card-padding-inline);
  background: #e9e2e2;
}

.step-card:nth-child(2) {
  background: #d9d9d9;
}

.step-card:nth-child(3) {
  background: #e6e6e6;
}

.step-card span {
  display: block;
  margin-bottom: var(--join-card-number-gap);
  color: #e92d1d;
  font-size: var(--join-card-number-size);
  font-weight: 700;
  line-height: 1;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.step-card strong {
  display: block;
  margin-bottom: var(--join-card-title-gap);
  color: #000;
  font-size: var(--join-card-title-size);
  font-weight: 700;
  line-height: 1.45;
}

.step-card p {
    margin: 0;
    color: #666666;
    font-size: var(--join-card-copy-size);
    font-weight: 500;
    line-height: var(--join-card-copy-line-height);
}

.message {
  display: grid;
  grid-template-columns: var(--join-message-image-width) var(--join-message-width);
  justify-content: start;
  gap: var(--join-message-gap);
  align-items: start;
  margin-inline-start: var(--join-content-offset);
}

.message>img {
  inline-size: var(--join-message-image-width);
  block-size: var(--join-message-image-height);
  object-fit: cover;
  object-position: center top;
}

.message__body {
  inline-size: var(--join-message-width);
  padding-block-start: var(--join-message-body-offset);
}

.message__body .eyebrow {
  margin: 0 0 var(--join-message-eyebrow-gap);
  color: #e92d1d;
  font-size: var(--join-message-eyebrow-size);
  font-weight: 700;
  line-height: 1.2;
}

.message__body h3 {
  margin: 0 0 var(--join-message-title-gap);
  color: #2d2d2d;
  font-size: var(--join-message-title-size);
  font-weight: 700;
  line-height: var(--join-message-title-line-height);
}

.message__body p {
  margin: 0;
  color: #333;
  font-size: var(--join-message-copy-size);
  font-weight: 500;
  line-height: var(--join-message-copy-line-height);
}

.message__body .message__name {
  margin-top: var(--join-message-name-gap);
  margin-bottom: 0;
  margin-inline-start: var(--join-message-indent);
  color: #111;
  font-weight: 600;
}

.message__signature {
  inline-size: var(--join-signature-width);
  margin-top: var(--join-signature-gap);
  margin-inline-start: var(--join-message-indent);
}

.faq {
     --faq-reference-width: 120rem;
    --faq-scale: clamp(0.4, calc(100vw / var(--faq-reference-width)), 1);
    --faq-container-width: 90rem;
    --faq-container-ratio: 75%;
    --faq-heading-size: max(calc(4.05rem * var(--faq-scale)), 2rem);
    --faq-heading-line-height: 1.3;
    --faq-heading-padding-start: calc(1.75rem * var(--faq-scale));
    --faq-heading-bar-width: calc(0.75rem * var(--faq-scale));
    --faq-eyebrow-size: max(calc(2rem * var(--faq-scale)), 1rem);
    --faq-eyebrow-gap: calc(2.625rem * var(--faq-scale));
    --faq-list-width: calc(65.625rem * var(--faq-scale));
    --faq-list-offset: calc(12.125rem * var(--faq-scale));
    --faq-list-gap: calc(7rem * var(--faq-scale));
    --faq-border-color: #e4e4e4;
    --faq-question-size: max(calc(1.55rem * var(--faq-scale)), 0.875rem);
    --faq-question-padding-block: calc(1.375rem * var(--faq-scale));
    --faq-question-padding-end: calc(4rem * var(--faq-scale));
    --faq-answer-size: max(calc(1.05rem * var(--faq-scale)), 0.75rem);
    --faq-answer-line-height: 2.55;
    --faq-answer-padding-block-end: calc(2rem * var(--faq-scale));
    --faq-icon-size: calc(1.125rem * var(--faq-scale));
    --faq-icon-line-thickness: max(calc(0.1875rem * var(--faq-scale)), 0.0625rem);
    --faq-recruit-gap: calc(15rem * var(--faq-scale));
    --faq-recruit-panel-width: calc(80.25rem * var(--faq-scale));
    --faq-recruit-panel-offset: calc(4.8125rem * var(--faq-scale));
    --faq-recruit-panel-gap: calc(6rem * var(--faq-scale));
    --faq-recruit-panel-padding-block-start: calc(4.75rem * var(--faq-scale));
    --faq-recruit-panel-padding-block-end: calc(5.5rem * var(--faq-scale));
    --faq-recruit-panel-padding-inline: calc(3rem * var(--faq-scale));
    --faq-recruit-row-gap: calc(2rem * var(--faq-scale));
    --faq-recruit-term-width: calc(9rem * var(--faq-scale));
    --faq-recruit-column-gap: calc(6rem * var(--faq-scale));
    --faq-recruit-text-size: max(calc(1.45rem * var(--faq-scale)), 0.875rem);
    display: flex;
    align-items: center;
    justify-content: center;
    inline-size: 100%;
    padding-block: 0;
    background: #fff;
    aspect-ratio: 1920 / 2700;
}

.faq>.container {
  inline-size: min(var(--faq-container-ratio), var(--faq-container-width));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.faq__questions > .eyebrow {
  margin: 0 0 var(--faq-eyebrow-gap);
  color: #f33323;
  font-size: var(--faq-eyebrow-size);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.32em;
}

.faq .accent-heading {
  padding-inline-start: var(--faq-heading-padding-start);
}

.faq .accent-heading::before {
  inline-size: var(--faq-heading-bar-width);
  inset-block: 0.14em;
}

.faq .accent-heading--small {
  margin: 0;
  color: #000;
  font-size: var(--faq-heading-size);
  font-weight: 600;
  line-height: var(--faq-heading-line-height);
}

.faq-list {
  inline-size: var(--faq-list-width);
  max-inline-size: 100%;
  margin: var(--faq-list-gap) 0 0 var(--faq-list-offset);
  border-top: 0.0625rem solid var(--faq-border-color);
}

.faq-item {
  flex: 0 0 auto;
  inline-size: 100%;
  max-inline-size: 100%;
  border-bottom: 0.0625rem solid var(--faq-border-color);
}

.faq-item h3 {
  margin: 0;
}

.faq-item button {
  position: relative;
  inline-size: 100%;
  padding-block: var(--faq-question-padding-block);
  padding-inline: 0 var(--faq-question-padding-end);
  color: #111;
  font-size: var(--faq-question-size);
  font-weight: 500;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
}

.faq-item button span {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-end: calc(0.875rem * var(--faq-scale));
  inline-size: var(--faq-icon-size);
  block-size: var(--faq-icon-size);
  border-inline-end: var(--faq-icon-line-thickness) solid #777;
  border-block-end: var(--faq-icon-line-thickness) solid #777;
  transform: translateY(-65%) rotate(45deg);
  transition: transform var(--transition);
}

.faq-item button[aria-expanded="true"] span {
  transform: translateY(-35%) rotate(225deg);
}

.faq-item button span::before,
.faq-item button span::after {
  content: none;
}

.faq-item__answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--transition);
}

.faq-item__answer>p {
    min-block-size: 0;
    margin: 0;
    overflow: hidden;
    color: #525151;
    font-size: var(--faq-answer-size);
    font-weight: 500;
    line-height: var(--faq-answer-line-height);
}

.faq-item:has(button[aria-expanded="true"]) .faq-item__answer {
  grid-template-rows: 1fr;
}

.faq-item:has(button[aria-expanded="true"]) .faq-item__answer>p {
  padding-block-end: var(--faq-answer-padding-block-end);
}

.recruit {
  margin-top: var(--faq-recruit-gap);
}

.recruit dl {
  display: grid;
  row-gap: var(--faq-recruit-row-gap);
  inline-size: var(--faq-recruit-panel-width);
  max-inline-size: 100%;
  margin: var(--faq-recruit-panel-gap) 0 0 var(--faq-recruit-panel-offset);
  padding-block: var(--faq-recruit-panel-padding-block-start) var(--faq-recruit-panel-padding-block-end);
  padding-inline: var(--faq-recruit-panel-padding-inline);
  background: #f3f3f3;
}

.recruit dl div {
    display: grid;
    grid-template-columns: var(--faq-recruit-term-width) minmax(0, 1fr);
    gap: var(--faq-recruit-column-gap);
    padding: 0;
    align-items: center;
}

.recruit dt,
.recruit dd {
  margin: 0;
  font-size: var(--faq-recruit-text-size);
  line-height: 1.6;
}

.recruit dt {
    color: #777;
    font-weight: 500;
    font-size: max(calc(1.6rem * var(--faq-scale)), 0.875rem);
}

.recruit dd {
  color: #333;
  font-weight: 500;
}

.entry {
  --entry-reference-width: 120rem;
  --entry-scale: clamp(0.4, calc(100vw / var(--entry-reference-width)), 1);
  --entry-container-width: 90rem;
  --entry-container-ratio: 75%;
  --entry-media-width: calc(69.6875rem * var(--entry-scale));
  --entry-content-shift: calc(-1.625rem * var(--entry-scale));
  --entry-eyebrow-size: max(calc(1.75rem * var(--entry-scale)), 1rem);
  --entry-eyebrow-gap: calc(1rem * var(--entry-scale));
  --entry-title-size: max(calc(4rem * var(--entry-scale)), 2.25rem);
  --entry-title-line-height: 1.7;
  --entry-lead-size: max(calc(1.75rem * var(--entry-scale)), 1rem);
  --entry-lead-line-height: 1.8;
  --entry-actions-gap: calc(5.25rem * var(--entry-scale));
  --entry-actions-margin: calc(4.625rem * var(--entry-scale));
  --entry-button-width: calc(27.0625rem * var(--entry-scale));
  --entry-primary-button-width: calc(26.9375rem * var(--entry-scale));
  --entry-button-height: calc(5.875rem * var(--entry-scale));
  --entry-button-padding-inline-end: calc(2.8125rem * var(--entry-scale));
  --entry-button-column-gap: calc(0.625rem * var(--entry-scale));
  --entry-line-button-padding-inline-start: calc(6rem * var(--entry-scale));
  --entry-primary-button-padding-inline-start: calc(3.625rem * var(--entry-scale));
  --entry-button-font-size: max(calc(1.25rem * var(--entry-scale)), 1rem);
  --entry-line-icon-size: calc(3.5rem * var(--entry-scale));
  --entry-arrow-icon-size: calc(2.25rem * var(--entry-scale));
  --entry-arrow-icon-padding: calc(0.4375rem * var(--entry-scale));
  --entry-arrow-icon-stroke: 2.5;
  --entry-note-margin: calc(4rem * var(--entry-scale));
  --entry-note-size: max(calc(1.4375rem * var(--entry-scale)), 0.75rem);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 100%;
  min-block-size: 0;
  padding-block: 0;
  overflow: hidden;
  isolation: isolate;
  background: #f3f3f3;
  aspect-ratio: 1920 / 1090;
}

.entry__media {
  position: absolute;
  inset-block: 0;
  inset-inline: 0;
  z-index: -2;
  inline-size: min(100%, var(--entry-media-width));
  block-size: 100%;
  margin-inline: auto;
  background: url("../images/cta-customer-768.webp") center 39% / cover no-repeat;
  background-image: image-set(
    url("../images/cta-customer-768.webp") 1x,
    url("../images/cta-customer-1536.webp") 2x
  );
}

.entry::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: rgba(255, 255, 255, 0.72);
}

.entry>.container {
  inline-size: min(var(--entry-container-ratio), var(--entry-container-width));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.entry__content {
  text-align: center;
  transform: translateY(var(--entry-content-shift));
}

.entry .eyebrow {
  margin: 0 0 var(--entry-eyebrow-gap);
  color: #f33323;
  font-size: var(--entry-eyebrow-size);
  font-weight: 700;
  line-height: 1.2;
}

.entry h2 {
  margin: 0 0 var(--entry-title-gap);
  color: #303030;
  font-size: var(--entry-title-size);
  font-weight: 800;
  line-height: var(--entry-title-line-height);
}

.entry h2+p {
    font-weight: 500;
    margin: var(--entry-note-margin) 0 0;
    font-size: max(calc(1.775rem * var(--entry-scale)), 0.75rem);
    line-height: 1.35;
}

.entry__actions {
  display: flex;
  justify-content: center;
  gap: var(--entry-actions-gap);
  margin-top: var(--entry-actions-margin);
}

.entry__actions .button {
  --button-height: var(--entry-button-height);
  --button-icon-size: var(--entry-arrow-icon-size);
  --button-icon-padding: var(--entry-arrow-icon-padding);
  --button-icon-stroke: var(--entry-arrow-icon-stroke);
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) var(--entry-arrow-icon-size);
  inline-size: var(--entry-button-width);
  min-inline-size: 0;
  min-block-size: var(--entry-button-height);
  column-gap: var(--entry-button-column-gap);
  justify-content: stretch;
  padding-inline: var(--entry-primary-button-padding-inline-start) var(--entry-button-padding-inline-end);
  border-radius: 0;
  font-size: var(--entry-button-font-size);
  font-weight: 700;
}

.entry__actions .button--line {
  --button-line-icon-size: var(--entry-line-icon-size);
  grid-template-columns: var(--entry-line-icon-size) max-content minmax(0, 1fr) var(--entry-arrow-icon-size);
  padding-inline-start: var(--entry-line-button-padding-inline-start);
  background: #00c95c;
}

.entry__actions .button--primary {
  inline-size: var(--entry-primary-button-width);
  padding-inline-start: var(--entry-primary-button-padding-inline-start);
  border-radius: var(--button-primary-radius);
  background: #b31a0d;
}

.entry__actions .button span {
  grid-column: 1;
}

.entry__actions .button--line span {
  grid-column: 2;
}

.entry__actions .button svg {
  grid-column: 3;
  justify-self: end;
  color: #fff;
}

.entry__actions .button--line > .button__icon {
  grid-column: 1;
  display: block;
  inline-size: var(--button-line-icon-size);
  block-size: var(--button-line-icon-size);
  align-self: center;
  justify-self: start;
  padding: 0;
  border-radius: 0;
  color: #fff;
  background: transparent;
  fill: currentColor;
  stroke: none;
  overflow: visible;
}

.entry__actions .button--line > svg:last-child {
  grid-column: 4;
}

.entry .entry__note {
  font-weight: 500;
  margin: var(--entry-note-margin) 0 0;
  font-size: var(--entry-note-size);
  line-height: 1.35;
}

.site-footer {
  --footer-container-width: 90rem;
  --footer-container-ratio: 75%;
  --footer-content-width: min(var(--footer-container-ratio), var(--footer-container-width));
  --footer-logo-size: 3.625rem;
  --footer-logo-gap: 1.125rem;
  --footer-description-size: 1.125rem;
  --footer-brand-padding-end: 1.625rem;
  --footer-brand-description-offset: 1.375rem;
  --footer-divider-color: rgba(255, 255, 255, 0.68);
  --footer-columns-gap: 8.75rem;
  --footer-columns-margin-start: 2.25rem;
  --footer-columns-margin-end: 5.875rem;
  --footer-company-width: 37.5rem;
  --footer-side-width: 25rem;
  --footer-side-row-gap: 3.5rem;
  --footer-heading-size: 1.5rem;
  --footer-heading-gap: 1.75rem;
  --footer-text-size: 1.25rem;
  --footer-text-line-height: 1.9;
  --footer-link-line-height: 1.7;
  --footer-bottom-padding-start: 1.5rem;
  --footer-bottom-gap: 1.5rem;
  --footer-bottom-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 100%;
  padding-block: 6rem;
  color: #fff;
  background: var(--color-footer);
  aspect-ratio: 1920 / 950;
}

.site-footer__inner {
  inline-size: var(--footer-content-width);
  max-width: none;
  margin-inline: auto;
}

.site-footer__brand {
  padding-block-end: var(--footer-brand-padding-end);
  border-bottom: 0.0625rem solid var(--footer-divider-color);
}

.site-footer h2 {
  margin: 0 0 var(--footer-logo-gap);
  font-size: var(--footer-logo-size);
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1;
}

.site-footer__brand p {
  margin: 0 0 0 var(--footer-brand-description-offset);
  font-size: var(--footer-description-size);
  line-height: 1.5;
}

.site-footer__columns {
  display: grid;
  grid-template-columns: var(--footer-company-width) var(--footer-side-width);
  gap: var(--footer-side-row-gap) var(--footer-columns-gap);
  align-items: start;
  justify-content: start;
  margin-block: var(--footer-columns-margin-start) var(--footer-columns-margin-end);
}

.site-footer__columns>section {
  inline-size: 100%;
  max-inline-size: 100%;
}

.site-footer__columns>section:first-child {
  grid-row: 1 / 3;
}

.site-footer__columns>section:nth-child(2),
.site-footer__columns>section:nth-child(3) {
  grid-column: 2;
}

.site-footer h3 {
  margin: 0 0 var(--footer-heading-gap);
  color: var(--color-red);
  font-size: var(--footer-heading-size);
  font-weight: 800;
  line-height: 1.5;
}

.site-footer address,
.site-footer li,
.site-footer a {
  color: rgba(255, 255, 255, 0.78);
  font-size: var(--footer-text-size);
  font-style: normal;
  font-weight: 500;
  line-height: var(--footer-text-line-height);
}

.site-footer ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.site-footer__links a {
  line-height: var(--footer-link-line-height);
  border-bottom: 0.0625rem dotted rgba(255, 255, 255, 0.65);
}

.site-footer__bottom {
  display: flex;
  justify-content: space-between;
  gap: var(--footer-bottom-gap);
  padding-block-start: var(--footer-bottom-padding-start);
  border-top: 0.0625rem solid var(--footer-divider-color);
}

.site-footer__bottom p {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: var(--footer-bottom-size);
  line-height: 1.5;
}

@media (min-width: 22.3125rem) {
  .timeline-column::after {
    background-image: url("../images/work-remote-512.webp");
  }
}

@media (min-width: 48.0625rem) {
  .mission__media {
    background-image: url("../images/mission-bg-1920.webp");
    background-image: image-set(
      url("../images/mission-bg-1920.webp") 1x,
      url("../images/mission-bg-3200.webp") 2x
    );
  }
}

@media (min-width: 100rem) {
  .entry__media {
    background-image: url("../images/cta-customer-1536.webp");
    background-image: image-set(
      url("../images/cta-customer-1536.webp") 1x,
      url("../images/cta-customer-2400.webp") 2x
    );
  }
}

