@charset "UTF-8";
@layer base, components, layout, pages, utilities;
@layer base {
  *,
  *::after,
  *::before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  @media (width < 768px) {
    html {
      font-size: 2.5641025641vw;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    html {
      font-size: 1.3020833333vw;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    html {
      font-size: 0.6944444444vw;
    }
  }
  @media (width >= 1920px) {
    html {
      font-size: 10px;
    }
  }
  @media (prefers-reduced-motion: no-preference) {
    html {
      scroll-behavior: smooth;
    }
  }
  html:has(.navbar--show) {
    overflow: hidden;
  }
  body {
    position: relative;
    overflow-x: clip;
    font-family: "Raleway", sans-serif;
    color: #fff;
    background-color: #031330;
  }
  .wrap {
    position: relative;
    width: 100%;
    max-width: 192rem;
    margin: 0 auto;
  }
  @media (width < 391px) {
    .wrap {
      padding: 0 1rem;
    }
  }
  @media (width >= 391px) {
    .wrap {
      padding: 0 2rem;
    }
  }
  :focus {
    outline: none;
  }
}
@layer base {
  body {
    font-weight: 400;
  }
  img {
    vertical-align: middle;
  }
  a {
    color: inherit;
    text-decoration: none;
  }
  b {
    font-weight: 700;
  }
  button {
    border: none;
    background: none;
    font: inherit;
    color: inherit;
    cursor: pointer;
  }
  ul,
  ol {
    list-style: none;
  }
  fieldset {
    border: none;
  }
  .section__title,
  .page__title {
    line-height: 1;
  }
}
@layer components {
  .btn {
    outline: none;
  }
}
@layer components {
  .logo {
    position: relative;
  }
  .logo img {
    width: 100%;
    height: auto;
  }
}
@layer components {
  .nav {
    display: flex;
  }
  .nav__link {
    position: relative;
    line-height: 140%;
    color: #fff;
  }
  @media (width >= 1025px) {
    .nav__link {
      transition: 0.3s color;
    }
    .nav__link:after {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      max-width: 0;
      height: 1px;
      display: block;
      content: "";
      background-color: #3a7ef6;
      transition: 0.3s max-width;
    }
  }
  @media (hover: hover) {
    .nav__link:hover {
      color: #3a7ef6;
    }
    .nav__link:hover:after {
      max-width: 20rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .nav__link {
      font-size: 2.2rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1920px) {
    .nav__link {
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  .nav--top {
    position: relative;
  }
  @media (width < 768px) {
    .nav--top {
      padding: 6rem 1rem 8.9rem;
      font-size: 2.5rem;
      row-gap: 2.2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .nav--top {
      padding: 3rem 6rem 6rem;
      font-size: 4.5rem;
      row-gap: 2.7rem;
    }
  }
  @media (width < 1025px) {
    .nav--top {
      z-index: 2;
      flex-direction: column;
      text-transform: uppercase;
      font-weight: 600;
      line-height: 110%;
      letter-spacing: -0.04em;
    }
    .nav--top .nav__link {
      line-height: 100%;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .nav--top {
      column-gap: 3.4rem;
    }
  }
  @media (width >= 1025px) {
    .nav--top {
      margin-left: auto;
      align-items: center;
    }
  }
  @media (width >= 1920px) {
    .nav--top {
      column-gap: 4rem;
    }
  }
  .nav--bottom {
    flex-direction: column;
  }
  @media (width < 768px) {
    .nav--bottom {
      margin-top: 3rem;
      row-gap: 1.2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .nav--bottom {
      row-gap: 1.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .nav--bottom {
      row-gap: 1.7rem;
    }
  }
  @media (width >= 1920px) {
    .nav--bottom {
      row-gap: 1.3rem;
    }
  }
  @media (width < 768px) {
    .nav--bottom .nav__link {
      font-size: 1.8rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1440px) {
    .nav--bottom .nav__link {
      font-size: 2.2rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1025px) {
    .nav--bottom .nav__link {
      width: max-content;
    }
  }
  .nav-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .nav-sph--1 {
    z-index: 2;
    opacity: 0.53;
    transform: rotate(-17deg);
  }
  @media (width < 768px) {
    .nav-sph--1 {
      right: -52rem;
      width: 135rem;
      top: -7rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .nav-sph--1 {
      left: -37rem;
      width: 119rem;
      top: -4rem;
    }
  }
  @media (width >= 1025px) {
    .nav-sph--1 {
      display: none;
    }
  }
  .nav-sph--2 {
    z-index: 1;
  }
  @media (width < 768px) {
    .nav-sph--2 {
      width: 80rem;
      top: -1rem;
      left: -23rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .nav-sph--2 {
      width: 133rem;
      top: -18.2rem;
      right: -449px;
    }
  }
  @media (width >= 1025px) {
    .nav-sph--2 {
      display: none;
    }
  }
}
@layer layout {
  .brands {
    position: relative;
    z-index: 1;
  }
  @media (width < 768px) {
    .brands {
      margin-top: 7.6rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .brands {
      margin-top: 10rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .brands {
      margin-top: 18.9rem;
    }
  }
  @media (width >= 1920px) {
    .brands {
      padding-top: 18.5rem;
    }
  }
  .brands__box {
    position: relative;
    max-width: 192rem;
    margin: 0 auto;
  }
  .brands-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .brands-sph--1 {
    opacity: 0.53;
    transform: rotate(-41deg);
  }
  @media (width < 768px) {
    .brands-sph--1 {
      width: 80rem;
      top: -10rem;
      right: -20rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .brands-sph--1 {
      width: 153rem;
      top: 4rem;
      right: -47rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .brands-sph--1 {
      width: 170rem;
      top: -10rem;
      right: -11rem;
    }
  }
  @media (width >= 1920px) {
    .brands-sph--1 {
      top: -24rem;
      left: -2rem;
    }
  }
  .brands .wrap {
    max-width: 180.6rem;
  }
  .brands .section__title {
    font-weight: 600;
    line-height: 120%;
    color: #fff;
  }
  @media (width < 768px) {
    .brands .section__title {
      font-size: 2.2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .brands .section__title {
      font-size: 2.5rem;
    }
  }
  @media (width >= 1025px) {
    .brands .section__title {
      margin: 0 auto;
      text-align: center;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .brands .section__title {
      max-width: 120rem;
      font-size: 4rem;
    }
  }
  @media (width >= 1920px) {
    .brands .section__title {
      max-width: 131.8rem;
      font-size: 4.5rem;
    }
  }
  .brands__list {
    display: grid;
  }
  @media (width < 768px) {
    .brands__list {
      margin-top: 1.5rem;
      gap: 1rem;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .brands__list {
      margin-top: 3rem;
      gap: 2rem;
    }
  }
  @media (width < 1920px) {
    .brands__list {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  @media (width >= 1920px) {
    .brands__list {
      margin-top: 9rem;
      grid-template-columns: repeat(5, 1fr);
      gap: 5rem;
    }
  }
  .brands__item {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
  }
  @media (width < 768px) {
    .brands__item {
      height: 6.4rem;
      padding: 1.5rem 0.8rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .brands__item {
      height: 12.6rem;
      padding: 0 1.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .brands__item {
      height: 18rem;
      padding: 0 10.3rem;
    }
  }
  @media (width >= 1920px) {
    .brands__item {
      height: 18.5rem;
      padding: 0 2.6rem;
      border-radius: 0.5rem;
    }
  }
  .brands__item img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    width: auto;
  }
}
@layer layout {
  .docs {
    position: relative;
    z-index: 1;
  }
  @media (width < 768px) {
    .docs {
      margin-top: 8rem;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .docs {
      margin-top: 10rem;
    }
  }
  @media (width >= 1920px) {
    .docs {
      margin-top: 23rem;
    }
  }
  .docs__container {
    position: relative;
    max-width: 192rem;
    margin: 0 auto;
    border-radius: 1rem;
    overflow: hidden;
  }
  .docs__container::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    content: "";
    background: linear-gradient(73.62deg, rgba(0, 0, 0, 0.39) 4.01%, rgba(102, 102, 102, 0) 90.39%), rgba(0, 0, 0, 0.3);
  }
  .docs__bg {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .docs__box {
    position: relative;
    z-index: 2;
  }
  @media (width < 768px) {
    .docs__box {
      padding: 4rem 0 5.4rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .docs__box {
      padding: 9.4rem 0;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs__box {
      padding: 14.5rem 0 4rem;
    }
  }
  @media (width >= 1920px) {
    .docs__box {
      padding: 20rem 0 9rem;
    }
  }
  .docs .section__title {
    font-weight: 600;
  }
  @media (width < 768px) {
    .docs .section__title {
      font-size: 3rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .docs .section__title {
      font-size: 4rem;
    }
  }
  @media (width >= 1025px) {
    .docs .section__title {
      text-align: center;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs .section__title {
      font-size: 5.5rem;
    }
  }
  @media (width >= 1920px) {
    .docs .section__title {
      font-size: 6.5rem;
    }
  }
  .docs .section__desc {
    font-weight: 600;
    line-height: 120%;
  }
  @media (width < 768px) {
    .docs .section__desc {
      max-width: 32rem;
      margin-top: 1.4rem;
      font-size: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .docs .section__desc {
      max-width: 55rem;
      margin-top: 1.8rem;
      font-size: 2.5rem;
    }
  }
  @media (width >= 1025px) {
    .docs .section__desc {
      margin-left: auto;
      margin-right: auto;
      text-align: center;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs .section__desc {
      max-width: 92rem;
      margin-top: 2rem;
      font-size: 4rem;
    }
  }
  @media (width >= 1920px) {
    .docs .section__desc {
      margin-top: 4rem;
      max-width: 95rem;
      font-size: 4.5rem;
    }
  }
  .docs__list {
    display: grid;
  }
  @media (width < 768px) {
    .docs__list {
      margin-top: 2rem;
      row-gap: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .docs__list {
      margin-top: 3.2rem;
      row-gap: 2rem;
    }
  }
  @media (width < 1025px) {
    .docs__list {
      max-width: 35.4rem;
    }
  }
  @media (width >= 1025px) {
    .docs__list {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs__list {
      margin-top: 4.9rem;
      column-gap: 2rem;
    }
  }
  @media (width >= 1920px) {
    .docs__list {
      margin-top: 9rem;
      column-gap: 6rem;
    }
  }
  .docs__item {
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0.5rem;
    backdrop-filter: blur(1rem);
    background: rgba(83, 139, 244, 0.16);
  }
  @media (width < 768px) {
    .docs__item {
      padding: 2.5rem 2rem;
      font-size: 1.8rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .docs__item {
      padding: 2rem;
      font-size: 1.8rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs__item {
      padding: 4.5rem 2rem;
      font-size: 2.5rem;
      line-height: 120%;
      min-height: 29.4rem;
    }
  }
  @media (width >= 1920px) {
    .docs__item {
      padding: 7.5rem 5rem 9rem;
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  .docs__files {
    display: grid;
  }
  @media (width < 768px) {
    .docs__files {
      margin-top: 3rem;
      row-gap: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .docs__files {
      margin-top: 4rem;
      grid-template-columns: repeat(2, 1fr);
      gap: 2rem;
    }
  }
  @media (width >= 1025px) {
    .docs__files {
      margin-top: 10rem;
      grid-template-columns: repeat(4, 1fr);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs__files {
      column-gap: 2rem;
    }
  }
  @media (width >= 1920px) {
    .docs__files {
      column-gap: 2.7rem;
    }
  }
  .docs__file {
    height: 5.1rem;
    display: flex;
    align-items: center;
    column-gap: 1.3rem;
    border-radius: 1rem;
    background-color: #051e4c;
    transition: 0.3s background-color;
    color: #fff;
    line-height: 140%;
  }
  @media (width < 1025px) {
    .docs__file {
      padding: 0.9rem 1.1rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .docs__file {
      padding: 1.4rem 1rem;
    }
  }
  @media (width < 1920px) {
    .docs__file {
      font-size: 1.6rem;
    }
  }
  @media (width >= 1920px) {
    .docs__file {
      padding: 0.8rem 1.6rem;
      font-size: 1.8rem;
    }
  }
  .docs__file-icon {
    width: 2.3rem;
    height: 2.3rem;
  }
  @media (hover: hover) {
    .docs__file:hover {
      background-color: #092b66;
    }
  }
}
@layer layout {
  .footer {
    position: relative;
    overflow: clip;
  }
  @media (width < 768px) {
    .footer {
      padding: 8rem 0 1.2rem;
    }
  }
  @media (width >= 768px) {
    .footer {
      padding-bottom: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer {
      padding-top: 10rem;
    }
  }
  @media (width >= 768px) {
    .footer {
      padding-top: 20rem;
    }
  }
  .footer__container {
    position: relative;
    border-radius: 1rem;
    background-color: #051e4c;
  }
  @media (width < 768px) {
    .footer__container {
      padding: 4.2rem 1rem 3.6rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__container {
      padding: 4.2rem 2rem 3.2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer__container {
      padding: 7.5rem 2rem 2rem;
    }
  }
  @media (width >= 1920px) {
    .footer__container {
      padding: 10rem 2.2rem 4rem;
    }
  }
  .footer__content {
    display: grid;
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__content {
      grid-template-columns: repeat(2, 1fr);
      column-gap: 2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer__content {
      grid-template-columns: 34rem repeat(2, 35.3rem) 35rem;
      row-gap: 1.8rem;
    }
  }
  @media (width >= 1920px) {
    .footer__content {
      grid-template-columns: repeat(4, 1fr);
      column-gap: 6rem;
      row-gap: 3.8rem;
    }
  }
  .footer-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .footer-sph--1 {
    z-index: 1;
    opacity: 0.53;
  }
  @media (width < 768px) {
    .footer-sph--1 {
      width: 106rem;
      top: -1.4rem;
      left: -31rem;
      transform: rotate(-17deg);
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer-sph--1 {
      width: 106rem;
      top: -1.4rem;
      left: -31rem;
      transform: rotate(-17deg);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer-sph--1 {
      top: -6rem;
      left: -42rem;
      width: 137rem;
      transform: rotate(-17deg);
    }
  }
  @media (width >= 1920px) {
    .footer-sph--1 {
      top: -2rem;
      left: -41rem;
      transform: rotate(-17deg);
    }
  }
  .footer-sph--2 {
    opacity: 0.6;
  }
  @media (width < 768px) {
    .footer-sph--2 {
      top: 0;
      right: -32.5rem;
      width: 100rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer-sph--2 {
      top: -13.6rem;
      right: -38.5rem;
      width: 118rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer-sph--2 {
      top: -25rem;
      left: -6rem;
      width: 139rem;
    }
  }
  @media (width >= 1920px) {
    .footer-sph--2 {
      top: -25rem;
      left: -6rem;
    }
  }
  .footer__box {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__box:first-child {
      grid-row: 1/4;
    }
  }
  @media (width < 768px) {
    .footer__box:nth-child(3) {
      margin-top: 4rem;
      max-width: 22rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__box:nth-child(3) {
      max-width: 27rem;
      margin-top: 4.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer__box:nth-child(3) .footer__text {
      max-width: 26rem;
    }
  }
  .footer__box:nth-child(4) {
    display: flex;
    flex-direction: column;
  }
  @media (width < 768px) {
    .footer__box:nth-child(4) {
      margin-top: 1.2rem;
      row-gap: 1.4rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__box:nth-child(4) {
      margin-top: 1.5rem;
      row-gap: 2rem;
    }
  }
  @media (width >= 1025px) {
    .footer__box:nth-child(4) {
      row-gap: 1.3rem;
    }
  }
  @media (width < 1025px) {
    .footer .logo {
      width: 18.7rem;
    }
  }
  @media (width >= 1025px) {
    .footer .logo {
      width: 22.8rem;
    }
  }
  @media (width < 768px) {
    .footer__desc {
      margin-top: 1.9rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__desc {
      margin-top: 1.9rem;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .footer__desc {
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width < 1025px) {
    .footer__desc {
      font-size: 1.8rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer__desc {
      max-width: 30rem;
      margin-top: 1.2rem;
      font-size: 2.2rem;
    }
  }
  @media (width >= 1920px) {
    .footer__desc {
      margin-top: 1.6rem;
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  @media (width < 768px) {
    .footer__text {
      font-size: 1.8rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .footer__text {
      font-size: 2.2rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1920px) {
    .footer__text {
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  .footer__text a {
    line-height: normal;
    transition: 0.3s color;
  }
  @media (hover: hover) {
    .footer__text a:hover {
      color: #3a7ef6;
    }
  }
  .footer__bottom {
    display: grid;
  }
  @media (width < 768px) {
    .footer__bottom {
      margin-top: 4rem;
      row-gap: 0.4rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__bottom {
      margin-top: 5rem;
      grid-column: 2/2;
      row-gap: 0.9rem;
    }
  }
  @media (width >= 1025px) {
    .footer__bottom {
      grid-column: 3/5;
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media (width >= 1920px) {
    .footer__bottom {
      column-gap: 6rem;
    }
  }
  .footer__link {
    line-height: 140%;
    color: #b2b2b2;
    transition: 0.3s color;
  }
  @media (width < 768px) {
    .footer__link {
      font-size: 1.6rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .footer__link {
      font-size: 1.4rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .footer__link {
      font-size: 1.6rem;
    }
  }
  @media (width >= 1920px) {
    .footer__link {
      font-size: 1.8rem;
    }
  }
  @media (hover: hover) {
    .footer__link:hover {
      color: #fff;
    }
  }
}
@layer layout {
  .header {
    position: fixed;
    z-index: 10;
    width: 100%;
  }
  @media (width < 768px) {
    .header {
      top: 2rem;
    }
  }
  @media (width >= 768px) {
    .header {
      top: 3rem;
    }
  }
  .header__box {
    display: flex;
    align-items: center;
    border-radius: 0.5rem;
    background-color: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(1rem);
  }
  @media (width < 768px) {
    .header__box {
      padding: 1.2rem 0.9rem;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .header__box {
      padding: 1.7rem 2rem;
    }
  }
  @media (width >= 1920px) {
    .header__box {
      padding: 2.3rem 3.3rem;
      justify-content: space-between;
    }
  }
  @media (width < 768px) {
    .header .logo {
      width: 9.9rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .header .logo {
      width: 13.4rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .header .logo {
      width: 20.6rem;
    }
  }
  @media (width >= 1920px) {
    .header .logo {
      width: 20.9rem;
    }
  }
  .header__phone {
    line-height: 130%;
    letter-spacing: -0.01em;
    color: #fff;
    font-family: "Inter", sans-serif;
    transition: 0.3s color;
  }
  @media (width < 768px) {
    .header__phone {
      font-size: 1.4rem;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .header__phone {
      font-size: 2.2rem;
    }
  }
  @media (width < 1025px) {
    .header__phone {
      margin-left: auto;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .header__phone {
      margin-left: 5rem;
      font-size: 2.5rem;
    }
  }
  @media (width >= 1920px) {
    .header__phone {
      margin-left: 24rem;
      font-size: 3rem;
    }
  }
  @media (hover: hover) {
    .header__phone:hover {
      color: #3a7ef6;
    }
  }
}
@layer pages {
  .main {
    overflow-x: clip;
  }
}
@layer layout {
  @media (width < 768px) {
    .navbar {
      top: calc(100% + 2rem);
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .navbar {
      top: calc(100% + 3.5rem + 2px);
    }
  }
  @media (width < 1025px) {
    .navbar {
      position: absolute;
      left: 0;
      border-radius: 1rem;
      width: 100%;
      max-height: 0;
      background: #051e4c;
      overflow: hidden;
      transition: 0.3s max-height;
    }
  }
  @media (width >= 1025px) {
    .navbar {
      display: contents;
    }
  }
  .navbar--show {
    max-height: 80rem;
  }
  @media (width < 768px) {
    .navbar__open {
      width: 3rem;
      margin-left: 5.7rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .navbar__open {
      width: 4rem;
      margin-left: 9.3rem;
    }
  }
  @media (width < 1025px) {
    .navbar__open {
      display: flex;
      flex-direction: column;
      row-gap: 0.8rem;
    }
    .navbar__open:before, .navbar__open:after {
      content: "";
    }
    .navbar__open:before, .navbar__open:after,
    .navbar__open span {
      width: 100%;
      height: 2px;
      display: block;
      background-color: #fff;
    }
  }
  @media (width >= 1025px) {
    .navbar__open {
      display: none;
    }
  }
  @media (width < 768px) {
    .navbar__close {
      margin: 2rem 2rem 0 auto;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .navbar__close {
      margin: 4rem 4rem 0 auto;
    }
  }
  @media (width < 1025px) {
    .navbar__close {
      display: block;
      width: 1.6rem;
      height: 1.6rem;
    }
    .navbar__close svg {
      width: 100%;
      height: 100%;
    }
  }
  @media (width >= 1025px) {
    .navbar__close {
      display: none;
    }
  }
}
@layer layout {
  @media (width < 768px) {
    .primary {
      padding-top: 9rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary {
      padding-top: 13rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary {
      padding-top: 15.2rem;
    }
  }
  @media (width >= 1920px) {
    .primary {
      padding-top: 16rem;
    }
  }
  .primary .wrap {
    z-index: 2;
  }
  .primary__content {
    position: relative;
    max-width: 192rem;
    margin: auto;
  }
  .primary-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .primary-sph--1 {
    z-index: 2;
    opacity: 0.53;
  }
  @media (width < 768px) {
    .primary-sph--1 {
      top: 38rem;
      left: -20.5rem;
      width: 109rem;
      transform: rotate(-15deg);
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary-sph--1 {
      top: 62.5rem;
      left: -16rem;
      width: 109rem;
      transform: rotate(-15deg);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary-sph--1 {
      top: 26rem;
      left: -66rem;
      width: 142rem;
      transform: rotate(-24deg);
    }
  }
  @media (width >= 1920px) {
    .primary-sph--1 {
      top: 20rem;
      left: -20rem;
    }
  }
  .primary-sph--2 {
    z-index: 1;
    transform: rotate(-23deg);
    opacity: 0.68;
  }
  @media (width < 768px) {
    .primary-sph--2 {
      width: 90rem;
      left: -26rem;
      top: 47.7rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary-sph--2 {
      width: 128rem;
      left: -43rem;
      top: 28rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary-sph--2 {
      top: 28rem;
      left: -80rem;
    }
  }
  @media (width >= 1920px) {
    .primary-sph--2 {
      top: 25rem;
      left: -50rem;
    }
  }
  .primary-sph--3 {
    z-index: 1;
    transform: rotate(59deg);
    opacity: 0.23;
  }
  @media (width < 768px) {
    .primary-sph--3 {
      width: 107rem;
      right: -80rem;
      top: 0rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary-sph--3 {
      width: 127rem;
      right: -52rem;
      top: -59rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary-sph--3 {
      top: -62rem;
      right: -46rem;
      width: 140rem;
    }
  }
  @media (width >= 1920px) {
    .primary-sph--3 {
      top: -81rem;
      right: -60rem;
    }
  }
  .primary__bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
  }
  @media (width < 768px) {
    .primary__bg {
      height: 46.8rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__bg {
      min-height: 91.7rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__bg {
      min-height: 86.7rem;
    }
  }
  @media (width >= 1920px) {
    .primary__bg {
      min-height: 92rem;
      border-radius: 0.5rem;
    }
  }
  .primary__bg::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    background: linear-gradient(269.68deg, rgba(5, 30, 76, 0) 1.19%, rgb(5, 30, 76) 71.61%);
  }
  .primary__bg img {
    position: absolute;
    z-index: -1;
    right: 0;
    height: 100%;
    object-fit: cover;
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__bg img {
      width: 129rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__bg img {
      width: 118.5rem;
    }
  }
  @media (width >= 1920px) {
    .primary__bg img {
      width: 151.2rem;
    }
  }
  .primary__box {
    display: grid;
  }
  @media (width < 768px) {
    .primary__box {
      padding-top: 3.7rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__box {
      padding: 5rem 0 4.3rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__box {
      padding: 4.8rem 0 4.2rem;
    }
  }
  @media (width >= 1920px) {
    .primary__box {
      padding: 8.5rem 0 0;
      grid-template-columns: repeat(3, 1fr);
      column-gap: 6rem;
    }
  }
  .primary__title {
    font-weight: 600;
    line-height: 110%;
    letter-spacing: -0.04em;
    text-transform: uppercase;
    color: #fff;
  }
  @media (width < 768px) {
    .primary__title {
      font-size: 2.5rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__title {
      font-size: 4rem;
    }
  }
  @media (width >= 1025px) {
    .primary__title {
      grid-column: 1/4;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__title {
      max-width: 121rem;
      font-size: 6.5rem;
    }
  }
  @media (width >= 1920px) {
    .primary__title {
      max-width: 144rem;
      font-size: 7.5rem;
    }
  }
  .primary__desc {
    line-height: 130%;
    color: #fff;
    font-family: "Inter", sans-serif;
  }
  @media (width < 768px) {
    .primary__desc {
      margin-top: 2rem;
      font-size: 1.8rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__desc {
      margin-top: 2.6rem;
      font-size: 2.5rem;
    }
  }
  @media (width < 1025px) {
    .primary__desc br {
      display: contents;
    }
  }
  @media (width >= 1025px) {
    .primary__desc {
      grid-column: 1/3;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__desc {
      margin-top: 1.7rem;
      font-size: 3.5rem;
    }
  }
  @media (width >= 1920px) {
    .primary__desc {
      margin-top: 2.5rem;
      font-size: 4rem;
      letter-spacing: 0.16rem;
    }
  }
  .primary__features {
    display: flex;
    flex-direction: column;
    line-height: 140%;
  }
  @media (width < 768px) {
    .primary__features {
      margin-top: 4rem;
      row-gap: 0.5rem;
      font-size: 1.6rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__features {
      margin-top: 2.5rem;
      row-gap: 1.7rem;
      font-size: 1.8rem;
    }
  }
  @media (width >= 1025px) {
    .primary__features {
      grid-column: 3/4;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__features {
      max-width: 34rem;
      margin-top: 1.7rem;
      row-gap: 3.3rem;
      font-size: 2.2rem;
    }
  }
  @media (width >= 1920px) {
    .primary__features {
      max-width: 45.3rem;
      margin-top: 2.8rem;
      row-gap: 3.5rem;
      font-size: 2.4rem;
    }
  }
  .primary__list {
    display: grid;
  }
  @media (width < 768px) {
    .primary__list {
      margin-top: 7rem;
      row-gap: 1.6rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__list {
      margin-top: 3.5rem;
      row-gap: 2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__list {
      padding: 5rem 0 3.5rem;
      grid-template-columns: repeat(3, 1fr);
      column-gap: 2rem;
      grid-column: 1/4;
    }
  }
  @media (width >= 1920px) {
    .primary__list {
      padding: 4.1rem 0 3.5rem;
      grid-template-columns: repeat(3, 1fr);
      column-gap: 6rem;
      grid-column: 1/4;
    }
  }
  .primary__item {
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0.5rem;
    backdrop-filter: blur(1rem);
    background: rgba(83, 139, 244, 0.16);
    align-items: flex-start;
  }
  @media (width < 768px) {
    .primary__item {
      padding: 1.2rem 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__item {
      padding: 2.3rem 3.2rem;
    }
  }
  @media (width < 1025px) {
    .primary__item {
      display: grid;
      grid-template-columns: 7.5rem 1fr;
      column-gap: 1rem;
    }
  }
  @media (width >= 1025px) {
    .primary__item {
      display: flex;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__item {
      padding: 1.5rem 2rem;
      column-gap: 1rem;
    }
  }
  @media (width >= 1920px) {
    .primary__item {
      padding: 2rem 4rem 2.5rem;
      column-gap: 2rem;
    }
  }
  @media (width < 768px) {
    .primary__item-desc {
      font-size: 1.6rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .primary__item-desc {
      font-size: 1.8rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__item-desc {
      font-size: 2.2rem;
    }
  }
  @media (width >= 768px) and (width < 1920px) {
    .primary__item-desc {
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1920px) {
    .primary__item-desc {
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  .primary__num {
    flex-shrink: 0;
    font-weight: 600;
    line-height: 1;
  }
  @media (width < 1025px) {
    .primary__num {
      width: 8.5rem;
      font-size: 3.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .primary__num {
      font-size: 4.8rem;
    }
  }
  @media (width >= 1920px) {
    .primary__num {
      font-size: 6rem;
    }
  }
}
@layer layout {
  .services {
    overflow-x: clip;
  }
  .services .wrap {
    max-width: 180rem;
  }
  .services-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .services-sph--1 {
    z-index: 2;
    transform: rotate(-41deg);
    opacity: 0.53;
  }
  @media (width < 768px) {
    .services-sph--1 {
      width: 76rem;
      top: -1rem;
      right: -30rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services-sph--1 {
      width: 91rem;
      top: -4rem;
      right: -19rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services-sph--1 {
      top: -7rem;
      left: 23rem;
      width: 118rem;
    }
  }
  @media (width >= 1920px) {
    .services-sph--1 {
      top: -6rem;
      left: -6rem;
    }
  }
  .services-sph--2 {
    z-index: 1;
    opacity: 0.6;
  }
  @media (width < 768px) {
    .services-sph--2 {
      width: 110rem;
      right: -68.9rem;
      top: 1.7rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services-sph--2 {
      width: 83rem;
      right: -40rem;
      top: 20.4rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services-sph--2 {
      top: -3rem;
      right: -32rem;
      width: 109rem;
    }
  }
  @media (width >= 1920px) {
    .services-sph--2 {
      top: 0;
      right: -6rem;
    }
  }
  .services__box {
    position: relative;
  }
  @media (width < 768px) {
    .services__box {
      padding-top: 8.5rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__box {
      padding-top: 9.2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__box {
      padding-top: 15rem;
    }
  }
  @media (width >= 1920px) {
    .services__box {
      padding-top: 19rem;
    }
  }
  .services__container {
    position: relative;
    z-index: 2;
  }
  .services .section__title {
    font-weight: 600;
    line-height: 120%;
  }
  @media (width < 768px) {
    .services .section__title {
      font-size: 2rem;
    }
  }
  @media (width >= 768px) {
    .services .section__title {
      text-align: center;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services .section__title {
      font-size: 2.5rem;
    }
  }
  @media (width >= 1025px) {
    .services .section__title {
      max-width: 120rem;
      margin: 0 auto;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services .section__title {
      font-size: 4rem;
    }
  }
  @media (width >= 1920px) {
    .services .section__title {
      font-size: 4.5rem;
    }
  }
  .services .section__desc {
    line-height: 130%;
    letter-spacing: -0.01em;
  }
  @media (width < 768px) {
    .services .section__desc {
      margin-top: 1rem;
      font-size: 1.6rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) {
    .services .section__desc {
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services .section__desc {
      margin-top: 1rem;
      max-width: 56rem;
      font-size: 2.2rem;
      line-height: normal;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services .section__desc {
      margin-top: 2.6rem;
      max-width: 100rem;
      font-size: 2.5rem;
    }
  }
  @media (width >= 1920px) {
    .services .section__desc {
      margin-top: 4rem;
      max-width: 120rem;
      font-size: 3rem;
    }
  }
  .services__industries {
    display: grid;
  }
  @media (width < 768px) {
    .services__industries {
      margin-top: 2.5rem;
      row-gap: 1.5rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__industries {
      margin-top: 3.5rem;
      row-gap: 1rem;
    }
  }
  @media (width >= 1025px) {
    .services__industries {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__industries {
      margin-top: 5rem;
      gap: 4rem 2.6rem;
    }
  }
  @media (width >= 1920px) {
    .services__industries {
      margin-top: 9rem;
      gap: 4rem 19rem;
    }
  }
  .services__industry {
    display: grid;
    align-items: center;
    font-weight: 700;
    text-transform: uppercase;
  }
  @media (width < 768px) {
    .services__industry {
      font-size: 1.4rem;
      line-height: 120%;
      grid-template-columns: 2.5rem 1fr;
      column-gap: 1rem;
    }
  }
  @media (width >= 768px) {
    .services__industry {
      line-height: 140%;
      grid-template-columns: 4rem 1fr;
      column-gap: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__industry {
      font-size: 1.8rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__industry {
      font-size: 2.2rem;
    }
  }
  @media (width >= 1920px) {
    .services__industry {
      font-size: 2.5rem;
    }
  }
  .services__industry-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #053169;
  }
  @media (width < 768px) {
    .services__industry-icon {
      width: 2.5rem;
      height: 2.5rem;
    }
  }
  @media (width >= 768px) {
    .services__industry-icon {
      width: 4rem;
      height: 4rem;
    }
  }
  .services__industry svg {
    height: auto;
  }
  @media (width < 768px) {
    .services__industry svg {
      width: 1rem;
    }
  }
  @media (width >= 768px) {
    .services__industry svg {
      width: 2rem;
    }
  }
  .services__list {
    display: grid;
  }
  @media (width < 768px) {
    .services__list {
      margin-top: 8rem;
      row-gap: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__list {
      margin-top: 9.4rem;
      row-gap: 3rem;
    }
  }
  @media (width >= 1025px) {
    .services__list {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__list {
      margin-top: 3rem;
      gap: 2rem;
    }
  }
  @media (width >= 1920px) {
    .services__list {
      margin-top: 3.8rem;
      gap: 11rem 17rem;
    }
  }
  .services__item {
    display: grid;
    background-color: #092b66;
    border-radius: 0.5rem;
  }
  @media (width < 768px) {
    .services__item {
      row-gap: 2rem;
    }
    .services__item .services__item-img {
      height: 17rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__item {
      grid-template-columns: 1fr 22.4rem;
      column-gap: 1.4rem;
    }
    .services__item .services__item-img {
      min-height: 19.4rem;
    }
  }
  @media (width < 1025px) {
    .services__item {
      padding: 3rem 2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__item {
      padding: 2rem;
    }
  }
  @media (width >= 1920px) {
    .services__item {
      padding: 2.6rem 2rem 1.6rem 3rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__item:not(:nth-child(5)) {
      grid-template-columns: 1fr 21rem;
      column-gap: 1.2rem;
    }
    .services__item:not(:nth-child(5)) .services__item-img {
      min-height: 37rem;
    }
  }
  @media (width >= 1920px) {
    .services__item:not(:nth-child(5)) {
      grid-template-columns: 1fr 24rem;
      column-gap: 2rem;
    }
    .services__item:not(:nth-child(5)) .services__item-img {
      min-height: 35rem;
    }
  }
  @media (width >= 1025px) {
    .services__item:nth-child(5) {
      grid-column: 1/3;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__item:nth-child(5) {
      grid-template-columns: 1fr 42.4rem;
      column-gap: 10rem;
    }
    .services__item:nth-child(5) .services__item-img {
      min-height: 52rem;
    }
  }
  @media (width >= 1920px) {
    .services__item:nth-child(5) {
      grid-template-columns: repeat(2, 77rem);
      column-gap: 18rem;
    }
    .services__item:nth-child(5) .services__item-img {
      min-height: 50rem;
    }
  }
  .services__item-title {
    font-weight: 600;
    line-height: 120%;
  }
  @media (width < 768px) {
    .services__item-title {
      font-size: 1.8rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__item-title {
      font-size: 2.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__item-title {
      margin-top: 2.5rem;
      font-size: 3.5rem;
    }
  }
  @media (width >= 1920px) {
    .services__item-title {
      font-size: 3.8rem;
    }
  }
  .services__item-desc {
    font-family: "Inter", sans-serif;
  }
  @media (width < 768px) {
    .services__item-desc {
      margin-top: 1rem;
      font-size: 1.6rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .services__item-desc {
      margin-top: 2rem;
      font-size: 1.8rem;
      line-height: 130%;
    }
  }
  @media (width >= 1025px) {
    .services__item-desc {
      margin-top: 4.4rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .services__item-desc {
      font-size: 2.2rem;
      line-height: 130%;
    }
  }
  @media (width >= 1920px) {
    .services__item-desc {
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  .services__item-img {
    border-radius: 0.5rem;
    overflow: hidden;
  }
  .services__item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
@layer layout {
  @media (width >= 1920px) {
    .steps {
      overflow: hidden;
      padding-bottom: 9rem;
    }
  }
  .steps__box {
    position: relative;
  }
  @media (width < 768px) {
    .steps__box {
      margin-top: 8rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps__box {
      margin-top: 9.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps__box {
      margin-top: 19.2rem;
    }
  }
  @media (width >= 1920px) {
    .steps__box {
      margin-top: 20.5rem;
    }
  }
  .steps-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .steps-sph--1 {
    z-index: 2;
    opacity: 0.53;
    transform: rotate(-41deg);
  }
  @media (width < 768px) {
    .steps-sph--1 {
      right: -98rem;
      width: 140rem;
      top: 40rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps-sph--1 {
      left: -28rem;
      width: 110rem;
      top: 2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps-sph--1 {
      top: 2rem;
      left: -12rem;
      width: 155rem;
    }
  }
  @media (width >= 1920px) {
    .steps-sph--1 {
      top: -2rem;
      left: -7rem;
    }
  }
  .steps-sph--2 {
    z-index: 1;
    opacity: 0.46;
    transform: rotate(59deg);
  }
  @media (width < 768px) {
    .steps-sph--2 {
      width: 127rem;
      top: 19.6rem;
      right: -93.6rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps-sph--2 {
      width: 110rem;
      top: -17rem;
      right: -28rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps-sph--2 {
      width: 160rem;
      top: -34rem;
      right: -22rem;
    }
  }
  @media (width >= 1920px) {
    .steps-sph--2 {
      top: -27rem;
      right: -21rem;
    }
  }
  .steps__content {
    position: relative;
    z-index: 3;
  }
  .steps .section__title {
    font-weight: 600;
  }
  @media (width < 768px) {
    .steps .section__title {
      font-size: 3rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps .section__title {
      font-size: 4rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps .section__title {
      font-size: 5.5rem;
    }
  }
  @media (width >= 1025px) {
    .steps .section__title {
      text-align: center;
    }
  }
  @media (width >= 1920px) {
    .steps .section__title {
      font-size: 6.5rem;
    }
  }
  .steps .section__desc {
    font-weight: 600;
    line-height: 120%;
  }
  @media (width < 768px) {
    .steps .section__desc {
      margin-top: 1rem;
      font-size: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps .section__desc {
      margin-top: 3rem;
      font-size: 2.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps .section__desc {
      margin: 2.3rem auto 0;
      max-width: 115rem;
      font-size: 4rem;
    }
  }
  @media (width >= 1025px) {
    .steps .section__desc {
      text-align: center;
    }
  }
  @media (width >= 1920px) {
    .steps .section__desc {
      margin: 3rem auto 0;
      max-width: 126.7rem;
      font-size: 4.5rem;
    }
  }
  .steps__list {
    display: grid;
  }
  @media (width < 1025px) {
    .steps__list {
      margin-top: 3rem;
      gap: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps__list {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps__list {
      margin-top: 8.8rem;
      gap: 3rem 2rem;
    }
  }
  @media (width >= 1025px) {
    .steps__list {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  @media (width >= 1920px) {
    .steps__list {
      margin-top: 10.8rem;
      gap: 5.2rem 6rem;
    }
  }
  .steps__item {
    position: relative;
    overflow: hidden;
    background-color: #031330;
    border-radius: 0.5rem;
  }
  @media (width < 768px) {
    .steps__item {
      min-height: 11.7rem;
      padding: 2rem 1rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps__item {
      min-height: 10.6rem;
      padding: 2.4rem 2rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps__item {
      min-height: 17.8rem;
      padding: 4.5rem 2rem;
    }
  }
  @media (width >= 1920px) {
    .steps__item {
      min-height: 25.6rem;
      padding: 6rem 3rem;
    }
  }
  .steps__item::before {
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    content: "";
    background-color: #092d6a;
    filter: blur(24.2rem);
    transform: rotate(-40deg);
  }
  @media (width < 768px) {
    .steps__item::before {
      top: -4.5rem;
      left: -12rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps__item::before {
      top: -7.4rem;
      left: -12rem;
    }
  }
  @media (width < 1025px) {
    .steps__item::before {
      width: 40.5rem;
      height: 29rem;
    }
  }
  @media (width >= 1025px) {
    .steps__item::before {
      width: 55rem;
      height: 39.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps__item::before {
      top: -14.8rem;
      left: -14.3rem;
    }
  }
  @media (width >= 1920px) {
    .steps__item::before {
      top: -14.35rem;
      left: -12rem;
    }
  }
  .steps__item-desc {
    position: relative;
    z-index: 2;
    font-family: "Inter", sans-serif;
  }
  @media (width < 768px) {
    .steps__item-desc {
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps__item-desc {
      letter-spacing: -0.01em;
      line-height: 130%;
    }
  }
  @media (width < 1025px) {
    .steps__item-desc {
      font-size: 1.8rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps__item-desc {
      font-size: 2.5rem;
      line-height: 120%;
    }
  }
  @media (width >= 1920px) {
    .steps__item-desc {
      max-width: 46rem;
      font-size: 3rem;
      letter-spacing: -0.01em;
      line-height: 130%;
    }
  }
  .steps__num {
    position: absolute;
    z-index: 1;
    font-weight: 900;
    font-family: "Inter", sans-serif;
    line-height: normal;
    background: linear-gradient(88.26deg, #0d1f57 36.21%, rgba(13, 31, 87, 0) 65.32%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  @media (width < 768px) {
    .steps__num {
      bottom: -3rem;
      right: -0.5rem;
      font-size: 12rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .steps__num {
      bottom: -3rem;
      right: -0.5rem;
      font-size: 12rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .steps__num {
      bottom: -4.3rem;
      right: -2.6rem;
      font-size: 20rem;
    }
  }
  @media (width >= 1920px) {
    .steps__num {
      bottom: -5rem;
      right: -2.5rem;
      font-size: 22.6rem;
    }
  }
}
@layer pages {
  .error {
    color: #fff;
    text-align: center;
  }
  @media (width < 768px) {
    .error {
      margin-top: 9rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .error {
      margin-top: 13rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .error {
      margin-top: 15.2rem;
    }
  }
  @media (width >= 1920px) {
    .error {
      margin-top: 16rem;
    }
  }
  .error__box {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  @media (width < 768px) {
    .error__box {
      padding-top: 4.3rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .error__box {
      padding-top: 2.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .error__box {
      padding-top: 1.9rem;
    }
  }
  @media (width >= 1920px) {
    .error__box {
      padding-top: 6.5rem;
    }
  }
  .error__num {
    font-weight: 600;
    line-height: 110%;
    letter-spacing: -0.04em;
    text-transform: uppercase;
  }
  @media (width < 768px) {
    .error__num {
      font-size: 10rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .error__num {
      font-size: 12.7rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .error__num {
      font-size: 25.2rem;
    }
  }
  @media (width >= 1920px) {
    .error__num {
      font-size: 33.5rem;
    }
  }
  .error__title {
    font-weight: 600;
    text-align: center;
  }
  @media (width < 768px) {
    .error__title {
      max-width: 32rem;
      margin-top: 2.7rem;
      font-size: 1.6rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .error__title {
      max-width: 58.2rem;
      margin-top: 1.8rem;
      font-size: 3rem;
    }
  }
  @media (width < 1025px) {
    .error__title {
      line-height: 120%;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .error__title {
      max-width: 58.2rem;
      margin-top: 1.3rem;
      font-size: 3.5rem;
      line-height: 140%;
    }
  }
  @media (width >= 1920px) {
    .error__title {
      max-width: 77.5rem;
      margin-top: 2.4rem;
      font-size: 4.5rem;
      line-height: 120%;
    }
  }
  @media (width < 768px) {
    .error__desc {
      max-width: 25rem;
      margin-top: 7.1rem;
      font-size: 1.6rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .error__desc {
      margin-top: 3.8rem;
      font-size: 2.2rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .error__desc {
      margin-top: 7.8rem;
      font-size: 2.5rem;
      line-height: 120%;
    }
  }
  @media (width >= 1920px) {
    .error__desc {
      margin-top: 12rem;
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
}
@layer pages {}
@layer pages {
  @media (width < 768px) {
    .policy {
      margin-top: 13rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy {
      margin-top: 20rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy {
      margin-top: 26.7rem;
    }
  }
  @media (width >= 1920px) {
    .policy {
      margin-top: 35rem;
    }
  }
  .policy__box {
    position: relative;
  }
  .policy-sph {
    position: absolute;
    height: auto;
    pointer-events: none;
  }
  .policy-sph--1 {
    z-index: 2;
    transform: rotate(-41deg);
    opacity: 0.53;
  }
  @media (width < 768px) {
    .policy-sph--1 {
      width: 86rem;
      top: -11.4rem;
      left: -44rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy-sph--1 {
      width: 113rem;
      top: -12rem;
      left: -45rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy-sph--1 {
      top: -12rem;
      left: -17rem;
      width: 145rem;
    }
  }
  @media (width >= 1920px) {
    .policy-sph--1 {
      top: -6rem;
      left: 0rem;
    }
  }
  .policy-sph--2 {
    z-index: 1;
    opacity: 0.6;
  }
  @media (width < 768px) {
    .policy-sph--2 {
      width: 75rem;
      right: -24.1rem;
      top: -23.4rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy-sph--2 {
      width: 100rem;
      right: -20.6rem;
      top: -27.5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy-sph--2 {
      top: -30rem;
      right: -18rem;
      width: 123rem;
    }
  }
  @media (width >= 1920px) {
    .policy-sph--2 {
      top: -26rem;
      right: 10rem;
    }
  }
  .policy__content {
    position: relative;
    z-index: 2;
  }
  .policy .page-title {
    font-weight: 600;
    line-height: 110%;
    letter-spacing: -0.04em;
    text-transform: uppercase;
  }
  @media (width < 768px) {
    .policy .page-title {
      font-size: 2.5rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy .page-title {
      font-size: 4.5rem;
    }
  }
  @media (width >= 1025px) {
    .policy .page-title {
      text-align: center;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy .page-title {
      font-size: 6.5rem;
    }
  }
  @media (width >= 1920px) {
    .policy .page-title {
      max-width: 106.5rem;
      margin: 0 auto;
      font-size: 7.5rem;
    }
  }
  @media (width < 768px) {
    .policy__text {
      margin-top: 4rem;
      font-size: 1.6rem;
      line-height: 120%;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy__text {
      margin-top: 5rem;
      font-size: 2.2rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy__text {
      margin-top: 4.3rem;
      font-size: 2.2rem;
      line-height: 130%;
      letter-spacing: -0.01em;
    }
  }
  @media (width >= 1920px) {
    .policy__text {
      margin-top: 8.2rem;
      font-size: 2.4rem;
      line-height: 140%;
    }
  }
  .policy__text h2 {
    font-weight: 600;
  }
  @media (width < 768px) {
    .policy__text h2 {
      font-size: 2rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy__text h2 {
      font-size: 2.5rem;
    }
  }
  @media (width < 1025px) {
    .policy__text h2 {
      line-height: 120%;
      margin-bottom: 3rem;
    }
  }
  @media (width >= 1025px) {
    .policy__text h2 {
      margin-bottom: 4rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy__text h2 {
      font-size: 3.5rem;
      line-height: 140%;
    }
  }
  @media (width >= 1920px) {
    .policy__text h2 {
      font-size: 4.5rem;
      line-height: 120%;
    }
  }
  @media (width < 768px) {
    .policy__text h2:not(:first-child) {
      margin-top: 4rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy__text h2:not(:first-child) {
      margin-top: 5rem;
    }
  }
  @media (width >= 1025px) and (width < 1920px) {
    .policy__text h2:not(:first-child) {
      margin-top: 8rem;
    }
  }
  @media (width >= 1920px) {
    .policy__text h2:not(:first-child) {
      margin-top: 10rem;
    }
  }
  @media (width >= 768px) and (width < 1025px) {
    .policy__text p,
    .policy__text ul,
    .policy__text ol {
      padding-left: 2rem;
    }
  }
  @media (width >= 1025px) {
    .policy__text p,
    .policy__text ul,
    .policy__text ol {
      padding-left: 4rem;
    }
  }
  .policy__text p:not(:last-child),
  .policy__text ul:not(:last-child),
  .policy__text ol:not(:last-child) {
    margin-bottom: 4rem;
  }
  .policy__text ul {
    list-style-position: inside;
  }
  .policy__text ul > li::marker {
    content: "— ";
    list-style-position: inside;
  }
}
@layer utilities {}/*# sourceMappingURL=main.css.map */