:root {
  --fs-sub-hero: 52px;
}

@media (max-width: 1199px) {
  :root {
    --fs-sub-hero: 46px;
  }
}

@media (max-width: 991px) {
  :root {
    --fs-sub-hero: 40px;
  }
}

@media (max-width: 575px) {
  :root {
    --fs-sub-hero: 32px;
  }
}

.mega__pane a[aria-current="page"],
.m-acc__links a[aria-current="page"] {
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
}

.mega__pane a[aria-current="page"]::before {
  background-color: var(--color-primary);
}

.sub-hero {
  position: relative;
  margin-top: calc(var(--header-h) * -1);
  padding-top: calc(var(--header-h) + 56px);
  padding-bottom: 72px;
  overflow: hidden;
  background-color: var(--color-bg-soft);
  border-bottom: 1px solid var(--color-border-soft);
}

.sub-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 56px;
  align-items: center;
}

.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 20px;
  color: var(--color-text-3);
}

.breadcrumb li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.breadcrumb li + li::before {
  content: "";
  width: 5px;
  height: 5px;
  border-top: 1.5px solid var(--color-muted);
  border-right: 1.5px solid var(--color-muted);
  transform: rotate(45deg);
}

.breadcrumb a {
  transition: color var(--duration) var(--ease);
}

.breadcrumb a:hover {
  color: var(--color-primary);
}

.breadcrumb [aria-current="page"] {
  font-weight: var(--fw-semibold);
  color: var(--color-ink);
}

.sub-hero__title {
  margin-top: 24px;
  font-size: var(--fs-sub-hero);
  font-weight: var(--fw-extrabold);
  line-height: 116%;
  color: var(--color-heading-hero);
}

.sub-hero__lead {
  max-width: 560px;
  margin-top: 20px;
  font-size: 18px;
  line-height: 28px;
  color: var(--color-text-hero);
}

.sub-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 36px;
}

.sub-hero__actions .btn--pill-outline {
  width: auto;
  padding-inline: 23px;
}

.sub-hero .hero__trust {
  justify-content: flex-start;
  margin: 28px 0 0;
}

.sub-hero__visual {
  align-self: center;
}

.sub-hero__visual img {
  width: 100%;
  max-width: 600px;
  margin-left: auto;
}

@media (max-width: 991px) {
  .sub-hero {
    padding-top: calc(var(--header-h) + 40px);
    padding-bottom: 56px;
  }

  .sub-hero__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .sub-hero__lead {
    font-size: 17px;
    line-height: 27px;
  }

  .sub-hero__visual img {
    max-width: 520px;
    margin-inline: auto;
  }
}

@media (max-width: 575px) {
  .sub-hero {
    padding-top: calc(var(--header-h) + 28px);
    padding-bottom: 44px;
  }

  .sub-hero__lead {
    font-size: 16px;
    line-height: 26px;
  }

  .sub-hero__actions .btn {
    flex: 1 1 100%;
  }

  .sub-hero .hero__trust {
    row-gap: 12px;
  }

  .sub-hero .hero__trust-divider {
    display: none;
  }
}

.split-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 480px);
  gap: 24px 64px;
  align-items: end;
}

.split-head__main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

.split-head .section-title {
  max-width: 680px;
}

@media (max-width: 991px) {
  .split-head {
    grid-template-columns: 1fr;
  }
}

.reasons {
  padding-block: var(--section-py);
  --net-ease: cubic-bezier(0.65, 0, 0.35, 1);
  --net-dur: 600ms;
  overflow: hidden;
  background:
    radial-gradient(900px 420px at 50% 0%, rgb(49 170 183 / 20%) 0%, rgb(49 170 183 / 0%) 70%),
    var(--color-bg-dark);
}

.reasons__head {
  max-width: 760px;
  margin-inline: auto;
}

.net-panel .section-title {
  color: var(--color-white);
}

.net-panel .section-lead {
  color: var(--color-muted);
}

.net-panel {
  position: relative;
}

.net {
  position: relative;
  margin-top: 40px;
}

.net__center {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  margin-inline: auto;
  border-radius: 28px;
  background-color: var(--color-white);
  box-shadow: 0 0 0 10px rgb(49 170 183 / 14%), 0 0 60px 10px rgb(49 170 183 / 35%);
}

.net__center img {
  width: 30px;
  height: 43px;
}

.net__svg {
  display: block;
  width: 100%;
  height: 260px;
  margin-top: -8px;
  overflow: visible;
}

.net__line {
  fill: none;
  stroke: rgb(49 170 183 / 35%);
  stroke-width: 1.5;
}

.net__pulse {
  fill: #5fd0dc;
  filter: drop-shadow(0 0 6px #31aab7);
}

.net__ripple {
  fill: none;
  stroke: #5fd0dc;
  stroke-width: 1.5;
  opacity: 0;
}

.net__nodes {
  display: grid;
  grid-template-columns: repeat(var(--net-n, 5), minmax(0, 1fr));
}

@media (min-width: 1200px) {
  .net--dense {
    --net-wide: min(100vw - 64px, 1680px);
    width: var(--net-wide);
    margin-inline: calc((100% - var(--net-wide)) / 2);
  }
}

.net__nodes--dense .net__node {
  margin-inline: 6px;
  padding: 32px 18px 26px;
}

.net__nodes--dense .net__title {
  font-size: 16px;
  line-height: 21px;
}

.net__nodes--dense .net__text {
  font-size: 13.5px;
}

.net__node {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-inline: 8px;
  padding: 34px 22px 30px;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 9%);
  border-radius: var(--radius-xl);
  background: linear-gradient(180deg, rgb(49 170 183 / 12%) 0%, rgb(255 255 255 / 2%) 55%);
  transition: border-color var(--net-dur) var(--net-ease), box-shadow var(--net-dur) var(--net-ease);
}

.net__node::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(260px 180px at 50% 0%, rgb(95 208 220 / 22%) 0%, rgb(95 208 220 / 0%) 70%);
  opacity: 0;
  transition: opacity var(--net-dur) var(--net-ease);
  pointer-events: none;
}

.net__node:hover {
  border-color: rgb(95 208 220 / 45%);
  box-shadow: inset 0 1px 0 rgb(95 208 220 / 25%), 0 0 0 1px rgb(95 208 220 / 12%);
}

.net__node:hover::before {
  opacity: 1;
}

.net__socket {
  position: absolute;
  top: -1px;
  left: 50%;
  width: 34px;
  height: 10px;
  border: 1px solid rgb(95 208 220 / 55%);
  border-top: 0;
  border-radius: 0 0 10px 10px;
  background-color: var(--color-bg-dark);
  transform: translateX(-50%);
}

.net__socket::after {
  content: "";
  position: absolute;
  top: 1px;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #5fd0dc;
  transform: translateX(-50%);
}

.net__top {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.net__label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 4px 9px 4px 8px;
  border: 1px solid rgb(255 255 255 / 10%);
  border-radius: var(--radius-pill);
  background-color: rgb(255 255 255 / 4%);
  font-size: 10px;
  font-weight: var(--fw-bold);
  line-height: 14px;
  letter-spacing: 0.5px;
  white-space: nowrap;
  text-transform: uppercase;
  color: #cbd5e1;
  transition: border-color var(--net-dur) var(--net-ease), color var(--net-dur) var(--net-ease);
}

.net__label::before {
  content: "";
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #5fd0dc;
  box-shadow: 0 0 8px #31aab7;
}

.net__node:hover .net__label {
  border-color: rgb(95 208 220 / 35%);
  color: var(--color-white);
}

.net__icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  padding: 5px;
  border: 1px solid rgb(95 208 220 / 30%);
  border-radius: 50%;
  transition: border-color var(--net-dur) var(--net-ease), box-shadow var(--net-dur) var(--net-ease);
}

.net__icon-core {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, rgb(95 208 220 / 30%) 0%, rgb(40 119 189 / 14%) 100%);
  box-shadow: inset 0 0 0 1px rgb(95 208 220 / 25%);
  position: relative;
  overflow: hidden;
  color: #5fd0dc;
  transition: color var(--net-dur) var(--net-ease), box-shadow var(--net-dur) var(--net-ease);
}

.net__icon-core::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(150deg, var(--color-primary) 0%, var(--color-secondary) 100%);
  opacity: 0;
  transition: opacity var(--net-dur) var(--net-ease);
}

.net__icon-core svg {
  position: relative;
}

.net__node:hover .net__icon {
  border-color: rgb(95 208 220 / 60%);
  box-shadow: 0 0 24px rgb(49 170 183 / 35%);
}

.net__node:hover .net__icon-core {
  box-shadow: inset 0 0 0 1px rgb(95 208 220 / 0%);
  color: var(--color-white);
}

.net__node:hover .net__icon-core::before {
  opacity: 1;
}

.net__title {
  position: relative;
  margin-top: 18px;
  font-size: 17px;
  font-weight: var(--fw-bold);
  line-height: 22px;
  color: var(--color-white);
}

.net__text {
  position: relative;
  margin-top: 8px;
  font-size: 14px;
  line-height: 155%;
  color: var(--color-muted);
}

.net__strip {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background-image: linear-gradient(90deg, transparent, #5fd0dc, transparent);
  transform: scaleX(0);
}

.net__node::after {
  content: "";
  position: absolute;
  inset: -1px;
  border: 1px solid rgb(95 208 220 / 55%);
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
}

@keyframes net-socket {
  0% { box-shadow: 0 0 0 0 rgb(95 208 220 / 0%); }
  12% { box-shadow: 0 0 0 6px rgb(95 208 220 / 45%), 0 0 18px 4px rgb(95 208 220 / 60%); }
  100% { box-shadow: 0 0 0 14px rgb(95 208 220 / 0%); }
}

@keyframes net-strip {
  0% { transform: scaleX(0); opacity: 1; }
  35% { transform: scaleX(1); opacity: 1; }
  100% { transform: scaleX(1); opacity: 0; }
}

@keyframes net-ring {
  0% { opacity: 0; }
  12% { opacity: 1; }
  100% { opacity: 0; }
}

.net.is-hit .net__socket::after {
  animation: net-socket 780ms ease-out;
}

.net.is-hit .net__strip {
  animation: net-strip 780ms ease-out forwards;
}

.net.is-hit .net__node::after {
  animation: net-ring 780ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
  .net__pulse,
  .net__ripple { display: none; }
}

@media (max-width: 1199px) {
  .net__node {
    margin-inline: 5px;
    padding-inline: 16px;
  }
}

@media (max-width: 1199px) {
  .net--dense .net__svg { display: none; }

  .net--dense .net__nodes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 40px;
  }

  .net--dense .net__node {
    margin-inline: 0;
  }

  .net--dense .net__node:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 991px) {
  .net__svg { display: none; }

  .net__nodes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 40px;
  }

  .net__node {
    margin-inline: 0;
  }

  .net__node:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 575px) {
  .net__nodes {
    grid-template-columns: 1fr;
  }
}

.features {
  --show-ease: cubic-bezier(0.65, 0, 0.35, 1);
  padding-block: var(--section-py);
  background-color: var(--color-white);
}

.features--tinted {
  background-color: var(--color-bg-soft-2);
}

.show {
  display: flex;
  flex-direction: column;
  gap: 96px;
  margin-top: 64px;
}

.show__row {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: 64px;
  align-items: center;
}

.show__row:nth-child(even) {
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
}

.show__row:nth-child(even) .show__media {
  order: -1;
}

.show__copy {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.show__big {
  font-size: 96px;
  font-weight: var(--fw-extrabold);
  line-height: 0.9;
  color: transparent;
  -webkit-text-stroke: 1.5px rgb(49 170 183 / 45%);
}

.show__title {
  font-size: 30px;
  font-weight: var(--fw-extrabold);
  line-height: 120%;
  color: var(--color-ink);
}

.show__text {
  font-size: 16px;
  line-height: 165%;
  color: var(--color-text-3);
}

.show__copy .btn {
  margin-top: 8px;
}

.show__media {
  position: relative;
  padding: 40px;
  border-radius: 32px;
  background: linear-gradient(150deg, #e6f5f7 0%, #dbe8f7 100%);
}

.show__media::before {
  content: "";
  position: absolute;
  inset: 18% 12%;
  border-radius: 50%;
  background: radial-gradient(circle, rgb(49 170 183 / 45%) 0%, rgb(49 170 183 / 0%) 70%);
  filter: blur(30px);
}

.show__frame {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--color-border-soft);
  border-radius: 16px;
  background-color: var(--color-white);
  box-shadow: 0 30px 60px -28px rgb(11 14 40 / 35%);
  transition: transform 700ms var(--show-ease);
}

.show__row:hover .show__frame {
  transform: scale(1.02);
}

.show__bar {
  display: flex;
  gap: 6px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--color-border-soft);
  background-color: var(--color-bg-soft);
}

.show__bar i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: #d5dbe3;
}

.show__frame img {
  width: 100%;
  padding: 10px;
}

@media (max-width: 1199px) {
  .show__row,
  .show__row:nth-child(even) {
    gap: 40px;
  }

  .show__big {
    font-size: 80px;
  }

  .show__title {
    font-size: 26px;
  }
}

@media (max-width: 991px) {
  .show {
    gap: 64px;
    margin-top: 40px;
  }

  .show__row,
  .show__row:nth-child(even) {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .show__row:nth-child(even) .show__media {
    order: 0;
  }

  .show__big {
    font-size: 64px;
  }

  .show__media {
    padding: 24px;
  }
}

@media (max-width: 575px) {
  .show {
    gap: 52px;
  }

  .show__title {
    font-size: 24px;
  }

  .show__media {
    padding: 14px;
    border-radius: var(--radius-xl);
  }

  .show__frame {
    border-radius: 12px;
  }

  .show__copy .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .show__row:hover .show__frame {
    transform: none;
  }
}

.spots {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-top: 64px;
}

.spot {
  position: relative;
  display: flex;
  min-height: 600px;
  padding: 64px 64px 0;
  overflow: hidden;
  border-radius: 32px;
  background:
    radial-gradient(60% 70% at 75% 15%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e2f4f6 0%, #d6e8f6 100%);
}

.spot:nth-child(3n + 2) {
  background:
    radial-gradient(60% 70% at 25% 15%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e7edf8 0%, #dce6f5 100%);
}

.spot:nth-child(3n) {
  background:
    radial-gradient(60% 70% at 75% 15%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e3f6f2 0%, #d9eef1 100%);
}

.spot__media {
  align-self: flex-end;
  width: 72%;
  margin-left: auto;
}

.spot:nth-child(even) .spot__media {
  margin-right: auto;
  margin-left: 0;
}

.spot__media img {
  width: 100%;
  padding: 12px 12px 0;
  border-radius: 18px 18px 0 0;
  background-color: var(--color-white);
  box-shadow: 0 -20px 60px -24px rgb(11 14 40 / 35%);
  transform-origin: bottom center;
  transition: transform 800ms var(--show-ease, ease-in-out);
}

.spot:hover .spot__media img {
  transform: translateY(-8px);
}

.spot__caption {
  --cap-pad: 40px;
  position: absolute;
  bottom: 40px;
  left: 40px;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  width: min(440px, 42%);
  padding: var(--cap-pad) var(--cap-pad) 0;
  overflow: hidden;
  border-radius: 20px;
  background-color: var(--color-white);
  box-shadow: 0 1px 2px rgb(11 14 40 / 6%), 0 40px 70px -36px rgb(11 14 40 / 40%);
}

.spot:nth-child(even) .spot__caption {
  right: 40px;
  left: auto;
}

.spot__num {
  font-size: 12px;
  font-weight: var(--fw-bold);
  letter-spacing: 1px;
  color: var(--color-primary);
  font-variant-numeric: tabular-nums;
}

.spot__title {
  font-size: 30px;
  font-weight: var(--fw-extrabold);
  line-height: 118%;
  color: var(--color-ink);
}

.spot__text {
  font-size: 16px;
  line-height: 165%;
  color: var(--color-text-3);
}

.spot__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: calc(100% + var(--cap-pad) * 2);
  margin: 10px calc(var(--cap-pad) * -1) 0;
  padding: 22px var(--cap-pad);
  border-top: 1px solid rgb(49 170 183 / 18%);
  background-color: var(--color-primary-10);
}

@media (max-width: 1199px) {
  .spot {
    min-height: 520px;
    padding: 48px 40px 0;
  }

  .spot__media {
    width: 66%;
  }

  .spot__caption {
    --cap-pad: 28px;
    width: min(380px, 44%);
  }

  .spot__title {
    font-size: 22px;
  }
}

@media (max-width: 991px) {
  .spots {
    gap: 24px;
    margin-top: 40px;
  }

  .spot {
    flex-direction: column;
    min-height: 0;
    padding: 32px 24px 0;
  }

  .spot__media,
  .spot:nth-child(even) .spot__media {
    width: 100%;
    margin: 0;
  }

  .spot__caption,
  .spot:nth-child(even) .spot__caption {
    position: relative;
    inset: auto;
    width: auto;
    margin: -48px 0 24px;
  }
}

@media (max-width: 575px) {
  .spot {
    padding: 20px 14px 0;
    border-radius: var(--radius-xl);
  }

  .spot__caption,
  .spot:nth-child(even) .spot__caption {
    --cap-pad: 20px;
    margin: -32px 0 14px;
  }

  .spot__title {
    font-size: 20px;
  }

  .spot__foot {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }

  .spot__foot .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .spot:hover .spot__media img {
    transform: none;
  }
}

.posters {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 24px;
  margin-top: 64px;
}

.poster {
  position: relative;
  display: flex;
  flex-direction: column;
  grid-column: span 2;
  min-height: 600px;
  padding: 36px 32px 0;
  overflow: hidden;
  border-radius: 28px;
  background:
    radial-gradient(70% 60% at 80% 10%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e2f4f6 0%, #d6e8f6 100%);
}

.poster:nth-child(3n + 2) {
  background:
    radial-gradient(70% 60% at 20% 10%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e7edf8 0%, #dce6f5 100%);
}

.poster:nth-child(3n) {
  background:
    radial-gradient(70% 60% at 80% 10%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e3f6f2 0%, #d9eef1 100%);
}

.poster:nth-child(3n + 1):nth-last-child(2),
.poster:nth-child(3n + 1):nth-last-child(2) + .poster {
  grid-column: span 3;
}

.poster__num {
  font-size: 13px;
  font-weight: var(--fw-bold);
  letter-spacing: 1px;
  color: var(--color-primary);
  font-variant-numeric: tabular-nums;
}

.poster__title {
  margin-top: 12px;
  font-size: 24px;
  font-weight: var(--fw-extrabold);
  line-height: 122%;
  color: var(--color-ink);
}

.poster__text {
  margin-top: 10px;
  font-size: 15px;
  line-height: 160%;
  color: var(--color-text-3);
}

.poster .btn {
  align-self: flex-start;
  margin-top: 22px;
}

.poster__shot {
  position: relative;
  flex: 1;
  min-height: 220px;
  margin-top: 32px;
}

.poster__shot img {
  position: absolute;
  top: 0;
  left: 0;
  width: 150%;
  max-width: none;
  padding: 10px 10px 0;
  border-radius: 16px 0 0 0;
  background-color: var(--color-white);
  box-shadow: 0 -10px 40px -20px rgb(11 14 40 / 30%);
  transition: transform 800ms var(--show-ease, ease-in-out);
}

.poster:hover .poster__shot img {
  transform: translateY(-10px);
}

@media (max-width: 1199px) {
  .poster {
    min-height: 540px;
    padding: 28px 24px 0;
  }

  .poster__title {
    font-size: 21px;
  }
}

@media (max-width: 991px) {
  .posters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 40px;
  }

  .poster,
  .poster:nth-child(3n + 1):nth-last-child(2),
  .poster:nth-child(3n + 1):nth-last-child(2) + .poster {
    grid-column: span 1;
  }

  .poster:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 575px) {
  .posters {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .poster {
    min-height: 500px;
    border-radius: var(--radius-xl);
  }

  .poster .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .poster:hover .poster__shot img {
    transform: none;
  }
}

.pillars {
  display: flex;
  flex-direction: column;
  gap: 120px;
  margin-top: 64px;
  overflow-x: clip;
}

.pillar__stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: 48px;
  align-items: center;
}

.pillar__word {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  justify-self: center;
  font-size: clamp(56px, calc(min(50vw, 700px) / (var(--len, 6) * 0.62)), 168px);
  font-weight: var(--fw-extrabold);
  line-height: 0.82;
  letter-spacing: -0.04em;
  white-space: nowrap;
  background-image: linear-gradient(180deg, #cfeaee 0%, #dce8f6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  user-select: none;
}

.pillar__stage > img {
  position: relative;
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  justify-self: center;
  width: min(540px, 86%);
  margin-top: clamp(40px, 5.5vw, 92px);
  mix-blend-mode: multiply;
}

.pillar__intro {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.pillar__intro .btn {
  margin-top: 28px;
}

.pillar__num {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 48px;
  font-weight: var(--fw-extrabold);
  line-height: 1;
  letter-spacing: -1px;
  background-image: linear-gradient(140deg, var(--color-primary), var(--color-secondary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-variant-numeric: tabular-nums;
}

.pillar__num small {
  font-size: 15px;
  font-weight: var(--fw-bold);
  letter-spacing: 0.5px;
  color: var(--color-muted);
  -webkit-text-fill-color: var(--color-muted);
}

.pillar__lead {
  margin-top: 18px;
  font-size: 17px;
  font-weight: var(--fw-semibold);
  line-height: 150%;
  color: var(--color-text-3);
}

.pillar__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 40px;
  row-gap: 16px;
}

.pillar__list li {
  position: relative;
  padding: 9px 14px 9px 38px;
  border: 1px solid rgb(49 170 183 / 25%);
  border-radius: var(--radius-pill);
  background-color: var(--color-primary-10);
  font-size: 13.5px;
  font-weight: var(--fw-semibold);
  line-height: 140%;
  color: var(--color-ink-4);
}

.pillar__list li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 12px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat,
    linear-gradient(140deg, var(--color-primary), var(--color-secondary));
}

.pillar__list b {
  color: var(--color-ink);
}

@media (max-width: 1199px) {
  .pillar__num {
    font-size: 40px;
  }
}

@media (max-width: 991px) {
  .pillars {
    gap: 80px;
    margin-top: 40px;
  }

  .pillar__stage {
    grid-template-columns: 1fr;
  }

  .pillar__word,
  .pillar__stage > img {
    grid-column: 1;
  }

  .pillar__stage > img {
    width: min(460px, 80%);
  }

  .pillar__intro {
    grid-row: 2;
    margin-top: 28px;
  }

  .pillar__list {
    margin-top: 28px;
  }
}

@media (max-width: 575px) {

  .pillar__lead {
    font-size: 16px;
  }

  .pillar__intro .btn {
    width: 100%;
  }
}

.features--split {
  padding-bottom: 0;
}

.splits {
  display: flex;
  flex-direction: column;
  margin-top: 64px;
}

.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 640px;
}

.split:nth-child(even) .split__media {
  order: 2;
}

.split__media {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(70% 60% at 80% 10%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e2f4f6 0%, #d6e8f6 100%);
}

.split:nth-child(3n + 2) .split__media {
  background:
    radial-gradient(70% 60% at 20% 10%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e7edf8 0%, #dce6f5 100%);
}

.split:nth-child(3n) .split__media {
  background:
    radial-gradient(70% 60% at 80% 10%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e3f6f2 0%, #d9eef1 100%);
}

.split__media img {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: min(660px, 92%);
  transform: translateX(-50%);
  transition: transform 900ms var(--show-ease, ease-in-out);
}

.split:hover .split__media img {
  transform: translateX(-50%) translateY(-8px);
}

.split__copy {
  display: flex;
  align-items: center;
  padding: 80px 64px;
  border-bottom: 1px solid var(--color-border-soft);
  background-color: var(--color-white);
}

.split__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  width: 100%;
  max-width: 560px;
}

.split:nth-child(even) .split__copy {
  justify-content: flex-end;
}

.split__title {
  font-size: 40px;
  font-weight: var(--fw-extrabold);
  line-height: 112%;
  letter-spacing: -0.5px;
  color: var(--color-ink);
}

.split__lead {
  font-size: 19px;
  font-weight: var(--fw-semibold);
  line-height: 145%;
  color: var(--color-primary);
}

.split__text {
  font-size: 16px;
  line-height: 165%;
  color: var(--color-text-3);
}

.split__panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  width: 100%;
  margin-top: 10px;
  padding: 24px;
  border: 1px solid var(--color-border-soft);
  border-radius: 20px;
  background-color: var(--color-bg-soft);
}

.split__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.split__list li {
  position: relative;
  padding: 9px 14px 9px 38px;
  border: 1px solid rgb(49 170 183 / 25%);
  border-radius: var(--radius-pill);
  background-color: var(--color-white);
  font-size: 13.5px;
  font-weight: var(--fw-semibold);
  line-height: 140%;
  color: var(--color-ink-4);
}

.split__list li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 12px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat,
    linear-gradient(140deg, var(--color-primary), var(--color-secondary));
}

.split__panel .btn {
  margin-top: 0;
}

@media (max-width: 1199px) {
  .split {
    min-height: 560px;
  }

  .split__copy {
    padding: 64px 40px;
  }

  .split__title {
    font-size: 34px;
  }
}

@media (max-width: 991px) {
  .splits {
    margin-top: 40px;
  }

  .split {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .split:nth-child(even) .split__media {
    order: 0;
  }

  .split__media {
    aspect-ratio: 4 / 3;
  }

  .split__copy,
  .split:nth-child(even) .split__copy {
    justify-content: flex-start;
    padding: 40px var(--gutter) 56px;
  }
}

@media (max-width: 575px) {
  .split__title {
    font-size: 28px;
  }

  .split__lead {
    font-size: 17px;
  }

  .split__panel {
    padding: 18px;
  }

  .split__panel .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .split:hover .split__media img {
    transform: translateX(-50%);
  }
}

.reasons--cards .section-title {
  color: var(--color-white);
}

.reasons--cards .section-lead {
  color: var(--color-muted);
}

.reason-cards {
  --cols: 4;
  --gap: 16px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: var(--gap);
  margin-top: 56px;
}

.reason-cards .net__node {
  flex: 0 0 calc((100% - var(--gap) * (var(--cols) - 1)) / var(--cols));
  margin-inline: 0;
  padding: 30px 24px 28px;
}

@media (max-width: 1199px) {
  .reason-cards {
    --cols: 3;
  }
}

@media (max-width: 991px) {
  .reason-cards {
    --cols: 2;
    margin-top: 40px;
  }
}

@media (max-width: 575px) {
  .reason-cards {
    --cols: 1;
  }
}

.story {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 72px;
  margin-top: 40px;
}

.story__step {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 16px;
  min-height: 72vh;
  opacity: 0.35;
  transition: opacity 600ms var(--show-ease, ease-in-out);
}

.story__step.is-active {
  opacity: 1;
}

.story__title {
  font-size: 38px;
  font-weight: var(--fw-extrabold);
  line-height: 115%;
  letter-spacing: -0.5px;
  color: var(--color-ink);
}

.story__text {
  font-size: 17px;
  line-height: 165%;
  color: var(--color-text-3);
}

.story__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.story__list li {
  position: relative;
  padding: 9px 14px 9px 38px;
  border: 1px solid rgb(49 170 183 / 25%);
  border-radius: var(--radius-pill);
  background-color: var(--color-primary-10);
  font-size: 13.5px;
  font-weight: var(--fw-semibold);
  line-height: 140%;
  color: var(--color-ink-4);
}

.story__list li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 12px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 10px no-repeat,
    linear-gradient(140deg, var(--color-primary), var(--color-secondary));
}

.story__step .btn {
  margin-top: 8px;
}

.story__inline {
  display: none;
}

.story__stage {
  position: sticky;
  top: calc(var(--header-h) + 48px);
  align-self: start;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  border-radius: 32px;
  background:
    radial-gradient(70% 60% at 70% 20%, rgb(255 255 255 / 75%) 0%, rgb(255 255 255 / 0%) 70%),
    linear-gradient(150deg, #e2f4f6 0%, #d6e8f6 100%);
}

.story__stage img {
  position: absolute;
  inset: 40px;
  width: calc(100% - 80px);
  height: calc(100% - 80px);
  object-fit: contain;
  mix-blend-mode: multiply;
  opacity: 0;
  transform: translateY(18px) scale(0.98);
  transition: opacity 600ms var(--show-ease, ease-in-out), transform 600ms var(--show-ease, ease-in-out);
}

.story__stage img.is-on {
  opacity: 1;
  transform: none;
}

@media (max-width: 1199px) {
  .story {
    gap: 48px;
  }

  .story__title {
    font-size: 32px;
  }
}

@media (max-width: 991px) {
  .story {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .story__stage {
    display: none;
  }

  .story__step {
    min-height: 0;
    padding-block: 32px;
    opacity: 1;
  }

  .story__step + .story__step {
    border-top: 1px solid var(--color-border);
  }

  .story__inline {
    display: block;
    width: 100%;
    padding: 24px;
    border-radius: 24px;
    background: linear-gradient(150deg, #e2f4f6 0%, #d6e8f6 100%);
  }

  .story__inline img {
    margin-inline: auto;
    mix-blend-mode: multiply;
  }
}

@media (max-width: 575px) {
  .story__title {
    font-size: 26px;
  }

  .story__text {
    font-size: 16px;
  }

  .story__step .btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .story__step,
  .story__stage img {
    transition: none;
  }
}

.voices {
  padding-block: var(--section-py);
  overflow: hidden;
  background-color: var(--color-bg-soft);
}

.voices__inner {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: 64px;
  align-items: center;
}

.voices__intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

.voices__nav {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 22px;
}

.voices__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background-color: var(--color-white);
  color: var(--color-ink);
  transition: background-color var(--duration) var(--ease), border-color var(--duration) var(--ease),
    color var(--duration) var(--ease), transform var(--duration) var(--ease);
}

.voices__arrow:hover {
  border-color: var(--color-primary);
  background-color: var(--color-primary);
  color: var(--color-white);
  transform: translateY(-2px);
}

.voices__count {
  margin-left: 12px;
  font-size: 14px;
  font-weight: var(--fw-semibold);
  line-height: 20px;
  color: var(--color-muted);
  font-variant-numeric: tabular-nums;
}

.voices__count b {
  font-size: 22px;
  font-weight: var(--fw-extrabold);
  color: var(--color-ink);
}

.voices__track {
  min-width: 0;
  clip-path: inset(-40px -100vw -40px 0);
}

.voices__slider {
  overflow: visible;
}

.q-card {
  display: flex;
  flex-direction: column;
  width: 560px;
  height: auto;
  padding: 40px;
  border: 1px solid var(--color-border-soft);
  border-radius: 24px;
  background-color: var(--color-white);
  box-shadow: 0 4px 10px rgb(11 14 40 / 5%);
  opacity: 0.55;
  transition: background-color 500ms var(--ease), border-color 500ms var(--ease), opacity 500ms var(--ease),
    box-shadow 500ms var(--ease);
}

.q-card.swiper-slide-active {
  border-color: transparent;
  background:
    radial-gradient(420px 220px at 100% 0%, rgb(49 170 183 / 24%) 0%, rgb(49 170 183 / 0%) 70%),
    var(--color-ink-2);
  opacity: 1;
}

.q-card__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.q-card__top svg {
  width: 44px;
  height: 33px;
  color: var(--color-primary);
}

.q-card__stars {
  display: flex;
  gap: 3px;
}

.q-card__quote {
  flex: 1;
  margin-top: 26px;
  font-size: 17px;
  line-height: 170%;
  color: var(--color-text);
  transition: color 500ms var(--ease);
}

.q-card__by {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--color-border);
  transition: border-color 500ms var(--ease);
}

.q-card__mono {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: var(--color-primary-10);
  font-size: 15px;
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  transition: background-color 500ms var(--ease), color 500ms var(--ease);
}

.q-card__name {
  display: block;
  font-size: 16px;
  font-weight: var(--fw-bold);
  line-height: 22px;
  color: var(--color-ink);
  transition: color 500ms var(--ease);
}

.q-card__org {
  display: block;
  font-size: 13px;
  line-height: 18px;
  color: var(--color-text-3);
}

.q-card__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  background-color: var(--color-accent-12);
  font-size: 12px;
  font-weight: var(--fw-bold);
  line-height: 16px;
  white-space: nowrap;
  color: #008a76;
}

.q-card.swiper-slide-active .q-card__quote {
  color: #e2e8f0;
}

.q-card.swiper-slide-active .q-card__by {
  border-top-color: rgb(255 255 255 / 12%);
}

.q-card.swiper-slide-active .q-card__mono {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.q-card.swiper-slide-active .q-card__name {
  color: var(--color-white);
}

.q-card.swiper-slide-active .q-card__org {
  color: var(--color-muted);
}

.q-card.swiper-slide-active .q-card__badge {
  background-color: rgb(0 177 149 / 18%);
  color: #5fe0c8;
}

@media (max-width: 1199px) {
  .voices__inner {
    gap: 40px;
  }

  .q-card {
    width: 480px;
    padding: 32px;
  }

  .q-card__quote {
    font-size: 16px;
  }
}

@media (max-width: 991px) {
  .voices__inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .voices__arrow {
    width: 46px;
    height: 46px;
  }

  .q-card {
    width: 86vw;
    padding: 24px 22px;
  }

  .q-card__quote {
    margin-top: 18px;
    font-size: 15px;
  }

  .q-card__by {
    flex-wrap: wrap;
  }

  .q-card__badge {
    margin-left: 60px;
  }
}

.cta__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border: 1px solid #1e293b;
  border-radius: var(--radius-lg);
  background-color: rgb(255 255 255 / 4%);
}

.cta__mark img {
  width: 26px;
  height: 37px;
}
