.banner {
  background: #fff;
  color: #fff;
  font-family: manrope;

  &._type1 {
    padding: calc(64px + 16px) 50px 0;
    border-radius: 64px 64px 0 0;
    margin-top: -64px;

    & .banner__block {
      margin-inline: auto;
      max-width: 1822px;
    }
  }

  &._type2 {
    padding: 100px 50px 0;
  }
}
@media (width < 768px) {
  .banner {
    &._type1 {
      padding: 32px 16px 0;
      margin-top: -16px;
      border-radius: 16px 16px 0 0;
    }

    &._type2 {
      padding: 64px 16px 0;
    }
  }
}

.banner__block {
  border-radius: 64px;
  padding: 90px 50px 50px 50%;
  background: top/cover no-repeat url("./img/banner1.png");
}
@media (width < 768px) {
  .banner__block {
    padding: 40px 16px 24px;
    border-radius: 50px 50px 24px 24px;
  }
}

.banner__miniblock {
  border-radius: 64px;
  padding: 70px;
  background: center/cover no-repeat url("./img/banner2.png");
}
@media (width < 768px) {
  .banner__miniblock {
    padding: 40px 16px 24px;
    border-radius: 24px;
  }
}

.banner__title {
  font-family: oswald;
  font-weight: 600;
  font-size: 77px;
  letter-spacing: -0.05em;
  text-transform: uppercase;
}
@media (width < 1050px) {
  .banner__title {
    font-size: 40px;
  }
}
@media (width < 768px) {
  .banner__title {
    font-size: 30px;
  }
}

.banner__subtitle {
  font-weight: 500;
  font-size: 32px;
  margin-top: 40px;

  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5em;

  & span {
    display: inline-block;
    padding: 11px 24px 16px;
    border-radius: 16px;
    border: 2px solid #ffffff;
  }
}
@media (width < 768px) {
  .banner__subtitle {
    font-size: 22px;
    margin-top: 1em;

    span {
      padding: 6px 14px 9px;
    }
  }
}

.banner__button {
  display: block;
  padding: 16px;
  font-size: 24px;
  font-weight: 500;
  border-radius: 16px;
  margin-top: 50px;
  width: 100%;
  max-width: 480px;
  text-align: center;
  background: radial-gradient(65.49% 100% at 51.66% 0%, #000000 0%, #21201f 100%);

  transition: opacity 0.4s;
  &:hover {
    opacity: 0.6;
  }
}
@media (width < 768px) {
  .banner__button {
    margin-top: 24px;
    font-size: 16px;
  }
}