:root {
  --hero-img-mobile: url("../pz_img/about-the-service/ats-hero-bg-mobile-bw.png");
  --hero-img: url("../pz_img/about-the-service/ats-hero-bg-bw.png");
  --ats-page-bg: #FFFFFF;
  --ats-newHero-logo: url("../pz_img/about-the-service/profplus_logo_white.svg");
  --ats-newHero-arrow: url("../pz_img/about-the-service/arrow.svg");
  --ats-newHero-m: url("../pz_img/about-the-service/newhero_img_mobile.png");
  --ats-newHero-d: url("../pz_img/about-the-service/newhero_img.png");
}

.about-the-service {
  --pad-x: 16px;
  --pad-y: 30px;
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 100%;
  max-width: 1440px;
  padding: 0 var(--pad-x) var(--pad-y);
  margin: 0 auto;
}

.ats-hero {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px;
  border-radius: 12px;
  background-image: var(--hero-img-mobile), linear-gradient(90deg, #10100F 0%, #1E1E1E 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: right center, center;
  background-size: contain, cover;
}

.ats-hero_title {
  width: 100%;
  max-width: 218px;
  font-size: 16px;
  font-weight: 800;
  line-height: 100%;
  letter-spacing: 0;
  color: #FFFFFF;
}

.ats-hero_desc {
  width: 100%;
  max-width: 234px;
  font-size: 10px;
  font-weight: 400;
  line-height: 100%;
  letter-spacing: 0;
  color: #FFFFFF;
}

/*---------------------------------------------------*/
.ats-newHero {
  --hero-pl: 16px;
  --hero-pr: 16px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: auto;
  margin-inline: calc(-1 * var(--pad-x));
  padding: 80px var(--hero-pr) 80px var(--hero-pl);
  background-image: linear-gradient(to bottom, #C1236D 0%, #F7641B 100%);
  font-family: Montserrat, Roboto, Arial, sans-serif;
  overflow: hidden;
  clip-path: polygon(83.75% 0%, 100% 0, 100% 100%, 0% 100%, 0% 0%, 23.562% 0%, 23.562% 0%, 24.114% 0.016%,
  24.655% 0.064%, 25.182% 0.143%, 25.69% 0.251%, 26.177% 0.387%, 26.638% 0.551%, 27.071% 0.741%,
  27.471% 0.956%, 27.836% 1.194%, 28.162% 1.456%, 28.162% 1.456%, 28.55% 1.803%, 28.904% 2.115%,
  29.229% 2.394%, 29.532% 2.644%, 29.82% 2.864%, 30.099% 3.058%, 30.374% 3.228%, 30.652% 3.375%,
  30.939% 3.501%, 31.242% 3.609%, 31.242% 3.609%, 31.562% 3.698%, 31.9% 3.77%, 32.263% 3.826%,
  32.655% 3.868%, 33.085% 3.898%, 33.558% 3.918%, 34.08% 3.93%, 34.658% 3.936%, 35.298% 3.939%,
  36.006% 3.939%, 61.65% 3.939%, 61.65% 3.939%, 62.358% 3.939%, 62.998% 3.936%, 63.576% 3.93%,
  64.098% 3.918%, 64.571% 3.898%, 65.001% 3.868%, 65.394% 3.826%, 65.756% 3.77%, 66.094% 3.698%,
  66.414% 3.609%, 66.414% 3.609%, 66.717% 3.501%, 67.004% 3.375%, 67.283% 3.228%, 67.558% 3.058%,
  67.836% 2.864%, 68.124% 2.644%, 68.427% 2.394%, 68.753% 2.115%, 69.106% 1.803%, 69.495% 1.456%, 69.495% 1.456%,
  69.82% 1.194%, 70.185% 0.956%, 70.585% 0.741%, 71.018% 0.551%, 71.48% 0.387%, 71.966% 0.251%, 72.475% 0.143%,
  73.001% 0.064%, 73.542% 0.016%, 74.094% 0%, 83.75% 0%);
  border-radius: 52px;
}


.ats-newHero_mark {
  width: 30px;
  height: 8px;
  margin-bottom: 30px;
  background-image: var(--ats-newHero-logo);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  display: inline-block;
}

.ats-newHero_title {
  font-size: 28px;
  font-weight: 600;
  color: white;
  margin-bottom: 20px;
  line-height: 1.1;
  letter-spacing: -0.04em;
  text-align: center;
  text-decoration-line: underline;
  text-decoration-color: #FDC6DB80;
  text-decoration-thickness: 4px;
  text-underline-offset: 4px;
  text-decoration-skip-ink: auto;
}

.ats-newHero_subTitle {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.04em;
  color: white;
  margin-bottom: 24px;
  text-align: center;
  text-decoration-line: underline;
  text-decoration-color: #FDC6DB80;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
  text-decoration-skip-ink: auto;
}

.ats-newHero-row {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.ats-newHero_p-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.ats-newHero_arrow {
  width: 8px;
  height: 8px;
  background-image: var(--ats-newHero-arrow);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: inline-block;
  flex: 0 0 auto;
}

.ats-newHero_p {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.01em;
  color: white;
  text-align: center;
}

.ats-newHero-media_mobile {
  width: 100%;
  max-width: 320px;
  aspect-ratio: 942 / 576;
  background-image: var(--ats-newHero-d);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin: 24px auto;
}

.ats-newHero-media {
  display: none;
  min-width: 0;
  width: 800px;
  aspect-ratio: 942 / 576;
  background-image: var(--ats-newHero-d);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

/*---------------------------------------------------*/
.ats-possibilities {
  width: 100%;
  font-family: Montserrat, Roboto, Arial, sans-serif;
}

.ats-possibilities_title {
  font-size: 20px;
  font-weight: 700;
  color: #333333;
  margin-bottom: 6px;
}

.ats-possibilities_title.no-subtitle {
  margin-bottom: 20px;
}

.ats-possibilities_subtitle {
  font-size: 14px;
  font-weight: 500;
  color: #282828;
  margin-bottom: 20px;
}

.ats-possibilities_list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  list-style: none;
}

.ats-possibilities_item {
  display: flex;
  gap: 16px;
  justify-content: start;
  align-items: center;
  padding: 16px;
  background: #F5F5F5;
  border-radius: 20px;
  min-height: 80px;
}

.ats-possibilities_item > img {
  width: 48px;
  height: 48px;
}

.ats-possibilities_text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px;
}

.ats-possibilities_h4 {
  font-size: 16px;
  font-weight: 700;
}

.ats-possibilities_p {
  font-size: 12px;
  font-weight: 500;
  line-height: 100%;
  letter-spacing: 0;
  color: #333333;
}

.ats-stores {
  position: relative;
  width: 100%;
  font-family: Montserrat, Roboto, Arial, sans-serif;
  background-image: linear-gradient(90deg, #1D1D1B 0%, #424242 100%);
  padding: 8px 18px;
  border-radius: 8px;
}

.ats-stores > img {
  position: absolute;
  display: block;
  bottom: 0;
  width: 126px;
  height: 128px;
}

.ats-stores_desc {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: start;
  gap: 8px;
  margin-left: 140px;
  line-height: 100%;
  letter-spacing: 0;
}

.ats-stores_title {
  font-size: 14px;
  font-weight: 700;
  color: #FFFFFF;
}

.ats-stores_text {
  font-size: 9px;
  font-weight: 400;
  color: #FFFFFF;
}

.ats-stores_list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  width: 100%;
  list-style: none;
}

.ats-stores_listitem {
  display: flex;
  gap: 4px;
  justify-content: start;
  align-items: center;
  width: 100%;
  max-width: 82px;
  padding: 4px;
  background: #FFFFFF;
  border-radius: 6px;
}

.ats-stores_listitem > img {
  width: 16px;
  height: 16px;
}

.ats-stores_listitem_text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2px;
}

.ats-stores_listitem_p {
  font-size: 6px;
  font-weight: 500;
}

.ats-stores_listitem_h4 {
  font-size: 8px;
  font-weight: 600;
}

@media (min-width: 560px) {
  .ats-hero {
    background-image: var(--hero-img), linear-gradient(90deg, #10100F 0%, #1E1E1E 100%);
  }

  .ats-hero_title {
    max-width: 400px;
    font-size: 20px;
  }

  .ats-hero_desc {
    max-width: 400px;
    font-size: 14px;
  }

  /*-----------------------------------------------------*/
  .ats-newHero {
    --hero-pl: 54px;
    --hero-pr: 54px;
    padding: 80px var(--hero-pr) 80px var(--hero-pl);
  }

  .ats-newHero_title {
    font-size: 44px;
  }

  .ats-newHero_subTitle {
    font-size: 24px;
  }

  .ats-newHero-row {
    flex-direction: row;
    gap: 10px;
    margin-inline-end: calc(-1 * var(--hero-pr));
  }

  .ats-newHero_p-block {
    display: flex;
    align-items: flex-start;
    margin-top: 30px;
  }

  .ats-newHero_p {
    font-size: 20px;
    text-align: start;
  }

  .ats-newHero-media_mobile {
    height: 390px;
    aspect-ratio: 942 / 576;
    background-image: var(--ats-newHero-m);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
  }

  /*-----------------------------------------------------*/
  .ats-possibilities_title {
    font-size: 24px;
  }

  .ats-stores {
    padding: 12px 24px;
  }

  .ats-stores_title {
    font-size: 20px;
  }

  .ats-stores_text {
    font-size: 14px;
  }
}

@media (min-width: 768px) {
  .about-the-service {
    --pad-x: 24px;
    --pad-y: 60px;
    gap: 36px;
  }

  .ats-hero {
    gap: 36px;
    padding: 36px 24px;
    border-radius: 20px;

  }

  .ats-hero_title {
    font-size: 30px;
  }

  .ats-hero_desc {
    font-size: 16px;
  }

  .ats-possibilities_title {
    font-size: 28px;
  }

  /*-----------------------------------------------------*/
  .ats-newHero_p {
    font-size: 24px;
  }

  /*-----------------------------------------------------*/
  .ats-possibilities_list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
  }

  .ats-possibilities_item {
    flex: 1 1 calc(50% - 8px);
    max-width: calc(50% - 8px);
    min-height: 120px;
  }

  .ats-possibilities_h4 {
    font-size: 20px;
  }

  .ats-stores > img {
    width: 144px;
    height: 148px;
  }

  .ats-stores_desc {
    margin-left: 168px;
  }

  .ats-stores {
    padding: 12px 24px;
  }
}

@media (min-width: 1024px) {
  .about-the-service {
    --pad-x: 120px;
    --pad-y: 40px;
    gap: 48px;
  }

  .ats-hero {
    gap: 42px;
    padding: 48px 32px;
    border-radius: 24px;
  }

  .ats-hero_desc {
    font-weight: 500;
  }

  /*--------------------------------*/
  .ats-newHero {
    clip-path: polygon(
      0% 0%, 21.562% 0%,
      21.816% 0.016%, 21.935% 0.065%, 22.050% 0.146%, 22.162% 0.255%, 22.269% 0.395%, 22.371% 0.565%, 22.466% 0.765%,
      22.554% 0.995%, 22.634% 1.240%, 22.705% 1.520%, 22.791% 1.870%, 22.868% 2.190%, 22.940% 2.460%, 23.007% 2.700%,
      23.070% 2.930%, 23.131% 3.110%, 23.192% 3.270%, 23.253% 3.410%, 23.316% 3.530%, 23.383% 3.630%, 23.454% 3.715%,
      23.527% 3.790%, 23.607% 3.840%, 23.693% 3.880%, 23.788% 3.905%, 23.892% 3.920%, 24.007% 3.935%, 24.134% 3.938%,
      24.298% 3.939%,

      41.650% 3.939%, 41.650% 3.939%, 42.026% 3.939%,
      42.166% 3.938%, 42.293% 3.935%, 42.408% 3.920%, 42.512% 3.905%, 42.607% 3.880%, 42.693% 3.840%, 42.773% 3.790%, 42.846% 3.715%,
      42.917% 3.630%, 42.917% 3.630%, 42.984% 3.530%, 43.047% 3.410%, 43.108% 3.270%, 43.169% 3.110%, 43.230% 2.930%, 43.293% 2.700%,
      43.360% 2.460%, 43.432% 2.190%, 43.509% 1.870%, 43.595% 1.520%, 43.595% 1.520%,
      43.666% 1.240%, 43.746% 0.995%, 43.834% 0.765%, 43.929% 0.565%, 44.031% 0.395%, 44.138% 0.255%, 44.250% 0.146%, 44.365% 0.065%,
      44.484% 0.016%, 44.750% 0%, 100% 0%, 100% 100%,

      65.882% 100.000%, 65.184% 99.968%, 64.874% 99.872%, 64.576% 99.714%, 64.281% 99.498%, 64.001% 99.226%, 63.737% 98.898%,
      63.489% 98.518%, 63.257% 98.088%, 63.048% 97.612%, 62.865% 97.088%, 62.865% 97.088%, 62.640% 96.394%, 62.439% 95.770%, 62.251% 95.212%,
      62.073% 94.712%, 61.909% 94.272%, 61.749% 93.884%, 61.590% 93.544%, 61.430% 93.250%, 61.266% 92.998%, 61.094% 92.782%, 61.094% 92.782%,
      60.905% 92.604%, 60.715% 92.460%, 60.508% 92.348%, 60.284% 92.264%, 60.035% 92.204%, 59.764% 92.164%, 59.461% 92.140%, 59.129% 92.128%,
      58.763% 92.122%, 57.781% 92.122%, 57.781% 92.122%, 42.219% 92.122%,
      41.237% 92.122%, 40.871% 92.128%, 40.539% 92.140%, 40.236% 92.164%, 39.965% 92.204%, 39.716% 92.264%, 39.492% 92.348%, 39.285% 92.460%,
      39.095% 92.604%, 38.906% 92.782%, 38.906% 92.782%, 38.734% 92.998%, 38.570% 93.250%, 38.410% 93.544%, 38.251% 93.884%, 38.091% 94.272%,
      37.927% 94.712%, 37.749% 95.212%, 37.561% 95.770%, 37.360% 96.394%, 37.135% 97.088%, 37.135% 97.088%, 36.952% 97.612%, 36.743% 98.088%,
      36.511% 98.518%, 36.263% 98.898%, 35.999% 99.226%, 35.719% 99.498%, 35.424% 99.714%, 35.126% 99.872%, 34.816% 99.968%, 34.118% 100.000%,
      34.118% 100.000%, 0% 100%
    );
  }

  .ats-newHero_desc {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
  }

  .ats-newHero-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    width: 100%;
  }

  .p-block-1 {
    width: 100%;
    max-width: 500px;
  }

  .ats-newHero-media_mobile {
    width: 100%;
    max-width: 500px;
    margin: 0;
    background-image: var(--ats-newHero-d);

  }

  /*--------------------------------*/
  .ats-possibilities_title.no-subtitle {
    margin-bottom: 20px;
  }

  .ats-possibilities_list {
    gap: 24px;
  }

  .ats-possibilities_item {
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
    flex-basis: calc(50% - 12px);
    max-width: calc(50% - 12px);
    min-height: 180px;
    padding: 20px;
  }

  .ats-possibilities_title {
    font-size: 32px;
  }

  .ats-possibilities_h4 {
    font-size: 24px;
  }

  .ats-possibilities_p, .ats-possibilities_subtitle {
    font-size: 16px;
  }

  .ats-stores > img {
    width: 220px;
    height: 228px;
  }

  .ats-stores_desc {
    margin-left: 238px;
  }

  .ats-stores {
    padding: 28px 36px;
  }

  .ats-stores_title {
    font-size: 28px;
  }

  .ats-stores_text {
    font-size: 16px;
    margin-bottom: 12px;
  }
}

@media (min-width: 1280px) {
  .ats-hero {
    padding: 68px 64px;
  }

  .ats-hero_title {
    max-width: 626px;
    font-size: 36px;
  }

  .ats-hero_desc {
    max-width: 702px;
    font-size: 20px;
  }

  /*-------------------------------------*/
  .ats-newHero {
    --hero-py: 80px;
    --hero-px: 44px;
    align-items: start;
    padding: var(--hero-py) var(--hero-px);
    margin-inline: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .ats-newHero_desc {
    justify-content: space-between;
  }

  .ats-newHero_content {
    width: 100%;
    max-width: 500px;
  }

  .ats-newHero_title {
    font-size: 44px;
    margin-bottom: 45px;
    text-align: start;
  }

  .ats-newHero_subTitle {
    position: relative;
    font-size: 24px;
    margin-bottom: 10px;
    text-align: start;
  }

  .ats-newHero-row {
    align-items: start;
  }

  .ats-newHero_p-block {
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 10px;
  }

  .ats-newHero_arrow {
    margin-top: 0.7em;
  }

  .ats-newHero_p {
    font-size: 20px;
    font-weight: 500;
  }

  .ats-newHero-media_mobile {
    display: none;
  }

  .ats-newHero-media {
    display: block;
    min-width: 0;
    width: 800px;
    aspect-ratio: 942/576;
  }

  /*-------------------------------------*/
  .ats-stores {
    align-items: center;
    gap: 60px;
    padding: 56px 48px;
    border-radius: 8px;
  }

  .ats-stores > img {
    width: 346px;
    height: 342px;
  }

  .ats-stores_desc {
    justify-content: center;
    gap: 14px;
    margin-left: 380px;
  }

  .ats-stores_title {
    font-size: 36px;
  }

  .ats-stores_text {
    font-size: 24px;
    font-weight: 500;
  }

  .ats-stores_list {
    gap: 16px;
  }

  .ats-stores_listitem {
    display: flex;
    gap: 8px;
    max-width: 150px;
    padding: 8px;
  }

  .ats-stores_listitem > img {
    width: 26px;
    height: 26px;
  }

  .ats-stores_listitem_text {
    gap: 0;
  }

  .ats-stores_listitem_p {
    font-size: 8px;
  }

  .ats-stores_listitem_h4 {
    font-size: 16px;
  }
}